simplex: changed grays of navbar and body to be more neutral / warmer
authorThomas Park <thomas@thomaspark.me>
Tue, 3 Apr 2012 14:22:06 +0000 (10:22 -0400)
committerThomas Park <thomas@thomaspark.me>
Tue, 3 Apr 2012 14:22:06 +0000 (10:22 -0400)
simplex/bootstrap.css
simplex/bootstrap.min.css
simplex/thumbnail.png
simplex/variables.less

index 58f4e93..e316ee5 100644 (file)
@@ -136,7 +136,7 @@ body {
   font-size: 13px;
   line-height: 18px;
   color: #555555;
-  background-color: #eef0f4;
+  background-color: #ededed;
 }
 a {
   color: #366ddc;
@@ -2782,15 +2782,15 @@ input[type="submit"].btn.btn-mini {
 .navbar-inner {
   padding-left: 20px;
   padding-right: 20px;
-  background-color: #f4f6f8;
-  background-image: -moz-linear-gradient(top, #f4f6f8, #f4f6f8);
-  background-image: -ms-linear-gradient(top, #f4f6f8, #f4f6f8);
-  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f4f6f8), to(#f4f6f8));
-  background-image: -webkit-linear-gradient(top, #f4f6f8, #f4f6f8);
-  background-image: -o-linear-gradient(top, #f4f6f8, #f4f6f8);
-  background-image: linear-gradient(top, #f4f6f8, #f4f6f8);
+  background-color: #f3f3f3;
+  background-image: -moz-linear-gradient(top, #f3f3f3, #f3f3f3);
+  background-image: -ms-linear-gradient(top, #f3f3f3, #f3f3f3);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f3f3f3), to(#f3f3f3));
+  background-image: -webkit-linear-gradient(top, #f3f3f3, #f3f3f3);
+  background-image: -o-linear-gradient(top, #f3f3f3, #f3f3f3);
+  background-image: linear-gradient(top, #f3f3f3, #f3f3f3);
   background-repeat: repeat-x;
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4f6f8', endColorstr='#f4f6f8', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3f3f3', endColorstr='#f3f3f3', GradientType=0);
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
@@ -2807,16 +2807,16 @@ input[type="submit"].btn.btn-mini {
   padding: 7px 10px;
   margin-left: 5px;
   margin-right: 5px;
-  background-color: #f4f6f8;
-  background-image: -moz-linear-gradient(top, #f4f6f8, #f4f6f8);
-  background-image: -ms-linear-gradient(top, #f4f6f8, #f4f6f8);
-  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f4f6f8), to(#f4f6f8));
-  background-image: -webkit-linear-gradient(top, #f4f6f8, #f4f6f8);
-  background-image: -o-linear-gradient(top, #f4f6f8, #f4f6f8);
-  background-image: linear-gradient(top, #f4f6f8, #f4f6f8);
+  background-color: #f3f3f3;
+  background-image: -moz-linear-gradient(top, #f3f3f3, #f3f3f3);
+  background-image: -ms-linear-gradient(top, #f3f3f3, #f3f3f3);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f3f3f3), to(#f3f3f3));
+  background-image: -webkit-linear-gradient(top, #f3f3f3, #f3f3f3);
+  background-image: -o-linear-gradient(top, #f3f3f3, #f3f3f3);
+  background-image: linear-gradient(top, #f3f3f3, #f3f3f3);
   background-repeat: repeat-x;
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4f6f8', endColorstr='#f4f6f8', GradientType=0);
-  border-color: #f4f6f8 #f4f6f8 #c5d0da;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3f3f3', endColorstr='#f3f3f3', GradientType=0);
+  border-color: #f3f3f3 #f3f3f3 #cdcdcd;
   border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
   filter: progid:dximagetransform.microsoft.gradient(enabled=false);
   -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075);
@@ -2828,11 +2828,11 @@ input[type="submit"].btn.btn-mini {
 .btn-navbar.active,
 .btn-navbar.disabled,
 .btn-navbar[disabled] {
-  background-color: #f4f6f8;
+  background-color: #f3f3f3;
 }
 .btn-navbar:active,
 .btn-navbar.active {
-  background-color: #d5dde4 \9;
+  background-color: #dadada \9;
 }
 .btn-navbar .icon-bar {
   display: block;
@@ -3015,15 +3015,15 @@ input[type="submit"].btn.btn-mini {
 .navbar .nav .active > a:hover {
   color: #333333;
   text-decoration: none;
-  background-color: #f4f6f8;
+  background-color: #f3f3f3;
 }
 .navbar .divider-vertical {
   height: 40px;
   width: 1px;
   margin: 0 9px;
   overflow: hidden;
-  background-color: #f4f6f8;
-  border-right: 1px solid #f4f6f8;
+  background-color: #f3f3f3;
+  border-right: 1px solid #f3f3f3;
 }
 .navbar .nav.pull-right {
   margin-left: 10px;
@@ -4025,7 +4025,7 @@ h6,
 }
 div.subnav {
   background-image: none;
-  background-color: #f4f6f8;
+  background-color: #f3f3f3;
   border-bottom: 1px solid transparent;
   -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
   -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
@@ -4079,7 +4079,7 @@ div.subnav .nav > li > a:hover {
 .nav-tabs > li > a:hover,
 .tabbable > .nav-tabs > li > a,
 .tabbable > .nav-tabs > li > a:hover {
-  background-color: #e5e8ee;
+  background-color: #e5e5e5;
   border: 1px solid #ccc;
 }
 .tabbable > .nav-tabs > li.active > a {
@@ -4095,7 +4095,7 @@ div.subnav .nav > li > a:hover {
 }
 .nav-tabs > li.active > a,
 .nav-tabs > li.active > a:hover {
-  background-color: #eef0f4;
+  background-color: #ededed;
 }
 input,
 textarea,
@@ -4110,7 +4110,7 @@ select,
   -webkit-border-radius: 0;
   -moz-border-radius: 0;
   border-radius: 0;
-  background-color: #eef0f4;
+  background-color: #ededed;
   color: #555555;
 }
 .help-inline,
@@ -4315,10 +4315,10 @@ select,
 }
 .modal-header,
 .modal-body {
-  background-color: #f4f6f8;
+  background-color: #f3f3f3;
 }
 .modal-footer {
-  background-color: #eef0f4;
+  background-color: #ededed;
 }
 i[class^="icon-"] {
   opacity: 0.6;
index 14320e9..b7d2a2d 100644 (file)
@@ -19,7 +19,7 @@ textarea{overflow:auto;vertical-align:top;}
 .clearfix:after{clear:both;}
 .hide-text{overflow:hidden;text-indent:100%;white-space:nowrap;}
 .input-block-level{display:block;width:100%;min-height:28px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;}
-body{margin:0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;line-height:18px;color:#555555;background-color:#eef0f4;}
+body{margin:0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;line-height:18px;color:#555555;background-color:#ededed;}
 a{color:#366ddc;text-decoration:none;}
 a:hover{color:#1d4ba8;text-decoration:underline;}
 .row{margin-left:-20px;*zoom:1;}.row:before,.row:after{display:table;content:"";}
@@ -512,10 +512,10 @@ button.btn.btn-mini,input[type="submit"].btn.btn-mini{*padding-top:1px;*padding-
 .tabs-right .nav-tabs>li>a:hover{border-color:#eeeeee #eeeeee #eeeeee #dddddd;}
 .tabs-right .nav-tabs .active>a,.tabs-right .nav-tabs .active>a:hover{border-color:#ddd #ddd #ddd transparent;*border-left-color:#ffffff;}
 .navbar{*position:relative;*z-index:2;overflow:visible;margin-bottom:18px;}
-.navbar-inner{padding-left:20px;padding-right:20px;background-color:#f4f6f8;background-image:-moz-linear-gradient(top, #f4f6f8, #f4f6f8);background-image:-ms-linear-gradient(top, #f4f6f8, #f4f6f8);background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#f4f6f8), to(#f4f6f8));background-image:-webkit-linear-gradient(top, #f4f6f8, #f4f6f8);background-image:-o-linear-gradient(top, #f4f6f8, #f4f6f8);background-image:linear-gradient(top, #f4f6f8, #f4f6f8);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4f6f8', endColorstr='#f4f6f8', GradientType=0);-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);-moz-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);}
+.navbar-inner{padding-left:20px;padding-right:20px;background-color:#f3f3f3;background-image:-moz-linear-gradient(top, #f3f3f3, #f3f3f3);background-image:-ms-linear-gradient(top, #f3f3f3, #f3f3f3);background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#f3f3f3), to(#f3f3f3));background-image:-webkit-linear-gradient(top, #f3f3f3, #f3f3f3);background-image:-o-linear-gradient(top, #f3f3f3, #f3f3f3);background-image:linear-gradient(top, #f3f3f3, #f3f3f3);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3f3f3', endColorstr='#f3f3f3', GradientType=0);-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);-moz-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);}
 .navbar .container{width:auto;}
-.btn-navbar{display:none;float:right;padding:7px 10px;margin-left:5px;margin-right:5px;background-color:#f4f6f8;background-image:-moz-linear-gradient(top, #f4f6f8, #f4f6f8);background-image:-ms-linear-gradient(top, #f4f6f8, #f4f6f8);background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#f4f6f8), to(#f4f6f8));background-image:-webkit-linear-gradient(top, #f4f6f8, #f4f6f8);background-image:-o-linear-gradient(top, #f4f6f8, #f4f6f8);background-image:linear-gradient(top, #f4f6f8, #f4f6f8);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4f6f8', endColorstr='#f4f6f8', GradientType=0);border-color:#f4f6f8 #f4f6f8 #c5d0da;border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);filter:progid:dximagetransform.microsoft.gradient(enabled=false);-webkit-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.1),0 1px 0 rgba(255, 255, 255, 0.075);-moz-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.1),0 1px 0 rgba(255, 255, 255, 0.075);box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.1),0 1px 0 rgba(255, 255, 255, 0.075);}.btn-navbar:hover,.btn-navbar:active,.btn-navbar.active,.btn-navbar.disabled,.btn-navbar[disabled]{background-color:#f4f6f8;}
-.btn-navbar:active,.btn-navbar.active{background-color:#d5dde4 \9;}
+.btn-navbar{display:none;float:right;padding:7px 10px;margin-left:5px;margin-right:5px;background-color:#f3f3f3;background-image:-moz-linear-gradient(top, #f3f3f3, #f3f3f3);background-image:-ms-linear-gradient(top, #f3f3f3, #f3f3f3);background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#f3f3f3), to(#f3f3f3));background-image:-webkit-linear-gradient(top, #f3f3f3, #f3f3f3);background-image:-o-linear-gradient(top, #f3f3f3, #f3f3f3);background-image:linear-gradient(top, #f3f3f3, #f3f3f3);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3f3f3', endColorstr='#f3f3f3', GradientType=0);border-color:#f3f3f3 #f3f3f3 #cdcdcd;border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);filter:progid:dximagetransform.microsoft.gradient(enabled=false);-webkit-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.1),0 1px 0 rgba(255, 255, 255, 0.075);-moz-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.1),0 1px 0 rgba(255, 255, 255, 0.075);box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.1),0 1px 0 rgba(255, 255, 255, 0.075);}.btn-navbar:hover,.btn-navbar:active,.btn-navbar.active,.btn-navbar.disabled,.btn-navbar[disabled]{background-color:#f3f3f3;}
+.btn-navbar:active,.btn-navbar.active{background-color:#dadada \9;}
 .btn-navbar .icon-bar{display:block;width:18px;height:2px;background-color:#f5f5f5;-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px;-webkit-box-shadow:0 1px 0 rgba(0, 0, 0, 0.25);-moz-box-shadow:0 1px 0 rgba(0, 0, 0, 0.25);box-shadow:0 1px 0 rgba(0, 0, 0, 0.25);}
 .btn-navbar .icon-bar+.icon-bar{margin-top:3px;}
 .nav-collapse.collapse{height:auto;}
@@ -543,8 +543,8 @@ button.btn.btn-mini,input[type="submit"].btn.btn-mini{*padding-top:1px;*padding-
 .navbar .nav>li{display:block;float:left;}
 .navbar .nav>li>a{float:none;padding:10px 10px 11px;line-height:19px;color:#555555;text-decoration:none;text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);}
 .navbar .nav>li>a:hover{background-color:transparent;color:#333333;text-decoration:none;}
-.navbar .nav .active>a,.navbar .nav .active>a:hover{color:#333333;text-decoration:none;background-color:#f4f6f8;}
-.navbar .divider-vertical{height:40px;width:1px;margin:0 9px;overflow:hidden;background-color:#f4f6f8;border-right:1px solid #f4f6f8;}
+.navbar .nav .active>a,.navbar .nav .active>a:hover{color:#333333;text-decoration:none;background-color:#f3f3f3;}
+.navbar .divider-vertical{height:40px;width:1px;margin:0 9px;overflow:hidden;background-color:#f3f3f3;border-right:1px solid #f3f3f3;}
 .navbar .nav.pull-right{margin-left:10px;margin-right:0;}
 .navbar .dropdown-menu{margin-top:1px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}.navbar .dropdown-menu:before{content:'';display:inline-block;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid #ccc;border-bottom-color:rgba(0, 0, 0, 0.2);position:absolute;top:-7px;left:9px;}
 .navbar .dropdown-menu:after{content:'';display:inline-block;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #ffffff;position:absolute;top:-6px;left:10px;}
@@ -695,7 +695,7 @@ h6,.hero-unit h1{color:#333333;}
 .navbar .nav .active>a,.navbar .nav .active>a:hover{background-color:transparent;}
 .navbar .nav .dropdown-toggle .caret,.navbar .nav .open.dropdown .caret{border-top-color:#555555;}
 .dropdown.open .dropdown-toggle{color:#333333;}
-div.subnav{background-image:none;background-color:#f4f6f8;border-bottom:1px solid transparent;-webkit-box-shadow:0 1px 1px rgba(0, 0, 0, 0.3);-moz-box-shadow:0 1px 1px rgba(0, 0, 0, 0.3);box-shadow:0 1px 1px rgba(0, 0, 0, 0.3);}
+div.subnav{background-image:none;background-color:#f3f3f3;border-bottom:1px solid transparent;-webkit-box-shadow:0 1px 1px rgba(0, 0, 0, 0.3);-moz-box-shadow:0 1px 1px rgba(0, 0, 0, 0.3);box-shadow:0 1px 1px rgba(0, 0, 0, 0.3);}
 div.subnav.subnav-fixed{-webkit-box-shadow:inset 0 5px #ffffff , 0 1px 1px rgba(0, 0, 0, 0.3);-moz-box-shadow:inset 0 5px #ffffff , 0 1px 1px rgba(0, 0, 0, 0.3);box-shadow:inset 0 5px #ffffff , 0 1px 1px rgba(0, 0, 0, 0.3);}
 div.subnav .nav>li>a{padding-top:12px;color:#555555;font-weight:normal;font-size:11px;}div.subnav .nav>li>a:hover{text-decoration:underline;}
 .dropdown-menu{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;font-size:11px;}
@@ -703,13 +703,13 @@ div.subnav .nav>li>a{padding-top:12px;color:#555555;font-weight:normal;font-size
 .navbar .nav-collapse.in .nav li>a{color:#333333;font-weight:normal;}
 .navbar .nav-collapse.in .nav li>a:hover{background-color:transparent;color:#000000;text-decoration:underline;}
 @media (max-width:979px){form.navbar-form,form.navbar-search{border-top:1px solid #ccc;border-bottom:1px solid #ccc;}}.nav>li>a{font-size:11px;border-width:1px;}
-.nav-tabs>li>a,.nav-tabs>li>a:hover,.tabbable>.nav-tabs>li>a,.tabbable>.nav-tabs>li>a:hover{background-color:#e5e8ee;border:1px solid #ccc;}
+.nav-tabs>li>a,.nav-tabs>li>a:hover,.tabbable>.nav-tabs>li>a,.tabbable>.nav-tabs>li>a:hover{background-color:#e5e5e5;border:1px solid #ccc;}
 .tabbable>.nav-tabs>li.active>a{border-bottom:1px solid transparent;}
 .tabbable.tabs-below>.nav-tabs>li.active>a,.tabbable.tabs-left>.nav-tabs>li.active>a,.tabbable.tabs-right>.nav-tabs>li.active>a{border-bottom:1px solid #ccc;}
 .nav-pills>li>a:hover{background-color:transparent;}
-.nav-tabs>li.active>a,.nav-tabs>li.active>a:hover{background-color:#eef0f4;}
+.nav-tabs>li.active>a,.nav-tabs>li.active>a:hover{background-color:#ededed;}
 input,textarea,select,.uneditable-input{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;}
-.navbar-search .search-query{border:1px solid #CCC;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;background-color:#eef0f4;color:#555555;}
+.navbar-search .search-query{border:1px solid #CCC;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;background-color:#ededed;color:#555555;}
 .help-inline,.help-block{font-size:11px;}
 .input-prepend input,.input-append input,.input-prepend select,.input-append select,.input-prepend .uneditable-input,.input-append .uneditable-input{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;}
 .input-prepend .add-on,.input-append .add-on,.input-prepend .btn,.input-append .btn{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;}
@@ -729,8 +729,8 @@ input,textarea,select,.uneditable-input{-webkit-border-radius:0;-moz-border-radi
 .btn-inverse:active,.btn-inverse.active{background-color:#79377c \9;}
 .modal,.modal-header,.modal-footer{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;}
 .modal-header{border-bottom:none;}
-.modal-header,.modal-body{background-color:#f4f6f8;}
-.modal-footer{background-color:#eef0f4;}
+.modal-header,.modal-body{background-color:#f3f3f3;}
+.modal-footer{background-color:#ededed;}
 i[class^="icon-"]{opacity:0.6;vertical-align:-2px;}
 .alert,.alert p,.alert-heading{font-size:11px;}
 .progress{background-color:#e3e3e3;background-image:-moz-linear-gradient(top, #e0e0e0, #e8e8e8);background-image:-ms-linear-gradient(top, #e0e0e0, #e8e8e8);background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#e0e0e0), to(#e8e8e8));background-image:-webkit-linear-gradient(top, #e0e0e0, #e8e8e8);background-image:-o-linear-gradient(top, #e0e0e0, #e8e8e8);background-image:linear-gradient(top, #e0e0e0, #e8e8e8);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e0e0e0', endColorstr='#e8e8e8', GradientType=0);}
index 04c1dd9..41ec590 100644 (file)
Binary files a/simplex/thumbnail.png and b/simplex/thumbnail.png differ
index ef4918d..16b17be 100755 (executable)
@@ -35,7 +35,7 @@
 
 // Scaffolding
 // -------------------------
-@bodyBackground:        #EEF0F4;
+@bodyBackground:        #EDEDED;
 @textColor:             @gray;
 
 
 // Navbar
 // -------------------------
 @navbarHeight:                    40px;
-@navbarBackground:                #F4F6F8;
+@navbarBackground:                #F3F3F3;
 @navbarBackgroundHighlight:       @navbarBackground;
 
 @navbarText:                      @gray;