From e76d7ad3b3c8f84a17c396ae6789f08c1e91af3f Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Thu, 26 Jan 2012 20:28:25 -0500 Subject: [PATCH] icons --- css/application.css | 273 ++++++++++++++++++++++++++++----------- css/marketing.css | 15 ++- images/problem-icon.png | Bin 0 -> 310 bytes images/vertical-icon.png | Bin 0 -> 295 bytes images/video-icon.png | Bin 0 -> 352 bytes 5 files changed, 210 insertions(+), 78 deletions(-) create mode 100644 images/problem-icon.png create mode 100644 images/vertical-icon.png create mode 100644 images/video-icon.png diff --git a/css/application.css b/css/application.css index 3e3ab17e75..4313361c2c 100644 --- a/css/application.css +++ b/css/application.css @@ -98,7 +98,7 @@ input, select { font-weight: bold; src: local("Droid Sans Bold"), local("DroidSans-Bold"), url("http://themes.googleusercontent.com/static/fonts/droidsans/v3/EFpQQyG9GqCrobXxL-KRMXbFhgvWbfSbdVg11QabG8w.woff") format("woff"); } -.clearfix:after, .topbar:after, div.book-wrapper section.book nav:after, div.wiki-wrapper section.wiki-body header:after, body.askbot .secondary-nav nav:after, html body div.header-wrapper header:after, html body div.header-wrapper header nav ul:after, html body section.main-content:after, html footer:after, div.course-wrapper section.course-content ol.vert-mod li:after, div.book-wrapper section.book nav ul:after, div.wiki-wrapper div#wiki_panel div#wiki_create_form:after, body.askbot footer div.footer-wrapper:after { +.clearfix:after, .topbar:after, div.course-wrapper section.course-content ol.sequence-nav:after, div.book-wrapper section.book nav:after, div.wiki-wrapper section.wiki-body header:after, body.askbot .secondary-nav nav:after, html body div.header-wrapper header:after, html body div.header-wrapper header nav ul:after, html body section.main-content:after, html footer:after, div.course-wrapper section.course-content ol.vert-mod li:after, div.book-wrapper section.book nav ul:after, div.wiki-wrapper div#wiki_panel div#wiki_create_form:after, body.askbot footer div.footer-wrapper:after { content: "."; display: block; height: 0; @@ -111,7 +111,7 @@ input, select { min-width: 810px; width: 100%; text-align: left; } - .wrapper div.table-wrapper, html body div.header-wrapper header div.table-wrapper, html body section.main-content div.table-wrapper, html footer div.table-wrapper, section.activation div.table-wrapper, body.askbot .secondary-nav nav div.table-wrapper, body.askbot footer div.footer-wrapper div.table-wrapper, .wrapper div.course-wrapper, html body div.header-wrapper header div.course-wrapper, html body section.main-content div.course-wrapper, html footer div.course-wrapper, section.activation div.course-wrapper, body.askbot .secondary-nav nav div.course-wrapper, body.askbot footer div.footer-wrapper div.course-wrapper, .wrapper div.book-wrapper, html body div.header-wrapper header div.book-wrapper, html body section.main-content div.book-wrapper, html footer div.book-wrapper, section.activation div.book-wrapper, body.askbot .secondary-nav nav div.book-wrapper, body.askbot footer div.footer-wrapper div.book-wrapper, .wrapper body.askbot section.main-content div.discussion-wrapper, body.askbot section.main-content .wrapper div.discussion-wrapper, html body.askbot div.header-wrapper header section.main-content div.discussion-wrapper, html body.askbot section.main-content div.header-wrapper header div.discussion-wrapper, html body.askbot section.main-content div.discussion-wrapper, html footer body.askbot section.main-content div.discussion-wrapper, body.askbot section.main-content html footer div.discussion-wrapper, section.activation body.askbot section.main-content div.discussion-wrapper, body.askbot section.main-content section.activation div.discussion-wrapper, body.askbot .secondary-nav nav section.main-content div.discussion-wrapper, body.askbot section.main-content .secondary-nav nav div.discussion-wrapper, body.askbot footer div.footer-wrapper section.main-content div.discussion-wrapper, body.askbot section.main-content footer div.footer-wrapper div.discussion-wrapper { + .wrapper div.table-wrapper, html body div.header-wrapper header div.table-wrapper, html body section.main-content div.table-wrapper, html footer div.table-wrapper, section.activation div.table-wrapper, body.askbot .secondary-nav nav div.table-wrapper, body.askbot footer div.footer-wrapper div.table-wrapper, .wrapper div.course-wrapper, html body div.header-wrapper header div.course-wrapper, html body section.main-content div.course-wrapper, html footer div.course-wrapper, section.activation div.course-wrapper, body.askbot .secondary-nav nav div.course-wrapper, body.askbot footer div.footer-wrapper div.course-wrapper, .wrapper div.book-wrapper, html body div.header-wrapper header div.book-wrapper, html body section.main-content div.book-wrapper, html footer div.book-wrapper, section.activation div.book-wrapper, body.askbot .secondary-nav nav div.book-wrapper, body.askbot footer div.footer-wrapper div.book-wrapper, .wrapper div.profile-wrapper, html body div.header-wrapper header div.profile-wrapper, html body section.main-content div.profile-wrapper, html footer div.profile-wrapper, section.activation div.profile-wrapper, body.askbot .secondary-nav nav div.profile-wrapper, body.askbot footer div.footer-wrapper div.profile-wrapper, .wrapper body.askbot section.main-content div.discussion-wrapper, body.askbot section.main-content .wrapper div.discussion-wrapper, html body.askbot div.header-wrapper header section.main-content div.discussion-wrapper, html body.askbot section.main-content div.header-wrapper header div.discussion-wrapper, html body.askbot section.main-content div.discussion-wrapper, html footer body.askbot section.main-content div.discussion-wrapper, body.askbot section.main-content html footer div.discussion-wrapper, section.activation body.askbot section.main-content div.discussion-wrapper, body.askbot section.main-content section.activation div.discussion-wrapper, body.askbot .secondary-nav nav section.main-content div.discussion-wrapper, body.askbot section.main-content .secondary-nav nav div.discussion-wrapper, body.askbot footer div.footer-wrapper section.main-content div.discussion-wrapper, body.askbot section.main-content footer div.footer-wrapper div.discussion-wrapper { display: table; width: 100%; } @@ -246,17 +246,31 @@ input, select { .sidebar h3.active a, div.course-wrapper div#accordion h3.active a, div.book-wrapper ul#booknav h3.active a, div.wiki-wrapper div#wiki_panel h3.active a, body.askbot section.main-content div.discussion-wrapper aside h3.active a, .sidebar div.course-wrapper div#accordion h3.ui-accordion-header.ui-state-active a, div.course-wrapper div#accordion .sidebar h3.ui-accordion-header.ui-state-active a, div.course-wrapper div#accordion h3.ui-accordion-header.ui-state-active a, div.book-wrapper ul#booknav div.course-wrapper div#accordion h3.ui-accordion-header.ui-state-active a, div.course-wrapper div#accordion div.book-wrapper ul#booknav h3.ui-accordion-header.ui-state-active a, div.wiki-wrapper div#wiki_panel div.course-wrapper div#accordion h3.ui-accordion-header.ui-state-active a, div.course-wrapper div#accordion div.wiki-wrapper div#wiki_panel h3.ui-accordion-header.ui-state-active a, body.askbot section.main-content div.discussion-wrapper aside div.course-wrapper div#accordion h3.ui-accordion-header.ui-state-active a, div.course-wrapper div#accordion body.askbot section.main-content div.discussion-wrapper aside h3.ui-accordion-header.ui-state-active a, .sidebar div.course-wrapper div#accordion div.wiki-wrapper div#wiki_panel input.ui-accordion-header.ui-state-active[type="button"] a, div.course-wrapper div#accordion div.wiki-wrapper div#wiki_panel .sidebar input.ui-accordion-header.ui-state-active[type="button"] a, div.course-wrapper div#accordion div.wiki-wrapper div#wiki_panel input.ui-accordion-header.ui-state-active[type="button"] a, div.book-wrapper ul#booknav div.course-wrapper div#accordion div.wiki-wrapper div#wiki_panel input.ui-accordion-header.ui-state-active[type="button"] a, div.course-wrapper div#accordion div.wiki-wrapper div#wiki_panel div.book-wrapper ul#booknav input.ui-accordion-header.ui-state-active[type="button"] a, div.course-wrapper div#accordion div.wiki-wrapper div#wiki_panel input.ui-accordion-header.ui-state-active[type="button"] a, body.askbot section.main-content div.discussion-wrapper aside div.course-wrapper div#accordion div.wiki-wrapper div#wiki_panel input.ui-accordion-header.ui-state-active[type="button"] a, div.course-wrapper div#accordion div.wiki-wrapper div#wiki_panel body.askbot section.main-content div.discussion-wrapper aside input.ui-accordion-header.ui-state-active[type="button"] a, .sidebar div.wiki-wrapper div#wiki_panel div.course-wrapper div#accordion input.ui-accordion-header.ui-state-active[type="button"] a, div.wiki-wrapper div#wiki_panel div.course-wrapper div#accordion .sidebar input.ui-accordion-header.ui-state-active[type="button"] a, div.wiki-wrapper div#wiki_panel div.course-wrapper div#accordion input.ui-accordion-header.ui-state-active[type="button"] a, div.book-wrapper ul#booknav div.wiki-wrapper div#wiki_panel div.course-wrapper div#accordion input.ui-accordion-header.ui-state-active[type="button"] a, div.wiki-wrapper div#wiki_panel div.course-wrapper div#accordion div.book-wrapper ul#booknav input.ui-accordion-header.ui-state-active[type="button"] a, div.wiki-wrapper div#wiki_panel div.course-wrapper div#accordion input.ui-accordion-header.ui-state-active[type="button"] a, body.askbot section.main-content div.discussion-wrapper aside div.wiki-wrapper div#wiki_panel div.course-wrapper div#accordion input.ui-accordion-header.ui-state-active[type="button"] a, div.wiki-wrapper div#wiki_panel div.course-wrapper div#accordion body.askbot section.main-content div.discussion-wrapper aside input.ui-accordion-header.ui-state-active[type="button"] a, .sidebar div.wiki-wrapper div#wiki_panel input.active[type="button"] a, div.wiki-wrapper div#wiki_panel .sidebar input.active[type="button"] a, div.course-wrapper div#accordion div.wiki-wrapper div#wiki_panel input.active[type="button"] a, div.wiki-wrapper div#wiki_panel div.course-wrapper div#accordion input.active[type="button"] a, div.book-wrapper ul#booknav div.wiki-wrapper div#wiki_panel input.active[type="button"] a, div.wiki-wrapper div#wiki_panel div.book-wrapper ul#booknav input.active[type="button"] a, div.wiki-wrapper div#wiki_panel input.active[type="button"] a, body.askbot section.main-content div.discussion-wrapper aside div.wiki-wrapper div#wiki_panel input.active[type="button"] a, div.wiki-wrapper div#wiki_panel body.askbot section.main-content div.discussion-wrapper aside input.active[type="button"] a { color: #000; } -.topbar, div.book-wrapper section.book nav, div.wiki-wrapper section.wiki-body header, body.askbot .secondary-nav nav { +.topbar, div.course-wrapper section.course-content ol.sequence-nav, div.book-wrapper section.book nav, div.wiki-wrapper section.wiki-body header, body.askbot .secondary-nav nav { background: #F6EFD4; border-bottom: 1px solid #eddfaa; margin: -22.652px -22.652px 22.652px; font-size: 12px; text-shadow: 0 1px 0 #fff; } - .topbar a, div.book-wrapper section.book nav a, div.wiki-wrapper section.wiki-body header a, body.askbot .secondary-nav nav a { + .topbar a, div.course-wrapper section.course-content ol.sequence-nav a, div.book-wrapper section.book nav a, div.wiki-wrapper section.wiki-body header a, body.askbot .secondary-nav nav a { + -webkit-box-shadow: inset 1px 0 0 #faf7e9; + -moz-box-shadow: inset 1px 0 0 #faf7e9; + -ms-box-shadow: inset 1px 0 0 #faf7e9; + -o-box-shadow: inset 1px 0 0 #faf7e9; + box-shadow: inset 1px 0 0 #faf7e9; + background: #f2e7bf; + border-left: 1px solid #e4d080; + color: #292309; + padding: 16.989px; text-transform: uppercase; - color: #292309; } - .topbar a:hover, div.book-wrapper section.book nav a:hover, div.wiki-wrapper section.wiki-body header a:hover, body.askbot .secondary-nav nav a:hover { - color: #7e691a; } + display: block; } + .topbar a:hover, div.course-wrapper section.course-content ol.sequence-nav a:hover, div.book-wrapper section.book nav a:hover, div.wiki-wrapper section.wiki-body header a:hover, body.askbot .secondary-nav nav a:hover { + color: #7e691a; + text-decoration: none; + background: none; } + +:focus { + outline-color: #ccc; } h1 { font-size: 1.6em; @@ -559,6 +573,8 @@ div#feedback_div form ol li { div#feedback_div form ol li textarea#feedback_message { height: 100px; } +div.course-wrapper ul, div.course-wrapper ol { + list-style: none; } div.course-wrapper div#accordion div#open_close_accordion { position: absolute; right: 0px; @@ -630,55 +646,162 @@ div.course-wrapper section.course-content ol.sequence-nav { border: none; cursor: pointer; display: table-cell; - min-width: 30px; - min-height: 30px; - padding: 0 10px; } -div.course-wrapper section.course-content div.video-wrapper { + padding: 16.989px; + float: left; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_problem_inactive { + width: 14px; + background: url("/static/images/problem-icon.png") 13px 13px no-repeat; + -webkit-box-shadow: inset -1px 0 0 #eddfaa; + -moz-box-shadow: inset -1px 0 0 #eddfaa; + -ms-box-shadow: inset -1px 0 0 #eddfaa; + -o-box-shadow: inset -1px 0 0 #eddfaa; + box-shadow: inset -1px 0 0 #eddfaa; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_problem_inactive:hover { + background-color: #f9f4e1; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_problem_visited { + width: 14px; + background: #ece5cb url("/static/images/problem-icon.png") -57px 13px no-repeat; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_problem_visited:hover { + background-color: #F6EFD4; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_problem_active { + width: 14px; + background: #fffbeb url("/static/images/problem-icon.png") -22px 13px no-repeat; + -webkit-box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; + -moz-box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; + -ms-box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; + -o-box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; + box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_problem_active:hover { + background-color: #F6EFD4; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_video_inactive { + width: 14px; + background: url("/static/images/video-icon.png") 13px 15px no-repeat; + -webkit-box-shadow: inset -1px 0 0 #eddfaa; + -moz-box-shadow: inset -1px 0 0 #eddfaa; + -ms-box-shadow: inset -1px 0 0 #eddfaa; + -o-box-shadow: inset -1px 0 0 #eddfaa; + box-shadow: inset -1px 0 0 #eddfaa; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_video_inactive:hover { + background-color: #f9f4e1; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_video_visited { + width: 14px; + background: #ece5cb url("/static/images/video-icon.png") -64px 15px no-repeat; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_video_visited:hover { + background-color: #F6EFD4; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_video_active { + width: 14px; + background: #fffbeb url("/static/images/video-icon.png") -25px 15px no-repeat; + -webkit-box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; + -moz-box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; + -ms-box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; + -o-box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; + box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_video_active:hover { + background-color: #F6EFD4; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_vertical_inactive { + width: 14px; + background: url("/static/images/vertical-icon.png") -82px 15px no-repeat; + -webkit-box-shadow: inset -1px 0 0 #eddfaa; + -moz-box-shadow: inset -1px 0 0 #eddfaa; + -ms-box-shadow: inset -1px 0 0 #eddfaa; + -o-box-shadow: inset -1px 0 0 #eddfaa; + box-shadow: inset -1px 0 0 #eddfaa; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_vertical_inactive:hover { + background-color: #f9f4e1; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_vertical_visited { + width: 14px; + background: #ece5cb url("/static/images/vertical-icon.png") 13px 15px no-repeat; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_vertical_visited:hover { + background-color: #F6EFD4; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_vertical_active { + width: 14px; + background: #fffbeb url("/static/images/vertical-icon.png") -35px 15px no-repeat; + -webkit-box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; + -moz-box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; + -ms-box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; + -o-box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; + box-shadow: inset -1px 0 0 #e4d080, inset 1px 0 0 #e4d080; } + div.course-wrapper section.course-content ol.sequence-nav li.seq_vertical_active:hover { + background-color: #F6EFD4; } + div.course-wrapper section.course-content ol.sequence-nav li.prev, div.course-wrapper section.course-content ol.sequence-nav li.next { + -webkit-box-shadow: inset 1px 0 0 #faf7e9; + -moz-box-shadow: inset 1px 0 0 #faf7e9; + -ms-box-shadow: inset 1px 0 0 #faf7e9; + -o-box-shadow: inset 1px 0 0 #faf7e9; + box-shadow: inset 1px 0 0 #faf7e9; + background: #f2e7bf; + border-left: 1px solid #e4d080; + color: #292309; + float: right; + letter-spacing: 1px; + padding: 16.989px; + text-transform: uppercase; } + div.course-wrapper section.course-content ol.sequence-nav li.prev:hover, div.course-wrapper section.course-content ol.sequence-nav li.next:hover { + text-decoration: none; + color: #7e691a; + text-decoration: none; + background: none; } + +section.course-content div.video-wrapper { float: left; - width: 640px; - min-height: 620px; } - div.course-wrapper section.course-content div.video-wrapper iframe#html5_player { - border: none; - display: none; - height: 390px; - width: 640px; } - div.course-wrapper section.course-content div.video-wrapper section ul { + width: 65.761%; + margin-right: 2.717%; } + section.course-content div.video-wrapper div.video-player { + position: relative; + padding-bottom: 56.25%; + padding-top: 30px; + height: 0; + overflow: hidden; } + section.course-content div.video-wrapper div.video-player object { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; } + section.course-content div.video-wrapper div.video-player iframe#html5_player { + border: none; + display: none; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; } + section.course-content div.video-wrapper section ul { display: inline-block; } - div.course-wrapper section.course-content div.video-wrapper section ul li { + section.course-content div.video-wrapper section ul li { margin-top: 5px; display: inline-block; cursor: pointer; border: 0; padding: 0; } - div.course-wrapper section.course-content div.video-wrapper section ul li div:empty { + section.course-content div.video-wrapper section ul li div:empty { display: none; } - div.course-wrapper section.course-content div.video-wrapper section div#slider { + section.course-content div.video-wrapper section div#slider { margin: -14px 0 10px 60px; } - div.course-wrapper section.course-content div.video-wrapper section div#vidtime { + section.course-content div.video-wrapper section div#vidtime { float: left; } - div.course-wrapper section.course-content div.video-wrapper section div#video_speeds { + section.course-content div.video-wrapper section div#video_speeds { float: right; cursor: pointer; } - div.course-wrapper section.course-content div.video-wrapper section div#video_speeds span:hover { + section.course-content div.video-wrapper section div#video_speeds span:hover { color: #993333; } -div.course-wrapper section.course-content ol.subtitles { - width: 220px; - margin-left: 20px; - float: left; } - div.course-wrapper section.course-content ol.subtitles li { +section.course-content ol.subtitles { + float: left; + width: 31.522%; } + section.course-content ol.subtitles li { margin-bottom: 0px; cursor: pointer; border: 0; padding: 0; color: #666; } - div.course-wrapper section.course-content ol.subtitles li.current { + section.course-content ol.subtitles li.current { background-color: #f3f3f3; color: #333; } - div.course-wrapper section.course-content ol.subtitles li:hover { + section.course-content ol.subtitles li:hover { color: #993333; } - div.course-wrapper section.course-content ol.subtitles li div { + section.course-content ol.subtitles li div { margin-bottom: 8px; } - div.course-wrapper section.course-content ol.subtitles li div:empty { + section.course-content ol.subtitles li div:empty { margin-bottom: 0px; } div.book-wrapper ul#booknav { @@ -690,44 +813,50 @@ div.book-wrapper ul#booknav { padding: 22.652px; } div.book-wrapper ul#booknav li ul { background: none; } -div.book-wrapper section.book nav ul li { - padding: 15px; } - div.book-wrapper section.book nav ul li.last { - float: left; } - div.book-wrapper section.book nav ul li.next { - float: right; } +div.book-wrapper section.book nav ul li.last { + float: left; + display: block; } + div.book-wrapper section.book nav ul li.last a { + -webkit-box-shadow: inset -1px 0 0 #faf7e9; + -moz-box-shadow: inset -1px 0 0 #faf7e9; + -ms-box-shadow: inset -1px 0 0 #faf7e9; + -o-box-shadow: inset -1px 0 0 #faf7e9; + box-shadow: inset -1px 0 0 #faf7e9; + border-right: 1px solid #e4d080; + border-left: 0; } +div.book-wrapper section.book nav ul li.next { + display: block; + float: right; } div.book-wrapper section.book section.page img { border: 1px solid #dddddd; max-width: 100%; min-width: 100%; } -div.profile-wrapper { - display: table; } - div.profile-wrapper section.user-info { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - -ms-box-sizing: border-box; - -o-box-sizing: border-box; - box-sizing: border-box; - margin-right: 2.024%; - padding: 22.652px; - width: 48.988%; - background: #e3e3e3; - border-right: 1px solid #d3d3d3; - text-shadow: 0 1px 0 #f6f6f6; - display: table-cell; } - div.profile-wrapper section.course-info { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - -ms-box-sizing: border-box; - -o-box-sizing: border-box; - box-sizing: border-box; - display: table-cell; - padding: 22.652px; - width: 48.988%; } - div.profile-wrapper section.course-info ul li { - display: inline-block; - padding-right: 1em; } +div.profile-wrapper section.user-info { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + -ms-box-sizing: border-box; + -o-box-sizing: border-box; + box-sizing: border-box; + margin-right: 2.024%; + padding: 22.652px; + width: 48.988%; + background: #e3e3e3; + border-right: 1px solid #d3d3d3; + text-shadow: 0 1px 0 #f6f6f6; + display: table-cell; } +div.profile-wrapper section.course-info { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + -ms-box-sizing: border-box; + -o-box-sizing: border-box; + box-sizing: border-box; + display: table-cell; + padding: 22.652px; + width: 48.988%; } + div.profile-wrapper section.course-info ul li { + display: inline-block; + padding-right: 1em; } form#wiki_revision { float: left; @@ -773,7 +902,6 @@ div.wiki-wrapper { div.wiki-wrapper div#wiki_panel { overflow: auto; } div.wiki-wrapper div#wiki_panel input[type="button"] { - color: #4d4d4d; -webkit-transition-property: all; -moz-transition-property: all; -ms-transition-property: all; @@ -794,6 +922,7 @@ div.wiki-wrapper { -ms-transition-delay: 0; -o-transition-delay: 0; transition-delay: 0; + color: #4d4d4d; font-size: 14px; margin: 0 !important; padding: 7px 7px 7px 30px; @@ -845,7 +974,8 @@ div.wiki-wrapper { color: #937b1f; line-height: 1em; } div.wiki-wrapper section.wiki-body header ul { - float: right; } + float: right; + list-style: none; } div.wiki-wrapper section.wiki-body header ul li { float: left; } div.wiki-wrapper section.wiki-body header ul li input[type="button"] { @@ -888,7 +1018,7 @@ div.wiki-wrapper { font-size: 12px; text-transform: uppercase; letter-spacing: 1px; - padding: 15px; + padding: 16.989px; margin: 0; } div.wiki-wrapper section.wiki-body header ul li input[type="button"]:hover { background: none; } @@ -3608,9 +3738,6 @@ a:hover { .seq_video_visited { background-color: #ccaacc; } -.seq_video_visited { - background-color: #cccaac; } - .seq_html_visited { background-color: #caaccc; } diff --git a/css/marketing.css b/css/marketing.css index b780b36a1d..f98e70dc15 100644 --- a/css/marketing.css +++ b/css/marketing.css @@ -199,6 +199,8 @@ body { background-color: #fff; color: #444; font: 16px Georgia, serif; } + body :focus { + outline-color: #ccc; } body h1 { font: 800 24px "Open Sans", Helvetica, Arial, sans-serif; } body li { @@ -266,7 +268,7 @@ header.announcement { border-radius: 0 0 3px 3px; background: #333; background: rgba(0, 0, 0, 0.7); - padding: 12.944px; } + padding: 12.944px 25.888px; } header.announcement div nav h1 { display: -moz-inline-box; -moz-box-orient: vertical; @@ -275,18 +277,21 @@ header.announcement { zoom: 1; *display: inline; *vertical-align: auto; - margin-right: 25.888px; } + margin-right: 12.944px; } header.announcement div nav h1 a { font: italic 800 18px "Open Sans", Helvetica, Arial, sans-serif; color: #fff; text-decoration: none; } + header.announcement div nav h1 a:hover, header.announcement div nav h1 a:focus { + color: #990000; } header.announcement div nav a.login { text-decoration: none; color: #fff; font-size: 12px; - font-style: normal; } - header.announcement div nav a.login:hover { - color: rgba(255, 255, 255, 0.6); } + font-style: normal; + font-family: "Open Sans", Helvetica, Arial, sans-serif; } + header.announcement div nav a.login:hover, header.announcement div nav a.login:focus { + color: #990000; } header.announcement div section { display: -moz-inline-box; -moz-box-orient: vertical; diff --git a/images/problem-icon.png b/images/problem-icon.png new file mode 100644 index 0000000000000000000000000000000000000000..7a7f052921d09f2db0f63f3004d8fd8b7d622690 GIT binary patch literal 310 zcmeAS@N?(olHy`uVBq!ia0vp^;Xo|R!3HFsGENi&Qhz;N978H@y}ht8^O%8vL*mwT zccgfj-cRzY&S(``Y22t_oYJu6Ww12QIv%#Sg_TPU*v*dZ4=6l(-G1KhpZ_eRHaO^g zC{X&;asIpc*#_34#^cJm_50&zF>*g)s+X}&YBez`Kf;xn@UBC&D1F`Wu%6Q$T_Kq; zMk184zp~Ad&p3D>wkpLuiT5oSRF#%$u z?d>+E=2MiVXGlK?`TD%AXvx{FJI$^?yA?A#yEu0pgtMmdKI;Vst0Bbmdk^lez literal 0 HcmV?d00001 diff --git a/images/vertical-icon.png b/images/vertical-icon.png new file mode 100644 index 0000000000000000000000000000000000000000..df4859090e297745219b87c76496bef4b6b37c28 GIT binary patch literal 295 zcmeAS@N?(olHy`uVBq!ia0vp^#Xu~?!3HEVUO$usQtv!n978H@y}e=B)#4!1^3ZNl z`UK7%n`VVCyeTc7bG3O)W^h$E_^KP-T=4$OHkRft`4VMg(VCqf*kkv7_+H05;Uv?; zDY9W4X<=7B*IDyGxf=i8?zith%rH|&!0%?FZPVF=l*KciZ3yqNY@XPgH0yAj;WHjL zv#w0O-AP)@lHyF$7(0Sc;Taal6+)um1bOLxHK!&=V%C! evpD2Be6^K8W`K{EgTA{eC|X zOCVwykRlfQAl`!v&_KyrAVnqiwNZcuO4b4?DzUE(12j;w7D!QveSHw%Jc9tI*#tPx z16(M8-+(vV01w~+Jit+a4Q93jDHgF`jRI^ivmHpWi2Z69V1t?MK#E1|S3klRJ;Eb& zYywjBVm}xK7@=bmkfIm+!7#uG9h-m@z1R