diff --git a/examples/dashboard/dashboard.css b/examples/dashboard/dashboard.css new file mode 100644 index 000000000..750124bf8 --- /dev/null +++ b/examples/dashboard/dashboard.css @@ -0,0 +1,93 @@ +/* + * Base structure + */ + +/* Move down content because we have a fixed navbar that is 50px tall */ +body { + padding-top: 50px; +} + + +/* + * Global add-ons + */ + +.sub-header { + padding-bottom: 10px; + border-bottom: 1px solid #eee; +} + + +/* + * Sidebar + */ + +/* Hide for mobile, show later */ +.sidebar { + display: none; +} +@media (min-width: 768px) { + .sidebar { + position: fixed; + top: 0; + left: 0; + bottom: 0; + z-index: 1000; + display: block; + padding: 70px 20px 20px; + background-color: #f5f5f5; + border-right: 1px solid #eee; + } +} + +/* Sidebar navigation */ +.nav-sidebar { + margin-left: -20px; + margin-right: -21px; /* 20px padding + 1px border */ + margin-bottom: 20px; +} +.nav-sidebar > li > a { + padding-left: 20px; + padding-right: 20px; +} +.nav-sidebar > .active > a { + color: #fff; + background-color: #428bca; +} + + +/* + * Main content + */ + +.main { + padding: 20px; +} +@media (min-width: 768px) { + .main { + padding-left: 40px; + pading-right: 40px; + } +} +.main .page-header { + margin-top: 0; +} + + +/* + * Placeholder dashboard ideas + */ + +.placeholders { + margin-bottom: 30px; + text-align: center; +} +.placeholders h4 { + margin-bottom: 0; +} +.placeholder { + margin-bottom: 20px; +} +.placeholder img { + border-radius: 50%; +} diff --git a/examples/dashboard/index.html b/examples/dashboard/index.html new file mode 100644 index 000000000..47ca987de --- /dev/null +++ b/examples/dashboard/index.html @@ -0,0 +1,243 @@ + + +
+ + + + + + + +| # | +Header | +Header | +Header | +Header | +
|---|---|---|---|---|
| 1,001 | +Lorem | +ipsum | +dolor | +sit | +
| 1,002 | +amet | +consectetur | +adipiscing | +elit | +
| 1,003 | +Integer | +nec | +odio | +Praesent | +
| 1,003 | +libero | +Sed | +cursus | +ante | +
| 1,004 | +dapibus | +diam | +Sed | +nisi | +
| 1,005 | +Nulla | +quis | +sem | +at | +
| 1,006 | +nibh | +elementum | +imperdiet | +Duis | +
| 1,007 | +sagittis | +ipsum | +Praesent | +mauris | +
| 1,008 | +Fusce | +nec | +tellus | +sed | +
| 1,009 | +augue | +semper | +porta | +Mauris | +
| 1,010 | +massa | +Vestibulum | +lacinia | +arcu | +
| 1,011 | +eget | +nulla | +Class | +aptent | +
| 1,012 | +taciti | +sociosqu | +ad | +litora | +
| 1,013 | +torquent | +per | +conubia | +nostra | +
| 1,014 | +per | +inceptos | +himenaeos | +Curabitur | +
| 1,015 | +sodales | +ligula | +in | +libero | +
Customize the navbar and carousel, then add some new components.
+ + + - -