X-Git-Url: https://projects.mako.cc/source/selectricity/blobdiff_plain/7b649ccad8804580632c255b9f451482fdbbe32d..931c5013597eca0dfe465f13f697ef867db22a91:/public/stylesheets/main.css?ds=sidebyside diff --git a/public/stylesheets/main.css b/public/stylesheets/main.css index 76eff61..acdff30 100644 --- a/public/stylesheets/main.css +++ b/public/stylesheets/main.css @@ -1,197 +1,254 @@ -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; + + +/* 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; + margin-bottom: 35px; } -#footer { text-align: center; - font-size: 12px; - color: #464646; - clear: both;} +#top-bar a { + color: #dddddd; + font-size: 11px; +} -#footer a { font-weight: normal; } - -#subtext { +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; +} + +.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; +} + +#page-title { + margin: -20px -20px 1em -20px; +} + +.plain-header { + margin: 1em -20px 1em -20px; +} + +.header { + display: block; + font-family: "trebuchet ms",trebuchet,verdana,arial,sans-serif; + font-size: 30px; + text-transform: uppercase; text-align: center; - font-size: 12px; - font-weight: bold; } + color: white; + background-color: #999999; + height: 32px; + float: left; + padding: 0px .75em 0px .75em; + margin-right: 10px; + margin-bottom: 14px; +} -.fieldWithErrors { - display: inline; +.subheader { + display: block; + font-family: "trebuchet ms",trebuchet,verdana,arial,sans-serif; + font-size: 18px; + text-align: left; + color: #666666; + background-color: #CCCCCC; + height: 26px; + padding: 6px 1em 0px 20px; + margin-bottom: 14px; +} + +#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; } -.fieldWithErrors input, .fieldWithErrors select { - background-color: #ffdfdf; + +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 { @@ -208,6 +265,35 @@ li.moveable { float: left; } +.preftable { + border-spacing: 0px; + border-width: 2px; + border-color: #999999; + border-style: solid; +} + +.preftable th { + border-width: 2px; + border-color: #999999; + border-style: solid; + text-align: center; + font-weight: bold; + padding: 5px 5px 5px 15px; + background-color: #999999; + color: #fff; +} + +.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; @@ -314,20 +400,10 @@ li.moveable { } #election_creation_progress_bar ul li { - display: inline; + display: block; list-style: default; } -#election_creation_progress_bar ul li:after { - font-weight: normal; - color: #000; - content: " || "; -} - -#election_creation_progress_bar ul li.last:after { - content: ""; -} - #election_creation_progress_bar li.step_selected { font-weight: bold; } @@ -336,3 +412,6 @@ li.moveable { color: #CCCCCC; font-weight: bold; } + + +