furatto 0.0.1 → 0.0.2

data/vendor/assets/stylesheets/furatto/_tooltips.scss

@@ -39,18 +39,6 @@
   margin-left: -3px;
 }
 
-.tooltip-inner {
-  max-width: 200px;
-  padding: 3px 8px;
-  color: $white;
-  text-align: center;
-  text-decoration: none;
-  background-color: #000000;
-  -webkit-border-radius: 4px;
-     -moz-border-radius: 4px;
-          border-radius: 4px;
-}
-
 .tooltip-arrow {
   position: absolute;
   width: 0;
@@ -135,9 +123,9 @@
 .tooltip-inner {
   background-color: $inverse;
   line-height: 18px;
-  padding: 12px 5px;
+  padding: 12px 14px;
   text-align: center;
-  width: 180px;
   @include border-radius(6px);
+  color: $white;
 }
 

data/vendor/assets/stylesheets/furatto/_typography.scss

@@ -9,20 +9,13 @@
 
 p {
   margin: 0 0 $base-line-height / 2;
-  color: #777;
+  text-rendering: optimizeLegibility;
+  line-height: 1.6;
 }
 
 /* Emphasis & miscelaneous */
 /* ----------------------- */
 
-small { 
-  font-size: 85%; 
-}
-
-strong { 
-  font-weight: bold; 
-}
-
 em { 
   font-style: italic; 
 }
@@ -30,7 +23,7 @@ em {
 //Utility classes
 
 .muted {
-  color: $light-gray;
+  color: $muted-color;
 }
 
 .text-warning {
@@ -65,11 +58,10 @@ em {
 //--------------------------------
 
 h1,h2,h3,h4,h5,h6 {
-  margin: $base-line-height 0;
+  margin: 0 0 10px 0;
   font-family: inherit;
   font-weight: 500;
   line-height: $base-line-height;
-  color: $headings-color;
   text-rendering: optimizelegibility; // Fix the character spacing for headings
 
   small {
@@ -80,7 +72,8 @@ h1,h2,h3,h4,h5,h6 {
 }
 
 .light {
-  font-weight: 200;
+  font-weight: 300;
+  color: $light-color;
 }
 
 /* Headers definition */
@@ -90,8 +83,8 @@ h1, h2, h3 {
   line-height: $base-line-height * 2;
 }
 
-h5, h6 {
-  text-transform: uppercase;
+h4 {
+  line-height: $base-line-height + 10;
 }
 
 h1 { 
@@ -132,6 +125,7 @@ ol ol,
 ol ul {
   margin-bottom: 0;
 }
+
 li {
   line-height: $base-line-height;
 }
@@ -148,58 +142,39 @@ ul.inline,
 ol.inline {
   margin-left: 0;
   list-style: none;
-  > li {
-    display: inline-block;
-    padding-left: 5px;
-    padding-right: 5px;
-  }
-}
+  margin-bottom: 10px;
+  margin-top: 10px;
 
-//Color Lists
-.color-list {
-  margin-left: 0;
-  list-style: none;
-  > li {
+   li {
     display: inline-block;
-    height: $color-list-item-height;
-    width: $color-list-item-width;
-    background: #222;
-    cursor: pointer;
-
-    &.red {
-      background: #ec7063;
-    }
-
-    &.green {
-      background: #1abc9c;
-    }
+    padding-left: 8px;
+    padding-right: 8px;
 
-    &.blue {
-      background: #3498db;
-    }
+    a.btn {
+      color: #FFF;
 
-    &.aero {
-      background: #9cc2cb;
+      &:hover {
+        text-decoration: none;
+      }
     }
 
-    &.grey {
-      background: #95a5a6;
-    }
+    a { 
+      color: $link-color;
 
-    &.orange {
-      background: #f39c12;
-    }
+      &.active {
+        background: #efefef;
+        color: $muted-color;
+        padding: 10px;
+        @include border-radius(3px);
 
-    &.yellow {
-      background: #f1c40f;
-    }
+        &:hover {
+          text-decoration: none;
+        }
+      }
 
-    &.pink {
-      background: #af7ac5;
-    }
-
-    &.purple {
-      background: #8677a7;
+      &:hover {
+        text-decoration: underline;
+      }
     }
   }
 }
@@ -228,35 +203,13 @@ dd {
   }
 }
 
-.inline {
-  display: inline-block;
-}
-
-//Color states
-.info {
-  color: $dark-blue;
-}
-
-.success {
-  color: $dark-green;
-}
-
-.warning {
-  color: $dark-orange;
-}
-
-.error {
-  color: $dark-red;
-}
-
-
 //Inline code
 .code {
   padding: 2px 4px;
-  color: #d14;
+  color: $code-color;
   white-space: nowrap;
-  background-color: #f7f7f9;
-  border: 1px solid #e1e1e8;
+  background-color: $code-bg;
+  font-weight: normal;
   font-size: $base-font-size;
   @include border-radius(3px);
 }
@@ -264,3 +217,8 @@ dd {
 i.nomargin {
   margin-right: 0 !important;
 }
+
+//Uppercase
+.text-uppercase {
+  text-transform: uppercase;
+}

data/vendor/assets/stylesheets/furatto/_variables.scss

@@ -4,258 +4,255 @@
 /**
  * Variables for manage the different styles
  * 
- * Designed and built @kurenn  
+ * Designed and built @kurenn and @eldelentes  
  */
 
-/* Body */
-/* ---- */
-$bg-color: #fefefe !default;
-/*$bg-color: #ebe7df;*/
-
-/* Fonts */
-/* ----- */
-$font-family: 'Lato', 'Helvetica Neue';
-$base-font-size: 16px;
-$base-line-height: 20px;
-$base-font-weight: 500;
-
-/* Border */
-/* ------ */
-$base-radius: 2px;
-
-/* Colors */
-/* ------ */
-
-//Reds
-$red: #e74c3c;
-$dark-red: #C0392B;
-
-//Hipsters
-$info: #1ABC9C;
-$dark-info: #16A085;
-
-//Inverse
-$dark-inverse: #2C3E50;
-$inverse: #34495E;
-
-//Blues
-$dark-blue: #2980B9;
-$blue: #3498DB;
-
-//Grays
-$dark-gray: #7F8C8D;
-$gray: #95a5a6;
-$light-gray: #ecf0f1;
-
-//Purples
-$purple: #9B59B6;
-$dark-purple: #8E44AD;
-
-//Greens
-$green: #2ECC71;
-$dark-green: #27AE60;
-
-//Orange
-$dark-orange: #f39c12;
-$orange: #f1c40f;
-
-//Black
-$dark-black: #232323;
-$black: lighten($dark-black, 10%);
-
-//White
-$white: #FFF;
-
-//All colors
-$colors: primary $dark-blue $blue, //class name, bg color, hover bg color
-         success $dark-green $green,
-         danger $dark-red $red,
-         warning $dark-orange $orange,
-         inverse $dark-inverse $inverse,
-         info $dark-info $info,
-         default $dark-gray $gray,
-         funky $dark-purple $purple,
-         dark $dark-black $black;
-
-/* Buttons */
-/* ------- */
-
-$font-size-large: $base-font-size * 1.25; // ~18px
-$font-size-xlarge: $base-font-size * 1.50; // ~24px
-$font-size-small: $base-font-size * 0.85; // ~12px
-$font-size-mini:  $base-font-size * 0.75; // ~11px
-
-$padding-large: 11px 19px; // 44px
-$padding-small:  2px 10px;  // 26px
-$padding-mini:   0 6px;   // 22px
-$padding-xlarge: 20px 30px; // 44px
-
-/* Alerts */
-/* ------ */
-$warning-alert-color: #d38305;
-$warning-header-color: #cc6633;
-
-$success-alert-color: #006633;
-$success-header-color: #006633;
-
-$info-alert-color: #195999;
-$info-header-color: #195999;
-
-$danger-alert-color: #993333;
-$danger-header-color: #993333;
-
-/* Navbar */
-/* ------ */
-$navbar-height: 55px;
-$navbar-bg-color: #232323;
-$navbar-border: #38393a;
-$navbar-text: #eaeaea;
-$navbar-brand-color: $navbar-text;
-$navbar-link-color-active: #FFF;
-$navbar-alpha: 0.75;
-
-/* Vertical Navbar */
-/* --------------- */
-$vrt-navbar-background: #232323;
-$vrt-navbar-width: 4em;
-$vrt-navbar-height: $vrt-navbar-width;
-$vrt-navbar-lineheight: 2em;
-$vrt-navbar-border: #000;
-$vrt-navbar-links-bg: $blue;
-$vrt-navbar-links-color: #FFF;
-$vrt-navbar-li-hover: $blue;
-
-/* Inputs */
-/* ------ */
-$input-color: #34495e;
-$input-border-radius: 2px;
-$input-bg: #FFF;
-$input-border-color: #CCC;
-$input-focus-color: $blue;
-
-/* Tables */
-/* ------ */
-$table-color: #FFF;
-$table-header-primary: $dark-blue;
-$table-border-color: #d2d2d2;
-$table-striped-color: #f9f9f9;
-
-/* Responsive Navbar */
-/* ----------------- */
-$nav-bar-collapse-width: 979px;
-$nav-bar-collapse-width-desktop: $nav-bar-collapse-width + 1;
-
-/* Images */
-/* ------ */
-$img-border: $dark-green;
-
-/* Select */
-/* ------ */
-$select-bg: $dark-info;
-$select-text-color: #FFF;
-$select-options-bg: $inverse;
-
-/* Checkbox and radio buttons */
-/* -------------------------- */
-$ch-rb-color: $dark-info;
-
-/* Grid */
-/* ---- */
-
-// Default 940px grid
-// -------------------------
-$gridColumns:             12 !default;
-$gridColumnWidth:         60px !default;
-$gridGutterWidth:         20px !default;
-$gridRowWidth:            ($gridColumns * $gridColumnWidth) + ($gridGutterWidth * ($gridColumns - 1)) !default;
-
-// 1200px min
-$gridColumnWidth1200:     70px !default;
-$gridGutterWidth1200:     30px !default;
-$gridRowWidth1200:        ($gridColumns * $gridColumnWidth1200) + ($gridGutterWidth1200 * ($gridColumns - 1)) !default;
-
-// 768px-979px
-$gridColumnWidth768:      42px !default;
-$gridGutterWidth768:      20px !default;
-$gridRowWidth768:         ($gridColumns * $gridColumnWidth768) + ($gridGutterWidth768 * ($gridColumns - 1)) !default;
-
-
-/* Fluid grid */
-/* ---------- */
-$fluidGridColumnWidth:    percentage($gridColumnWidth/$gridRowWidth) !default;
-$fluidGridGutterWidth:    percentage($gridGutterWidth/$gridRowWidth) !default;
-
-// 1200px min
-$fluidGridColumnWidth1200:     percentage($gridColumnWidth1200/$gridRowWidth1200) !default;
-$fluidGridGutterWidth1200:     percentage($gridGutterWidth1200/$gridRowWidth1200) !default;
-
-// 768px-979px
-$fluidGridColumnWidth768:      percentage($gridColumnWidth768/$gridRowWidth768) !default;
-$fluidGridGutterWidth768:      percentage($gridGutterWidth768/$gridRowWidth768) !default;
-
-/* Forms */
-/* ----- */
-$inputHeight: $base-line-height + 10px; // base line-height + 8px vertical padding + 2px top/bottom border
-
-/* Footer */
-/* ------ */
-$footer-bg: lighten($navbar-bg-color, 0.5);
-$footer-text-color: #FFF;
-$footer-height: 80px;
-
-/* Icons */
-/* ----- */
-$icon-base-color: $dark-inverse;
-$icon-base-inverse-color: #FFF;
-$icon-small-size: 2em;
-$icon-medium-size: 4em;
-$icon-large-size: 6em;
-$icon-xlarge-size: 8em;
-$icon-xxlarge-size: 10em;
-
-
-/* Links */
-/* ----- */
-$link-color: #0088cc;
-
-/* Headings */
-/* -------- */
-$headings-color: #4b4b4b;
-
-/* Color Lists */
-/* ----------- */
-$color-list-item-height: 16px;
-$color-list-item-width: $color-list-item-height;
-
-/* Pagination */
-/* ---------- */
-$pagination-color: desaturate(lighten($inverse, 57.5%), 17%);
-
-/* Toolbars */
-/* -------- */
-$toolbar-bg-color: #232323;
-
-/* Dropdown */
-/* -------- */
+// Body
+$bg-color: #FFF !default;
+
+// Fonts
+$font-family: 'Lato', 'Helvetica Neue' !default;
+$base-font-size: 16px !default;
+$base-line-height: 20px !default;
+$base-font-weight: 500 !default;
+$base-font-color: #333 !default;
+
+// Border
+$base-radius: 2px !default;
+
+// Colors
+
+// Reds
+$red: #e74c3c !default;
+$dark-red: #c0392b !default;
+
+// Hipsters
+$info: #1ABC9C !default;
+$dark-info: #16A085 !default;
+
+$aqua: #00CA74 !default;
+$dark-aqua: #03AE72 !default;
+
+// Inverse
+$dark-inverse: #242730 !default;
+$inverse: #2E323E !default;
+
+// Blues
+$dark-blue: #2980b9 !default;
+$blue: #3498db !default;
+
+// Grays
+$dark-gray: #7F8C8D !default;
+$gray: #95a5a6 !default;
+$light-gray: #ecf0f1 !default;
+
+// Purples
+$purple: #9B59B6 !default;
+$dark-purple: #8E44AD !default;
+
+// Greens
+$green: #2ecc71 !default;
+$dark-green: #27ae60 !default;
+
+// Yellows
+$yellow: #FFD02C !default;
+$dark-yellow: #DCB334 !default;
+
+// Orange
+$dark-orange: #d35400 !default;
+$orange: #e67e22 !default;
+
+// Blacks
+$black: #191C20 !default;
+$dark-black: #262626 !default;
+
+// White
+$white: #FFF !default;
+
+// Muted
+$muted-color: #555 !default;
+
+// Light1
+$light-color: #6F6F6F !default;
+
+// All colors
+$colors: info $blue $dark-blue, // class name, bg color, hover bg color
+         success $green $dark-green,
+         danger $red $dark-red,
+         warning $orange $dark-orange,
+         primary $inverse $dark-inverse,
+         funky $purple $dark-purple;
+
+// Jumbo
+$jumbo-container-bg-color: #3498d9 !default;
+$jumbo-container-bg-gradient: #67b2e3 !default;
+
+// Buttons
+$font-size-large: $base-font-size * 1.25 !default; // ~18px
+$font-size-xlarge: $base-font-size * 1.50 !default; // ~24px
+$font-size-small: $base-font-size * 0.85 !default; // ~12px
+$font-size-mini:  $base-font-size * 0.75 !default; // ~11px
+
+$padding-large: 11px 19px !default; // 44px
+$padding-small:  2px 10px !default;  // 26px
+$padding-mini:   0 6px !default;   // 22px
+$padding-xlarge: 20px 30px !default; // 44px
+$padding-xxlarge: 20px 50px !default; // 44px
+
+// HR
+$hr-color: #DDD !default;
+
+// BLOCKQUOTE
+$blockquote-color: #777 !default;
+$blockquote-border-color: #DDD !default;
+
+
+// Alerts
+$warning-alert-color: $orange !default;
+$warning-header-color: $dark-orange !default;
+
+$success-alert-color: $dark-green !default;
+$success-header-color: $dark-green !default;
+
+$info-alert-color: $dark-blue !default;
+$info-header-color: $dark-blue !default;
+
+$danger-alert-color: $dark-red !default;
+$danger-header-color: $dark-red !default;
+
+// Navbar 
+$navbar-height: 51px !default;
+$navbar-bg-color: #2d313d !default;
+$navbar-border: #38393a !default;
+$navbar-text: #eaeaea !default;
+$navbar-brand-color: $navbar-text !default;
+$navbar-link-color-active: #FFF !default;
+$navbar-inverse-bg-color: #FFF !default;
+$navbar-inverse-text: #0088cc !default; 
+
+// Panel
+$panel-inverse-bg: $white !default;
+$panel-inverse-active-color: #555 !default;
+$panel-inverse-active-bg: #EFEFEF !default;
+$panel-inverse-link-color: #0088cc !default;
+
+// Inputs
+$input-color: #34495e !default;
+$input-border-radius: 4px !default;
+$input-bg: #FFF !default;
+$input-border-color: #CCC !default;
+$input-focus-color: $blue !default;
+
+// Tables
+$table-color: #FFF !default;
+$table-header-primary: $dark-blue !default;
+$table-border-color: #d2d2d2 !default;
+$table-striped-color: #f9f9f9 !default;
+
+// Responsive Navbar
+$nav-bar-collapse-width: 979px !default;
+$nav-bar-collapse-width-desktop: $nav-bar-collapse-width + 1 !default;
+
+// Images
+$img-border: $dark-green !default;
+
+// Forms
+$input-height: $base-line-height + 10px !default; // base line-height + 8px vertical padding + 2px top/bottom border
+
+// Dashboard
+$dashboard-primary-bg-color: $inverse !default;
+$dashboard-info-bg-color: $blue !default;
+$dashboard-funky-bg-color: $purple !default;
+$dashboard-danger-bg-color: $red !default;
+$dashboard-warning-bg-color: $orange !default;
+$dashboard-success-bg-color: $green !default;
+$dashboard-inverse-bg-color: #34495e !default;
+
+// Footer
+$footer-text-color: #232323 !default;
+$footer-anchor-color: #777 !default;
+$footer-height: 80px !default;
+$footer-anchor-size: 13px !default;
+
+// Icons
+$icon-base-color: $dark-inverse !default;
+$icon-base-inverse-color: #FFF !default;
+$icon-small-size: 2em !default;
+$icon-medium-size: 4em !default;
+$icon-large-size: 6em !default;
+$icon-xlarge-size: 8em !default;
+$icon-xxlarge-size: 10em !default;
+
+// Links
+$link-color: #0088cc !default;
+
+// Headings
+$headings-color: #222 !default;
+
+
+// Pagination
+$pagination-color: desaturate(lighten($inverse, 57.5%), 17%) !default;
+
+// Toolbars
+$toolbar-bg-color: #232323 !default;
+
+// Dropdown
 $zindex-dropdown: 1000 !default;
 $dropdown-bg: $white !default;
-$dropdown-border: rgba(0,0,0,0.2);
+$dropdown-border: rgba(0,0,0,0.2) !default;
 $dropdown-link-color: $dark-gray !default;
 $dropdown-link-color-hover: $white !default;
-$dropdown-link-color-hover-bg: lighten($blue, 10%);
+$dropdown-link-color-hover-bg: lighten($blue, 10%) !default;
+
+// Code
+$code-bg: #f7f7f9 !default;
+$code-font-size: 0.8em !default;
+$code-comment-color: #999 !default;
+$code-tag-color: #2f6f9f !default;
+$code-css-property-color: #333 !default;
+$code-color: #d44950 !default;
+
+// Calendar
+$calendar-highlight-color: #b1dcfb !default;
+$calendar-highlighted-color: #0089ec !default;
+
+
+// Container center
+$container-center-width: 90% !default;
+
+// Modal
+$modal-max-width: 630px !default;
+$modal-min-width: 320px !default;
+
+// Responsive widths
+
+// Extra small screen / phone
+$screen-xs:                  480px !default;
+$screen-xs-min:              $screen-xs !default;
+$screen-phone:               $screen-xs-min !default;
+
+// Small screen / tablet
+$screen-sm:                  768px !default;
+$screen-sm-min:              $screen-sm !default;
+$screen-tablet:              $screen-sm-min !default;
+
+// Medium screen / desktop
+$screen-md:                  992px !default;
+$screen-md-min:              $screen-md !default;
+$screen-desktop:             $screen-md-min !default;
 
-/* Code */
-/*---------------------*/
-$code-bg: #fafafa;
-$code-font-size: 0.8em;
+// Large screen / wide desktop
+// Note: Deprecated $screen-lg and $screen-lg-desktop as of v3.0.1
+$screen-lg:                  1200px !default;
+$screen-lg-min:              $screen-lg !default;
+$screen-lg-desktop:          $screen-lg-min !default;
 
-/* Calendar */
-/*---------------------*/
-$calendar-highlight-color: #b1dcfb;
-$calendar-highlighted-color: #0089ec;
+// So media queries don't overlap when required, provide a maximum
+$screen-xs-max:              ($screen-sm-min - 1) !default;
+$screen-sm-max:              ($screen-md-min - 1) !default;
+$screen-md-max:              ($screen-lg-min - 1) !default;
 
-/* Font Awesome Icons */
-/* ------------------ */
+// Font Awesome Icons
 
 $FontAwesomePath: "/assets/fontawesome" !default;
 $FontAwesomeVersion: "3.2.1" !default;
@@ -263,7 +260,7 @@ $borderColor: #eeeeee !default;
 $iconMuted: #eeeeee !default;
 $iconLight: white !default;
 $iconDark: #333333 !default; //1d1d1b
-$icons-li-width: (30em/14);
+$icons-li-width: (30em/14) !default;
 
 $glass: "\f000";
 $music: "\f001";