Commit bf93db1e authored by Thomas Park's avatar Thomas Park
Browse files

flatly: refactor code, style additional components

parent 5ac3b31c
This diff is collapsed.
// Flatness by Jenil(www.jgog.in)
// Bootswatch 2.3.1
// -----------------------------------------------------
// TYPOGRAPHY
// --------------------------------------------------
@import url("http://fonts.googleapis.com/css?family=Lato:400,700,900,400italic");
h1 {
font-size: 32px;
font-weight: 900; }
h2 {
font-size: 26px;
font-weight: 700;
margin-bottom: 2px; }
h3 {
font-size: 24px;
font-weight: 700;
margin-bottom: 4px;
margin-top: 2px; }
h4 {
font-size: 18px;
font-weight: 500;
margin-top: 4px; }
h5 {
font-size: 16px;
font-weight: 500;
text-transform: uppercase; }
h6 {
font-size: 13px;
font-weight: 500;
text-transform: uppercase; }
// SCAFFOLDING
// --------------------------------------------------
// NAVBAR
// --------------------------------------------------
.navbar-inverse .navbar-search .search-query
{
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
// NAVIGATION
// --------------------------------------------------
.navbar [class^="icon-"], .navbar [class*=" icon-"]
{
background-image: url("../img/glyphicons-halflings-white.png");
}
.navbar .nav>.active>a, .navbar .nav>.active>a:hover, .navbar .nav>.active>a:focus
{
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.nav>li>a{
text-shadow: none !important;
font-size: 15px;
}
// BUTTONS
// --------------------------------------------------
.btn {
border: none;
background-image: none;
color: white;
font-size: 16.5px;
text-decoration: none;
text-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
-webkit-transition: 0.25s;
-moz-transition: 0.25s;
-o-transition: 0.25s;
transition: 0.25s;
-webkit-backface-visibility: hidden;
}
.btn:hover,
.btn:focus {
color: white;
-webkit-transition: 0.25s;
-moz-transition: 0.25s;
-o-transition: 0.25s;
transition: 0.25s;
-webkit-backface-visibility: hidden;
}
.btn:active,
.btn.active {
color: rgba(255, 255, 255, 0.75);
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.btn.disabled,
.btn[disabled] {
color: white;
}
.btn.btn-large {
padding-bottom: 12px;
padding-top: 13px;
}
.btn-toolbar .btn {
font-size: 18px;
padding: 10px 14px 9px;
}
.btn-toolbar .btn:first-child {
-webkit-border-radius: 6px 0 0 6px;
-moz-border-radius: 6px 0 0 6px;
border-radius: 6px 0 0 6px;
}
.btn-toolbar .btn:last-child {
-webkit-border-radius: 0 6px 6px 0;
-moz-border-radius: 0 6px 6px 0;
border-radius: 0 6px 6px 0;
}
.btn-toolbar .btn.active { color: white }
.btn-small{
font-size: 12px;
}
// TABLES
// -----------------------------------------------------
// FORMS
// --------------------------------------------------
.input-append .add-on, .input-prepend .add-on
{
border: none;
background: none;
}
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"],
.uneditable-input {
border: 2px solid #dce4ec;
color: #34495e;
font-family: "Lato", sans-serif;
font-size: 14px;
padding: 2px 0 3px 10px;
text-indent: 1px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
textarea:-moz-placeholder,
input[type="text"]:-moz-placeholder,
input[type="password"]:-moz-placeholder,
input[type="datetime"]:-moz-placeholder,
input[type="datetime-local"]:-moz-placeholder,
input[type="date"]:-moz-placeholder,
input[type="month"]:-moz-placeholder,
input[type="time"]:-moz-placeholder,
input[type="week"]:-moz-placeholder,
input[type="number"]:-moz-placeholder,
input[type="email"]:-moz-placeholder,
input[type="url"]:-moz-placeholder,
input[type="search"]:-moz-placeholder,
input[type="tel"]:-moz-placeholder,
input[type="color"]:-moz-placeholder,
.uneditable-input:-moz-placeholder {
color: #acb6c0;
}
textarea::-webkit-input-placeholder,
input[type="text"]::-webkit-input-placeholder,
input[type="password"]::-webkit-input-placeholder,
input[type="datetime"]::-webkit-input-placeholder,
input[type="datetime-local"]::-webkit-input-placeholder,
input[type="date"]::-webkit-input-placeholder,
input[type="month"]::-webkit-input-placeholder,
input[type="time"]::-webkit-input-placeholder,
input[type="week"]::-webkit-input-placeholder,
input[type="number"]::-webkit-input-placeholder,
input[type="email"]::-webkit-input-placeholder,
input[type="url"]::-webkit-input-placeholder,
input[type="search"]::-webkit-input-placeholder,
input[type="tel"]::-webkit-input-placeholder,
input[type="color"]::-webkit-input-placeholder,
.uneditable-input::-webkit-input-placeholder {
color: #acb6c0;
}
textarea.placeholder,
input[type="text"].placeholder,
input[type="password"].placeholder,
input[type="datetime"].placeholder,
input[type="datetime-local"].placeholder,
input[type="date"].placeholder,
input[type="month"].placeholder,
input[type="time"].placeholder,
input[type="week"].placeholder,
input[type="number"].placeholder,
input[type="email"].placeholder,
input[type="url"].placeholder,
input[type="search"].placeholder,
input[type="tel"].placeholder,
input[type="color"].placeholder,
.uneditable-input.placeholder {
color: #acb6c0;
}
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
border-color: #1abc9c;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.control-group.error textarea, .control-group.error
input[type="text"], .control-group.error
input[type="password"], .control-group.error
input[type="datetime"], .control-group.error
input[type="datetime-local"], .control-group.error
input[type="date"], .control-group.error
input[type="month"], .control-group.error
input[type="time"], .control-group.error
input[type="week"], .control-group.error
input[type="number"], .control-group.error
input[type="email"], .control-group.error
input[type="url"], .control-group.error
input[type="search"], .control-group.error
input[type="tel"], .control-group.error
input[type="color"], .control-group.error
.uneditable-input {
border-color: #e74c3c;
color: #e74c3c;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.control-group.error textarea:focus, .control-group.error
input[type="text"]:focus, .control-group.error
input[type="password"]:focus, .control-group.error
input[type="datetime"]:focus, .control-group.error
input[type="datetime-local"]:focus, .control-group.error
input[type="date"]:focus, .control-group.error
input[type="month"]:focus, .control-group.error
input[type="time"]:focus, .control-group.error
input[type="week"]:focus, .control-group.error
input[type="number"]:focus, .control-group.error
input[type="email"]:focus, .control-group.error
input[type="url"]:focus, .control-group.error
input[type="search"]:focus, .control-group.error
input[type="tel"]:focus, .control-group.error
input[type="color"]:focus, .control-group.error
.uneditable-input:focus {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.control-group.success textarea, .control-group.success
input[type="text"], .control-group.success
input[type="password"], .control-group.success
input[type="datetime"], .control-group.success
input[type="datetime-local"], .control-group.success
input[type="date"], .control-group.success
input[type="month"], .control-group.success
input[type="time"], .control-group.success
input[type="week"], .control-group.success
input[type="number"], .control-group.success
input[type="email"], .control-group.success
input[type="url"], .control-group.success
input[type="search"], .control-group.success
input[type="tel"], .control-group.success
input[type="color"], .control-group.success
.uneditable-input {
border-color: #2ecc71;
color: #2ecc71;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.control-group.success textarea:focus, .control-group.success
input[type="text"]:focus, .control-group.success
input[type="password"]:focus, .control-group.success
input[type="datetime"]:focus, .control-group.success
input[type="datetime-local"]:focus, .control-group.success
input[type="date"]:focus, .control-group.success
input[type="month"]:focus, .control-group.success
input[type="time"]:focus, .control-group.success
input[type="week"]:focus, .control-group.success
input[type="number"]:focus, .control-group.success
input[type="email"]:focus, .control-group.success
input[type="url"]:focus, .control-group.success
input[type="search"]:focus, .control-group.success
input[type="tel"]:focus, .control-group.success
input[type="color"]:focus, .control-group.success
.uneditable-input:focus {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.control-group.warning textarea, .control-group.warning
input[type="text"], .control-group.warning
input[type="password"], .control-group.warning
input[type="datetime"], .control-group.warning
input[type="datetime-local"], .control-group.warning
input[type="date"], .control-group.warning
input[type="month"], .control-group.warning
input[type="time"], .control-group.warning
input[type="week"], .control-group.warning
input[type="number"], .control-group.warning
input[type="email"], .control-group.warning
input[type="url"], .control-group.warning
input[type="search"], .control-group.warning
input[type="tel"], .control-group.warning
input[type="color"], .control-group.warning
.uneditable-input {
border-color: #f1c40f;
color: #f1c40f;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.control-group.warning textarea:focus, .control-group.warning
input[type="text"]:focus, .control-group.warning
input[type="password"]:focus, .control-group.warning
input[type="datetime"]:focus, .control-group.warning
input[type="datetime-local"]:focus, .control-group.warning
input[type="date"]:focus, .control-group.warning
input[type="month"]:focus, .control-group.warning
input[type="time"]:focus, .control-group.warning
input[type="week"]:focus, .control-group.warning
input[type="number"]:focus, .control-group.warning
input[type="email"]:focus, .control-group.warning
input[type="url"]:focus, .control-group.warning
input[type="search"]:focus, .control-group.warning
input[type="tel"]:focus, .control-group.warning
input[type="color"]:focus, .control-group.warning
.uneditable-input:focus {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.control-group.info textarea, .control-group.info
input[type="text"], .control-group.info
input[type="password"], .control-group.info
input[type="datetime"], .control-group.info
input[type="datetime-local"], .control-group.info
input[type="date"], .control-group.info
input[type="month"], .control-group.info
input[type="time"], .control-group.info
input[type="week"], .control-group.info
input[type="number"], .control-group.info
input[type="email"], .control-group.info
input[type="url"], .control-group.info
input[type="search"], .control-group.info
input[type="tel"], .control-group.info
input[type="color"], .control-group.info
.uneditable-input {
border-color: #3498db;
color: #3498db;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.control-group.info textarea:focus, .control-group.info
input[type="text"]:focus, .control-group.info
input[type="password"]:focus, .control-group.info
input[type="datetime"]:focus, .control-group.info
input[type="datetime-local"]:focus, .control-group.info
input[type="date"]:focus, .control-group.info
input[type="month"]:focus, .control-group.info
input[type="time"]:focus, .control-group.info
input[type="week"]:focus, .control-group.info
input[type="number"]:focus, .control-group.info
input[type="email"]:focus, .control-group.info
input[type="url"]:focus, .control-group.info
input[type="search"]:focus, .control-group.info
input[type="tel"]:focus, .control-group.info
input[type="color"]:focus, .control-group.info
.uneditable-input:focus {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
input[disabled],
input[readonly],
textarea[disabled],
textarea[readonly] {
background-color: #eaeded;
border-color: transparent;
color: #cad2d3;
cursor: default; }
input[type="file"]{
line-height: 16px;
}
// DROPDOWNS
// --------------------------------------------------
.btn.dropdown-toggle .caret{
border-top-color: white;
}
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus, .dropdown-submenu:hover>a, .dropdown-submenu:focus>a
{
background-image: none;
}
// ALERTS, LABELS, BADGES
// --------------------------------------------------
// MISC
// --------------------------------------------------
[class^="icon-"], [class*=" icon-"] {
margin-top: 3px;
}
.well{
border: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.btn-small [class^="icon-"], .btn-small [class*=" icon-"]
{
margin-top: 3px;
}
.progress{
background: #e8edf2;
border-radius: 32px;
height: 12px;
-webkit-box-shadow: none;
box-shadow: none;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.progress .bar{
background: #1abc9c;
-webkit-box-shadow: none !important;
box-shadow: none !important;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.progress-success .bar{
background-color: #2ecc71;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.progress-warning .bar{
background-color: #f1c40f;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.progress-danger .bar{
background-color: #e74c3c;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.progress-info .bar{
background-color: #3498db;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.subnav
{
background-image: none;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
// MEDIA QUERIES
// --------------------------------------------------
This diff is collapsed.
This diff is collapsed.
// Flatness by Jenil (www.jgog.in)
// Bootswatch 2.3.1
// -----------------------------------------------------
// TYPOGRAPHY
// --------------------------------------------------
@import url("http://fonts.googleapis.com/css?family=Lato:400,700,900,400italic");
h1 {
font-size: 48px;
font-weight: 900;
}
h2 {
font-size: 36px;
font-weight: 700;
}
h3 {
font-size: 28px;
font-weight: 700;
}
h4 {
font-size: 24px;
font-weight: 500;
}
h5 {
font-size: 16px;
font-weight: 500;
}
h6 {
font-size: 13px;
font-weight: 500;
text-transform: none;
}
p {
margin-bottom: 1em;
}
// SCAFFOLDING
// --------------------------------------------------
.page-header {
border-bottom: none;
}
// NAVBAR
// --------------------------------------------------
.navbar {
.brand {
text-shadow: none;
&:hover {
color: @linkColorHover;
}
}
.navbar-inner {
.box-shadow(none);
}
.nav > li > a {
text-shadow: none;
}
.nav > .active > a,
.nav > .active > a:hover,
.nav > .active > a:focus {
.box-shadow(none);
}
.navbar-search .search-query {
border: none;
.box-shadow(none);
line-height: normal;
}
.btn-navbar {
background-image: none;
.box-shadow(none);
}
&-inverse {
.navbar-search .search-query {
border-color: transparent;
.box-shadow(none);
line-height: normal;
color: @textColor;
&:focus {
padding: 4px 14px;
color: @textColor;
}
}
}
}
div.subnav {
border-color: transparent;
background-image: none;
background-color: @grayLighter;
.box-shadow(none);
&-fixed {
top: @navbarHeight;
}
.nav > li > a {
border-color: transparent;
.box-shadow(none);
color: @textColor;
}
.nav > .active > a,
.nav > .active > a:hover {
border-color: transparent;
background-color: darken(@grayLighter, 10%);
.box-shadow(none);
color: @textColor;
}
}
// NAVIGATION
// --------------------------------------------------
.nav-list {