railsbricks-reloaded 3.2.1

data/lib/railsbricks/assets/stylesheets/application.scss

@@ -0,0 +1,6 @@
+/*
+ * Overwritten by RailsBricks
+ *
+ *= require_self
+ */
+@import "railsbricks_custom";

data/lib/railsbricks/assets/stylesheets/railsbricks_custom.scss

@@ -0,0 +1,562 @@
+//***********************************************************
+// BOOTSTRAP VARIABLES OVERRIDES
+
+// Color system
+$brand-primary: BRICK_BRAND_COLOR;
+$brand-success: #5cb85c;
+$brand-warning: #f0ad4e;
+$brand-danger: #d9534f;
+$brand-info: #5bc0de;
+
+// Body scaffolding
+$body-bg: BRICK_BODY_COLOR;
+$text-color: BRICK_TEXT_COLOR;
+$link-color: $brand-primary;
+$link-hover-color: darken($link-color, 15%);
+
+// Typography
+BRICK_FONT_IMPORT
+$font-family-sans-serif: BRICK_FONT_SANS_SERIF;
+$font-family-serif: BRICK_FONT_SERIF;
+$font-family-monospace: BRICK_FONT_MONOSPACE;
+$font-family-base: BRICK_FONT_BASE;
+$font-size-base: 14px;
+
+// Headings
+$headings-font-family: $font-family-base;
+$headings-font-weight: 700;
+$headings-color: inherit;
+
+// Code blocks
+$code-color: #c7254e;
+$code-bg: #f9f2f4;
+$pre-color: #373737;
+$pre-bg: #f5f5f5;
+$pre-border-color: #cccccc;
+
+// Components: Padding
+$padding-base-vertical: 6px;
+$padding-large-vertical: 10px;
+$padding-small-vertical: 5px;
+$padding-base-horizontal: 12px;
+$padding-large-horizontal: 16px;
+$padding-small-horizontal: 10px;
+
+// Components: Rounded corners
+$border-radius-base: 4px;
+$border-radius-large: 6px;
+$border-radius-small: 3px;
+
+// Components: Active state
+$component-active-color: #ffffff;
+$component-active-bg: $brand-primary;
+
+// Components: Carets
+$caret-width-base: 4px;
+$caret-width-large: 5px;
+
+// Buttons: Global
+$btn-font-weight: normal;
+$btn-link-disabled-color: #cccccc;
+
+// Buttons: Default
+$btn-default-color: #ffffff;
+$btn-default-bg: #bbbbbb;
+$btn-default-border: #cccccc;
+
+// Buttons: Primary
+$btn-primary-color: $btn-default-color;
+$btn-primary-bg: $brand-primary;
+$btn-primary-border: darken($btn-primary-bg, 5%);
+
+// Buttons: Info
+$btn-info-color: $btn-default-color;
+$btn-info-bg: $brand-info;
+$btn-info-border: darken($btn-info-bg, 5%);
+
+// Buttons: Warning
+$btn-warning-color: $btn-default-color;
+$btn-warning-bg: $brand-warning;
+$btn-warning-border: darken($btn-warning-bg, 5%);
+
+// Buttons: Danger
+$btn-danger-color: $btn-default-color;
+$btn-danger-bg: $brand-danger;
+$btn-danger-border: darken($btn-danger-bg, 5%);
+
+// Form states and alerts
+$state-success-text: #468847;
+$state-success-bg: #dff0d8;
+$state-success-border: darken($state-success-bg, 5%);
+
+$state-warning-text: #c09853;
+$state-warning-bg: #fcf8e3;
+$state-warning-border: darken($state-warning-bg, 3%);
+
+$state-danger-text: #b94a48;
+$state-danger-bg: #f2dede;
+$state-danger-border: darken($state-danger-bg, 3%);
+
+$state-info-text: #3a87ad;
+$state-info-bg: #d9edf7;
+$state-info-border: darken($state-info-bg, 7%);
+
+// Alerts: Base styles
+$alert-padding: 15px;
+$alert-border-radius: $border-radius-base;
+$alert-link-font-weight: bold;
+
+// Alerts: Warning
+$alert-warning-text: $state-warning-text;
+$alert-warning-bg: $state-warning-bg;
+$alert-warning-border: $state-warning-border;
+
+// Alerts: Success
+$alert-success-text: $state-success-text;
+$alert-success-bg: $state-success-bg;
+$alert-success-border: $state-success-border;
+
+// Alerts: Danger
+$alert-danger-text: $state-danger-text;
+$alert-danger-bg: $state-danger-bg;
+$alert-danger-border: $state-danger-border;
+
+//Alerts: Info
+$alert-info-text: $state-info-text;
+$alert-info-bg: $state-info-bg;
+$alert-info-border: $state-info-border;
+
+// Navbar: Base styles
+$navbar-height: 50px;
+$navbar-margin-bottom: 4px;
+$navbar-padding-horizontal: 15px;
+$navbar-padding-vertical: 13px;
+$navbar-border-radius: 0px;
+
+// Navbar: Default navbar
+// -> Basics
+$navbar-default-color: #777777;
+$navbar-default-bg: #f8f8f8;
+$navbar-default-border: darken($navbar-default-bg, 7%);
+// -> Links
+$navbar-default-link-color: #777777;
+$navbar-default-link-hover-color: #333333;
+$navbar-default-link-hover-bg: $navbar-default-bg;
+$navbar-default-link-active-color: #555555;
+$navbar-default-link-active-bg: darken($navbar-default-bg, 7%);
+$navbar-default-link-disabled-color: #cccccc;
+$navbar-default-link-disabled-bg:$navbar-default-bg;
+// -> Brand
+$navbar-default-brand-color: $navbar-default-link-color;
+$navbar-default-brand-hover-color: darken($navbar-default-brand-color, 10%);
+$navbar-default-brand-hover-bg: $navbar-default-bg;
+// -> Toggle
+$navbar-default-toggle-hover-bg: #dddddd;
+$navbar-default-toggle-icon-bar-bg: #cccccc;
+$navbar-default-toggle-border-color: #dddddd;
+
+// Navbar: Inverted navbar
+// -> Basics
+$navbar-inverse-color: #eeeeee;
+$navbar-inverse-bg: #222222;
+$navbar-inverse-border: darken($navbar-inverse-bg, 7%);
+// -> Links
+$navbar-inverse-link-color: #eeeeee;
+$navbar-inverse-link-hover-color: #ffffff;
+$navbar-inverse-link-hover-bg: $navbar-inverse-bg;
+$navbar-inverse-link-active-color: #ffffff;
+$navbar-inverse-link-active-bg: darken($navbar-inverse-bg, 7%);
+$navbar-inverse-link-disabled-color: #444444;
+$navbar-inverse-link-disabled-bg:$navbar-inverse-bg;
+// -> Brand
+$navbar-inverse-brand-color: $navbar-inverse-link-color;
+$navbar-inverse-brand-hover-color: #ffffff;
+$navbar-inverse-brand-hover-bg: $navbar-inverse-bg;
+// -> Toggle
+$navbar-inverse-toggle-hover-bg: #333333;
+$navbar-inverse-toggle-icon-bar-bg: #ffffff;
+$navbar-inverse-toggle-border-color: #333333;
+
+// Nav: Default nav
+// -> Common values
+$nav-link-padding: 10px 15px;
+$nav-link-hover-bg: #eeeeee;
+$nav-disabled-link-color: #cccccc;
+$nav-disabled-link-hover-color: #cccccc;
+$nav-open-link-hover-color: #ffffff;
+$nav-open-caret-border-color: #ffffff;
+// -> Pills
+$nav-pills-active-link-hover-color: #ffffff;
+$nav-pills-active-link-hover-bg: $component-active-bg;
+// -> Tabs
+$nav-tabs-border-color: #dddddd;
+$nav-tabs-link-hover-border-color: #eeeeee;
+$nav-tabs-active-link-hover-color: #bbbbbb;
+$nav-tabs-active-link-hover-bg: $body-bg;
+$nav-tabs-active-link-hover-border-color: #dddddd;
+$nav-tabs-justified-link-border-color: #dddddd;
+$nav-tabs-justified-active-link-border-color: $body-bg;
+
+// Tables
+// -> Default padding for <th>s and <td>s
+$table-cell-padding: 8px;
+// -> Default padding cells in .table-condensed
+$table-condensed-cell-padding: 5px;
+// -> Default background color used for all tables.
+$table-bg: $body-bg;
+// -> Background color used for .table-striped.
+$table-bg-accent: #f9f9f9;
+// -> Background color used for .table-hover.
+$table-bg-hover: #f5f5f5;
+// -> Border color for table and cell borders.
+$table-border-color: #dddddd;
+
+// Forms
+// -> Inputs
+$input-color: $text-color; // Text color for <input>s
+$input-bg: #ffffff; // <input> background color
+$input-border: #cccccc; // <input> border color
+$input-border-radius: $border-radius-base; // <input> border radius
+$input-color-placeholder: #bbbbbb; // Placeholder text color
+// -> Input states
+$input-border-focus: #66afe9; // Border color for inputs on focus
+$input-bg-disabled: #dddddd; // <input disabled> background color
+// -> Input sizes
+$input-height-base: 38px; // Default .form-control height
+$input-height-large: 46px; // Large .form-control height
+$input-height-small: 28px; // Small .form-control height
+// -> Legend
+$legend-color: #aaaaaa;
+$legend-border-color: #e5e5e5;
+// -> Input groups
+$input-group-addon-bg: #cccccc; // Background color for textual input addons
+$input-group-addon-border-color: $input-border; // Border color for textual input addons
+
+// Dropdowns
+// -> Dropdown menu
+$dropdown-bg: #ffffff; // Dropdown menu background color
+$dropdown-border: #373737; // Dropdown menu border color
+$dropdown-fallback-border: #cccccc; // Dropdown menu border color for IE8
+$dropdown-caret-color: #dddddd; // Indicator arrow for showing an element has a dropdown
+$dropdown-divider-bg: #e5e5e5; // Dropdown divider top border color
+$dropdown-header-color: #dddddd; // Text color for headers within dropdown menus
+// -> Dropdown items
+$dropdown-link-color: $text-color; // Dropdown text color
+$dropdown-link-hover-color: darken($dropdown-link-color,5%); // Hovered dropdown menu entry text color
+$dropdown-link-hover-bg: #f5f5f5; // Hovered dropdown menu entry text color
+$dropdown-link-active-color: $component-active-color; // Active dropdown menu entry text color
+$dropdown-link-active-bg: $component-active-bg; // Active dropdown menu entry background color
+$dropdown-link-disabled-color: #dddddd; // Disabled dropdown menu entry background color
+
+// Panels and wells
+// -> Common panel styles
+$panel-bg: #ffffff;
+$panel-inner-border: #dddddd; // Border color for elements within panels
+$panel-border-radius: $border-radius-base;
+$panel-footer-bg: #f5f5f5;
+// -> Contextual panel colors
+// --> Default
+$panel-default-text: #373737;
+$panel-default-border: #dddddd;
+$panel-default-heading-bg: #f5f5f5;
+// --> Primary
+$panel-primary-text: #ffffff;
+$panel-primary-border: $brand-primary;
+$panel-primary-heading-bg: $brand-primary;
+// --> Success
+$panel-success-text: $state-success-text;
+$panel-success-border: $state-success-border;
+$panel-success-heading-bg: $state-success-bg;
+// --> Info
+$panel-info-text: $state-info-text;
+$panel-info-border: $state-info-border;
+$panel-info-heading-bg: $state-info-bg;
+// --> Warning
+$panel-warning-text: $state-warning-text;
+$panel-warning-border: $state-warning-border;
+$panel-warning-heading-bg: $state-warning-bg;
+// --> Danger
+$panel-danger-text: $state-danger-text;
+$panel-danger-border: $state-danger-border;
+$panel-danger-heading-bg: $state-danger-bg;
+// -> Wells
+$well-bg: #f5f5f5;
+
+// Jumbotron
+$jumbotron-padding: 30px;
+$jumbotron-bg: #cccccc;
+$jumbotron-font-size: ceil($font-size-base * 1.5);
+$jumbotron-color: $text-color;
+$jumbotron-heading-color: $headings-color;
+
+// Carousel
+$carousel-text-shadow: 0px 1px 2px #373737;
+$carousel-control-color: #ffffff;
+$carousel-caption-color: #ffffff;
+$carousel-indicator-border-color: #ffffff;
+$carousel-indicator-active-bg: #ffffff;
+
+// Labels
+$label-color: #ffffff; // Default label text color
+$label-link-hover-color: #ffffff; // Default text color of a linked label
+$label-default-bg: #cccccc; // Default label background color
+$label-primary-bg: $brand-primary; // Primary label background color
+$label-success-bg: $brand-success; // Success label background color
+$label-info-bg: $brand-info; // Info label background color
+$label-warning-bg: $brand-warning; // Warning label background color
+$label-danger-bg: $brand-danger; // Danger label background color
+
+// Close button
+$close-font-weight: bold;
+$close-color: #000000;
+$close-text-shadow: 0px 1px 0px #ffffff;
+
+// Type
+$text-muted: #bbbbbb; // Text muted color
+$abbr-border-color: #cccccc; // Abbreviations and acronyms border color
+$headings-small-color: BRICK_HEADINGS_SMALL_COLOR; // Headings small color
+$blockquote-small-color: #cccccc; // Blockquote small color
+$blockquote-border-color: #eeeeee; // Blockquote border color
+$page-header-border-color: #eeeeee; // Page header border color
+
+// Other
+$hr-border: #cccccc; // Horizontal line color
+$component-offset-horizontal: 180px; // Horizontal offset for forms and lists
+
+//***********************************************************
+@import "bootstrap-sprockets";
+@import "bootstrap";
+@import "font-awesome-sprockets";
+@import "font-awesome";
+
+//***********************************************************
+// CLASSES FOR VISUAL TESTING
+.test1 {
+  background-color: yellow;
+}
+.test2 {
+  background-color: red;
+}
+.test3 {
+  background-color: blue;
+}
+//***********************************************************
+
+//***********************************************************
+// APPLICATION-WIDE
+html,body {
+  height: 100%;
+}
+
+#wrap {
+  min-height: 100%;
+  padding-bottom: 120px;
+}
+
+blockquote{
+  font-size: $font-size-base;
+  font-style: italic;
+}
+
+.monospaced-control{
+  font-family: $font-family-monospace;
+  font-size: 12px;
+}
+
+.center-block{
+  margin-left: auto;
+  margin-right: auto;
+}
+//***********************************************************
+
+//***********************************************************
+// SPACING
+$space-lg: 60px;
+$space-md: 40px;
+$space-sm: 20px;
+$space-xs: 10px;
+
+.space-top-lg{
+  margin-top: $space-lg;
+}
+.space-top-md{
+  margin-top: $space-md;
+}
+.space-top-sm{
+  margin-top: $space-sm;
+}
+.space-top-xs{
+  margin-top: $space-xs;
+}
+
+.space-bottom-lg{
+  margin-bottom: $space-lg;
+}
+.space-bottom-md{
+  margin-bottom: $space-md;
+}
+.space-bottom-sm{
+  margin-bottom: $space-sm;
+}
+.space-bottom-xs{
+  margin-bottom: $space-xs;
+}
+
+.space-left-lg{
+  margin-left: $space-lg;
+}
+.space-left-md{
+  margin-left: $space-md;
+}
+.space-left-sm{
+  margin-left: $space-sm;
+}
+.space-left-xs{
+  margin-left: $space-xs;
+}
+
+.space-right-lg{
+  margin-right: $space-lg;
+}
+.space-right-md{
+  margin-right: $space-md;
+}
+.space-right-sm{
+  margin-right: $space-sm;
+}
+.space-right-xs{
+  margin-right: $space-xs;
+}
+
+.space-all-lg{
+  margin: $space-lg;
+}
+.space-all-md{
+  margin: $space-md;
+}
+.space-all-sm{
+  margin: $space-sm;
+}
+.space-all-xs{
+  margin: $space-xs;
+}
+
+//***********************************************************
+
+//***********************************************************
+// FLASH MESSAGES
+.alert {
+  margin-top: -4px;
+}
+//***********************************************************
+
+//***********************************************************
+// NAVBAR
+.navbar-brand {
+  font-size: inherit;
+}
+//***********************************************************
+
+//***********************************************************
+// ERRORS
+#error_explanation {
+  color: $brand-danger;
+  ul {
+    margin-left: 8px;
+    padding-left: 8px;
+  }
+
+  h2 {
+    display:none;
+  }
+}
+
+.error-text {
+  color: $brand-danger;
+}
+
+.field_with_errors {
+  .form-control {
+    border: 1px solid $brand-danger;
+  }
+  label {
+    color: $brand-danger;
+  }
+}
+//***********************************************************
+
+//***********************************************************
+// IMAGES
+img {
+  @extend .img-responsive;
+}
+
+.img-inline{
+  display: inline;
+}
+
+.img-block{
+  display: block;
+}
+
+.img-framed{
+  border: 1px solid #cccccc;
+  box-shadow: 2px 2px 6px #dddddd;
+  border-radius: 4px;
+}
+
+.img-title{
+  color: #bbbbbb;
+  font-size: 0.9em;
+  font-style: italic;
+  margin-top: 4px;
+}
+
+//***********************************************************
+
+//***********************************************************
+// VIDEO
+.js-video {
+  height: 0;
+  padding-top: 25px;
+  padding-bottom: 67.5%;
+  margin-bottom: 10px;
+  position: relative;
+  overflow: hidden;
+  box-shadow: 3px 3px 5px #cccccc;
+  border: 3px solid #373737;
+
+}
+
+.js-video.widescreen {
+  padding-bottom: 57.25%;
+}
+
+.js-video.vimeo {
+  padding-top: 0;
+}
+
+.js-video embed, .js-video iframe, .js-video object, .js-video video {
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+}
+//***********************************************************
+
+
+//***********************************************************
+// FOOTER
+#footer {
+  background-color: BRICK_FOOTER_BACKGROUND_COLOR;
+  color: BRICK_FOOTER_COLOR;
+  height: 100px;
+  margin-top: -100px;
+  letter-spacing: 1px;
+
+  .footer-first-row {
+    padding-top: 20px;
+  }
+}
+//***********************************************************