diff options
author | MaZderMind | 2015-02-26 17:57:42 +0100 |
---|---|---|
committer | MaZderMind | 2015-02-26 17:57:42 +0100 |
commit | 6db2f0f4b9816ccd271332b89a05a9d0d753216b (patch) | |
tree | fd7ecf7cf16b33bdb75c45e747d12f9ecca43358 /assets/css/src | |
parent | 9fb5b19bb0652b9c187c9b552c0a7ec4d6778222 (diff) |
shuffle things around on the way to a bootstrap-based configurable website
Diffstat (limited to '')
-rw-r--r-- | assets/css/src/_fonts.scss | 21 | ||||
-rw-r--r-- | assets/css/src/_variables.scss | 819 | ||||
-rw-r--r-- | assets/css/src/lustige-styles.scss | 891 |
3 files changed, 0 insertions, 1731 deletions
diff --git a/assets/css/src/_fonts.scss b/assets/css/src/_fonts.scss deleted file mode 100644 index 7d251f3..0000000 --- a/assets/css/src/_fonts.scss +++ /dev/null @@ -1,21 +0,0 @@ -/* font Estrangelo Edessa */ -@font-face { - font-family: 'Estrangelo Edessa'; - src: url('../fonts/estre.eot'); - font-weight: normal; - font-style: normal; -} -@font-face { - font-family: 'Estrangelo Edessa'; - src: url('../fonts/estre.otf') format('opentype'); - font-weight: normal; - font-style: normal; -} -@font-face { - font-family: 'Estrangelo Edessa'; - src: url('../fonts/estre.ttf') format('truetype'), - url('../fonts/estre.woff') format('woff'), - url('../fonts/estre.svg') format('svg'); - font-weight: normal; - font-style: normal; -}
\ No newline at end of file diff --git a/assets/css/src/_variables.scss b/assets/css/src/_variables.scss deleted file mode 100644 index dbf5832..0000000 --- a/assets/css/src/_variables.scss +++ /dev/null @@ -1,819 +0,0 @@ -@import "../lib/bootstrap/variables"; - -// Override Bootstrap variables here (defaults from bootstrap-sass v3.1.1.1): - -// a flag to toggle asset pipeline / compass integration -// defaults to true if twbs-font-path function is present (no function => twbs-font-path('') parsed as string == right side) -// in Sass 3.3 this can be improved with: function-exists(twbs-font-path) -// $bootstrap-sass-asset-helper: (twbs-font-path("") != unquote('twbs-font-path("")')) -// -// Variables -// -------------------------------------------------- - -//== Colors -// -//## Gray and brand colors for use across Bootstrap. - -// $gray-darker: lighten(#000, 13.5%) // #222 -// $gray-dark: lighten(#000, 20%) // #333 (buttons & header) -// $gray: lighten(#000, 33.5%) // #555 -// $gray-light: lighten(#000, 60%) // #999 -// $gray-lighter: lighten(#000, 93.5%) // #eee - -$brand-primary: #d87500; // orange -$transparent-white: rgba(255, 255, 255, 0.3); -// $brand-success: #5cb85c -// $brand-info: #5bc0de -// $brand-warning: #f0ad4e -// $brand-danger: #d9534f - -//== Scaffolding -// -//## Settings for some of the most global styles. - -//* Background color for `<body>`. -// $body-bg: #fff -$body-bg: #fff; -//* Global text color on `<body>`. -$text-color: #000; - -//* Global textual link color. -$link-color: $brand-primary; -//* Link hover color set via `darken()` function. -$link-hover-color: darken($link-color, 15%); - -//== Typography -// -//## Font, line-height, and color for body text, headings, and more. - -$font-family-sans-serif: "Estrangelo Edessa", "Helvetica Neue", Helvetica, Arial, sans-serif; -// $font-family-serif: Georgia, "Times New Roman", Times, serif -//* Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`. -// $font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace -$font-family-base: $font-family-sans-serif; -//$font-family: "Droid Sans",Arial,"Trebuchet MS",sans-serif; - -$font-size-base: 14px; -$font-size-large: ceil(($font-size-base * 1.7)); // ~24px -// $font-size-small: ceil(($font-size-base * 0.85)) // ~12px - -$font-size-h1: floor(($font-size-base * 3)); // ~42px -$font-size-h2: floor(($font-size-base * 2.15)); // ~30px -// $font-size-h3: ceil(($font-size-base * 1.7)) // ~24px -// $font-size-h4: ceil(($font-size-base * 1.25)) // ~18px -// $font-size-h5: $font-size-base -// $font-size-h6: ceil(($font-size-base * 0.85)) // ~12px - -//* Unit-less `line-height` for use in components like buttons. -$line-height-base: 1.2; -//* Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc. -$line-height-computed: floor(($font-size-base * $line-height-base)); - -//* By default, this inherits from the `<body>`. -// $headings-font-family: inherit -// $headings-font-weight: 500 -// $headings-line-height: 1.1 -$headings-color: $gray; - -//== Iconography -// -//## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower. - -//* Load fonts from this directory. -$icon-font-path: "../fonts/"; -//* File name for all font files. -$icon-font-name: "fontawesome-webfont"; -//* Element ID within SVG icon file. -$icon-font-svg-id: "fontawesomeregular"; - -//== Components -// -//## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start). - -$padding-base-vertical: 4px; -// $padding-base-horizontal: 12px - -// $padding-large-vertical: 10px -// $padding-large-horizontal: 16px - -// $padding-small-vertical: 5px -// $padding-small-horizontal: 10px - -// $padding-xs-vertical: 1px -// $padding-xs-horizontal: 5px - -// $line-height-large: 1.33 -// $line-height-small: 1.5 - -$border-radius-base: 0; -$border-radius-large: 0; -$border-radius-small: 0; - -//* Global color for active items (e.g., navs or dropdowns). -// $component-active-color: #fff -//* Global background color for active items (e.g., navs or dropdowns). -// $component-active-bg: $brand-primary - -//* Width of the `border` for generating carets that indicator dropdowns. -// $caret-width-base: 4px -//* Carets increase slightly in size for larger components. -// $caret-width-large: 5px - -//== Tables -// -//## Customizes the `.table` component with basic values, each used across all table variations. - -//* Padding for `<th>`s and `<td>`s. -// $table-cell-padding: 8px -//* Padding for cells in `.table-condensed`. -// $table-condensed-cell-padding: 5px - -//* Default background color used for all tables. -// $table-bg: transparent -//* Background color used for `.table-striped`. -// $table-bg-accent: #f9f9f9 -//* Background color used for `.table-hover`. -// $table-bg-hover: #f5f5f5 -// $table-bg-active: $table-bg-hover - -//* Border color for table and cell borders. -// $table-border-color: #ddd - -//== Buttons -// -//## For each of Bootstrap's buttons, define text, background and border color. - -// $btn-font-weight: normal - -$btn-default-color: $gray-dark; -$btn-default-bg: #fff; -$btn-default-border: #fff; - -$btn-primary-color: #fff; -$btn-primary-bg: $gray-dark; -$btn-primary-border: $gray-dark; - -// $btn-success-color: #fff -// $btn-success-bg: $brand-success -// $btn-success-border: darken($btn-success-bg, 5%) - -// $btn-info-color: #fff -// $btn-info-bg: $brand-info -// $btn-info-border: darken($btn-info-bg, 5%) - -// $btn-warning-color: #fff -// $btn-warning-bg: $brand-warning -// $btn-warning-border: darken($btn-warning-bg, 5%) - -// $btn-danger-color: #fff -// $btn-danger-bg: $brand-danger -// $btn-danger-border: darken($btn-danger-bg, 5%) - -// $btn-link-disabled-color: $gray-light - -//== Forms -// -//## - -//* `<input>` background color -// $input-bg: #fff -//* `<input disabled>` background color -// $input-bg-disabled: $gray-lighter - -//* Text color for `<input>`s -// $input-color: $gray -//* `<input>` border color -$input-border: transparent; -//* `<input>` border radius -$input-border-radius: $border-radius-base; -//* Border color for inputs on focus -$input-border-focus: $brand-primary; - -//* Placeholder text color -$input-color-placeholder: $gray-light; - -//* Default `.form-control` height -$input-height-base: ($line-height-computed + ($padding-base-vertical * 2) + 2); -//* Large `.form-control` height -// $input-height-large: (ceil($font-size-large * $line-height-large) + ($padding-large-vertical * 2) + 2) -//* Small `.form-control` height -// $input-height-small: (floor($font-size-small * $line-height-small) + ($padding-small-vertical * 2) + 2) - -// $legend-color: $gray-dark -// $legend-border-color: #e5e5e5 - -//* Background color for textual input addons -// $input-group-addon-bg: $gray-lighter -//* Border color for textual input addons -// $input-group-addon-border-color: $input-border - -//== Dropdowns -// -//## Dropdown menu container and contents. - -//* Background for the dropdown menu. -// $dropdown-bg: #fff -//* Dropdown menu `border-color`. -// $dropdown-border: rgba(0,0,0,.15) -//* Dropdown menu `border-color` **for IE8**. -// $dropdown-fallback-border: #ccc -//* Divider color for between dropdown items. -// $dropdown-divider-bg: #e5e5e5 - -//* Dropdown link text color. -// $dropdown-link-color: $gray-dark -//* Hover color for dropdown links. -// $dropdown-link-hover-color: darken($gray-dark, 5%) -//* Hover background for dropdown links. -// $dropdown-link-hover-bg: #f5f5f5 - -//* Active dropdown menu item text color. -// $dropdown-link-active-color: $component-active-color -//* Active dropdown menu item background color. -// $dropdown-link-active-bg: $component-active-bg - -//* Disabled dropdown menu item background color. -// $dropdown-link-disabled-color: $gray-light - -//* Text color for headers within dropdown menus. -// $dropdown-header-color: $gray-light - -// Note: Deprecated $dropdown-caret-color as of v3.1.0 -// $dropdown-caret-color: #000 - -//-- Z-index master list -// -// Warning: Avoid customizing these values. They're used for a bird's eye view -// of components dependent on the z-axis and are designed to all work together. -// -// Note: These variables are not generated into the Customizer. - -// $zindex-navbar: 1000 -// $zindex-dropdown: 1000 -// $zindex-popover: 1060 -// $zindex-tooltip: 1070 -// $zindex-navbar-fixed: 1030 -// $zindex-modal-background: 1040 -// $zindex-modal: 1050 - -//== Media queries breakpoints -// -//## Define the breakpoints at which your layout will change, adapting to different screen sizes. - -// Extra small screen / phone -// Note: Deprecated $screen-xs and $screen-phone as of v3.0.1 -// Note: Deprecated $screen-xs-min as of v3.2.0 -// $screen-xs: 480px -// $screen-xs-min: $screen-xs -// $screen-phone: $screen-xs-min - -// Small screen / tablet -// Note: Deprecated $screen-sm and $screen-tablet as of v3.0.1 -$screen-sm: 450px; -$screen-sm-min: $screen-sm; -$screen-tablet: $screen-sm-min; - -// Medium screen / desktop -// Note: Deprecated $screen-md and $screen-desktop as of v3.0.1 -$screen-md: 960px; -$screen-md-min: $screen-md; -$screen-desktop: $screen-md-min; - -// Large screen / wide desktop -// Note: Deprecated $screen-lg and $screen-lg-desktop as of v3.0.1 -$screen-lg: 1200px; -$screen-lg-min: $screen-lg; -$screen-lg-desktop: $screen-lg-min; - -// So media queries don't overlap when required, provide a maximum -$screen-xs-max: ($screen-sm-min - 1); -$screen-sm-max: ($screen-md-min - 1); -$screen-md-max: ($screen-lg-min - 1); - -//== Grid system -// -//## Define your custom responsive grid. - -//* Number of columns in the grid. -// $grid-columns: 12 -//* Padding between columns. Gets divided in half for the left and right. -// $grid-gutter-width: 30px -// Navbar collapse -//* Point at which the navbar becomes uncollapsed. -$grid-float-breakpoint: 0; //$screen-sm-min; -//* Point at which the navbar begins collapsing. -$grid-float-breakpoint-max: 0; //($grid-float-breakpoint - 1); - -//== Container sizes -// -//## Define the maximum width of `.container` for different screen sizes. - -// Small screen / tablet -$container-tablet: 700px; -//* For `$screen-sm-min` and up. -$container-sm: $container-tablet; - -// Medium screen / desktop -$container-desktop: 700px; -//* For `$screen-md-min` and up. -$container-md: $container-desktop; - -// Large screen / wide desktop -$container-large-desktop: 1024px; -//* For `$screen-lg-min` and up. -$container-lg: $container-large-desktop; - -//== Navbar -// -//## - -// Basics of a navbar -$navbar-height: 48px; -$navbar-margin-bottom: 0; -$navbar-border-radius: $border-radius-base; -// $navbar-padding-horizontal: floor(($grid-gutter-width / 2)) -$navbar-padding-vertical: (($navbar-height - $line-height-computed) / 2); -// $navbar-collapse-max-height: 340px - -// $navbar-default-color: #777 -$navbar-default-bg: $gray-dark; -$navbar-default-border: transparent; - -// Navbar links -$navbar-default-link-color: $gray-dark; -$navbar-default-link-hover-color: $brand-primary; -$navbar-default-link-hover-bg: #fff; -// $navbar-default-link-active-color: #555 -// $navbar-default-link-active-bg: darken($navbar-default-bg, 6.5%) -// $navbar-default-link-disabled-color: #ccc -// $navbar-default-link-disabled-bg: transparent - -// Navbar brand label -$navbar-default-brand-color: #fff; -$navbar-default-brand-hover-color: $gray-lighter; -// $navbar-default-brand-hover-bg: transparent - -// Navbar toggle -// $navbar-default-toggle-hover-bg: #ddd -// $navbar-default-toggle-icon-bar-bg: #888 -// $navbar-default-toggle-border-color: #ddd - -// Inverted navbar -// Reset inverted navbar basics -// $navbar-inverse-color: $gray-light -// $navbar-inverse-bg: #222 -// $navbar-inverse-border: darken($navbar-inverse-bg, 10%) - -// Inverted navbar links -// $navbar-inverse-link-color: $gray-light -// $navbar-inverse-link-hover-color: #fff -// $navbar-inverse-link-hover-bg: transparent -// $navbar-inverse-link-active-color: $navbar-inverse-link-hover-color -// $navbar-inverse-link-active-bg: darken($navbar-inverse-bg, 10%) -// $navbar-inverse-link-disabled-color: #444 -// $navbar-inverse-link-disabled-bg: transparent - -// Inverted navbar brand label -// $navbar-inverse-brand-color: $navbar-inverse-link-color -// $navbar-inverse-brand-hover-color: #fff -// $navbar-inverse-brand-hover-bg: transparent - -// Inverted navbar toggle -// $navbar-inverse-toggle-hover-bg: #333 -// $navbar-inverse-toggle-icon-bar-bg: #fff -// $navbar-inverse-toggle-border-color: #333 - -//== Navs -// -//## - -//=== Shared nav styles -$nav-link-padding: 0px 10px; -$nav-link-hover-bg: #fff; - -// $nav-disabled-link-color: $gray-light -// $nav-disabled-link-hover-color: $gray-light - -// $nav-open-link-hover-color: #fff - -//== Tabs -// $nav-tabs-border-color: #ddd - -// $nav-tabs-link-hover-border-color: $gray-lighter - -// $nav-tabs-active-link-hover-bg: $body-bg -// $nav-tabs-active-link-hover-color: $gray -// $nav-tabs-active-link-hover-border-color: #ddd - -// $nav-tabs-justified-link-border-color: #ddd -// $nav-tabs-justified-active-link-border-color: $body-bg - -//== Pills -$nav-pills-border-radius: $border-radius-base; -// $nav-pills-active-link-hover-bg: $component-active-bg -// $nav-pills-active-link-hover-color: $component-active-color - -//== Pagination -// -//## - -// $pagination-color: $link-color -// $pagination-bg: #fff -// $pagination-border: #ddd - -// $pagination-hover-color: $link-hover-color -// $pagination-hover-bg: $gray-lighter -// $pagination-hover-border: #ddd - -// $pagination-active-color: #fff -// $pagination-active-bg: $brand-primary -// $pagination-active-border: $brand-primary - -// $pagination-disabled-color: $gray-light -// $pagination-disabled-bg: #fff -// $pagination-disabled-border: #ddd - -//== Pager -// -//## - -// $pager-bg: $pagination-bg -// $pager-border: $pagination-border -// $pager-border-radius: 15px - -// $pager-hover-bg: $pagination-hover-bg - -// $pager-active-bg: $pagination-active-bg -// $pager-active-color: $pagination-active-color - -// $pager-disabled-color: $pagination-disabled-color - -//== Jumbotron -// -//## - -// $jumbotron-padding: 30px -// $jumbotron-color: inherit -// $jumbotron-bg: $gray-lighter -// $jumbotron-heading-color: inherit -// $jumbotron-font-size: ceil(($font-size-base * 1.5)) - -//== Form states and alerts -// -//## Define colors for form feedback states and, by default, alerts. - -// $state-success-text: #3c763d -// $state-success-bg: #dff0d8 -// $state-success-border: darken(adjust-hue($state-success-bg, -10), 5%) - -// $state-info-text: #31708f -// $state-info-bg: #d9edf7 -// $state-info-border: darken(adjust-hue($state-info-bg, -10), 7%) - -// $state-warning-text: #8a6d3b -// $state-warning-bg: #fcf8e3 -// $state-warning-border: darken(adjust-hue($state-warning-bg, -10), 5%) - -// $state-danger-text: #a94442 -// $state-danger-bg: #f2dede -// $state-danger-border: darken(adjust-hue($state-danger-bg, -10), 5%) - -//== Tooltips -// -//## - -//* Tooltip max width -// $tooltip-max-width: 200px -//* Tooltip text color -// $tooltip-color: #fff -//* Tooltip background color -// $tooltip-bg: #000 -// $tooltip-opacity: .9 - -//* Tooltip arrow width -// $tooltip-arrow-width: 5px -//* Tooltip arrow color -// $tooltip-arrow-color: $tooltip-bg - -//== Popovers -// -//## - -//* Popover body background color -// $popover-bg: #fff -//* Popover maximum width -// $popover-max-width: 276px -//* Popover border color -// $popover-border-color: rgba(0,0,0,.2) -//* Popover fallback border color -// $popover-fallback-border-color: #ccc - -//* Popover title background color -// $popover-title-bg: darken($popover-bg, 3%) - -//* Popover arrow width -// $popover-arrow-width: 10px -//* Popover arrow color -// $popover-arrow-color: #fff - -//* Popover outer arrow width -// $popover-arrow-outer-width: ($popover-arrow-width + 1) -//* Popover outer arrow color -// $popover-arrow-outer-color: rgba($popover-border-color, 0.05) -//* Popover outer arrow fallback color -// $popover-arrow-outer-fallback-color: darken($popover-fallback-border-color, 20%) - -//== Labels -// -//## - -//* Default label background color -$label-default-bg: $gray-dark; -//* Primary label background color -// $label-primary-bg: $brand-primary -//* Success label background color -// $label-success-bg: $brand-success -//* Info label background color -// $label-info-bg: $brand-info -//* Warning label background color -// $label-warning-bg: $brand-warning -//* Danger label background color -// $label-danger-bg: $brand-danger - -//* Default label text color -// $label-color: #fff -//* Default text color of a linked label -// $label-link-hover-color: #fff - -//== Modals -// -//## - -//* Padding applied to the modal body -// $modal-inner-padding: 15px - -//* Padding applied to the modal title -// $modal-title-padding: 15px -//* Modal title line-height -// $modal-title-line-height: $line-height-base - -//* Background color of modal content area -// $modal-content-bg: #fff -//* Modal content border color -// $modal-content-border-color: rgba(0,0,0,.2) -//* Modal content border color **for IE8** -// $modal-content-fallback-border-color: #999 - -//* Modal backdrop background color -// $modal-backdrop-bg: #000 -//* Modal backdrop opacity -// $modal-backdrop-opacity: .5 -//* Modal header border color -// $modal-header-border-color: #e5e5e5 -//* Modal footer border color -// $modal-footer-border-color: $modal-header-border-color - -// $modal-lg: 900px -// $modal-md: 600px -// $modal-sm: 300px - -//== Alerts -// -//## Define alert colors, border radius, and padding. - -// $alert-padding: 15px -$alert-border-radius: $border-radius-base; -// $alert-link-font-weight: bold - -// $alert-success-bg: $state-success-bg -// $alert-success-text: $state-success-text -// $alert-success-border: $state-success-border - -// $alert-info-bg: $state-info-bg -// $alert-info-text: $state-info-text -// $alert-info-border: $state-info-border - -// $alert-warning-bg: $state-warning-bg -// $alert-warning-text: $state-warning-text -// $alert-warning-border: $state-warning-border - -// $alert-danger-bg: $state-danger-bg -// $alert-danger-text: $state-danger-text -// $alert-danger-border: $state-danger-border - -//== Progress bars -// -//## - -//* Background color of the whole progress component -// $progress-bg: #f5f5f5 -//* Progress bar text color -// $progress-bar-color: #fff - -//* Default progress bar color -// $progress-bar-bg: $brand-primary -//* Success progress bar color -// $progress-bar-success-bg: $brand-success -//* Warning progress bar color -// $progress-bar-warning-bg: $brand-warning -//* Danger progress bar color -// $progress-bar-danger-bg: $brand-danger -//* Info progress bar color -// $progress-bar-info-bg: $brand-info - -//== List group -// -//## - -//* Background color on `.list-group-item` -// $list-group-bg: #fff -//* `.list-group-item` border color -// $list-group-border: #ddd -//* List group border radius -// $list-group-border-radius: $border-radius-base - -//* Background color of single list items on hover -// $list-group-hover-bg: #f5f5f5 -//* Text color of active list items -// $list-group-active-color: $component-active-color -//* Background color of active list items -// $list-group-active-bg: $component-active-bg -//* Border color of active list elements -// $list-group-active-border: $list-group-active-bg -//* Text color for content within active list items -// $list-group-active-text-color: lighten($list-group-active-bg, 40%) - -//* Text color of disabled list items -// $list-group-disabled-color: $gray-light -//* Background color of disabled list items -// $list-group-disabled-bg: $gray-lighter -//* Text color for content within disabled list items -// $list-group-disabled-text-color: $list-group-disabled-color - -// $list-group-link-color: #555 -// $list-group-link-hover-color: $list-group-link-color -// $list-group-link-heading-color: #333 - -//== Panels -// -//## - -// $panel-bg: #fff -// $panel-body-padding: 15px -// $panel-heading-padding: 10px 15px -// $panel-footer-padding: $panel-heading-padding -$panel-border-radius: $border-radius-base; - -//* Border color for elements within panels -// $panel-inner-border: #ddd -// $panel-footer-bg: #f5f5f5 - -// $panel-default-text: $gray-dark -// $panel-default-border: #ddd -// $panel-default-heading-bg: #f5f5f5 - -// $panel-primary-text: #fff -// $panel-primary-border: $brand-primary -// $panel-primary-heading-bg: $brand-primary - -// $panel-success-text: $state-success-text -// $panel-success-border: $state-success-border -// $panel-success-heading-bg: $state-success-bg - -// $panel-info-text: $state-info-text -// $panel-info-border: $state-info-border -// $panel-info-heading-bg: $state-info-bg - -// $panel-warning-text: $state-warning-text -// $panel-warning-border: $state-warning-border -// $panel-warning-heading-bg: $state-warning-bg - -// $panel-danger-text: $state-danger-text -// $panel-danger-border: $state-danger-border -// $panel-danger-heading-bg: $state-danger-bg - -//== Thumbnails -// -//## - -//* Padding around the thumbnail image -// $thumbnail-padding: 4px -//* Thumbnail background color -// $thumbnail-bg: $body-bg -//* Thumbnail border color -$thumbnail-border: none; -//* Thumbnail border radius -$thumbnail-border-radius: $border-radius-base; - -//* Custom text color for thumbnail captions -// $thumbnail-caption-color: $text-color -//* Padding around the thumbnail caption -// $thumbnail-caption-padding: 9px - -//== Wells -// -//## - -// $well-bg: #f5f5f5 -// $well-border: darken($well-bg, 7%) - -//== Badges -// -//## - -// $badge-color: #fff -//* Linked badge text color on hover -// $badge-link-hover-color: #fff -// $badge-bg: $gray-light - -//* Badge text color in active nav link -// $badge-active-color: $link-color -//* Badge background color in active nav link -// $badge-active-bg: #fff - -// $badge-font-weight: bold -// $badge-line-height: 1 -// $badge-border-radius: 10px - -//== Breadcrumbs -// -//## - -// $breadcrumb-padding-vertical: 8px -// $breadcrumb-padding-horizontal: 15px -//* Breadcrumb background color -$breadcrumb-bg: none; -//* Breadcrumb text color -$breadcrumb-color: #fff; -//* Text color of current page in the breadcrumb -$breadcrumb-active-color: $brand-primary; -//* Textual separator for between breadcrumb elements -$breadcrumb-separator: "\f054" - -//== Carousel -// -//## - -// $carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6) - -// $carousel-control-color: #fff -// $carousel-control-width: 15% -// $carousel-control-opacity: .5 -// $carousel-control-font-size: 20px - -// $carousel-indicator-active-bg: #fff -// $carousel-indicator-border-color: #fff - -// $carousel-caption-color: #fff - -//== Close -// -//## - -// $close-font-weight: bold -// $close-color: #000 -// $close-text-shadow: 0 1px 0 #fff - -//== Code -// -//## - -// $code-color: #c7254e -// $code-bg: #f9f2f4 - -// $kbd-color: #fff -// $kbd-bg: #333 - -// $pre-bg: #f5f5f5 -// $pre-color: $gray-dark -// $pre-border-color: #ccc -// $pre-scrollable-max-height: 340px - -//== Type -// -//## - -//* Text muted color -// $text-muted: $gray-light -//* Abbreviations and acronyms border color -// $abbr-border-color: $gray-light -//* Headings small color -// $headings-small-color: $gray-light -//* Blockquote small color -// $blockquote-small-color: $gray-light -//* Blockquote font size -// $blockquote-font-size: ($font-size-base * 1.25) -//* Blockquote border color -// $blockquote-border-color: $gray-lighter -//* Page header border color -// $page-header-border-color: $gray-lighter - -//== Miscellaneous -// -//## - -//* Horizontal line color. -// $hr-border: $gray-lighter - -//* Horizontal offset for forms and lists. -// $component-offset-horizontal: 180px diff --git a/assets/css/src/lustige-styles.scss b/assets/css/src/lustige-styles.scss deleted file mode 100644 index 4559f6c..0000000 --- a/assets/css/src/lustige-styles.scss +++ /dev/null @@ -1,891 +0,0 @@ -// customize bootstrap variables here: -@import "fonts"; -@import "variables"; -@import "../lib/bootstrap"; - -// primary plan: video -//$bg: '../img/video-blur.jpg'; -//$bgscale: true; - -// fallback-plan: 31C3 artwork based background -$bg: '../img/bg.png'; -$bgscale: false; - -$max-width: $container-lg; - -/* main layout */ -html { - width: 100%; - overflow: hidden; - overflow-y: scroll; - - /* poor support - but for the future! */ - hyphens: auto; - -webkit-hyphens: auto; - -moz-hyphens: auto; - -ms-hyphens: auto; -} - -body { - padding-top: $navbar-height; - width: 100%; - overflow: hidden; - overflow-y: initial; - margin-bottom: 55px; -} - -.top-space { - padding-top: 40px; -} - -h1 { - color: $gray-dark; - margin-top: 60px; - line-height: 0.9em; -} - -h1 + h2 { - margin-top: -0.2em; -} - -h2 { - margin-top: 1.2em; - .date { - margin-right: 0.2em; - color: $brand-primary; - font-size: 16px; - } -} - -p { - margin-bottom: 0.5em; - .fa { - display: inline; - color: $gray-dark; - font-size: 1.1em; - } -} - -.container, .container-fluid { - max-width: $max-width; - padding: 0; -} - -.label { - display: inline-block; - border-radius: $border-radius-base; - padding-top: 0.3em; - padding-bottom: 0.1em; - font-size: 14px; - font-weight: normal; - margin-right: 2px; - margin-bottom: $padding-small-vertical; -} - -/* navigation bar */ -.navbar { - border: none; - - background-image: url($bg); - background-position: 50% -9px; - - padding: 0 15px; - - body.rooms & { - background-image: none; - } - - .navbar-brand { - font-size: 24px; - padding: 12px 15px; - } - - .btn.btn-default { - padding: 0.2em; - height: 1.8em; - max-width: 2em; - &:hover, &:focus, &:active { - color: $brand-primary; - background-color: #fff; - border-color: #fff; - } - } - - .navbar-form { - margin-top: 0.8em; - margin-bottom: 0.8em; - } - - input { - height: 1.8em; - padding-top: 6px; - } - - .fa { - min-width: 20px; - font-size: 1.3em; - } -} - -/* breadcrumb */ -#breadcrumb { - background-color: $gray; - font-size: 16px; - ol { - max-width: $max-width; - padding: $padding-small-vertical $padding-large-horizontal; - margin-bottom: 0; - li + li:before { - font-family: FontAwesome; - font-size: 9px; - } - } -} - -/* browse-by-buttons at homescreen */ -.browse-button-bar { - text-align: center; - margin-top: $padding-large-vertical; - margin-bottom: $padding-large-vertical; - .btn-lg { - margin: $padding-small-vertical $padding-small-horizontal; - } - .fa { - font-size: 1.3em; - } -} - -/* news */ -h1 + .news-item { - margin-top: -0.5em; -} - -/* recording detail site */ -.nav.nav-tabs.nav-justified { - margin-top: 16px; - font-weight: bold; - font-size: 24px; - background-color: $gray; - - & > li { - a { - padding: $padding-large-vertical 0 0 0; - margin-bottom: 0; - border: none; - &:hover, &:focus, &:active { - background-color: #fff; - } - &:hover, &:focus, &:active { - border: none; - } - } - &.active > a { - color: white; - background-color: $gray-dark; - } - } -} - -.player-wrap { - background-color: $gray-dark; -} - -.tab-content { - background-color: $gray-dark; - - .mejs-container { - margin: auto; - } - - #switcher { - padding: $padding-large-horizontal; - - h3 { - color: $gray-light; - &:first-child { - margin-top: 0; - } - } - - p { - color: white; - font-size: 120%; - } - - ul { - list-style-type: none; - padding: 0; - li { - min-width: 49%; - display: inline-block; - } - a { - margin: 0 $padding-xs-horizontal; - } - } - - .filetype { - text-transform: uppercase; - margin-right: $padding-small-horizontal; - color: #000; - background-color: #fff; - min-width: 4em; - } - - a:hover, a:focus, a:active { - text-decoration: none; - } - } - - #feedback { - padding: 20px; - - label { color: white; } - h3 { display: none; color: white; } - iframe { display: none; } - - input[type="radio"], input[type="checkbox"] { - margin-top: 0; - } - - .col { - padding: 0 30px; - } - } -} - -ul.metadata { - list-style: none; - padding: $padding-small-vertical 0; - text-align: center; - border-bottom: 1px solid $gray; - li { - display: inline-block; - min-width: 24.5%; - padding: $padding-small-vertical $padding-small-horizontal; - } - .fa { - margin-right: $padding-xs-horizontal; - } -} - -/* footer */ -footer { - padding: 0.7em; - margin-top: 2em; - color: $gray-light; - background-color: $gray-dark; - text-align: center; - - position: fixed; - bottom: 0; - width: 100%; -} - -/* links */ -a.inverted { - color: $gray-lighter; -} - -/* buttons */ -.btn-lg { - padding-top: 5px; - padding-bottom: 5px; - .fa { - /* nicely positioned icons on large buttons */ - position: relative; - top: 0.15em; - margin-right: 0.3em; - } -} - -/* banner area */ -@if $bgscale { - @media all and (min-width: 1920px) { - .banner { - background-repeat: no-repeat; - background-size: 100% auto; - } - } -} -.banner { - width: 100%; - height: 280px; - overflow: hidden; - text-align: center; - background-image: url($bg); - background-position: 50% 50%; - background-repeat: repeat-x; - position: relative; - - .logo { - position: relative; - z-index: 1; - display: inline-block; - margin-top: 37px; - } -} - -.rooms { - .room-group { - background-color: $gray-darker; - overflow: hidden; - margin-bottom: 2em; - - &.recordings { - text-align: center; - li a { - color: $brand-primary; - font-size: 4em; - - &:hover { - text-decoration: none; - } - } - } - - h2 { - margin: 0.6em 1.2em 0.3em; - } - - ul { - list-style-type: none; - padding: 0 0 5px 0; - margin: 0 -5px; - } - - li { - padding: 5px !important; - - &.sendezentrum a .title { - left: 240px; - text-shadow: none; - font-weight: normal; - } - - a { - background-color: $gray-dark; - color: white; - display: block; - position: relative; - width: 100%; - height: 120px; - padding: .5em; - text-align: center; - font-size: 2.75em; - - &:hover { - background-color: #1a1a1a; - text-decoration: none; - } - - .teaser { - position: absolute; - left: 0; - top: 0; - } - - .title { - position: absolute; - top: 40px; - left: 60px; - - font-weight: bold; - text-shadow: - $gray-dark -3px -3px 5px, - $gray-dark 3px 3px 5px, - $gray-dark -3px 3px 5px, - $gray-dark 3px -3px 5px; - padding-bottom: 20px; - } - - .program-teaser { - color: $gray-lighter; - text-align: left; - position: absolute; - left: 230px; - font-size: 14px; - - strong { - display: block; - } - .next-talk { - display: block; - margin-top: 10px; - } - - .hidden { visibility: hidden; } - } - } - } - } -} - -.room { - - &.lq .player-wrap { - padding: 32px 0; - } - - &.audio .player-wrap { - padding: 64px 32px; - } - - &.slides .player-wrap .slide-audio { - padding: 32px 32px; - } - - .click-to-irc { - background-image: url(../img/irc-soft.png); - height: 376px; - border: 2px solid $gray-dark; - - text-align: center; - cursor: pointer; - - .activator { - margin-top: 120px; - font-size: 60px; - a { - font-size: 40px; - } - - a.twitterlink { - font-size: 30px; - } - } - iframe { display: none; } - - &.active { - background-image: none; - .activator { display: none; } - iframe { display: block; } - } - - } - -} -.mejs-container { - .mejs-subs-line { - position: absolute; - bottom: 50px; - height: 85px; - width: 100%; - background-color: rgba(white, .85); - color: black; - font-size: 65px; - text-align: center; - opacity: 0; - display: none; - padding: 5px 0; - overflow: hidden; - - .silence { - font-size: 49%; - opacity: 0; - display: none; - color: #555; - } - &.silence .silence { opacity: 1; display: block; } - - .error { - color: red; - opacity: 0; - display: none; - } - &.error .error { opacity: 1; display: block; } - } - - .mejs-controls { - $factor: 1.5; - visibility: visible !important; - - .mejs-subs-button > span { - cursor: pointer; - color: #e3e3e3; - font-size: 28px; - padding-top: 5px; - padding-left: 5px; - } - - height: 12px + 18px * $factor; - div { - width: 26px * $factor; - height: 26px * $factor; - } - .mejs-button button { - background-size: 144px * $factor 32px * $factor !important; - width: 16px * $factor; - height: 16px * $factor; - } - .mejs-playpause-button { - &.mejs-play button { - background-position: 0 0; - } - &.mejs-pause button { - background-position: 0 -16px * $factor; - } - } - .mejs-volume-button { - &.mejs-mute button { - background-position: -16px * $factor -16px * $factor; - } - &.mejs-unmute button { - background-position: -16px * $factor 0; - } - .mejs-volume-slider { - left: 4px * $factor; - } - } - .mejs-fullscreen-button button { - background-position: -32px * $factor 0; - } - - $top: $factor * 12px - 12px; - .mejs-time { - padding-top: $top + 8px; - } - .mejs-horizontal-volume-slider { - width: 110px; - top: $top; - .mejs-horizontal-volume-total { - width: 100px; - } - } - } - - &.mejs-audio { - margin: 0 auto; - } - .mejs-overlay-loading { - background: none !important; - } -} - -/* events overview */ -.event-previews { - .event-preview { - margin: 16px 0; - display: block; - clear: both; - height: 120px; - color: black; - - &.released { - background-color: #96d600; - } - - &.live { - background-color: $brand-primary; - .metadata li, h3 { - color: white; - } - - &:hover { - .metadata li, h3 { - color: white; - } - - h3 { - text-decoration: underline; - } - } - } - - &.template { display: none; } - - .video-thumbnail { - float: left; - height: 120px; - } - - &:hover, &:focus, &:active { - text-decoration: none; - .metadata li, h3 { - color: $link-color; - } - } - - - .metadata { - text-align: left; - border: none; - - li { - padding: $padding-xs-vertical; - padding-right: $padding-xs-horizontal; - color: $gray-dark; - min-width: inherit; - } - } - - .caption { - margin-left: 220px; - padding-left: $padding-large-horizontal; - - h3 { - margin-top: 0; - } - } - } -} - -/* and now for medium screens: */ -@media all and (min-width: $screen-sm-min) and (max-width: $container-desktop) { - - - /* events overview */ - .event-previews .event-preview { - h3 { - font-size: 17px; - } - } - -} - -/* and now for small screens: */ -@media all and (max-width: $screen-xs-max) { - - /* main layout */ - body { - padding-top: 0; - } - - h1 { - font-size: 34px; - margin-top: 30px; - } - h2 { - font-size: 23px; - } - - /* large buttons */ - .btn-lg, .btn-group-lg>.btn { - font-size: 23px; - } - - footer { - position: initial; - } - - /* navigation bar */ - .navbar { - position: initial; - & > .container-fluid { - display: inline-table; - width: 100%; - } - form { - width: 100%; - } - .navbar-form.navbar-right:last-child { - margin-right: 0; - } - .navbar-header, .navbar-form { - padding: 0; - margin-top: 0; - margin-bottom: 0; - min-width: 95px; - } - .input-group { - margin-bottom: $padding-small-vertical; - } - .button-wrapper { - text-align: right; - margin-top: $padding-large-vertical; - } - } - - /* banner area */ - .banner { - height: 230px; - img { - height: 120px; - width: auto; - } - .titlebar { - //padding-top: 20px; - } - } - - /* events overview */ - .event-preview { - /* one column layout */ - width: 100%; - } - - /* tabs */ - .nav.nav-tabs.nav-justified > li { - a { - font-size: 20px; - padding-top: 5px; - } - &.active > a { - background-color: $gray; - } - } - - /* events overview */ - .event-previews { - .event-preview { - height: auto; - - .video-thumbnail { - margin-top: 1.5em; - height: 90px; - width: 120px; - } - - .caption { - margin-left: 120px; - padding-left: $padding-small-horizontal; - h3 { - height: 90px; - vertical-align: middle; - display: table-cell; - margin-top: 0; - font-size: 17px; - } - } - .metadata { - position: relative; - left: -130px; - padding: 0; - margin-bottom: 3px; - white-space: nowrap; - margin-bottom: $padding-small-vertical; - } - } - } - - /* event overview for searches & tags */ - .event-previews-tags .event-preview, - .event-previews-search .event-preview { - h3 { - font-size: 17px; - } - .conference-logo { - width: 60px; - } - .caption { - margin-left: 60px; - } - } - - .rooms .room-group li.sendezentrum a { - .teaser { display: none; } - .title { - position: static; - margin-top: 10px; - text-align: center; - } - } -} - -.program { - $now: red; - $hightlight: #96d600; - $daychange: $brand-primary; - - &.scroll-container { - overflow: hidden; - overflow-x: scroll; - } - - .scroll-element { - position: relative; - } - - .room { - overflow: hidden; - } - - .now { - position: absolute; - left: 0; - width: 150px; - height: 500px; - background-color: transparentize($now, 0.5); - font-size: 14px; - - span { - display: block; - position: absolute; - right: -25px; - color: red; - } - } - - .block { - overflow: hidden; - float: left; - height: 100px; - - /* and now for small screens: */ - @media all and (max-width: $screen-xs-max) { - height: 75px; - } - - - padding: 10px; - - border: 1px solid white; - - h3 { - color: white; - margin: 0; - padding: 0; - - /* and now for small screens: */ - @media all and (max-width: $screen-xs-max) { - font-size: 22px; - } - } - - h4 { - margin: 3px 0; - color: $gray-lighter; - } - - h5 { - color: $gray-lighter; - } - - a { - color: white; - } - - &.event h3 { - //height: 48px; - overflow: hidden; - } - - &.gap { - background-image: url(../img/stripes/gap.png); - background-color: rgba(255,255,255,0.3); - } - - &.daychange { - background-image: url(../img/stripes/gap.png); - background-color: transparentize($daychange, 0.3) !important; - } - - &.pause { - background-color: rgba(255,255,255,0.3); - } - } - - .room.highlight .block { - background-color: $hightlight; - } -} - - -.e404 { - text-align: center; - - h1 { - margin: 20px 0 40px 0; - } - img { max-width: 100%; } -} |