diff --git a/static/css/labs.css b/static/css/labs.css index 77b8357..e9ca154 100644 --- a/static/css/labs.css +++ b/static/css/labs.css @@ -1,5 +1,94 @@ BODY { - padding-top: 50px; + padding-top: 75px; +/* font-family: "Work Sans","Source Sans Pro","Open Sans","Helvetica Neue","Helvetica","Tahoma","Geneva","Arial",sans-serif; +*/ + letter-spacing: +.02rem; + font-weight: 300; + font-size: 1.8rem; + line-height: 2; + color: #4d5363; +} + +code { + color: f00; + font-size: 1.7rem; +} + +h1 { + text-align: center; + font-size: 5.5rem; + +} +h1, h2, h3, h4, h5, h6 { + font-family: "Lato","Open Sans","Helvetica","Tahoma","Geneva","Arial",sans-serif; + text-rendering: optimizeLegibility; + line-height: 150%; + letter-spacing: 0; +} + +h2 { + font-size: 3.5rem; +} + +h3 { + font-size: 2.6rem; +} + +h4 { + font-size: 2.2rem; +} + +img{ + max-width: 500px; + height: auto; +} + +video { + max-width: 100%; + height: auto; +} + +pre { + font-size: 1.7rem; + line-height: 1.7; +} + +.navbar { + + padding-left: 0px; + padding-right: 20px; +/*background-color: #ba3232; + border-right: 20px solid #fff; +*/letter-spacing: +.05rem; + font-weight: bold; + font-size: 2rem; +} + +a:link { + color: #e00; +} + +a:visited { + color: #e00; +} + +a:hover { + color: #000; +} + +.navbar a:link{ + color: #ba3232; + font-size: 4rem; +} + +.navbar a:visited { + color: #ba3232; + font-size: 4rem; +} + +.navbar a:hover { + color: #ba3232; + font-size: 4rem; } .sidebar-toggle { @@ -8,20 +97,28 @@ BODY { } .sidebar { +/*padding-top: 100px; +*/margin-top: 5px; display: none; position: fixed; top: 51px; bottom: 0; left: 0; z-index: 1050; - padding: 20px; + padding-left: 20px; overflow-x: hidden; overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */ - background-color: #f8f8f8; + background-color: #292929; border-right: 1px solid #eee; + letter-spacing: +.05rem; + font-weight: 300; + font-size: 1.55rem; + line-height: 1.8; } + .sidebar.active { display: block; + } @media (min-width: 768px) { .sidebar { @@ -29,10 +126,16 @@ BODY { } } +.sidebar a { + display: block; + padding: 10px 20px; + text-decoration: none; + color: #ccc; +} + .sidebar ul { list-style-type: none; padding: 0; - background-color: #f8f8f8; } .sidebar > ul { @@ -41,33 +144,33 @@ BODY { margin-left: -20px; } -.sidebar a { - display: block; - padding: 10px 20px; - text-decoration: none; - color: #777; -} - .sidebar .sub-item > a{ padding-left: 40px; + background-color: #111; } .sidebar .subsub-item > a{ padding-left: 60px; + background-color: #111; } .sidebar .subsubsub-item > a{ padding-left: 80px; + background-color: #111; } .sidebar .active > a { color: #fff; - background-color: #428bca; + background-color: #ba3232; + font-weight: bold; + } .sidebar a:hover { - color: #555; - background-color: #eee; + color: #fff; +/* background-color: #ba3232; +*/ font-weight: bold; + } .main { @@ -86,6 +189,7 @@ BODY { .property-name { font-weight: bold; } + .bs-callout { padding: 20px; margin: 20px 0;