diff --git a/package.json b/package.json index 7fd11eb5a..b31bd35b1 100644 --- a/package.json +++ b/package.json @@ -23,8 +23,8 @@ "test": "mocha tests/unit", "watch": "watchify static/js/init.js -o static/js/app.js --debug --verbose", "build": "browserify static/js/init.js > static/js/app.js", - "sass-watch": "sass --watch static/styles/sass/styles.scss:static/styles/styles.css", - "sass-build": "sass static/styles/sass/styles.scss:static/styles/styles.css", + "sass-watch": "sass --watch static/styles/:static/styles/", + "sass-build": "sass static/styles/sass/:static/styles/", "watch-all": "npm run watch & npm run sass-watch" }, "repository": { diff --git a/static/img/brand.png b/static/img/brand.png new file mode 100644 index 000000000..fc019be73 Binary files /dev/null and b/static/img/brand.png differ diff --git a/static/img/brand@2x.png b/static/img/brand@2x.png new file mode 100644 index 000000000..aa01e64e2 Binary files /dev/null and b/static/img/brand@2x.png differ diff --git a/static/img/mesh.png b/static/img/mesh.png new file mode 100644 index 000000000..6e2b26bc2 Binary files /dev/null and b/static/img/mesh.png differ diff --git a/static/img/mesh@2x.png b/static/img/mesh@2x.png new file mode 100644 index 000000000..12b0fd85f Binary files /dev/null and b/static/img/mesh@2x.png differ diff --git a/static/img/us_flag_small.png b/static/img/us_flag_small.png new file mode 100644 index 000000000..73bd1de3c Binary files /dev/null and b/static/img/us_flag_small.png differ diff --git a/static/styles/_base/_base.scss b/static/styles/_base/_base.scss new file mode 100644 index 000000000..6bebd4b39 --- /dev/null +++ b/static/styles/_base/_base.scss @@ -0,0 +1,22 @@ +// Bitters v0.10.0 +// http://bitters.bourbon.io + +// Variables +@import 'variables'; + +// Mixins +@import 'mixins/flash'; +@import 'mixins/icon'; + +// Extends +@import 'extends/button'; +@import 'extends/clearfix'; +@import 'extends/hide-text'; + +// Typography and Elements +@import 'typography'; +@import 'forms'; +@import 'tables'; +@import 'lists'; +@import 'flashes'; +@import 'buttons'; diff --git a/static/styles/_base/_buttons.scss b/static/styles/_base/_buttons.scss new file mode 100644 index 000000000..8409821c9 --- /dev/null +++ b/static/styles/_base/_buttons.scss @@ -0,0 +1,46 @@ +@mixin button($bgcolor, $textcolor, $hoverbg, $hovertext) { + @include appearance(none); + @include transition(background-color .1s); + -webkit-font-smoothing: antialiased; + background-color: $bgcolor; + border-radius: $base-border-radius; + border: none; + display: inline-block; + color: $textcolor; + font-size: $base-font-size; + font-weight: bold; + line-height: 1; + padding: .75em 1em; + text-decoration: none; + cursor: pointer; + user-select: none; + vertical-align: middle; + white-space: nowrap; + + &:hover { + background-color: $hoverbg; + color: $hovertext; + } + + &:active, + &:focus { + @include appearance(none); + outline: none; + } +} + +.button { + @include button($light-gray, $dark-gray, $dark-gray, #fff); + border: 1px solid $medium-gray; + +} + +button, +input[type="submit"], +.primary { + @include button($blue, #fff, $blue-2, #fff); + + &:active { + background-color: $blue-2; + } +} diff --git a/static/styles/_base/_flashes.scss b/static/styles/_base/_flashes.scss new file mode 100644 index 000000000..7eeddf1c7 --- /dev/null +++ b/static/styles/_base/_flashes.scss @@ -0,0 +1,15 @@ +%flash-alert { + @include flash($alert-color); +} + +%flash-error { + @include flash($error-color); +} + +%flash-notice { + @include flash($notice-color); +} + +%flash-success { + @include flash($success-color); +} diff --git a/static/styles/_base/_forms.scss b/static/styles/_base/_forms.scss new file mode 100644 index 000000000..0a57c2308 --- /dev/null +++ b/static/styles/_base/_forms.scss @@ -0,0 +1,126 @@ +fieldset { + background: lighten($base-border-color, 10); + border: 1px solid $base-border-color; + margin: 0 0 ($base-line-height / 2) 0; + padding: $base-line-height; +} + +input, +label, +select { + display: block; + font-family: $form-font-family; + font-size: $form-font-size; +} + +label { + margin-bottom: $base-line-height / 4; + + &.required:after { + content: "*"; + } + + abbr { + display: none; + } +} + +#{$all-text-inputs} { + height: 2rem; +} + +textarea, +#{$all-text-inputs}, +select[multiple=multiple] { + @include box-sizing(border-box); + @include transition(border-color); + background-color: white; + border-radius: $form-border-radius; + border: 1px solid $form-border-color; + box-shadow: $form-box-shadow; + font-family: $form-font-family; + font-size: $form-font-size; + padding: .5rem 1rem; + width: 100%; + + &:hover { + border-color: $form-border-color-hover; + } + + &:focus { + border-color: $form-border-color-focus; + box-shadow: $form-box-shadow-focus; + outline: none; + } +} + +textarea { + resize: vertical; +} + +input[type="search"] { + @include appearance(none); +} + +input[type="checkbox"], input[type="radio"] { + display: inline; + margin-right: $base-line-height / 4; +} + +input[type="file"] { + margin-bottom: $base-line-height / 2; + padding-bottom: ($base-line-height / 3); + width: 100%; +} + +select { + width: auto; + max-width: 100%; + margin-bottom: $base-line-height; +} + + +// Custom form elements +.input-button-combo { + #{$all-text-inputs} { + width: 75%; + float: left; + border-radius: $base-border-radius 0 0 $base-border-radius; + } + + input[type="submit"] { + width: 25%; + float: left; + border-radius: 0 $base-border-radius $base-border-radius 0; + } +} + +// Overriding Chosen styles +// .chosen-container-single .chosen-single { +// background: #fff; +// border-radius: $base-border-radius; +// padding: .5rem 1rem; +// height: 2rem; +// font-size: $form-font-size; +// line-height: 1; +// color: $base-font-color; +// +// } +// +// .chosen-container-active.chosen-with-drop .chosen-single { +// background: #fff; +// } +// +// // Chosen select toggle +// .chosen-container-single .chosen-single div { +// width: 32px; +// background-color: $dark-gray; +// +// b { +// content: "\e62a"; +// color: #fff; +// @include icon(); +// background: none; +// +// } +// } diff --git a/static/styles/_base/_grid-settings.scss b/static/styles/_base/_grid-settings.scss new file mode 100644 index 000000000..5bac40617 --- /dev/null +++ b/static/styles/_base/_grid-settings.scss @@ -0,0 +1,6 @@ +// Neat Breakpoints +$medium-screen: em(640); +$large-screen: em(860); + +$medium-screen-up: new-breakpoint(min-width $medium-screen 4); +$large-screen-up: new-breakpoint(min-width $large-screen 8); diff --git a/static/styles/_base/_lists.scss b/static/styles/_base/_lists.scss new file mode 100644 index 000000000..3b3646607 --- /dev/null +++ b/static/styles/_base/_lists.scss @@ -0,0 +1,38 @@ +ul, ol { + margin: 0; + padding: 0; + list-style-type: none; + + &%default-ul { + list-style-type: disc; + margin-bottom: $base-line-height / 2; + padding-left: $base-line-height; + } + + &%default-ol { + list-style-type: decimal; + margin-bottom: $base-line-height / 2; + padding-left: $base-line-height; + } +} + +%flat-list { + @include clearfix(); + + li { + float: left; + } +} + +dl { + margin-bottom: $base-line-height / 2; + + dt { + font-weight: bold; + margin-top: $base-line-height / 2; + } + + dd { + margin: 0; + } +} diff --git a/static/styles/_base/_tables.scss b/static/styles/_base/_tables.scss new file mode 100644 index 000000000..31e78f4a5 --- /dev/null +++ b/static/styles/_base/_tables.scss @@ -0,0 +1,22 @@ +table { + border-collapse: collapse; + margin: ($base-line-height / 2) 0; + table-layout: fixed; + width: 100%; +} + +th { + border-bottom: 1px solid darken($base-border-color, 15%); + font-weight: bold; + padding: ($base-line-height / 2) 0; + text-align: left; +} + +td { + border-bottom: 1px solid $base-border-color; + padding: ($base-line-height / 2) 0; +} + +tr, td, th { + vertical-align: middle; +} diff --git a/static/styles/_base/_typography.scss b/static/styles/_base/_typography.scss new file mode 100644 index 000000000..aee6b07f4 --- /dev/null +++ b/static/styles/_base/_typography.scss @@ -0,0 +1,98 @@ +body { + -webkit-font-smoothing: antialiased; + background-color: $base-background-color; + color: $base-font-color; + font-family: $base-font-family; + font-size: $base-font-size * .875; + line-height: $unitless-line-height; +} + +h1, h2, h3, h4, h5, h6 { + font-family: $header-font-family; + line-height: $header-line-height; + margin: 0; + text-rendering: optimizeLegibility; // Fix the character spacing for headings +} + +h1 { + font-size: $base-font-size * 3.125; + font-weight: 300; +} + +h2 { + font-size: $base-font-size * 2.5; + font-weight: 300; + margin-bottom: 1rem; +} + +h3 { + font-size: $base-font-size * 2; + font-weight: 400; +} + +h4 { + font-size: $base-font-size * 1.25; + font-weight: 400; +} + +h5 { + font-size: $base-font-size * 1.25; // 16 * 1.25 = 20px +} + +h6 { + font-size: $base-font-size; +} + +p { + margin: 0 0 ($base-line-height * .5); +} + +a { + @include transition(color 0.1s linear); + color: $base-link-color; + text-decoration: none; + + &:hover { + color: $hover-link-color; + } + + &:active, &:focus { + color: $hover-link-color; + outline: none; + } +} + +hr { + border-bottom: 1px solid $base-border-color; + border-left: none; + border-right: none; + border-top: none; + margin: $base-line-height 0; +} + +img { + margin: 0; + max-width: 100%; +} + +blockquote { + border-left: 2px solid $base-border-color; + color: lighten($base-font-color, 15); + margin: $base-line-height 0; + padding-left: $base-line-height / 2; +} + +cite { + color: lighten($base-font-color, 25); + font-style: italic; + + &:before { + content: '\2014 \00A0'; + } +} + +// Universal text classes + +.lead-text { + font-size: $base-font-size * 1.125; +} diff --git a/static/styles/_base/_variables.scss b/static/styles/_base/_variables.scss new file mode 100644 index 000000000..286d9931f --- /dev/null +++ b/static/styles/_base/_variables.scss @@ -0,0 +1,73 @@ +// Typography +$sans-serif: 'Open Sans', helvetica, arial, sans-serif; +$serif: $georgia; +$base-font-family: $sans-serif; +$header-font-family: $base-font-family; + +// Sizes +$base-font-size: 1rem; +$base-line-height: 1.5; +$unitless-line-height: $base-line-height / ($base-line-height * 0 + 1); // Strip units from line-height: https://developer.mozilla.org/en-US/docs/Web/CSS/line-height#Prefer_unitless_numbers_for_line-height_values +$header-line-height: 1.25; +$base-border-radius: em(4); + +// Colors +$dark-gray: #515A61; +$medium-gray: #D7D7D7; +$light-gray: #F6F6F6; +$light-red: #FBE3E4; +$light-yellow: #FFF6BF; +$light-green: #E6EFC2; + +// FEC Colors +$blue: #2678BA; +$blue-2: #1B5585; +$red: #DB4857; +$red-2: #A13540; +$green: #148552; +$green-2: #0F5E3B; +$licorice: #3E4957; +$licorice-2: #323A45; + +// Data colors +$data-support: #1B5585; // Blue +$data-support-2: #103552; // Darker blue +$data-oppose: #A9205C; // Purple +$data-oppose-2: #6B143B; // Darker purple +$data-receipt: #148552; // Green +$data-disbursement: #DB4857; // Salmon + +// UI Colors +$meta-box-color: #FBFBFD; + +// Background Color +$base-background-color: white; + +// Font Colors +$base-font-color: $dark-gray; +$base-accent-color: $blue; + +// Link Colors +$base-link-color: $base-accent-color; +$hover-link-color: darken($base-accent-color, 15); +$base-button-color: $light-gray; +$hover-button-color: $medium-gray; + +// Border color +$base-border-color: $medium-gray; + +// Flash Colors +$alert-color: $light-yellow; +$error-color: $light-red; +$notice-color: $light-yellow; +$success-color: $light-green; + +// Forms +$form-border-color: $dark-gray; +$form-border-color-hover: darken($form-border-color, 10); +$form-border-color-focus: $base-accent-color; +$form-border-radius: $base-border-radius; +$form-box-shadow: inset 0 1px 3px rgba(0,0,0,0.06); +$form-box-shadow-focus: $form-box-shadow, 0 0 0 rgba(darken($form-border-color-focus, 5), 0.7); +$form-font-size: $base-font-size * .875; +$form-font-family: $base-font-family; diff --git a/static/styles/_base/extends/_button.scss b/static/styles/_base/extends/_button.scss new file mode 100644 index 000000000..e69de29bb diff --git a/static/styles/_base/extends/_clearfix.scss b/static/styles/_base/extends/_clearfix.scss new file mode 100644 index 000000000..22ac1795e --- /dev/null +++ b/static/styles/_base/extends/_clearfix.scss @@ -0,0 +1,3 @@ +%clearfix { + @include clearfix; +} diff --git a/static/styles/_base/extends/_hide-text.scss b/static/styles/_base/extends/_hide-text.scss new file mode 100644 index 000000000..a41a12344 --- /dev/null +++ b/static/styles/_base/extends/_hide-text.scss @@ -0,0 +1,3 @@ +%hide-text { + @include hide-text; +} diff --git a/static/styles/_base/mixins/_flash.scss b/static/styles/_base/mixins/_flash.scss new file mode 100644 index 000000000..55afd6143 --- /dev/null +++ b/static/styles/_base/mixins/_flash.scss @@ -0,0 +1,15 @@ +@mixin flash($color) { + background: $color; + color: darken($color, 60); + font-weight: bold; + margin-bottom: $base-line-height / 2; + padding: $base-line-height / 2; + + a { + color: darken($color, 70); + + &:hover { + color: darken($color, 90); + } + } +} diff --git a/static/styles/_base/mixins/_icon.scss b/static/styles/_base/mixins/_icon.scss new file mode 100644 index 000000000..49f919431 --- /dev/null +++ b/static/styles/_base/mixins/_icon.scss @@ -0,0 +1,16 @@ +// Mixin that gives all of the styles necessary to put a themify icon into CSS +// Using the content property + +@mixin icon() { + font-family: 'themify'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + + /* Better Font Rendering =========== */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} diff --git a/static/styles/bourbon/_bourbon-deprecated-upcoming.scss b/static/styles/_bourbon/_bourbon-deprecated-upcoming.scss similarity index 100% rename from static/styles/bourbon/_bourbon-deprecated-upcoming.scss rename to static/styles/_bourbon/_bourbon-deprecated-upcoming.scss diff --git a/static/styles/bourbon/_bourbon.scss b/static/styles/_bourbon/_bourbon.scss similarity index 100% rename from static/styles/bourbon/_bourbon.scss rename to static/styles/_bourbon/_bourbon.scss diff --git a/static/styles/bourbon/addons/_button.scss b/static/styles/_bourbon/addons/_button.scss similarity index 100% rename from static/styles/bourbon/addons/_button.scss rename to static/styles/_bourbon/addons/_button.scss diff --git a/static/styles/bourbon/addons/_clearfix.scss b/static/styles/_bourbon/addons/_clearfix.scss similarity index 100% rename from static/styles/bourbon/addons/_clearfix.scss rename to static/styles/_bourbon/addons/_clearfix.scss diff --git a/static/styles/bourbon/addons/_directional-values.scss b/static/styles/_bourbon/addons/_directional-values.scss similarity index 100% rename from static/styles/bourbon/addons/_directional-values.scss rename to static/styles/_bourbon/addons/_directional-values.scss diff --git a/static/styles/bourbon/addons/_ellipsis.scss b/static/styles/_bourbon/addons/_ellipsis.scss similarity index 100% rename from static/styles/bourbon/addons/_ellipsis.scss rename to static/styles/_bourbon/addons/_ellipsis.scss diff --git a/static/styles/bourbon/addons/_font-family.scss b/static/styles/_bourbon/addons/_font-family.scss similarity index 100% rename from static/styles/bourbon/addons/_font-family.scss rename to static/styles/_bourbon/addons/_font-family.scss diff --git a/static/styles/bourbon/addons/_hide-text.scss b/static/styles/_bourbon/addons/_hide-text.scss similarity index 100% rename from static/styles/bourbon/addons/_hide-text.scss rename to static/styles/_bourbon/addons/_hide-text.scss diff --git a/static/styles/bourbon/addons/_html5-input-types.scss b/static/styles/_bourbon/addons/_html5-input-types.scss similarity index 100% rename from static/styles/bourbon/addons/_html5-input-types.scss rename to static/styles/_bourbon/addons/_html5-input-types.scss diff --git a/static/styles/bourbon/addons/_position.scss b/static/styles/_bourbon/addons/_position.scss similarity index 100% rename from static/styles/bourbon/addons/_position.scss rename to static/styles/_bourbon/addons/_position.scss diff --git a/static/styles/bourbon/addons/_prefixer.scss b/static/styles/_bourbon/addons/_prefixer.scss similarity index 100% rename from static/styles/bourbon/addons/_prefixer.scss rename to static/styles/_bourbon/addons/_prefixer.scss diff --git a/static/styles/bourbon/addons/_retina-image.scss b/static/styles/_bourbon/addons/_retina-image.scss similarity index 100% rename from static/styles/bourbon/addons/_retina-image.scss rename to static/styles/_bourbon/addons/_retina-image.scss diff --git a/static/styles/bourbon/addons/_size.scss b/static/styles/_bourbon/addons/_size.scss similarity index 100% rename from static/styles/bourbon/addons/_size.scss rename to static/styles/_bourbon/addons/_size.scss diff --git a/static/styles/bourbon/addons/_timing-functions.scss b/static/styles/_bourbon/addons/_timing-functions.scss similarity index 100% rename from static/styles/bourbon/addons/_timing-functions.scss rename to static/styles/_bourbon/addons/_timing-functions.scss diff --git a/static/styles/bourbon/addons/_triangle.scss b/static/styles/_bourbon/addons/_triangle.scss similarity index 100% rename from static/styles/bourbon/addons/_triangle.scss rename to static/styles/_bourbon/addons/_triangle.scss diff --git a/static/styles/bourbon/addons/_word-wrap.scss b/static/styles/_bourbon/addons/_word-wrap.scss similarity index 100% rename from static/styles/bourbon/addons/_word-wrap.scss rename to static/styles/_bourbon/addons/_word-wrap.scss diff --git a/static/styles/bourbon/css3/_animation.scss b/static/styles/_bourbon/css3/_animation.scss similarity index 100% rename from static/styles/bourbon/css3/_animation.scss rename to static/styles/_bourbon/css3/_animation.scss diff --git a/static/styles/bourbon/css3/_appearance.scss b/static/styles/_bourbon/css3/_appearance.scss similarity index 100% rename from static/styles/bourbon/css3/_appearance.scss rename to static/styles/_bourbon/css3/_appearance.scss diff --git a/static/styles/bourbon/css3/_backface-visibility.scss b/static/styles/_bourbon/css3/_backface-visibility.scss similarity index 100% rename from static/styles/bourbon/css3/_backface-visibility.scss rename to static/styles/_bourbon/css3/_backface-visibility.scss diff --git a/static/styles/bourbon/css3/_background-image.scss b/static/styles/_bourbon/css3/_background-image.scss similarity index 100% rename from static/styles/bourbon/css3/_background-image.scss rename to static/styles/_bourbon/css3/_background-image.scss diff --git a/static/styles/bourbon/css3/_background.scss b/static/styles/_bourbon/css3/_background.scss similarity index 100% rename from static/styles/bourbon/css3/_background.scss rename to static/styles/_bourbon/css3/_background.scss diff --git a/static/styles/bourbon/css3/_border-image.scss b/static/styles/_bourbon/css3/_border-image.scss similarity index 100% rename from static/styles/bourbon/css3/_border-image.scss rename to static/styles/_bourbon/css3/_border-image.scss diff --git a/static/styles/bourbon/css3/_border-radius.scss b/static/styles/_bourbon/css3/_border-radius.scss similarity index 100% rename from static/styles/bourbon/css3/_border-radius.scss rename to static/styles/_bourbon/css3/_border-radius.scss diff --git a/static/styles/bourbon/css3/_box-sizing.scss b/static/styles/_bourbon/css3/_box-sizing.scss similarity index 100% rename from static/styles/bourbon/css3/_box-sizing.scss rename to static/styles/_bourbon/css3/_box-sizing.scss diff --git a/static/styles/bourbon/css3/_calc.scss b/static/styles/_bourbon/css3/_calc.scss similarity index 100% rename from static/styles/bourbon/css3/_calc.scss rename to static/styles/_bourbon/css3/_calc.scss diff --git a/static/styles/bourbon/css3/_columns.scss b/static/styles/_bourbon/css3/_columns.scss similarity index 100% rename from static/styles/bourbon/css3/_columns.scss rename to static/styles/_bourbon/css3/_columns.scss diff --git a/static/styles/bourbon/css3/_filter.scss b/static/styles/_bourbon/css3/_filter.scss similarity index 100% rename from static/styles/bourbon/css3/_filter.scss rename to static/styles/_bourbon/css3/_filter.scss diff --git a/static/styles/bourbon/css3/_flex-box.scss b/static/styles/_bourbon/css3/_flex-box.scss similarity index 100% rename from static/styles/bourbon/css3/_flex-box.scss rename to static/styles/_bourbon/css3/_flex-box.scss diff --git a/static/styles/bourbon/css3/_font-face.scss b/static/styles/_bourbon/css3/_font-face.scss similarity index 100% rename from static/styles/bourbon/css3/_font-face.scss rename to static/styles/_bourbon/css3/_font-face.scss diff --git a/static/styles/bourbon/css3/_font-feature-settings.scss b/static/styles/_bourbon/css3/_font-feature-settings.scss similarity index 100% rename from static/styles/bourbon/css3/_font-feature-settings.scss rename to static/styles/_bourbon/css3/_font-feature-settings.scss diff --git a/static/styles/bourbon/css3/_hidpi-media-query.scss b/static/styles/_bourbon/css3/_hidpi-media-query.scss similarity index 100% rename from static/styles/bourbon/css3/_hidpi-media-query.scss rename to static/styles/_bourbon/css3/_hidpi-media-query.scss diff --git a/static/styles/bourbon/css3/_hyphens.scss b/static/styles/_bourbon/css3/_hyphens.scss similarity index 100% rename from static/styles/bourbon/css3/_hyphens.scss rename to static/styles/_bourbon/css3/_hyphens.scss diff --git a/static/styles/bourbon/css3/_image-rendering.scss b/static/styles/_bourbon/css3/_image-rendering.scss similarity index 100% rename from static/styles/bourbon/css3/_image-rendering.scss rename to static/styles/_bourbon/css3/_image-rendering.scss diff --git a/static/styles/bourbon/css3/_keyframes.scss b/static/styles/_bourbon/css3/_keyframes.scss similarity index 100% rename from static/styles/bourbon/css3/_keyframes.scss rename to static/styles/_bourbon/css3/_keyframes.scss diff --git a/static/styles/bourbon/css3/_linear-gradient.scss b/static/styles/_bourbon/css3/_linear-gradient.scss similarity index 100% rename from static/styles/bourbon/css3/_linear-gradient.scss rename to static/styles/_bourbon/css3/_linear-gradient.scss diff --git a/static/styles/bourbon/css3/_perspective.scss b/static/styles/_bourbon/css3/_perspective.scss similarity index 100% rename from static/styles/bourbon/css3/_perspective.scss rename to static/styles/_bourbon/css3/_perspective.scss diff --git a/static/styles/bourbon/css3/_placeholder.scss b/static/styles/_bourbon/css3/_placeholder.scss similarity index 100% rename from static/styles/bourbon/css3/_placeholder.scss rename to static/styles/_bourbon/css3/_placeholder.scss diff --git a/static/styles/bourbon/css3/_radial-gradient.scss b/static/styles/_bourbon/css3/_radial-gradient.scss similarity index 100% rename from static/styles/bourbon/css3/_radial-gradient.scss rename to static/styles/_bourbon/css3/_radial-gradient.scss diff --git a/static/styles/bourbon/css3/_transform.scss b/static/styles/_bourbon/css3/_transform.scss similarity index 100% rename from static/styles/bourbon/css3/_transform.scss rename to static/styles/_bourbon/css3/_transform.scss diff --git a/static/styles/bourbon/css3/_transition.scss b/static/styles/_bourbon/css3/_transition.scss similarity index 100% rename from static/styles/bourbon/css3/_transition.scss rename to static/styles/_bourbon/css3/_transition.scss diff --git a/static/styles/bourbon/css3/_user-select.scss b/static/styles/_bourbon/css3/_user-select.scss similarity index 100% rename from static/styles/bourbon/css3/_user-select.scss rename to static/styles/_bourbon/css3/_user-select.scss diff --git a/static/styles/bourbon/functions/_assign.scss b/static/styles/_bourbon/functions/_assign.scss similarity index 100% rename from static/styles/bourbon/functions/_assign.scss rename to static/styles/_bourbon/functions/_assign.scss diff --git a/static/styles/bourbon/functions/_color-lightness.scss b/static/styles/_bourbon/functions/_color-lightness.scss similarity index 100% rename from static/styles/bourbon/functions/_color-lightness.scss rename to static/styles/_bourbon/functions/_color-lightness.scss diff --git a/static/styles/bourbon/functions/_flex-grid.scss b/static/styles/_bourbon/functions/_flex-grid.scss similarity index 100% rename from static/styles/bourbon/functions/_flex-grid.scss rename to static/styles/_bourbon/functions/_flex-grid.scss diff --git a/static/styles/bourbon/functions/_golden-ratio.scss b/static/styles/_bourbon/functions/_golden-ratio.scss similarity index 100% rename from static/styles/bourbon/functions/_golden-ratio.scss rename to static/styles/_bourbon/functions/_golden-ratio.scss diff --git a/static/styles/bourbon/functions/_grid-width.scss b/static/styles/_bourbon/functions/_grid-width.scss similarity index 100% rename from static/styles/bourbon/functions/_grid-width.scss rename to static/styles/_bourbon/functions/_grid-width.scss diff --git a/static/styles/bourbon/functions/_modular-scale.scss b/static/styles/_bourbon/functions/_modular-scale.scss similarity index 100% rename from static/styles/bourbon/functions/_modular-scale.scss rename to static/styles/_bourbon/functions/_modular-scale.scss diff --git a/static/styles/bourbon/functions/_px-to-em.scss b/static/styles/_bourbon/functions/_px-to-em.scss similarity index 100% rename from static/styles/bourbon/functions/_px-to-em.scss rename to static/styles/_bourbon/functions/_px-to-em.scss diff --git a/static/styles/bourbon/functions/_px-to-rem.scss b/static/styles/_bourbon/functions/_px-to-rem.scss similarity index 100% rename from static/styles/bourbon/functions/_px-to-rem.scss rename to static/styles/_bourbon/functions/_px-to-rem.scss diff --git a/static/styles/bourbon/functions/_strip-units.scss b/static/styles/_bourbon/functions/_strip-units.scss similarity index 100% rename from static/styles/bourbon/functions/_strip-units.scss rename to static/styles/_bourbon/functions/_strip-units.scss diff --git a/static/styles/bourbon/functions/_tint-shade.scss b/static/styles/_bourbon/functions/_tint-shade.scss similarity index 100% rename from static/styles/bourbon/functions/_tint-shade.scss rename to static/styles/_bourbon/functions/_tint-shade.scss diff --git a/static/styles/bourbon/functions/_transition-property-name.scss b/static/styles/_bourbon/functions/_transition-property-name.scss similarity index 100% rename from static/styles/bourbon/functions/_transition-property-name.scss rename to static/styles/_bourbon/functions/_transition-property-name.scss diff --git a/static/styles/bourbon/functions/_unpack.scss b/static/styles/_bourbon/functions/_unpack.scss similarity index 100% rename from static/styles/bourbon/functions/_unpack.scss rename to static/styles/_bourbon/functions/_unpack.scss diff --git a/static/styles/bourbon/helpers/_convert-units.scss b/static/styles/_bourbon/helpers/_convert-units.scss similarity index 100% rename from static/styles/bourbon/helpers/_convert-units.scss rename to static/styles/_bourbon/helpers/_convert-units.scss diff --git a/static/styles/bourbon/helpers/_gradient-positions-parser.scss b/static/styles/_bourbon/helpers/_gradient-positions-parser.scss similarity index 100% rename from static/styles/bourbon/helpers/_gradient-positions-parser.scss rename to static/styles/_bourbon/helpers/_gradient-positions-parser.scss diff --git a/static/styles/bourbon/helpers/_is-num.scss b/static/styles/_bourbon/helpers/_is-num.scss similarity index 100% rename from static/styles/bourbon/helpers/_is-num.scss rename to static/styles/_bourbon/helpers/_is-num.scss diff --git a/static/styles/bourbon/helpers/_linear-angle-parser.scss b/static/styles/_bourbon/helpers/_linear-angle-parser.scss similarity index 100% rename from static/styles/bourbon/helpers/_linear-angle-parser.scss rename to static/styles/_bourbon/helpers/_linear-angle-parser.scss diff --git a/static/styles/bourbon/helpers/_linear-gradient-parser.scss b/static/styles/_bourbon/helpers/_linear-gradient-parser.scss similarity index 100% rename from static/styles/bourbon/helpers/_linear-gradient-parser.scss rename to static/styles/_bourbon/helpers/_linear-gradient-parser.scss diff --git a/static/styles/bourbon/helpers/_linear-positions-parser.scss b/static/styles/_bourbon/helpers/_linear-positions-parser.scss similarity index 100% rename from static/styles/bourbon/helpers/_linear-positions-parser.scss rename to static/styles/_bourbon/helpers/_linear-positions-parser.scss diff --git a/static/styles/bourbon/helpers/_linear-side-corner-parser.scss b/static/styles/_bourbon/helpers/_linear-side-corner-parser.scss similarity index 100% rename from static/styles/bourbon/helpers/_linear-side-corner-parser.scss rename to static/styles/_bourbon/helpers/_linear-side-corner-parser.scss diff --git a/static/styles/bourbon/helpers/_radial-arg-parser.scss b/static/styles/_bourbon/helpers/_radial-arg-parser.scss similarity index 100% rename from static/styles/bourbon/helpers/_radial-arg-parser.scss rename to static/styles/_bourbon/helpers/_radial-arg-parser.scss diff --git a/static/styles/bourbon/helpers/_radial-gradient-parser.scss b/static/styles/_bourbon/helpers/_radial-gradient-parser.scss similarity index 100% rename from static/styles/bourbon/helpers/_radial-gradient-parser.scss rename to static/styles/_bourbon/helpers/_radial-gradient-parser.scss diff --git a/static/styles/bourbon/helpers/_radial-positions-parser.scss b/static/styles/_bourbon/helpers/_radial-positions-parser.scss similarity index 100% rename from static/styles/bourbon/helpers/_radial-positions-parser.scss rename to static/styles/_bourbon/helpers/_radial-positions-parser.scss diff --git a/static/styles/bourbon/helpers/_render-gradients.scss b/static/styles/_bourbon/helpers/_render-gradients.scss similarity index 100% rename from static/styles/bourbon/helpers/_render-gradients.scss rename to static/styles/_bourbon/helpers/_render-gradients.scss diff --git a/static/styles/bourbon/helpers/_shape-size-stripper.scss b/static/styles/_bourbon/helpers/_shape-size-stripper.scss similarity index 100% rename from static/styles/bourbon/helpers/_shape-size-stripper.scss rename to static/styles/_bourbon/helpers/_shape-size-stripper.scss diff --git a/static/styles/bourbon/helpers/_str-to-num.scss b/static/styles/_bourbon/helpers/_str-to-num.scss similarity index 100% rename from static/styles/bourbon/helpers/_str-to-num.scss rename to static/styles/_bourbon/helpers/_str-to-num.scss diff --git a/static/styles/bourbon/settings/_asset-pipeline.scss b/static/styles/_bourbon/settings/_asset-pipeline.scss similarity index 100% rename from static/styles/bourbon/settings/_asset-pipeline.scss rename to static/styles/_bourbon/settings/_asset-pipeline.scss diff --git a/static/styles/bourbon/settings/_prefixer.scss b/static/styles/_bourbon/settings/_prefixer.scss similarity index 100% rename from static/styles/bourbon/settings/_prefixer.scss rename to static/styles/_bourbon/settings/_prefixer.scss diff --git a/static/styles/bourbon/settings/_px-to-em.scss b/static/styles/_bourbon/settings/_px-to-em.scss similarity index 100% rename from static/styles/bourbon/settings/_px-to-em.scss rename to static/styles/_bourbon/settings/_px-to-em.scss diff --git a/static/styles/_custom/_layout.scss b/static/styles/_custom/_layout.scss new file mode 100644 index 000000000..2f51cc48c --- /dev/null +++ b/static/styles/_custom/_layout.scss @@ -0,0 +1,11 @@ +// Base styles for layout + +.container { + @include outer-container(); +} + +.sub-section { + @include clearfix(); + padding: 2rem 0; + border-bottom: 1px dotted $base-border-color; +} diff --git a/static/styles/_custom/_states.scss b/static/styles/_custom/_states.scss new file mode 100644 index 000000000..f4d336fdf --- /dev/null +++ b/static/styles/_custom/_states.scss @@ -0,0 +1,3 @@ +.hidden { + display: none; +} diff --git a/static/styles/neat/_neat-helpers.scss b/static/styles/_neat/_neat-helpers.scss similarity index 100% rename from static/styles/neat/_neat-helpers.scss rename to static/styles/_neat/_neat-helpers.scss diff --git a/static/styles/neat/_neat.scss b/static/styles/_neat/_neat.scss similarity index 100% rename from static/styles/neat/_neat.scss rename to static/styles/_neat/_neat.scss diff --git a/static/styles/neat/functions/_new-breakpoint.scss b/static/styles/_neat/functions/_new-breakpoint.scss similarity index 100% rename from static/styles/neat/functions/_new-breakpoint.scss rename to static/styles/_neat/functions/_new-breakpoint.scss diff --git a/static/styles/neat/functions/_private.scss b/static/styles/_neat/functions/_private.scss similarity index 100% rename from static/styles/neat/functions/_private.scss rename to static/styles/_neat/functions/_private.scss diff --git a/static/styles/neat/grid/_fill-parent.scss b/static/styles/_neat/grid/_fill-parent.scss similarity index 100% rename from static/styles/neat/grid/_fill-parent.scss rename to static/styles/_neat/grid/_fill-parent.scss diff --git a/static/styles/neat/grid/_grid.scss b/static/styles/_neat/grid/_grid.scss similarity index 100% rename from static/styles/neat/grid/_grid.scss rename to static/styles/_neat/grid/_grid.scss diff --git a/static/styles/neat/grid/_media.scss b/static/styles/_neat/grid/_media.scss similarity index 100% rename from static/styles/neat/grid/_media.scss rename to static/styles/_neat/grid/_media.scss diff --git a/static/styles/neat/grid/_omega.scss b/static/styles/_neat/grid/_omega.scss similarity index 100% rename from static/styles/neat/grid/_omega.scss rename to static/styles/_neat/grid/_omega.scss diff --git a/static/styles/neat/grid/_outer-container.scss b/static/styles/_neat/grid/_outer-container.scss similarity index 100% rename from static/styles/neat/grid/_outer-container.scss rename to static/styles/_neat/grid/_outer-container.scss diff --git a/static/styles/neat/grid/_pad.scss b/static/styles/_neat/grid/_pad.scss similarity index 100% rename from static/styles/neat/grid/_pad.scss rename to static/styles/_neat/grid/_pad.scss diff --git a/static/styles/neat/grid/_private.scss b/static/styles/_neat/grid/_private.scss similarity index 100% rename from static/styles/neat/grid/_private.scss rename to static/styles/_neat/grid/_private.scss diff --git a/static/styles/neat/grid/_reset.scss b/static/styles/_neat/grid/_reset.scss similarity index 100% rename from static/styles/neat/grid/_reset.scss rename to static/styles/_neat/grid/_reset.scss diff --git a/static/styles/neat/grid/_row.scss b/static/styles/_neat/grid/_row.scss similarity index 100% rename from static/styles/neat/grid/_row.scss rename to static/styles/_neat/grid/_row.scss diff --git a/static/styles/neat/grid/_shift.scss b/static/styles/_neat/grid/_shift.scss similarity index 100% rename from static/styles/neat/grid/_shift.scss rename to static/styles/_neat/grid/_shift.scss diff --git a/static/styles/neat/grid/_span-columns.scss b/static/styles/_neat/grid/_span-columns.scss similarity index 100% rename from static/styles/neat/grid/_span-columns.scss rename to static/styles/_neat/grid/_span-columns.scss diff --git a/static/styles/neat/grid/_to-deprecate.scss b/static/styles/_neat/grid/_to-deprecate.scss similarity index 100% rename from static/styles/neat/grid/_to-deprecate.scss rename to static/styles/_neat/grid/_to-deprecate.scss diff --git a/static/styles/neat/grid/_visual-grid.scss b/static/styles/_neat/grid/_visual-grid.scss similarity index 100% rename from static/styles/neat/grid/_visual-grid.scss rename to static/styles/_neat/grid/_visual-grid.scss diff --git a/static/styles/neat/settings/_grid.scss b/static/styles/_neat/settings/_grid.scss similarity index 86% rename from static/styles/neat/settings/_grid.scss rename to static/styles/_neat/settings/_grid.scss index f1dcda478..68c311e1a 100644 --- a/static/styles/neat/settings/_grid.scss +++ b/static/styles/_neat/settings/_grid.scss @@ -1,6 +1,6 @@ $column: golden-ratio(1em, 3) !default; // Column width $gutter: golden-ratio(1em, 1) !default; // Gutter between each two columns -$grid-columns: 12 !default; // Total number of columns in the grid +$grid-columns: 24 !default; // Total number of columns in the grid $max-width: em(1088) !default; // Max-width of the outer container $border-box-sizing: true !default; // Makes all elements have a border-box layout $default-feature: min-width; // Default @media feature for the breakpoint() mixin diff --git a/static/styles/neat/settings/_visual-grid.scss b/static/styles/_neat/settings/_visual-grid.scss similarity index 100% rename from static/styles/neat/settings/_visual-grid.scss rename to static/styles/_neat/settings/_visual-grid.scss diff --git a/static/styles/sass/styles.scss b/static/styles/sass/styles.scss deleted file mode 100644 index ea3d8060c..000000000 --- a/static/styles/sass/styles.scss +++ /dev/null @@ -1,229 +0,0 @@ -@import "../bourbon/bourbon"; -@import "../neat/neat"; - -$grid-columns: 24; - -$dark-blue: #03253e; -$white: #fff; -$light-gray: #d8d8d8; -$black: #000; -$medium-gray: #969696; -$medium-blue: #1067d5; -$dark-gray: #484b50; - -$open-sans: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; -$raleway: 'Raleway', 'Helvetica Neue', Helvetica, Arial, sans-serif; -$source-code-pro: 'Source Code Pro', monospace; - -@mixin zero-space() { - margin: 0; - padding: 0; -} - -h1, h2, h3, h4, h5 { - font-family: $raleway; -} - -body { - margin: 0; - font-family: $open-sans; - padding-bottom: 4em; -} - -.inactive, .header-nav-bar a.inactive { - color: $medium-gray; -} - -#main { - @include outer-container(); - @include shift(1); -} - -.header { - background-color: $dark-blue; -} - -.header-bar { - color: $white; - padding-left: $column + $gutter; -} - -.header-nav { - background-color: $light-gray; -} - -.header-nav-bar { - @include zero-space(); - list-style: none; - padding-left: $column + $gutter; - - li { - display: inline-block; - - a { - color: $black; - display: block; - padding: 1em; - text-decoration: none; - - &.active { - background-color: $dark-blue; - color: $white; - } - } - } -} - -#search { - @include clearfix; - - label { - margin: 1em 0; - display: block; - } - - input { - height: 3em; - } - - input[name=search] { - @include span-columns(16); - @include omega(); - font-size: 1.2em; - border: 1px solid $medium-gray; - padding: 0 1em; - } - - input[type=submit] { - @include span-columns(4); - @include omega(); - @include linear-gradient(to bottom, #5fb85f, #439e46); - border: 0; - font-size: 1.2em; /* to match em sizing on text field */ - @include border-right-radius(4px); - } -} - -.browse-links { - margin: 1em 0; - - ul { - @include zero-space(); - list-style: none; - display: inline; - - li { - display: inline; - margin: 0 .5em; - - a { - font-weight: bold; - color: $medium-blue; - } - } - } -} - -.filter-box { - @include span-columns(16); - border: 1px solid $medium-blue; - - .filter-header-bar { - background-color: $medium-blue; - font-size: 1em; - color: $white; - @include pad(); - font-weight: bold; - } - - .filter-field-container { - @include clearfix(); - - .field { - @include pad(); - @include span-columns(2.5 of 8); - position: relative; - - label { - display: block; - font-size: .8em; - } - - input[type=text] { - width: 100%; - } - - .add-filter { - position: absolute; - left: 100%; - top: 36px; - cursor: pointer; - } - - &.active { - label { - color: $medium-blue; - } - - input, select, .chosen-single { - border: 1px solid $medium-blue; - } - } - } - } -} - -#selected-filters { - margin: 1.5em 0; - - .selected-filter { - display: inline; - background-color: $medium-blue; - color: $white; - font-size: .75em; - padding: .5em; - margin-right: 1em; - - .close { - margin-left: 2em; - } - } -} - -#candidates, -#committees, -#results { - @include span-columns(24); - clear: left; - border-top: 1px dashed $medium-gray; - margin-top: 1.5em; - padding-top: 1em; - - table { - border-spacing: 0; - border-collapse: collapse; - - th { - background-color: $light-gray; - color: $dark-gray; - border: 1px solid $medium-gray; - border-right: 0; - text-align: left; - padding: .5em; - - &:last-child { - border-right: 1px solid $medium-gray; - } - } - - tr { - border-bottom: 1px solid $medium-gray; - - td { - padding: .75em .25em; - font-family: $source-code-pro; - font-size: .7em; - } - } - } -} diff --git a/static/styles/styles.css b/static/styles/styles.css index 5550afda5..77752bd19 100644 --- a/static/styles/styles.css +++ b/static/styles/styles.css @@ -3,200 +3,538 @@ -moz-box-sizing: border-box; box-sizing: border-box; } -h1, h2, h3, h4, h5 { - font-family: "Raleway", "Helvetica Neue", Helvetica, Arial, sans-serif; } - body { + -webkit-font-smoothing: antialiased; + background-color: white; + color: #515A61; + font-family: "Open Sans", helvetica, arial, sans-serif; + font-size: 0.875rem; + line-height: 1.5; } + +h1, h2, h3, h4, h5, h6 { + font-family: "Open Sans", helvetica, arial, sans-serif; + line-height: 1.25; margin: 0; - font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; - padding-bottom: 4em; } + text-rendering: optimizeLegibility; } -.inactive, .header-nav-bar a.inactive { - color: #969696; } +h1 { + font-size: 3.125rem; + font-weight: 300; } -#main { - max-width: 68em; - margin-left: auto; - margin-right: auto; - margin-left: 8.5298%; } - #main:after { - content: ""; - display: table; - clear: both; } +h2 { + font-size: 2.5rem; + font-weight: 300; + margin-bottom: 1rem; } -.header { - background-color: #03253e; } +h3 { + font-size: 2rem; + font-weight: 400; } -.header-bar { - color: #fff; - padding-left: 5.8538em; } +h4 { + font-size: 1.25rem; + font-weight: 400; } + +h5 { + font-size: 1.25rem; } + +h6 { + font-size: 1rem; } + +p { + margin: 0 0 0.75; } -.header-nav { - background-color: #d8d8d8; } +a { + -webkit-transition: color 0.1s linear; + -moz-transition: color 0.1s linear; + transition: color 0.1s linear; + color: #2678BA; + text-decoration: none; } + a:hover { + color: #194f7a; } + a:active, a:focus { + color: #194f7a; + outline: none; } -.header-nav-bar { +hr { + border-bottom: 1px solid #D7D7D7; + border-left: none; + border-right: none; + border-top: none; + margin: 1.5 0; } + +img { + margin: 0; + max-width: 100%; } + +blockquote { + border-left: 2px solid #D7D7D7; + color: #74818b; + margin: 1.5 0; + padding-left: 0.75; } + +cite { + color: #909aa2; + font-style: italic; } + cite:before { + content: '\2014 \00A0'; } + +.lead-text { + font-size: 1.125rem; } + +fieldset { + background: #f1f1f1; + border: 1px solid #D7D7D7; + margin: 0 0 0.75 0; + padding: 1.5; } + +input, +label, +select { + display: block; + font-family: "Open Sans", helvetica, arial, sans-serif; + font-size: 0.875rem; } + +label { + margin-bottom: 0.375; } + label.required:after { + content: "*"; } + label abbr { + display: none; } + +input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="time"], input[type="week"] { + height: 2rem; } + +textarea, +input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="time"], input[type="week"], +select[multiple=multiple] { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + -webkit-transition: border-color; + -moz-transition: border-color; + transition: border-color; + background-color: white; + border-radius: 0.25em; + border: 1px solid #515A61; + box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06); + font-family: "Open Sans", helvetica, arial, sans-serif; + font-size: 0.875rem; + padding: .5rem 1rem; + width: 100%; } + textarea:hover, + input[type="email"]:hover, input[type="number"]:hover, input[type="password"]:hover, input[type="search"]:hover, input[type="tel"]:hover, input[type="text"]:hover, input[type="url"]:hover, input[type="color"]:hover, input[type="date"]:hover, input[type="datetime"]:hover, input[type="datetime-local"]:hover, input[type="month"]:hover, input[type="time"]:hover, input[type="week"]:hover, + select[multiple=multiple]:hover { + border-color: #3a4045; } + textarea:focus, + input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="url"]:focus, input[type="color"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, + select[multiple=multiple]:focus { + border-color: #2678BA; + box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06), 0 0 0 rgba(34, 106, 165, 0.7); + outline: none; } + +textarea { + resize: vertical; } + +input[type="search"] { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + -o-appearance: none; + appearance: none; } + +input[type="checkbox"], input[type="radio"] { + display: inline; + margin-right: 0.375; } + +input[type="file"] { + margin-bottom: 0.75; + padding-bottom: 0.5; + width: 100%; } + +select { + width: auto; + max-width: 100%; + margin-bottom: 1.5; } + +.input-button-combo input[type="email"], .input-button-combo input[type="number"], .input-button-combo input[type="password"], .input-button-combo input[type="search"], .input-button-combo input[type="tel"], .input-button-combo input[type="text"], .input-button-combo input[type="url"], .input-button-combo input[type="color"], .input-button-combo input[type="date"], .input-button-combo input[type="datetime"], .input-button-combo input[type="datetime-local"], .input-button-combo input[type="month"], .input-button-combo input[type="time"], .input-button-combo input[type="week"] { + width: 75%; + float: left; + border-radius: 0.25em 0 0 0.25em; } +.input-button-combo input[type="submit"] { + width: 25%; + float: left; + border-radius: 0 0.25em 0.25em 0; } + +table { + border-collapse: collapse; + margin: 0.75 0; + table-layout: fixed; + width: 100%; } + +th { + border-bottom: 1px solid #b1b1b1; + font-weight: bold; + padding: 0.75 0; + text-align: left; } + +td { + border-bottom: 1px solid #D7D7D7; + padding: 0.75 0; } + +tr, td, th { + vertical-align: middle; } + +ul, ol { margin: 0; padding: 0; - list-style: none; - padding-left: 5.8538em; } - .header-nav-bar li { - display: inline-block; } - .header-nav-bar li a { - color: #000; - display: block; - padding: 1em; - text-decoration: none; } - .header-nav-bar li a.active { - background-color: #03253e; - color: #fff; } - -#search:after { + list-style-type: none; } +.page-nav:after, .browse-links:after { content: ""; display: table; clear: both; } -#search label { - margin: 1em 0; - display: block; } -#search input { - height: 3em; } -#search input[name=search] { +.page-nav li, .browse-links li { + float: left; } + +dl { + margin-bottom: 0.75; } + dl dt { + font-weight: bold; + margin-top: 0.75; } + dl dd { + margin: 0; } + +.button { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + -o-appearance: none; + appearance: none; + -webkit-transition: background-color 0.1s; + -moz-transition: background-color 0.1s; + transition: background-color 0.1s; + -webkit-font-smoothing: antialiased; + background-color: #F6F6F6; + border-radius: 0.25em; + border: none; + display: inline-block; + color: #515A61; + font-size: 1rem; + font-weight: bold; + line-height: 1; + padding: .75em 1em; + text-decoration: none; + cursor: pointer; + user-select: none; + vertical-align: middle; + white-space: nowrap; + border: 1px solid #D7D7D7; } + .button:hover { + background-color: #515A61; + color: #fff; } + .button:active, .button:focus { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + -o-appearance: none; + appearance: none; + outline: none; } + +button, +input[type="submit"], +.primary { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + -o-appearance: none; + appearance: none; + -webkit-transition: background-color 0.1s; + -moz-transition: background-color 0.1s; + transition: background-color 0.1s; + -webkit-font-smoothing: antialiased; + background-color: #2678BA; + border-radius: 0.25em; + border: none; + display: inline-block; + color: #fff; + font-size: 1rem; + font-weight: bold; + line-height: 1; + padding: .75em 1em; + text-decoration: none; + cursor: pointer; + user-select: none; + vertical-align: middle; + white-space: nowrap; } + button:hover, + input[type="submit"]:hover, + .primary:hover { + background-color: #1B5585; + color: #fff; } + button:active, button:focus, + input[type="submit"]:active, + input[type="submit"]:focus, + .primary:active, + .primary:focus { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + -o-appearance: none; + appearance: none; + outline: none; } + button:active, + input[type="submit"]:active, + .primary:active { + background-color: #1B5585; } + +.container { + max-width: 68em; + margin-left: auto; + margin-right: auto; } + .container:after { + content: ""; + display: table; + clear: both; } + +.sub-section { + padding: 2rem 0; + border-bottom: 1px dotted #D7D7D7; } + .sub-section:after { + content: ""; + display: table; + clear: both; } + +.hidden { + display: none; } + +body { + padding: 0; + margin: 0; + min-width: 68em; } + +.usa { + background-color: #e6e6e6; + text-align: center; + font-size: .75rem; + padding: .25rem; } + +.site-header { + border-bottom: 5px solid #DB4857; } + +.site-header__inner { + padding: 1.25em 0; } + +.page-nav { + background-color: #3E4957; } + +.page-nav .page-nav__item { + padding: 2rem; + border-right: 1px solid #F6F6F6; + color: #fff; } +.page-nav a { + display: block; + font-size: 1.125rem; + line-height: 2rem; } + .page-nav a:hover { + background-color: #323A45; } + +.page-nav__search { float: left; display: block; margin-right: 1.16509%; - width: 66.2783%; - margin-right: 0; - font-size: 1.2em; - border: 1px solid #969696; - padding: 0 1em; } - #search input[name=search]:last-child { + width: 40.98703%; + padding-left: 0; + margin-right: 0; } + .page-nav__search:last-child { margin-right: 0; } -#search input[type=submit] { + .page-nav__search .search-bar, + .page-nav__search .search-submit { + height: 2rem; + margin-bottom: 0; } + +.hero { + padding: 5rem 0; + color: #fff; + text-align: center; + background-color: #3E4957; + background-image: url("../img/mesh@2x.png"); + background-size: contain; } + +.search-bar { + margin: 0; + border: 0; } + +#large-search label { + margin-bottom: 2em; } + +.search--large { float: left; display: block; margin-right: 1.16509%; - width: 15.69576%; - margin-right: 0; - background-color: #5fb85f; - background-image: -webkit-linear-gradient(top, #5fb85f, #439e46); - background-image: linear-gradient(to bottom,#5fb85f, #439e46); - border: 0; - font-size: 1.2em; - /* to match em sizing on text field */ - border-top-right-radius: 4px; - border-bottom-right-radius: 4px; } - #search input[type=submit]:last-child { + width: 74.70873%; + margin-left: 12.64564%; } + .search--large:last-child { margin-right: 0; } + .search--large .search-bar { + padding: 1rem; + font-size: 2rem; + height: 4rem; } + .search--large .search-bar::-webkit-input-placeholder { + font-weight: 300; } + .search--large .search-bar::-moz-placeholder { + font-weight: 300; } + .search--large .search-bar:-moz-placeholder { + font-weight: 300; } + .search--large .search-bar:-ms-input-placeholder { + font-weight: 300; } + .search--large input[type="submit"] { + padding: 1rem; + font-size: 2rem; + line-height: 1; + font-weight: 300; } -.browse-links { - margin: 1em 0; } - .browse-links ul { - margin: 0; - padding: 0; - list-style: none; - display: inline; } - .browse-links ul li { - display: inline; - margin: 0 .5em; } - .browse-links ul li a { - font-weight: bold; - color: #1067d5; } +.sub-hero { + text-align: center; + padding: 3rem 0; } -.filter-box { +.browse-links { float: left; display: block; margin-right: 1.16509%; - width: 66.2783%; - border: 1px solid #1067d5; } - .filter-box:last-child { + width: 49.41745%; + margin-left: 25.29127%; + padding: 1rem 0; } + .browse-links:last-child { margin-right: 0; } - .filter-box .filter-header-bar { - background-color: #1067d5; - font-size: 1em; - color: #fff; - padding: 2.35765%; - font-weight: bold; } - .filter-box .filter-field-container:after { + .browse-links li { + float: left; + display: block; + margin-right: 2.35765%; + width: 48.82117%; } + .browse-links li:last-child { + margin-right: 0; } + .browse-links li .button { + display: block; } + +.data { + padding: 3rem 0; } + +.filter-box { + margin-bottom: 2rem; } + +.filter-header-bar { + position: relative; + background-color: #F6F6F6; + border: 1px solid #D7D7D7; + padding: .5rem 1rem; } + .filter-header-bar .disclosure-toggle { + position: absolute; + right: 0; + top: 0; + border-radius: 0; + width: 45px; + height: 100%; } + +.filter-field-container { + border: 1px solid #D7D7D7; + padding: 1rem; } + .filter-field-container:after { content: ""; display: table; clear: both; } - .filter-box .filter-field-container .field { - padding: 2.35765%; + .filter-field-container .field { float: left; display: block; - margin-right: 3.57866%; - width: 28.78967%; - position: relative; } - .filter-box .filter-field-container .field:last-child { + margin-right: 1.16509%; + width: 49.41745%; + padding: 1rem 0; } + .filter-field-container .field:last-child { + margin-right: 0; } + .filter-field-container .field:nth-child(even) { margin-right: 0; } - .filter-box .filter-field-container .field label { - display: block; - font-size: .8em; } - .filter-box .filter-field-container .field input[type=text] { - width: 100%; } - .filter-box .filter-field-container .field .add-filter { - position: absolute; - left: 100%; - top: 36px; - cursor: pointer; } - .filter-box .filter-field-container .field.active label { - color: #1067d5; } - .filter-box .filter-field-container .field.active input, .filter-box .filter-field-container .field.active select, .filter-box .filter-field-container .field.active .chosen-single { - border: 1px solid #1067d5; } - -#selected-filters { - margin: 1.5em 0; } - #selected-filters .selected-filter { - display: inline; - background-color: #1067d5; - color: #fff; - font-size: .75em; - padding: .5em; - margin-right: 1em; } - #selected-filters .selected-filter .close { - margin-left: 2em; } - -#candidates, -#committees, + +.field.active label { + color: #148552; } +.field.active .chosen-single { + border: 2px solid #148552; } + #results { float: left; display: block; margin-right: 1.16509%; - width: 100%; - clear: left; - border-top: 1px dashed #969696; - margin-top: 1.5em; - padding-top: 1em; } - #candidates:last-child, - #committees:last-child, + width: 100%; } #results:last-child { margin-right: 0; } - #candidates table, - #committees table, - #results table { - border-spacing: 0; - border-collapse: collapse; } - #candidates table th, - #committees table th, - #results table th { - background-color: #d8d8d8; - color: #484b50; - border: 1px solid #969696; - border-right: 0; - text-align: left; - padding: .5em; } - #candidates table th:last-child, - #committees table th:last-child, - #results table th:last-child { - border-right: 1px solid #969696; } - #candidates table tr, - #committees table tr, - #results table tr { - border-bottom: 1px solid #969696; } - #candidates table tr td, - #committees table tr td, - #results table tr td { - padding: .75em .25em; - font-family: "Source Code Pro", monospace; - font-size: .7em; } + +table { + margin: 0; + border: 1px solid #D7D7D7; } + +tr { + border: none; + font-size: .875rem; } + +th { + padding: .5rem; + border-right: 1px solid #D7D7D7; + border-bottom: 1px solid #D7D7D7; + font-weight: normal; } + th:last-child { + border-right: none; } + +td { + padding: .5rem; } + +.flex-cell { + white-space: nowrap; + width: 1%; } + +tr:nth-child(even) { + background-color: #F6F6F6; } + +.sortable-header { + -webkit-transition: background-color 0.1s; + -moz-transition: background-color 0.1s; + transition: background-color 0.1s; + background-color: #fff; + color: #2678BA; + cursor: pointer; } + .sortable-header:hover { + background-color: #2678BA; + border-color: #2678BA; + color: #fff; } + +.meta-box { + float: left; + display: block; + margin-right: 1.16509%; + width: 100%; + margin-bottom: 2rem; + padding: 1rem; + background-color: #FBFBFD; + border: 1px solid #D7D7D7; } + .meta-box:last-child { + margin-right: 0; } + +.results-count { + float: left; + display: block; + margin-right: 1.16509%; + width: 49.41745%; } + .results-count:last-child { + margin-right: 0; } + .results-count p { + margin: 0; } + +.pagination { + float: left; + display: block; + margin-right: 1.16509%; + width: 49.41745%; + text-align: right; } + .pagination:last-child { + margin-right: 0; } + +.pagination__link:nth-child(2) { + margin-left: 1rem; } /*# sourceMappingURL=styles.css.map */ diff --git a/static/styles/styles.css.map b/static/styles/styles.css.map index 8e7b94137..bc8d09081 100644 --- a/static/styles/styles.css.map +++ b/static/styles/styles.css.map @@ -1,7 +1,7 @@ { "version": 3, -"mappings": "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", -"sources": ["neat/grid/_grid.scss","bourbon/addons/_prefixer.scss","sass/styles.scss","neat/grid/_outer-container.scss","neat/settings/_grid.scss","neat/grid/_shift.scss","bourbon/addons/_clearfix.scss","neat/grid/_span-columns.scss","neat/grid/_omega.scss","bourbon/css3/_linear-gradient.scss","neat/grid/_pad.scss"], +"mappings": "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", +"sources": ["_neat/grid/_grid.scss","_bourbon/addons/_prefixer.scss","_base/_typography.scss","_base/_variables.scss","_base/_forms.scss","_base/_tables.scss","_base/_lists.scss","_bourbon/addons/_clearfix.scss","_base/_buttons.scss","_custom/_layout.scss","_neat/grid/_outer-container.scss","_neat/settings/_grid.scss","_custom/_states.scss","styles.scss","_neat/grid/_span-columns.scss","_neat/grid/_shift.scss","_bourbon/css3/_placeholder.scss","_neat/grid/_omega.scss"], "names": [], "file": "styles.css" } \ No newline at end of file diff --git a/static/styles/styles.scss b/static/styles/styles.scss new file mode 100644 index 000000000..dbcf1fe2e --- /dev/null +++ b/static/styles/styles.scss @@ -0,0 +1,273 @@ +@import "_bourbon/bourbon"; +@import "_neat/neat"; +@import "_base/base"; +@import "_custom/layout"; +@import "_custom/states"; + +body { + padding: 0; + margin: 0; + min-width: em(1088); +} + +// MODULE: USA Banner +.usa { + background-color: #e6e6e6; + text-align: center; + font-size: .75rem; + padding: .25rem; +} + +// MODULE: Header + +.site-header { + border-bottom: 5px solid $red; +} + +.site-header__inner { + padding: em(20) 0; +} + +// MODULE: Page nav +.page-nav { + background-color: $licorice; +} + +.page-nav { + @extend %flat-list; + + .page-nav__item { + padding: 2rem; + border-right: 1px solid $light-gray; + color: #fff; + } + + a { + display: block; + font-size: 1.125rem; + line-height: 2rem; + + &:hover { + background-color: $licorice-2; + } + } +} + +.page-nav__search { + @include span-columns(10); + padding-left: 0; + margin-right: 0; + + .search-bar, + .search-submit { + height: 2rem; + margin-bottom: 0; + } +} + + +// MODULE: Hero Unit +.hero { + padding: rem(80) 0; + color: #fff; + text-align: center; + background-color: $licorice; + background-image: url('../img/mesh@2x.png'); + background-size: contain; + +} + + + +// MODULE: Search bar + +.search-bar { + margin: 0; + border: 0; +} + +#large-search { + label { + margin-bottom: 2em; + } +} + +.search--large { + @include span-columns(18); + @include shift(3); + + .search-bar { + padding: 1rem; + font-size: 2rem; + height: 4rem; + + @include placeholder { + font-weight: 300; + } + } + + input[type="submit"] { + padding: 1rem; + font-size: 2rem; + line-height: 1; + font-weight: 300; + } +} + + +// MODULE: Browse links +.sub-hero { + text-align: center; + padding: 3rem 0; +} + +.browse-links { + @extend %flat-list; + @include span-columns(12); + @include shift(6); + padding: 1rem 0; + + li { + @include span-columns(6 of 12); + .button { + display: block; + } + } +} + + +// MODULE: Data view +.data { + padding: 3rem 0; +} + +// MODULE: Filter box +.filter-box { + margin-bottom: 2rem; +} + +.filter-header-bar { + position: relative; + background-color: $light-gray; + border: 1px solid $medium-gray; + padding: .5rem 1rem; + + .disclosure-toggle { + position: absolute; + right: 0; + top: 0; + border-radius: 0; + width: 45px; + height: 100%; + } +} + +.filter-field-container { + @include clearfix(); + border: 1px solid $medium-gray; + padding: 1rem; + + .field { + @include span-columns(12); + padding: 1rem 0; + + &:nth-child(even) { + @include omega() + } + } +} + +.field.active { + label { + color: $green; + } + + .chosen-single { + border: 2px solid $green; + } +} + + +// MODULE: Table + +#results { + @include span-columns(24); +} + +table { + margin: 0; + border: 1px solid $medium-gray; +} + +tr { + border: none; + font-size: .875rem; +} + +th { + padding: .5rem; + border-right: 1px solid $medium-gray; + border-bottom: 1px solid $medium-gray; + font-weight: normal; + + &:last-child { + border-right: none; + } +} + +td { + padding: .5rem; +} + +.flex-cell { + white-space: nowrap; // Prevents text-wrapping + width: 1%; // Setting this along with a fixed width on the table makes cells flexible +} + + +tr:nth-child(even) { + background-color: $light-gray; +} + +.sortable-header { + @include transition(background-color .1s); + background-color: #fff; + color: $blue; + cursor: pointer; + + &:hover { + background-color: $blue; + border-color: $blue; + color: #fff; + } +} + + +// MODULE: Meta box +// For things like pagination controls and chart controls + +.meta-box { + @include span-columns(24); + margin-bottom: 2rem; + padding: 1rem; + background-color: $meta-box-color; + border: 1px solid $medium-gray; +} + +.results-count { + @include span-columns(12); + p { + margin: 0; + } +} + +.pagination { + @include span-columns(12); + text-align: right; +} + +.pagination__link { + &:nth-child(2) { + margin-left: 1rem; + } +} diff --git a/views/candidates.handlebars b/views/candidates.handlebars index 1082275f3..f3f8137d2 100644 --- a/views/candidates.handlebars +++ b/views/candidates.handlebars @@ -1,303 +1,305 @@ -