X-Git-Url: https://projects.mako.cc/source/selectricity-live/blobdiff_plain/b9f3bbdefb7bb1abd63193e2162aae1e78e1a1cb..9516096632eaa0015fa67613aaa0bed711481a72:/public/stylesheets/main.css diff --git a/public/stylesheets/main.css b/public/stylesheets/main.css index 86cf84b..16b10bf 100644 --- a/public/stylesheets/main.css +++ b/public/stylesheets/main.css @@ -1,196 +1,255 @@ -body { - font-size: 1em; - font-weight: normal; - word-spacing: normal; - letter-spacing: normal; - text-transform: none; - font-family: Myriad Web, Geneva, Arial, Helvetica, sans-serif; - font-size-adjust: .48; -} -p, blockquote, ul, ol, dl, dd, li, dir, menu {} - -h1, h2, h3, h4 { - border-bottom: 1px solid #4D801A; - text-shadow: #4D801A 0.2em 0.2em 3px; - -} -#headertext a {color: #FFFFFF; text-decoration: none;} - -a:link { font-weight: bold; color: #4D801A; text-decoration: underline; } -a:visited { font-weight: bold; color: #4D801A; text-decoration: underline; } -a:hover { color: #FFFFFF; text-decoration: none; background: #0063DC; } -a:active { color: #FFFFFF; text-decoration: none; background: #0259C4; } - -#loginbox { - padding: 10px; - border: 1px solid; - width: 400px; - text-align: left; +@charset "utf-8"; + +/* CSS Document */ + +/**************************************************************** + Selectricity || selectricity.org + Design by Courtland Allen +*****************************************************************/ + +/* basics */ + +body { + color: black; + background: white; + background: url(/images/bg_main.png) repeat-x top left; } -#ErrorExplanation { - width: 400px; - border: 2px solid 'red'; - padding: 7px; - padding-bottom: 12px; - margin-bottom: 20px; - background-color: #f0f0f0; +h2 { + font-size: 24px !important; + margin: 0 0 1em 0 !important; } -#ErrorExplanation h2 { - text-align: left; - font-weight: bold; - padding: 5px 5px 5px 15px; - font-size: 12px; - margin: -7px; - background-color: #c00; - color: #fff; +h3 { + font-size: 18px !important; + margin: 0 0 1em 0 !important; } -#ErrorExplanation p { - color: #333; - margin-bottom: 0; - padding: 5px; +.special { + background-color: #999999; + color: white; + text-align: center; + pading: 0 1em 0 1em; } -#ErrorExplanation ul li { - font-size: 12px; - list-style: square; +label { + font-weight: bold; } -#top { padding-left: 10px; - padding-right: 10px; - padding-top: 5px; - padding-bottom: 5px; - font-weight: normal; - background: #73BF26; - color: #FFFFFF; + +/* Left column. Includes logo, poll information, and graph. */ + +#left-side { + width: 270px; + float: left; + text-align: left; + margin-top: 33px; + font-size: 13px; } -#top h3 { - border-bottom: 0px; - font-size: 30px; } +#left-side h1 { + height: 0px; + overflow: hidden; + padding-top: 189px; + background: url(/images/title_main.png) no-repeat top left; +} -#links { text-align : right; } -#links a { color: #FFF; font-weight: bold; } -#links a:visited { color: #FFF; font-weight: bold; } -.ListLine0 { - background: #e0f8f8; - +#left-side-content { + color: #666666; + margin-top: 40px; + text-align: left; } -.ListLine1 { - background: #cccccc; - + +#left-side-content p { + color: #666666; + padding-left: 2em; + margin: 2em 0 2em 0; } -#main { margin: 30px; } +#left-side-content ol { + color: #666666; +} -#notice { background: #FFFBB3; - text-align: left; - font-weight: bold; - border: 2px dotted 'red'; - margin-top: 10px; - margin-left: 50px; - padding: 5px 5px 5px 15px; - width: 400px; } +/* #graph { + margin-top: 50px; + background: url(/images/graph.jpg) top left no-repeat; + height: 0px; + overflow: hidden; + padding-top: 243px; +} */ -#status { - width: 400px; - border: 1px solid #0000FF; - border-width: 1px; - padding: 7px; - padding-bottom: 12px; - margin-bottom: 20px; - background-color: #f0f0f0; -} -#footer { text-align: center; - font-size: 12px; - color: #464646; - clear: both;} -#footer a { font-weight: normal; } - -#subtext { +/* Right column. Includes top-bar and main-box. */ + +#right-side { + width: 611px; + margin-top: 0px; + float: right; +} + +#top-bar { + float: right; + margin-right: 50px; + width: 231px; text-align: center; - font-size: 12px; - font-weight: bold; } + margin-bottom: 35px; +} -.fieldWithErrors { - display: inline; +#top-bar a { + color: #dddddd; + font-size: 11px; +} + +div#bar-left { + background-image: url(/images/top_bar_1.png); + width: 153px; + height: 37px; + padding-top: 8px; + float: left; + clear: left; +} + +div#bar-right { + background-image: url(/images/top_bar_2.png); + width: 78px; + height: 37px; + padding-top: 8px; + float: left; + clear: right; +} + +.green { color: #10a700; } + +.left-aligned h4 { + float: left; + padding-top: 26px; + height: 0px; + overflow: hidden; + background: no-repeat top left; +} + +.right-aligned h4 { + float: right; + padding-top: 26px; + height: 0px; + overflow: hidden; + background: no-repeat top right; } -.fieldWithErrors input, .fieldWithErrors select { - background-color: #ffdfdf; + +.left-aligned { text-align: left; } + +.right-aligned { text-align: right; } + +h5 { + color: #5c5c5c; + background-color: #d6d6d6; + height: 21px; + font-size: 16px; + padding: 5px 15px 0 15px; + margin-bottom: .75em; + overflow: hidden; +} + +#title-header { + margin: -20px -20px 1em -20px; + height: 32px; + margin-bottom: 14px; + background-color: #e5e5e5; +} + +.normal-header { + margin: 1.3em -20px 1.3em -20px; + height: 32px; + background-color: #e5e5e5; +} + +.header { + display: block; + font-family: verdana,arial,helvetica,sans-serif; + font-size: 30px; + text-transform: uppercase; + text-align: center; + color: white; + background-color: #999999; + height: 32px; + float: left; + padding: 0px .75em 0px .75em; } +.subheader { + float: left; + font-family: verdana,arial,helvetica,sans-serif; + font-size: 18px; + color: #666666; + background-color: #e5e5e5; + height: 26px; + padding: 6px 1em 0px 10px; +} +#main-box { + float: right; + width: 571px; + padding: 20px; + background: #f9f9f9; + border: 1px solid #b3b3b3; +} + +#main-box p, #main-box blockquote, #main-box ul { + margin-bottom: 1em; +} + +blockquote { + margin-left: 3em; +} + + +/* css related to error in forms */ + +#errorExplanation { + border: 2px solid #C00; + width: 260px; + margin-bottom: 20px; + background-color: #f0f0f0; +} -#xxErrorExplanation h2 { +#errorExplanation h2 { + font-size: 1em !important; text-align: left; font-weight: bold; - padding: 5px 5px 5px 15px; - font-size: 12px; - margin: -7px; + padding: 5px 5px 5px 5px; background-color: #c00; color: #fff; } -#xxErrorExplanation p { +#errorExplanation p { + font-size: 1em; color: #333; margin-bottom: 0; padding: 5px; } -#xxErrorExplanation ul li { - font-size: 12px; +#errorExplanation ul li { + font-size: 1em; list-style: square; } -.mainresultbox { - text-align: center; - width: 850px; - border-width: 2px; - border-style: solid; - border-color: #4D801A; - padding: 7px; - margin-right: 30px; - margin-bottom: 30px; +.fieldWithErrors { + display: inline; } - -.mainresultbox h3 { - text-align: center; - font-weight: bold; - padding: 5px 5px 5px 15px; - margin: -7px; - background-color: #73BF26; - color: #fff; - border-bottom: 0px; +.fieldWithErrors input, .fieldWithErrors select, .fieldWithErrors textarea { + background-color: #FFFBB3; } -.resultbox { - text-align: center; + +#status { width: 400px; - float: left; - border-width: 2px; - border-style: solid; - border-color: #4D801A; + border: 1px solid #0000FF; + border-width: 1px; padding: 7px; - margin-right: 30px; - margin-bottom: 30px; -} - -.resultbox h3 { - text-align: center; - font-weight: bold; - padding: 5px 5px 5px 15px; - margin: -7px; - background-color: #73BF26; - color: #fff; - border-bottom: 0px; -} -.clearbox { - clear: both; - margin: 30px; + padding-bottom: 12px; + margin-bottom: 20px; + background-color: #f0f0f0; } li.moveable { @@ -207,6 +266,36 @@ li.moveable { float: left; } +.preftable { + border-spacing: 0px; + border-width: 2px; + border-color: #999999; + border-style: solid; +} + +.preftable th { + font-family: verdana,arial,helvetica,sans-serif; + border-width: 2px; + border-color: #999999; + border-style: solid; + text-align: center; + font-weight: bold; + padding: 5px 5px 5px 5px; + background-color: #999999; + color: #FFFFFF; +} + +.preftable td { + border-collapse: collapse; + border-width: 1px; + border-color: #999999; + border-style: solid; + + text-align: right; + padding-right: 5px; + padding-left: 5px; +} + .voterbox { border-spacing: 0px; border-width: 2px; @@ -236,6 +325,17 @@ li.moveable { padding-left: 5px; } +/* voterbox#election is used on user summary page */ +.voterbox#election { border-color: #990d13; } + +.voterbox#election th { + background-color: #dc0d13; + border-color: #dc0d13; +} + +.voterbox#election td { border-color: #990d13;} + + .rbmoreinfo hr { width: 100%; height: 10px; @@ -312,3 +412,19 @@ li.moveable { padding: 5px; } +#election_creation_progress_bar ul li { + display: block; + list-style: default; +} + +#election_creation_progress_bar li.step_selected { + font-weight: bold; +} + +#election_creation_progress_bar li.step_unselected { + color: #CCCCCC; + font-weight: bold; +} + + +