From 0a2c845d0cc0a714083a2b6ea30b240a7663b945 Mon Sep 17 00:00:00 2001 From: Florian Mounier Date: Thu, 12 Dec 2013 15:07:51 +0100 Subject: [PATCH] Import bootstrap --- init_bootstrap.sh | 1 + project/static/sass/_alerts.sass | 55 + project/static/sass/_badges.sass | 44 + project/static/sass/_breadcrumbs.sass | 19 + project/static/sass/_button-groups.sass | 213 + project/static/sass/_buttons.sass | 134 + project/static/sass/_carousel.sass | 185 + project/static/sass/_close.sass | 29 + project/static/sass/_code.sass | 48 + .../static/sass/_component-animations.sass | 25 + project/static/sass/_dropdowns.sass | 165 + project/static/sass/_forms.sass | 320 + project/static/sass/_glyphicons.sass | 830 ++ project/static/sass/_grid.sass | 81 + project/static/sass/_input-groups.sass | 123 + project/static/sass/_jumbotron.sass | 28 + project/static/sass/_labels.sass | 46 + project/static/sass/_list-group.sass | 71 + project/static/sass/_media.sass | 47 + project/static/sass/_mixins.sass | 759 ++ project/static/sass/_modals.sass | 119 + project/static/sass/_navbar.sass | 458 + project/static/sass/_navs.sass | 192 + project/static/sass/_normalize.sass | 384 + project/static/sass/_pager.sass | 39 + project/static/sass/_pagination.sass | 68 + project/static/sass/_panels.sass | 132 + project/static/sass/_popovers.sass | 124 + project/static/sass/_print.sass | 69 + project/static/sass/_progress-bars.sass | 87 + .../static/sass/_responsive-utilities.sass | 143 + project/static/sass/_scaffolding.sass | 98 + project/static/sass/_tables.sass | 182 + project/static/sass/_theme.sass | 244 + project/static/sass/_thumbnails.sass | 26 + project/static/sass/_tooltip.sass | 91 + project/static/sass/_type.sass | 253 + project/static/sass/_utilities.sass | 48 + project/static/sass/_variables.sass | 641 ++ project/static/sass/_wells.sass | 25 + project/static/sass/bootstrap.sass | 49 + project/static/stylesheets/bootstrap.css | 7630 +++++++++++++++++ 42 files changed, 14325 insertions(+) mode change 100644 => 100755 init_bootstrap.sh create mode 100644 project/static/sass/_alerts.sass create mode 100644 project/static/sass/_badges.sass create mode 100644 project/static/sass/_breadcrumbs.sass create mode 100644 project/static/sass/_button-groups.sass create mode 100644 project/static/sass/_buttons.sass create mode 100644 project/static/sass/_carousel.sass create mode 100644 project/static/sass/_close.sass create mode 100644 project/static/sass/_code.sass create mode 100644 project/static/sass/_component-animations.sass create mode 100644 project/static/sass/_dropdowns.sass create mode 100644 project/static/sass/_forms.sass create mode 100644 project/static/sass/_glyphicons.sass create mode 100644 project/static/sass/_grid.sass create mode 100644 project/static/sass/_input-groups.sass create mode 100644 project/static/sass/_jumbotron.sass create mode 100644 project/static/sass/_labels.sass create mode 100644 project/static/sass/_list-group.sass create mode 100644 project/static/sass/_media.sass create mode 100644 project/static/sass/_mixins.sass create mode 100644 project/static/sass/_modals.sass create mode 100644 project/static/sass/_navbar.sass create mode 100644 project/static/sass/_navs.sass create mode 100644 project/static/sass/_normalize.sass create mode 100644 project/static/sass/_pager.sass create mode 100644 project/static/sass/_pagination.sass create mode 100644 project/static/sass/_panels.sass create mode 100644 project/static/sass/_popovers.sass create mode 100644 project/static/sass/_print.sass create mode 100644 project/static/sass/_progress-bars.sass create mode 100644 project/static/sass/_responsive-utilities.sass create mode 100644 project/static/sass/_scaffolding.sass create mode 100644 project/static/sass/_tables.sass create mode 100644 project/static/sass/_theme.sass create mode 100644 project/static/sass/_thumbnails.sass create mode 100644 project/static/sass/_tooltip.sass create mode 100644 project/static/sass/_type.sass create mode 100644 project/static/sass/_utilities.sass create mode 100644 project/static/sass/_variables.sass create mode 100644 project/static/sass/_wells.sass create mode 100644 project/static/sass/bootstrap.sass create mode 100644 project/static/stylesheets/bootstrap.css diff --git a/init_bootstrap.sh b/init_bootstrap.sh old mode 100644 new mode 100755 index b3bce68..3b1b001 --- a/init_bootstrap.sh +++ b/init_bootstrap.sh @@ -1 +1,2 @@ +#!/bin/bash sass-convert -R -F scss -T sass ext/sass-bootstrap/lib/ project/static/sass/ diff --git a/project/static/sass/_alerts.sass b/project/static/sass/_alerts.sass new file mode 100644 index 0000000..8ee39d1 --- /dev/null +++ b/project/static/sass/_alerts.sass @@ -0,0 +1,55 @@ +// +// Alerts +// -------------------------------------------------- + +// Base styles +// ------------------------- + +.alert + padding: $alert-padding + margin-bottom: $line-height-computed + border: 1px solid transparent + border-radius: $alert-border-radius + // Headings for larger alerts + h4 + margin-top: 0 + // Specified for the h4 to prevent conflicts of changing $headings-color + color: inherit + // Provide class for links that match alerts + .alert-link + font-weight: $alert-link-font-weight + // Improve alignment and spacing of inner content + > p, + > ul + margin-bottom: 0 + > p + p + margin-top: 5px + +// Dismissable alerts +// +// Expand the right padding and account for the close button's positioning. + +.alert-dismissable + padding-right: $alert-padding + 20 + // Adjust close link position + .close + position: relative + top: -2px + right: -21px + color: inherit + +// Alternate styles +// +// Generate contextual modifier classes for colorizing the alert. + +.alert-success + +alert-variant($alert-success-bg, $alert-success-border, $alert-success-text) + +.alert-info + +alert-variant($alert-info-bg, $alert-info-border, $alert-info-text) + +.alert-warning + +alert-variant($alert-warning-bg, $alert-warning-border, $alert-warning-text) + +.alert-danger + +alert-variant($alert-danger-bg, $alert-danger-border, $alert-danger-text) diff --git a/project/static/sass/_badges.sass b/project/static/sass/_badges.sass new file mode 100644 index 0000000..dc0d7ec --- /dev/null +++ b/project/static/sass/_badges.sass @@ -0,0 +1,44 @@ +// +// Badges +// -------------------------------------------------- + +// Base classes +.badge + display: inline-block + min-width: 10px + padding: 3px 7px + font-size: $font-size-small + font-weight: $badge-font-weight + color: $badge-color + line-height: $badge-line-height + vertical-align: baseline + white-space: nowrap + text-align: center + background-color: $badge-bg + border-radius: $badge-border-radius + // Empty badges collapse automatically (not available in IE8) + &:empty + display: none + +// Hover state, but only for links +a.badge + &:hover, + &:focus + color: $badge-link-hover-color + text-decoration: none + cursor: pointer + +// Quick fix for labels/badges in buttons +.btn .badge + position: relative + top: -1px + +// Account for counters in navs + +a.list-group-item.active > .badge, +.nav-pills > .active > a > .badge + color: $badge-active-color + background-color: $badge-active-bg + +.nav-pills > li > a > .badge + margin-left: 3px diff --git a/project/static/sass/_breadcrumbs.sass b/project/static/sass/_breadcrumbs.sass new file mode 100644 index 0000000..5187690 --- /dev/null +++ b/project/static/sass/_breadcrumbs.sass @@ -0,0 +1,19 @@ +// +// Breadcrumbs +// -------------------------------------------------- + +.breadcrumb + padding: 8px 15px + margin-bottom: $line-height-computed + list-style: none + background-color: $breadcrumb-bg + border-radius: $border-radius-base + > li + display: inline-block + + li:before + content: "#{$breadcrumb-separator}\00a0" + // Unicode space added since inline-block means non-collapsing white-space + padding: 0 5px + color: $breadcrumb-color + > .active + color: $breadcrumb-active-color diff --git a/project/static/sass/_button-groups.sass b/project/static/sass/_button-groups.sass new file mode 100644 index 0000000..4c1a922 --- /dev/null +++ b/project/static/sass/_button-groups.sass @@ -0,0 +1,213 @@ +// +// Button groups +// -------------------------------------------------- + +// Button carets +// +// Match the button text color to the arrow/caret for indicating dropdown-ness. + +.caret + .btn-default & + border-top-color: $btn-default-color + .btn-primary &, + .btn-success &, + .btn-warning &, + .btn-danger &, + .btn-info & + border-top-color: #fff + +.dropup + .btn-default .caret + border-bottom-color: $btn-default-color + .btn-primary, + .btn-success, + .btn-warning, + .btn-danger, + .btn-info + .caret + border-bottom-color: #fff + +// Make the div behave like a button + +.btn-group, +.btn-group-vertical + position: relative + display: inline-block + vertical-align: middle + // match .btn alignment given font-size hack above + > .btn + position: relative + float: left + // Bring the "active" button to the front + &:hover, + &:focus, + &:active, + &.active + z-index: 2 + &:focus + // Remove focus outline when dropdown JS adds it after closing the menu + outline: none + +// Prevent double borders when buttons are next to each other +.btn-group + .btn + .btn, + .btn + .btn-group, + .btn-group + .btn, + .btn-group + .btn-group + margin-left: -1px + +// Optional: Group multiple button groups together for a toolbar +.btn-toolbar + +clearfix + .btn-group + float: left + // Space out series of button groups + > .btn, + > .btn-group + + .btn, + + .btn-group + margin-left: 5px + +.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) + border-radius: 0 + +// Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match +.btn-group > .btn:first-child + margin-left: 0 + &:not(:last-child):not(.dropdown-toggle) + +border-right-radius(0) + +// Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it + +.btn-group > .btn:last-child:not(:first-child), +.btn-group > .dropdown-toggle:not(:first-child) + +border-left-radius(0) + +// Custom edits for including btn-groups within btn-groups (useful for including dropdown buttons within a btn-group) +.btn-group > .btn-group + float: left + +.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn + border-radius: 0 + +.btn-group > .btn-group:first-child + > .btn:last-child, + > .dropdown-toggle + +border-right-radius(0) + +.btn-group > .btn-group:last-child > .btn:first-child + +border-left-radius(0) + +// On active and open, don't show outline + +.btn-group .dropdown-toggle:active, +.btn-group.open .dropdown-toggle + outline: 0 + +// Sizing +// +// Remix the default button sizing classes into new ones for easier manipulation. + +.btn-group-xs > .btn + @extend .btn-xs + +.btn-group-sm > .btn + @extend .btn-sm + +.btn-group-lg > .btn + @extend .btn-lg + +// Split button dropdowns +// ---------------------- + +// Give the line between buttons some depth +.btn-group > .btn + .dropdown-toggle + padding-left: 8px + padding-right: 8px + +.btn-group > .btn-lg + .dropdown-toggle + padding-left: 12px + padding-right: 12px + +// The clickable button for toggling the menu +// Remove the gradient and set the same inset shadow as the :active state +.btn-group.open .dropdown-toggle + +box-shadow(inset 0 3px 5px rgba(0, 0, 0, 0.125)) + // Show no shadow for `.btn-link` since it has no other button styles. + &.btn-link + +box-shadow(none) + +// Reposition the caret +.btn .caret + margin-left: 0 + +// Carets in other button sizes +.btn-lg .caret + border-width: $caret-width-large $caret-width-large 0 + border-bottom-width: 0 + +// Upside down carets for .dropup +.dropup .btn-lg .caret + border-width: 0 $caret-width-large $caret-width-large + +// Vertical button groups +// ---------------------- + +.btn-group-vertical + > .btn, + > .btn-group + display: block + float: none + width: 100% + max-width: 100% + // Clear floats so dropdown menus can be properly placed + > .btn-group + +clearfix + > .btn + float: none + > .btn + .btn, + > .btn + .btn-group, + > .btn-group + .btn, + > .btn-group + .btn-group + margin-top: -1px + margin-left: 0 + +.btn-group-vertical > .btn + &:not(:first-child):not(:last-child) + border-radius: 0 + &:first-child:not(:last-child) + border-top-right-radius: $border-radius-base + +border-bottom-radius(0) + &:last-child:not(:first-child) + border-bottom-left-radius: $border-radius-base + +border-top-radius(0) + +.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn + border-radius: 0 + +.btn-group-vertical > .btn-group:first-child + > .btn:last-child, + > .dropdown-toggle + +border-bottom-radius(0) + +.btn-group-vertical > .btn-group:last-child > .btn:first-child + +border-top-radius(0) + +// Justified button groups +// ---------------------- + +.btn-group-justified + display: table + width: 100% + table-layout: fixed + border-collapse: separate + .btn + float: none + display: table-cell + width: 1% + +// Checkbox and radio options + +[data-toggle="buttons"] > .btn > input[type="radio"], +[data-toggle="buttons"] > .btn > input[type="checkbox"] + display: none diff --git a/project/static/sass/_buttons.sass b/project/static/sass/_buttons.sass new file mode 100644 index 0000000..a79ada7 --- /dev/null +++ b/project/static/sass/_buttons.sass @@ -0,0 +1,134 @@ +// +// Buttons +// -------------------------------------------------- + +// Base styles +// -------------------------------------------------- + +// Core styles +.btn + display: inline-block + margin-bottom: 0 + // For input.btn + font-weight: $btn-font-weight + text-align: center + vertical-align: middle + cursor: pointer + background-image: none + // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 + border: 1px solid transparent + white-space: nowrap + +button-size($padding-base-vertical, $padding-base-horizontal, $font-size-base, $line-height-base, $border-radius-base) + +user-select(none) + &:focus + +tab-focus + &:hover, + &:focus + color: $btn-default-color + text-decoration: none + &:active, + &.active + outline: 0 + background-image: none + +box-shadow(inset 0 3px 5px rgba(0, 0, 0, 0.125)) + &.disabled, + &[disabled], + fieldset[disabled] & + cursor: not-allowed + pointer-events: none + // Future-proof disabling of clicks + +opacity(0.65) + +box-shadow(none) + +// Alternate buttons +// -------------------------------------------------- + +.btn-default + +button-variant($btn-default-color, $btn-default-bg, $btn-default-border) + +.btn-primary + +button-variant($btn-primary-color, $btn-primary-bg, $btn-primary-border) + +// Warning appears as orange +.btn-warning + +button-variant($btn-warning-color, $btn-warning-bg, $btn-warning-border) + +// Danger and error appear as red +.btn-danger + +button-variant($btn-danger-color, $btn-danger-bg, $btn-danger-border) + +// Success appears as green +.btn-success + +button-variant($btn-success-color, $btn-success-bg, $btn-success-border) + +// Info appears as blue-green +.btn-info + +button-variant($btn-info-color, $btn-info-bg, $btn-info-border) + +// Link buttons +// ------------------------- + +// Make a button look and behave like a link +.btn-link + color: $link-color + font-weight: normal + cursor: pointer + border-radius: 0 + &, + &:active, + &[disabled], + fieldset[disabled] & + background-color: transparent + +box-shadow(none) + &, + &:hover, + &:focus, + &:active + border-color: transparent + &:hover, + &:focus + color: $link-hover-color + text-decoration: underline + background-color: transparent + &[disabled], + fieldset[disabled] & + &:hover, + &:focus + color: $btn-link-disabled-color + text-decoration: none + +// Button Sizes +// -------------------------------------------------- + +.btn-lg + // line-height: ensure even-numbered height of button next to large input + +button-size($padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $border-radius-large) + +.btn-sm, +.btn-xs + // line-height: ensure proper height of button next to small input + +button-size($padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small) + +.btn-xs + padding: 1px 5px + +// Block button +// -------------------------------------------------- + +.btn-block + display: block + width: 100% + padding-left: 0 + padding-right: 0 + +// Vertically space out multiple block buttons +.btn-block + .btn-block + margin-top: 5px + +// Specificity overrides + +input[type="submit"], +input[type="reset"], +input[type="button"] + &.btn-block + width: 100% diff --git a/project/static/sass/_carousel.sass b/project/static/sass/_carousel.sass new file mode 100644 index 0000000..e9480b5 --- /dev/null +++ b/project/static/sass/_carousel.sass @@ -0,0 +1,185 @@ +// +// Carousel +// -------------------------------------------------- + +// Wrapper for the slide container and indicators +.carousel + position: relative + +.carousel-inner + position: relative + overflow: hidden + width: 100% + > .item + display: none + position: relative + +transition(0.6s ease-in-out left) + // Account for jankitude on images + > img, + > a > img + +img-responsive + line-height: 1 + > .active, + > .next, + > .prev + display: block + > .active + left: 0 + > .next, + > .prev + position: absolute + top: 0 + width: 100% + > .next + left: 100% + > .prev + left: -100% + > .next.left, + > .prev.right + left: 0 + > .active.left + left: -100% + > .active.right + left: 100% + +// Left/right controls for nav +// --------------------------- + +.carousel-control + position: absolute + top: 0 + left: 0 + bottom: 0 + width: $carousel-control-width + +opacity($carousel-control-opacity) + font-size: $carousel-control-font-size + color: $carousel-control-color + text-align: center + text-shadow: $carousel-text-shadow + // We can't have this transition here because WebKit cancels the carousel + // animation if you trip this while in the middle of another animation. + // Set gradients for backgrounds + &.left + +gradient-horizontal($start_color: rgba(0, 0, 0, 0.5), $end_color: rgba(0, 0, 0, 0.0001)) + &.right + left: auto + right: 0 + +gradient-horizontal($start_color: rgba(0, 0, 0, 0.0001), $end_color: rgba(0, 0, 0, 0.5)) + // Hover/focus state + &:hover, + &:focus + color: $carousel-control-color + text-decoration: none + +opacity(0.9) + // Toggles + .icon-prev, + .icon-next, + .glyphicon-chevron-left, + .glyphicon-chevron-right + position: absolute + top: 50% + z-index: 5 + display: inline-block + .icon-prev, + .glyphicon-chevron-left + left: 50% + .icon-next, + .glyphicon-chevron-right + right: 50% + .icon-prev, + .icon-next + width: 20px + height: 20px + margin-top: -10px + margin-left: -10px + font-family: serif + .icon-prev + &:before + content: '\2039' + // SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039) + .icon-next + &:before + content: '\203a' + // SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A) + +// Optional indicator pips +// +// Add an unordered list with the following class and add a list item for each +// slide your carousel holds. + +.carousel-indicators + position: absolute + bottom: 10px + left: 50% + z-index: 15 + width: 60% + margin-left: -30% + padding-left: 0 + list-style: none + text-align: center + li + display: inline-block + width: 10px + height: 10px + margin: 1px + text-indent: -999px + border: 1px solid $carousel-indicator-border-color + border-radius: 10px + cursor: pointer + // IE8-9 hack for event handling + // + // Internet Explorer 8-9 does not support clicks on elements without a set + // `background-color`. We cannot use `filter` since that's not viewed as a + // background color by the browser. Thus, a hack is needed. + // + // For IE8, we set solid black as it doesn't support `rgba()`. For IE9, we + // set alpha transparency for the best results possible. + background-color: #000 \9 + // IE8 + background-color: rgba(0, 0, 0, 0) + // IE9 + .active + margin: 0 + width: 12px + height: 12px + background-color: $carousel-indicator-active-bg + +// Optional captions +// ----------------------------- +// Hidden by default for smaller viewports +.carousel-caption + position: absolute + left: 15% + right: 15% + bottom: 20px + z-index: 10 + padding-top: 20px + padding-bottom: 20px + color: $carousel-caption-color + text-align: center + text-shadow: $carousel-text-shadow + & .btn + text-shadow: none + // No shadow for button elements in carousel-caption + +// Scale up controls for tablets and up +@media screen and (min-width: $screen-sm-min) + // Scale up the controls a smidge + .carousel-control + .glyphicons-chevron-left, + .glyphicons-chevron-right, + .icon-prev, + .icon-next + width: 30px + height: 30px + margin-top: -15px + margin-left: -15px + font-size: 30px + // Show and left align the captions + .carousel-caption + left: 20% + right: 20% + padding-bottom: 30px + // Move up the indicators + .carousel-indicators + bottom: 20px diff --git a/project/static/sass/_close.sass b/project/static/sass/_close.sass new file mode 100644 index 0000000..2a773e8 --- /dev/null +++ b/project/static/sass/_close.sass @@ -0,0 +1,29 @@ +// +// Close icons +// -------------------------------------------------- + +.close + float: right + font-size: $font-size-base * 1.5 + font-weight: $close-font-weight + line-height: 1 + color: $close-color + text-shadow: $close-text-shadow + +opacity(0.2) + &:hover, + &:focus + color: $close-color + text-decoration: none + cursor: pointer + +opacity(0.5) + // [converter] extracted button& to button.close + +// Additional properties for button version +// iOS requires the button element instead of an anchor tag. +// If you want the anchor version, it requires `href="#"`. +button.close + padding: 0 + cursor: pointer + background: transparent + border: 0 + -webkit-appearance: none diff --git a/project/static/sass/_code.sass b/project/static/sass/_code.sass new file mode 100644 index 0000000..e1f6df1 --- /dev/null +++ b/project/static/sass/_code.sass @@ -0,0 +1,48 @@ +// +// Code (inline and block) +// -------------------------------------------------- + +// Inline and block code styles + +code, +kbd, +pre, +samp + font-family: $font-family-monospace + +// Inline code +code + padding: 2px 4px + font-size: 90% + color: $code-color + background-color: $code-bg + white-space: nowrap + border-radius: $border-radius-base + +// Blocks of code +pre + display: block + padding: ($line-height-computed - 1) / 2 + margin: 0 0 $line-height-computed / 2 + font-size: $font-size-base - 1 + // 14px to 13px + line-height: $line-height-base + word-break: break-all + word-wrap: break-word + color: $pre-color + background-color: $pre-bg + border: 1px solid $pre-border-color + border-radius: $border-radius-base + // Account for some code outputs that place code tags in pre tags + code + padding: 0 + font-size: inherit + color: inherit + white-space: pre-wrap + background-color: transparent + border-radius: 0 + +// Enable scrollable blocks of code +.pre-scrollable + max-height: $pre-scrollable-max-height + overflow-y: scroll diff --git a/project/static/sass/_component-animations.sass b/project/static/sass/_component-animations.sass new file mode 100644 index 0000000..8710b66 --- /dev/null +++ b/project/static/sass/_component-animations.sass @@ -0,0 +1,25 @@ +// +// Component animations +// -------------------------------------------------- + +// Heads up! +// +// We don't use the `.opacity()` mixin here since it causes a bug with text +// fields in IE7-8. Source: https://github.com/twitter/bootstrap/pull/3552. + +.fade + opacity: 0 + +transition(opacity 0.15s linear) + &.in + opacity: 1 + +.collapse + display: none + &.in + display: block + +.collapsing + position: relative + height: 0 + overflow: hidden + +transition(height 0.35s ease) diff --git a/project/static/sass/_dropdowns.sass b/project/static/sass/_dropdowns.sass new file mode 100644 index 0000000..cc63a90 --- /dev/null +++ b/project/static/sass/_dropdowns.sass @@ -0,0 +1,165 @@ +// +// Dropdown menus +// -------------------------------------------------- + +// Dropdown arrow/caret +.caret + display: inline-block + width: 0 + height: 0 + margin-left: 2px + vertical-align: middle + border-top: $caret-width-base solid $dropdown-caret-color + border-right: $caret-width-base solid transparent + border-left: $caret-width-base solid transparent + // Firefox fix for https://github.com/twbs/bootstrap/issues/9538. Once fixed, + // we can just straight up remove this. + border-bottom: 0 dotted + +// The dropdown wrapper (div) +.dropdown + position: relative + +// Prevent the focus on the dropdown toggle when closing dropdowns +.dropdown-toggle:focus + outline: 0 + +// The dropdown menu (ul) +.dropdown-menu + position: absolute + top: 100% + left: 0 + z-index: $zindex-dropdown + display: none + // none by default, but block on "open" of the menu + float: left + min-width: 160px + padding: 5px 0 + margin: 2px 0 0 + // override default ul + list-style: none + font-size: $font-size-base + background-color: $dropdown-bg + border: 1px solid $dropdown-fallback-border + // IE8 fallback + border: 1px solid $dropdown-border + border-radius: $border-radius-base + +box-shadow(0 6px 12px rgba(0, 0, 0, 0.175)) + background-clip: padding-box + // Aligns the dropdown menu to right + &.pull-right + right: 0 + left: auto + // Dividers (basically an hr) within the dropdown + .divider + +nav-divider($dropdown-divider-bg) + // Links within the dropdown menu + > li > a + display: block + padding: 3px 20px + clear: both + font-weight: normal + line-height: $line-height-base + color: $dropdown-link-color + white-space: nowrap + // prevent links from randomly breaking onto new lines + +// Hover/Focus state +.dropdown-menu > li > a + &:hover, + &:focus + text-decoration: none + color: $dropdown-link-hover-color + background-color: $dropdown-link-hover-bg + +// Active state +.dropdown-menu > .active > a + &, + &:hover, + &:focus + color: $dropdown-link-active-color + text-decoration: none + outline: 0 + background-color: $dropdown-link-active-bg + +// Disabled state +// +// Gray out text and ensure the hover/focus state remains gray + +.dropdown-menu > .disabled > a + &, + &:hover, + &:focus + color: $dropdown-link-disabled-color + +// Nuke hover/focus effects +.dropdown-menu > .disabled > a + &:hover, + &:focus + text-decoration: none + background-color: transparent + background-image: none + // Remove CSS gradient + +reset-filter + cursor: not-allowed + +// Open state for the dropdown +.open + // Show the menu + > .dropdown-menu + display: block + // Remove the outline when :focus is triggered + > a + outline: 0 + +// Dropdown section headers +.dropdown-header + display: block + padding: 3px 20px + font-size: $font-size-small + line-height: $line-height-base + color: $dropdown-header-color + +// Backdrop to catch body clicks on mobile, etc. +.dropdown-backdrop + position: fixed + left: 0 + right: 0 + bottom: 0 + top: 0 + z-index: $zindex-dropdown - 10 + +// Right aligned dropdowns +.pull-right > .dropdown-menu + right: 0 + left: auto + +// Allow for dropdowns to go bottom up (aka, dropup-menu) +// +// Just add .dropup after the standard .dropdown class and you're set, bro. +// TODO: abstract this so that the navbar fixed styles are not placed here? + +.dropup, +.navbar-fixed-bottom .dropdown + // Reverse the caret + .caret + // Firefox fix for https://github.com/twbs/bootstrap/issues/9538. Once this + // gets fixed, restore `border-top: 0;`. + border-top: 0 dotted + border-bottom: $caret-width-base solid $dropdown-caret-color + content: "" + // Different positioning for bottom up menu + .dropdown-menu + top: auto + bottom: 100% + margin-bottom: 1px + +// Component alignment +// +// Reiterate per navbar.less and the modified component alignment there. + +@media (min-width: $grid-float-breakpoint) + .navbar-right + .dropdown-menu + right: 0 + left: auto diff --git a/project/static/sass/_forms.sass b/project/static/sass/_forms.sass new file mode 100644 index 0000000..a452d11 --- /dev/null +++ b/project/static/sass/_forms.sass @@ -0,0 +1,320 @@ +// +// Forms +// -------------------------------------------------- + +// Normalize non-controls +// +// Restyle and baseline non-control form elements. + +fieldset + padding: 0 + margin: 0 + border: 0 + +legend + display: block + width: 100% + padding: 0 + margin-bottom: $line-height-computed + font-size: $font-size-base * 1.5 + line-height: inherit + color: $legend-color + border: 0 + border-bottom: 1px solid $legend-border-color + +label + display: inline-block + margin-bottom: 5px + font-weight: bold + +// Normalize form controls + +// Override content-box in Normalize (* isn't specific enough) +input[type="search"] + +box-sizing(border-box) + +// Position radios and checkboxes better + +input[type="radio"], +input[type="checkbox"] + margin: 4px 0 0 + margin-top: 1px \9 + /* IE8-9 + line-height: normal + +// Set the height of select and file controls to match text inputs +input[type="file"] + display: block + +// Make multiple select elements height not fixed + +select[multiple], +select[size] + height: auto + +// Fix optgroup Firefox bug per https://github.com/twbs/bootstrap/issues/7611 +select optgroup + font-size: inherit + font-style: inherit + font-family: inherit + +// Focus for select, file, radio, and checkbox + +input[type="file"]:focus, +input[type="radio"]:focus, +input[type="checkbox"]:focus + +tab-focus + +// Fix for Chrome number input +// Setting certain font-sizes causes the `I` bar to appear on hover of the bottom increment button. +// See https://github.com/twbs/bootstrap/issues/8350 for more. +input[type="number"] + &::-webkit-outer-spin-button, + &::-webkit-inner-spin-button + height: auto + +// Adjust output element +output + display: block + padding-top: $padding-base-vertical + 1 + font-size: $font-size-base + line-height: $line-height-base + color: $input-color + vertical-align: middle + +// Common form controls +// +// Shared size and type resets for form controls. Apply `.form-control` to any +// of the following form controls: +// +// select +// textarea +// input[type="text"] +// input[type="password"] +// input[type="datetime"] +// input[type="datetime-local"] +// input[type="date"] +// input[type="month"] +// input[type="time"] +// input[type="week"] +// input[type="number"] +// input[type="email"] +// input[type="url"] +// input[type="search"] +// input[type="tel"] +// input[type="color"] + +.form-control + display: block + width: 100% + height: $input-height-base + // Make inputs at least the height of their button counterpart (base line-height + padding + border) + padding: $padding-base-vertical $padding-base-horizontal + font-size: $font-size-base + line-height: $line-height-base + color: $input-color + vertical-align: middle + background-color: $input-bg + background-image: none + // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 + border: 1px solid $input-border + border-radius: $input-border-radius + +box-shadow(inset 0 1px 1px rgba(0, 0, 0, 0.075)) + +transition(border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s) + // Customize the `:focus` state to imitate native WebKit styles. + +form-control-focus + // Placeholder + // + // Placeholder text gets special styles because when browsers invalidate entire + // lines if it doesn't understand a selector/ + +placeholder + // Disabled and read-only inputs + // Note: HTML5 says that controls under a fieldset > legend:first-child won't + // be disabled if the fieldset is disabled. Due to implementation difficulty, + // we don't honor that edge case; we style them as disabled anyway. + &[disabled], + &[readonly], + fieldset[disabled] & + cursor: not-allowed + background-color: $input-bg-disabled + // [converter] extracted textarea& to textarea.form-control + +// Reset height for `textarea`s +textarea.form-control + height: auto + +// Form groups +// +// Designed to help with the organization and spacing of vertical forms. For +// horizontal forms, use the predefined grid classes. + +.form-group + margin-bottom: 15px + +// Checkboxes and radios +// +// Indent the labels to position radios/checkboxes as hanging controls. + +.radio, +.checkbox + display: block + min-height: $line-height-computed + // clear the floating input if there is no label text + margin-top: 10px + margin-bottom: 10px + padding-left: 20px + vertical-align: middle + label + display: inline + margin-bottom: 0 + font-weight: normal + cursor: pointer + +.radio input[type="radio"], +.radio-inline input[type="radio"], +.checkbox input[type="checkbox"], +.checkbox-inline input[type="checkbox"] + float: left + margin-left: -20px + +.radio + .radio, +.checkbox + .checkbox + margin-top: -5px + // Move up sibling radios or checkboxes for tighter spacing + +// Radios and checkboxes on same line + +.radio-inline, +.checkbox-inline + display: inline-block + padding-left: 20px + margin-bottom: 0 + vertical-align: middle + font-weight: normal + cursor: pointer + +.radio-inline + .radio-inline, +.checkbox-inline + .checkbox-inline + margin-top: 0 + margin-left: 10px + // space out consecutive inline controls + +// Apply same disabled cursor tweak as for inputs +// +// Note: Neither radios nor checkboxes can be readonly. + +input[type="radio"], +input[type="checkbox"], +.radio, +.radio-inline, +.checkbox, +.checkbox-inline + &[disabled], + fieldset[disabled] & + cursor: not-allowed + +// Form control sizing + ++input-size(".input-sm", $input-height-small, $padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small) + ++input-size(".input-lg", $input-height-large, $padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $border-radius-large) + +// Form control feedback states +// +// Apply contextual and semantic states to individual form controls. + +// Warning +.has-warning + +form-control-validation($state-warning-text, $state-warning-text, $state-warning-bg) + +// Error +.has-error + +form-control-validation($state-danger-text, $state-danger-text, $state-danger-bg) + +// Success +.has-success + +form-control-validation($state-success-text, $state-success-text, $state-success-bg) + +// Static form control text +// +// Apply class to a `p` element to make any string of text align with labels in +// a horizontal form layout. + +.form-control-static + margin-bottom: 0 + // Remove default margin from `p` + +// Help text +// +// Apply to any element you wish to create light text for placement immediately +// below a form control. Use for general help, formatting, or instructional text. + +.help-block + display: block + // account for any element using help-block + margin-top: 5px + margin-bottom: 10px + color: lighten($text-color, 25%) + // lighten the text some for contrast + +// Inline forms +// +// Make forms appear inline(-block) by adding the `.form-inline` class. Inline +// forms begin stacked on extra small (mobile) devices and then go inline when +// viewports reach <768px. +// +// Requires wrapping inputs and labels with `.form-group` for proper display of +// default HTML form controls and our custom form controls (e.g., input groups). +// +// Heads up! This is mixin-ed into `.navbar-form` in navbars.less. + +.form-inline + // Kick in the inline + @media (min-width: $screen-sm) + // Inline-block all the things for "inline" + .form-group + display: inline-block + margin-bottom: 0 + vertical-align: middle + // In navbar-form, allow folks to *not* use `.form-group` + .form-control + display: inline-block + // Remove default margin on radios/checkboxes that were used for stacking, and + // then undo the floating of radios and checkboxes to match (which also avoids + // a bug in WebKit: https://github.com/twbs/bootstrap/issues/1969). + .radio, + .checkbox + display: inline-block + margin-top: 0 + margin-bottom: 0 + padding-left: 0 + .radio input[type="radio"], + .checkbox input[type="checkbox"] + float: none + margin-left: 0 + +// Horizontal forms +// +// Horizontal forms are built on grid classes and allow you to create forms with +// labels on the left and inputs on the right. + +.form-horizontal + // Consistent vertical alignment of labels, radios, and checkboxes + .control-label, + .radio, + .checkbox, + .radio-inline, + .checkbox-inline + margin-top: 0 + margin-bottom: 0 + padding-top: $padding-base-vertical + 1 + // Default padding plus a border + // Make form groups behave like rows + .form-group + +make-row + .form-control-static + padding-top: $padding-base-vertical + 1 + // Only right align form labels here when the columns stop stacking + @media (min-width: $screen-sm-min) + .control-label + text-align: right diff --git a/project/static/sass/_glyphicons.sass b/project/static/sass/_glyphicons.sass new file mode 100644 index 0000000..b17cc80 --- /dev/null +++ b/project/static/sass/_glyphicons.sass @@ -0,0 +1,830 @@ +// +// Glyphicons for Bootstrap +// +// Since icons are fonts, they can be placed anywhere text is placed and are +// thus automatically sized to match the surrounding child. To use, create an +// inline element with the appropriate classes, like so: +// +// Star + +// Import the fonts +@font-face + font-family: 'Glyphicons Halflings' + src: url("#{$icon-font-path}#{$icon-font-name}.eot") + src: url("#{$icon-font-path}#{$icon-font-name}.eot?#iefix") format("embedded-opentype"), url("#{$icon-font-path}#{$icon-font-name}.woff") format("woff"), url("#{$icon-font-path}#{$icon-font-name}.ttf") format("truetype"), url("#{$icon-font-path}#{$icon-font-name}.svg#glyphicons_halflingsregular") format("svg") + + +// Catchall baseclass +.glyphicon + position: relative + top: 1px + display: inline-block + font-family: 'Glyphicons Halflings' + font-style: normal + font-weight: normal + line-height: 1 + -webkit-font-smoothing: antialiased + -moz-osx-font-smoothing: grayscale + &:empty + width: 1em + +// Individual icons +.glyphicon-asterisk + &:before + content: "\2a" + +.glyphicon-plus + &:before + content: "\2b" + +.glyphicon-euro + &:before + content: "\20ac" + +.glyphicon-minus + &:before + content: "\2212" + +.glyphicon-cloud + &:before + content: "\2601" + +.glyphicon-envelope + &:before + content: "\2709" + +.glyphicon-pencil + &:before + content: "\270f" + +.glyphicon-glass + &:before + content: "\e001" + +.glyphicon-music + &:before + content: "\e002" + +.glyphicon-search + &:before + content: "\e003" + +.glyphicon-heart + &:before + content: "\e005" + +.glyphicon-star + &:before + content: "\e006" + +.glyphicon-star-empty + &:before + content: "\e007" + +.glyphicon-user + &:before + content: "\e008" + +.glyphicon-film + &:before + content: "\e009" + +.glyphicon-th-large + &:before + content: "\e010" + +.glyphicon-th + &:before + content: "\e011" + +.glyphicon-th-list + &:before + content: "\e012" + +.glyphicon-ok + &:before + content: "\e013" + +.glyphicon-remove + &:before + content: "\e014" + +.glyphicon-zoom-in + &:before + content: "\e015" + +.glyphicon-zoom-out + &:before + content: "\e016" + +.glyphicon-off + &:before + content: "\e017" + +.glyphicon-signal + &:before + content: "\e018" + +.glyphicon-cog + &:before + content: "\e019" + +.glyphicon-trash + &:before + content: "\e020" + +.glyphicon-home + &:before + content: "\e021" + +.glyphicon-file + &:before + content: "\e022" + +.glyphicon-time + &:before + content: "\e023" + +.glyphicon-road + &:before + content: "\e024" + +.glyphicon-download-alt + &:before + content: "\e025" + +.glyphicon-download + &:before + content: "\e026" + +.glyphicon-upload + &:before + content: "\e027" + +.glyphicon-inbox + &:before + content: "\e028" + +.glyphicon-play-circle + &:before + content: "\e029" + +.glyphicon-repeat + &:before + content: "\e030" + +.glyphicon-refresh + &:before + content: "\e031" + +.glyphicon-list-alt + &:before + content: "\e032" + +.glyphicon-lock + &:before + content: "\e033" + +.glyphicon-flag + &:before + content: "\e034" + +.glyphicon-headphones + &:before + content: "\e035" + +.glyphicon-volume-off + &:before + content: "\e036" + +.glyphicon-volume-down + &:before + content: "\e037" + +.glyphicon-volume-up + &:before + content: "\e038" + +.glyphicon-qrcode + &:before + content: "\e039" + +.glyphicon-barcode + &:before + content: "\e040" + +.glyphicon-tag + &:before + content: "\e041" + +.glyphicon-tags + &:before + content: "\e042" + +.glyphicon-book + &:before + content: "\e043" + +.glyphicon-bookmark + &:before + content: "\e044" + +.glyphicon-print + &:before + content: "\e045" + +.glyphicon-camera + &:before + content: "\e046" + +.glyphicon-font + &:before + content: "\e047" + +.glyphicon-bold + &:before + content: "\e048" + +.glyphicon-italic + &:before + content: "\e049" + +.glyphicon-text-height + &:before + content: "\e050" + +.glyphicon-text-width + &:before + content: "\e051" + +.glyphicon-align-left + &:before + content: "\e052" + +.glyphicon-align-center + &:before + content: "\e053" + +.glyphicon-align-right + &:before + content: "\e054" + +.glyphicon-align-justify + &:before + content: "\e055" + +.glyphicon-list + &:before + content: "\e056" + +.glyphicon-indent-left + &:before + content: "\e057" + +.glyphicon-indent-right + &:before + content: "\e058" + +.glyphicon-facetime-video + &:before + content: "\e059" + +.glyphicon-picture + &:before + content: "\e060" + +.glyphicon-map-marker + &:before + content: "\e062" + +.glyphicon-adjust + &:before + content: "\e063" + +.glyphicon-tint + &:before + content: "\e064" + +.glyphicon-edit + &:before + content: "\e065" + +.glyphicon-share + &:before + content: "\e066" + +.glyphicon-check + &:before + content: "\e067" + +.glyphicon-move + &:before + content: "\e068" + +.glyphicon-step-backward + &:before + content: "\e069" + +.glyphicon-fast-backward + &:before + content: "\e070" + +.glyphicon-backward + &:before + content: "\e071" + +.glyphicon-play + &:before + content: "\e072" + +.glyphicon-pause + &:before + content: "\e073" + +.glyphicon-stop + &:before + content: "\e074" + +.glyphicon-forward + &:before + content: "\e075" + +.glyphicon-fast-forward + &:before + content: "\e076" + +.glyphicon-step-forward + &:before + content: "\e077" + +.glyphicon-eject + &:before + content: "\e078" + +.glyphicon-chevron-left + &:before + content: "\e079" + +.glyphicon-chevron-right + &:before + content: "\e080" + +.glyphicon-plus-sign + &:before + content: "\e081" + +.glyphicon-minus-sign + &:before + content: "\e082" + +.glyphicon-remove-sign + &:before + content: "\e083" + +.glyphicon-ok-sign + &:before + content: "\e084" + +.glyphicon-question-sign + &:before + content: "\e085" + +.glyphicon-info-sign + &:before + content: "\e086" + +.glyphicon-screenshot + &:before + content: "\e087" + +.glyphicon-remove-circle + &:before + content: "\e088" + +.glyphicon-ok-circle + &:before + content: "\e089" + +.glyphicon-ban-circle + &:before + content: "\e090" + +.glyphicon-arrow-left + &:before + content: "\e091" + +.glyphicon-arrow-right + &:before + content: "\e092" + +.glyphicon-arrow-up + &:before + content: "\e093" + +.glyphicon-arrow-down + &:before + content: "\e094" + +.glyphicon-share-alt + &:before + content: "\e095" + +.glyphicon-resize-full + &:before + content: "\e096" + +.glyphicon-resize-small + &:before + content: "\e097" + +.glyphicon-exclamation-sign + &:before + content: "\e101" + +.glyphicon-gift + &:before + content: "\e102" + +.glyphicon-leaf + &:before + content: "\e103" + +.glyphicon-fire + &:before + content: "\e104" + +.glyphicon-eye-open + &:before + content: "\e105" + +.glyphicon-eye-close + &:before + content: "\e106" + +.glyphicon-warning-sign + &:before + content: "\e107" + +.glyphicon-plane + &:before + content: "\e108" + +.glyphicon-calendar + &:before + content: "\e109" + +.glyphicon-random + &:before + content: "\e110" + +.glyphicon-comment + &:before + content: "\e111" + +.glyphicon-magnet + &:before + content: "\e112" + +.glyphicon-chevron-up + &:before + content: "\e113" + +.glyphicon-chevron-down + &:before + content: "\e114" + +.glyphicon-retweet + &:before + content: "\e115" + +.glyphicon-shopping-cart + &:before + content: "\e116" + +.glyphicon-folder-close + &:before + content: "\e117" + +.glyphicon-folder-open + &:before + content: "\e118" + +.glyphicon-resize-vertical + &:before + content: "\e119" + +.glyphicon-resize-horizontal + &:before + content: "\e120" + +.glyphicon-hdd + &:before + content: "\e121" + +.glyphicon-bullhorn + &:before + content: "\e122" + +.glyphicon-bell + &:before + content: "\e123" + +.glyphicon-certificate + &:before + content: "\e124" + +.glyphicon-thumbs-up + &:before + content: "\e125" + +.glyphicon-thumbs-down + &:before + content: "\e126" + +.glyphicon-hand-right + &:before + content: "\e127" + +.glyphicon-hand-left + &:before + content: "\e128" + +.glyphicon-hand-up + &:before + content: "\e129" + +.glyphicon-hand-down + &:before + content: "\e130" + +.glyphicon-circle-arrow-right + &:before + content: "\e131" + +.glyphicon-circle-arrow-left + &:before + content: "\e132" + +.glyphicon-circle-arrow-up + &:before + content: "\e133" + +.glyphicon-circle-arrow-down + &:before + content: "\e134" + +.glyphicon-globe + &:before + content: "\e135" + +.glyphicon-wrench + &:before + content: "\e136" + +.glyphicon-tasks + &:before + content: "\e137" + +.glyphicon-filter + &:before + content: "\e138" + +.glyphicon-briefcase + &:before + content: "\e139" + +.glyphicon-fullscreen + &:before + content: "\e140" + +.glyphicon-dashboard + &:before + content: "\e141" + +.glyphicon-paperclip + &:before + content: "\e142" + +.glyphicon-heart-empty + &:before + content: "\e143" + +.glyphicon-link + &:before + content: "\e144" + +.glyphicon-phone + &:before + content: "\e145" + +.glyphicon-pushpin + &:before + content: "\e146" + +.glyphicon-usd + &:before + content: "\e148" + +.glyphicon-gbp + &:before + content: "\e149" + +.glyphicon-sort + &:before + content: "\e150" + +.glyphicon-sort-by-alphabet + &:before + content: "\e151" + +.glyphicon-sort-by-alphabet-alt + &:before + content: "\e152" + +.glyphicon-sort-by-order + &:before + content: "\e153" + +.glyphicon-sort-by-order-alt + &:before + content: "\e154" + +.glyphicon-sort-by-attributes + &:before + content: "\e155" + +.glyphicon-sort-by-attributes-alt + &:before + content: "\e156" + +.glyphicon-unchecked + &:before + content: "\e157" + +.glyphicon-expand + &:before + content: "\e158" + +.glyphicon-collapse-down + &:before + content: "\e159" + +.glyphicon-collapse-up + &:before + content: "\e160" + +.glyphicon-log-in + &:before + content: "\e161" + +.glyphicon-flash + &:before + content: "\e162" + +.glyphicon-log-out + &:before + content: "\e163" + +.glyphicon-new-window + &:before + content: "\e164" + +.glyphicon-record + &:before + content: "\e165" + +.glyphicon-save + &:before + content: "\e166" + +.glyphicon-open + &:before + content: "\e167" + +.glyphicon-saved + &:before + content: "\e168" + +.glyphicon-import + &:before + content: "\e169" + +.glyphicon-export + &:before + content: "\e170" + +.glyphicon-send + &:before + content: "\e171" + +.glyphicon-floppy-disk + &:before + content: "\e172" + +.glyphicon-floppy-saved + &:before + content: "\e173" + +.glyphicon-floppy-remove + &:before + content: "\e174" + +.glyphicon-floppy-save + &:before + content: "\e175" + +.glyphicon-floppy-open + &:before + content: "\e176" + +.glyphicon-credit-card + &:before + content: "\e177" + +.glyphicon-transfer + &:before + content: "\e178" + +.glyphicon-cutlery + &:before + content: "\e179" + +.glyphicon-header + &:before + content: "\e180" + +.glyphicon-compressed + &:before + content: "\e181" + +.glyphicon-earphone + &:before + content: "\e182" + +.glyphicon-phone-alt + &:before + content: "\e183" + +.glyphicon-tower + &:before + content: "\e184" + +.glyphicon-stats + &:before + content: "\e185" + +.glyphicon-sd-video + &:before + content: "\e186" + +.glyphicon-hd-video + &:before + content: "\e187" + +.glyphicon-subtitles + &:before + content: "\e188" + +.glyphicon-sound-stereo + &:before + content: "\e189" + +.glyphicon-sound-dolby + &:before + content: "\e190" + +.glyphicon-sound-5-1 + &:before + content: "\e191" + +.glyphicon-sound-6-1 + &:before + content: "\e192" + +.glyphicon-sound-7-1 + &:before + content: "\e193" + +.glyphicon-copyright-mark + &:before + content: "\e194" + +.glyphicon-registration-mark + &:before + content: "\e195" + +.glyphicon-cloud-download + &:before + content: "\e197" + +.glyphicon-cloud-upload + &:before + content: "\e198" + +.glyphicon-tree-conifer + &:before + content: "\e199" + +.glyphicon-tree-deciduous + &:before + content: "\e200" diff --git a/project/static/sass/_grid.sass b/project/static/sass/_grid.sass new file mode 100644 index 0000000..ece29a0 --- /dev/null +++ b/project/static/sass/_grid.sass @@ -0,0 +1,81 @@ +// +// Grid system +// -------------------------------------------------- + +// Set the container width, and override it for fixed navbars in media queries +.container + +container-fixed + +// mobile first defaults +.row + +make-row + +// Common styles for small and large grid columns ++make-grid-columns + +// Extra small grid +// +// Grid classes for extra small devices like smartphones. No offset, push, or +// pull classes are present here due to the size of the target. +// +// Note that `.col-xs-12` doesn't get floated on purpose--there's no need since +// it's full-width. + ++make-grid-columns-float(xs) + ++make-grid($grid-columns, xs, width) + ++make-grid($grid-columns, xs, pull) + ++make-grid($grid-columns, xs, push) + ++make-grid($grid-columns, xs, offset) + +// Small grid +// +// Columns, offsets, pushes, and pulls for the small device range, from phones +// to tablets. +// +// Note that `.col-sm-12` doesn't get floated on purpose--there's no need since +// it's full-width. + +@media (min-width: $screen-sm-min) + .container + width: $container-sm + +make-grid-columns-float(sm) + +make-grid($grid-columns, sm, width) + +make-grid($grid-columns, sm, pull) + +make-grid($grid-columns, sm, push) + +make-grid($grid-columns, sm, offset) + +// Medium grid +// +// Columns, offsets, pushes, and pulls for the desktop device range. +// +// Note that `.col-md-12` doesn't get floated on purpose--there's no need since +// it's full-width. + +@media (min-width: $screen-md-min) + .container + width: $container-md + +make-grid-columns-float(md) + +make-grid($grid-columns, md, width) + +make-grid($grid-columns, md, pull) + +make-grid($grid-columns, md, push) + +make-grid($grid-columns, md, offset) + +// Large grid +// +// Columns, offsets, pushes, and pulls for the large desktop device range. +// +// Note that `.col-lg-12` doesn't get floated on purpose--there's no need since +// it's full-width. + +@media (min-width: $screen-lg-min) + .container + width: $container-lg + +make-grid-columns-float(lg) + +make-grid($grid-columns, lg, width) + +make-grid($grid-columns, lg, pull) + +make-grid($grid-columns, lg, push) + +make-grid($grid-columns, lg, offset) diff --git a/project/static/sass/_input-groups.sass b/project/static/sass/_input-groups.sass new file mode 100644 index 0000000..2a322ee --- /dev/null +++ b/project/static/sass/_input-groups.sass @@ -0,0 +1,123 @@ +// +// Input groups +// -------------------------------------------------- + +// Base styles +// ------------------------- +.input-group + position: relative + // For dropdowns + display: table + border-collapse: separate + // prevent input groups from inheriting border styles from table cells when placed within a table + // Undo padding and float of grid classes + &.col + float: none + padding-left: 0 + padding-right: 0 + .form-control + width: 100% + margin-bottom: 0 + +// Sizing options +// +// Remix the default form control sizing classes into new ones for easier +// manipulation. + +.input-group-lg > .form-control, +.input-group-lg > .input-group-addon, +.input-group-lg > .input-group-btn > .btn + @extend .input-lg + +.input-group-sm > .form-control, +.input-group-sm > .input-group-addon, +.input-group-sm > .input-group-btn > .btn + @extend .input-sm + +// Display as table-cell +// ------------------------- + +.input-group-addon, +.input-group-btn, +.input-group .form-control + display: table-cell + &:not(:first-child):not(:last-child) + border-radius: 0 + +// Addon and addon wrapper for buttons + +.input-group-addon, +.input-group-btn + width: 1% + white-space: nowrap + vertical-align: middle + // Match the inputs + +// Text input groups +// ------------------------- +.input-group-addon + padding: $padding-base-vertical $padding-base-horizontal + font-size: $font-size-base + font-weight: normal + line-height: 1 + color: $input-color + text-align: center + background-color: $input-group-addon-bg + border: 1px solid $input-group-addon-border-color + border-radius: $border-radius-base + // Sizing + &.input-sm + padding: $padding-small-vertical $padding-small-horizontal + font-size: $font-size-small + border-radius: $border-radius-small + &.input-lg + padding: $padding-large-vertical $padding-large-horizontal + font-size: $font-size-large + border-radius: $border-radius-large + // Nuke default margins from checkboxes and radios to vertically center within. + input[type="radio"], + input[type="checkbox"] + margin-top: 0 + +// Reset rounded corners + +.input-group .form-control:first-child, +.input-group-addon:first-child, +.input-group-btn:first-child > .btn, +.input-group-btn:first-child > .dropdown-toggle, +.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) + +border-right-radius(0) + +.input-group-addon:first-child + border-right: 0 + +.input-group .form-control:last-child, +.input-group-addon:last-child, +.input-group-btn:last-child > .btn, +.input-group-btn:last-child > .dropdown-toggle, +.input-group-btn:first-child > .btn:not(:first-child) + +border-left-radius(0) + +.input-group-addon:last-child + border-left: 0 + +// Button input groups +// ------------------------- +.input-group-btn + position: relative + white-space: nowrap + // Negative margin to only have a 1px border between the two + &:first-child > .btn + margin-right: -1px + &:last-child > .btn + margin-left: -1px + +.input-group-btn > .btn + position: relative + // Jankily prevent input button groups from wrapping + + .btn + margin-left: -4px + // Bring the "active" button to the front + &:hover, + &:active + z-index: 2 diff --git a/project/static/sass/_jumbotron.sass b/project/static/sass/_jumbotron.sass new file mode 100644 index 0000000..b292883 --- /dev/null +++ b/project/static/sass/_jumbotron.sass @@ -0,0 +1,28 @@ +// +// Jumbotron +// -------------------------------------------------- + +.jumbotron + padding: $jumbotron-padding + margin-bottom: $jumbotron-padding + font-size: $jumbotron-font-size + font-weight: 200 + line-height: $line-height-base * 1.5 + color: $jumbotron-color + background-color: $jumbotron-bg + h1 + line-height: 1 + color: $jumbotron-heading-color + p + line-height: 1.4 + .container & + border-radius: $border-radius-large + // Only round corners at higher resolutions if contained in a container + @media screen and (min-width: $screen-sm-min) + padding-top: $jumbotron-padding * 1.6 + padding-bottom: $jumbotron-padding * 1.6 + .container & + padding-left: $jumbotron-padding * 2 + padding-right: $jumbotron-padding * 2 + h1 + font-size: $font-size-base * 4.5 diff --git a/project/static/sass/_labels.sass b/project/static/sass/_labels.sass new file mode 100644 index 0000000..51ec4f4 --- /dev/null +++ b/project/static/sass/_labels.sass @@ -0,0 +1,46 @@ +// +// Labels +// -------------------------------------------------- + +.label + display: inline + padding: .2em .6em .3em + font-size: 75% + font-weight: bold + line-height: 1 + color: $label-color + text-align: center + white-space: nowrap + vertical-align: baseline + border-radius: .25em + // Add hover effects, but only for links + &[href] + &:hover, + &:focus + color: $label-link-hover-color + text-decoration: none + cursor: pointer + // Empty labels collapse automatically (not available in IE8) + &:empty + display: none + +// Colors +// Contextual variations (linked labels get darker on :hover) + +.label-default + +label-variant($label-default-bg) + +.label-primary + +label-variant($label-primary-bg) + +.label-success + +label-variant($label-success-bg) + +.label-info + +label-variant($label-info-bg) + +.label-warning + +label-variant($label-warning-bg) + +.label-danger + +label-variant($label-danger-bg) diff --git a/project/static/sass/_list-group.sass b/project/static/sass/_list-group.sass new file mode 100644 index 0000000..49a2f88 --- /dev/null +++ b/project/static/sass/_list-group.sass @@ -0,0 +1,71 @@ +// +// List groups +// -------------------------------------------------- + +// Base class +// +// Easily usable on