diff --git a/css/swc.css b/css/swc.css index 58d3702cef4b3cba99467b1d51e6e4578bfc8e7a..e5e769c2775837743eb88177000e17f4cd15a1e0 100644 --- a/css/swc.css +++ b/css/swc.css @@ -1,59 +1,3 @@ -/* Headings */ -h1, h2, h3, h4, h5, h6 { - color: rgb(03,03,03); -} - -h1, h2 { - margin-top: 40px; - margin-bottom: 10px; -} - -h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { - color: inherit; -} - -/* Chapter titles. */ -div.chapter h2 { - text-align: center; - font-style: italic; -} - -/* Objectives and key points */ -.objectives, .keypoints { - background-color: azure; -} - -/* Things to fix. */ -.fixme { - text-decoration: underline; - color: darkred; - background-color: lightgray; -} - -/* Putting shadows around things. */ -.shadow { - -moz-box-shadow: 0 0 30px 5px #999; - -webkit-box-shadow: 0 0 30px 5px #999; - box-shadow: 0 0 30px 5px #999; -} - -/* Things to understand (lead-in to sections in book). */ -.understand { - background-color: lightyellow; -} - -/* Block quotations. */ -blockquote { - margin: 1em; - padding: 1em 1em .5em 1em; - width: 90%; -} - -/* Citation for testimonial quote. */ -blockquote.testimonial cite { - font-style: italic; -} - /* Main body of pages. */ body { background: #BEC3C6; @@ -79,6 +23,10 @@ div.banner { border-bottom: 1px solid #A6A6A6; } +.swc-blue-bg { + background-color: #20267D; +} + /* Padding around image in top banner. */ div.banner a img { padding: 20px 25px; @@ -90,46 +38,6 @@ div.banner a img { } } -/* Explanatory call-out boxes. */ -div.box { - background-color: mistyrose; - display: block; - margin-left: auto; - margin-right: auto; - padding-top: 1px; - padding-bottom: 1px; - padding-left: 10px; - padding-right: 10px; - outline-color: gray; - outline-width: 1px; - outline-style: solid; -} -@media (max-width: 700px) { - div.box { - width: 80%; - } -} -@media (min-width: 700px) { - div.box { - width: 54em; - max-width: 80%; - } -} - -/* Level 2 headings inside pages. */ -div.content div h3 { - border-bottom: 1px solid #CCCCCC; - display: block; - font-family: Verdana,"BitStream vera Sans"; - margin-top: 10px; - padding: 0 5px 3px; -} - -/* PDF and slide files referenced from lectures. */ -div.files { - padding: 10px; -} - /* Footer of every page. */ div.footer { clear: both; @@ -139,111 +47,42 @@ div.footer { text-align: right; } -.swc-blue-bg { - background-color: #20267D; -} - -/* Main menu at the top of every page. */ -div.mainmenu { - clear: both; - background-color: #F4F4F4; - margin: 0px; - padding: 3px 0px 3px 25px; - border-bottom: 1px solid #A6A6A6; - height:30px -} - -#menubar { - float:left; - margin-top:4px; -} - -#searchbar { - float:right; - margin-right:20px; -} - -/* Narration for audio-only lectures. */ -div.narration { - text-align: center; - font-size: 2em; -} - -/* Table of contents. */ -div.toc { - /* No special styling yet. */ -} - -.transcript { - display: table; -} - -.transcript .media img { - border: 1px solid grey; +/* Headings */ +h1, h2, h3, h4, h5, h6 { + color: rgb(03,03,03); } - -/* Title styling */ h1.title { margin:40px 0px; border-bottom:1px solid #515151; } -/* YouTube video embed. */ -div.youtube { - text-align: center; - padding: 10px; -} - -/* Glossary description lists. */ -dl.gloss { - /* Empty for now. */ -} - -/* FIXME: shouldn't be using iframe's directly (EventBrite and YouTube should be via macro expansion). */ -iframe.youtube_player { - border : 0; - text-align : center; - width : 640px; - height : 500px; -} - -/* Amy Brown's logo in book/stylesheet.html. */ -img.logoARB { - float: right; -} - -/* Person's name in team.html. */ -span.person { - font-weight: bold; - font-style: italic; -} - -/* Bibliography book covers. */ -img.book-cover { - width: 80px; +h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { + color: inherit; } -/* Blog calendar table in blog/index.html. */ -table.blogcalendar th { - text-align : right; - font-weight : bold; +/* Objectives and key points */ +.objectives, .keypoints { + background-color: azure; } -/* See above. */ -table.blogcalendar th.left { - text-align : left; +/* Things to fix. */ +.fixme { + text-decoration: underline; + color: darkred; + background-color: lightgray; } -/* See above. */ -table.blogcalendar tr td { - text-align : right; +/* Things to understand (lead-in to sections in book). */ +.understand { + background-color: lightyellow; } -/* Blog index tables in blog/index.html. */ -table.blogindex td.date { - text-align: left ; - width:10em; +/* Block quotations. */ +blockquote { + margin: 1em; + padding: 1em 1em .5em 1em; + width: 90%; } /* Tables used for displaying choices in challenges. */ @@ -256,54 +95,6 @@ table.outlined { border-collapse: collapse; } -/* Container for content in the workshop index page */ -div.workshops { - text-align: center; -} - -/* Link items (to workshop pages) in the workshops tables */ -table.workshops td.link { - width: 50%; - text-align: left; -} - -/* Spacer items (i.e. ellipsis) on the workshops tables */ -table.workshops td.spacer { - max-width: 100%; - text-align: center; -} - -/* Date columns on the workshops tables */ -table.workshops td.date { - width: 50%; - text-align: right; -} - -/* Badge modal dialog */ -#assertion-modal { - width:700px; - margin-left:-350px; -} -#assertion-modal iframe { - background-color: transparent; - border: 0px none transparent; - padding: 0px; - width: 100%; - height: 20em; -} - -#assertion-model img.badge { - position: absolute; - right: 15px; - bottom: 35px; - opacity: 0.5; -} - -/* list with checkbox as bullet */ -ul.checklist { - list-style-image: url('/img/checkbox.png'); -} - /* Printing */ @media print { h1 { @@ -403,8 +194,8 @@ code { border-top-color: #ffffff; border-bottom-color: #ffffff; } -/* GitHub Ribbon */ +/* GitHub Ribbon */ #github-ribbon a { background: #000; color: #fff; @@ -440,8 +231,8 @@ code { bottom: 1px; top: auto; } -/* github ribbon breaking point */ +/* GitHub ribbon breaking point */ @media screen and (min-width: 600px) { .navbar .btn-navbar { margin-right: 150px;