Commit 1538b313 authored by Thomas Park's avatar Thomas Park
Browse files

readable: refresh styles

parent 9e99f300
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -2,23 +2,22 @@ ...@@ -2,23 +2,22 @@
// Bootswatch // Bootswatch
// ----------------------------------------------------- // -----------------------------------------------------
@import url("//fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic"); @import url("//fonts.googleapis.com/css?family=Raleway:700");
.btn-shadow(@color) {
#gradient > .vertical-three-colors(lighten(@color, 10%), @color, 6%, darken(@color, 4%));
filter: none;
border: 1px solid darken(@color, 10%);
}
// Navbar ===================================================================== // Navbar =====================================================================
.navbar { .navbar {
.box-shadow(0 1px 4px rgba(0, 0, 0, 0.2)); font-family: @headings-font-family;
text-transform: uppercase;
&-nav > li > a { &-nav > li > a {
padding-top: @navbar-padding-vertical + 6px; padding-top: @navbar-padding-vertical + 6px;
} }
&-nav > li > a:hover {
text-decoration: underline;
}
&-brand { &-brand {
padding-top: @navbar-padding-vertical + 5px; padding-top: @navbar-padding-vertical + 5px;
} }
...@@ -26,38 +25,21 @@ ...@@ -26,38 +25,21 @@
// Buttons ==================================================================== // Buttons ====================================================================
.btn-default, .btn {
.btn-default:hover { font-family: @headings-font-family;
.btn-shadow(@btn-default-bg); text-transform: uppercase;
}
.btn-primary,
.btn-primary:hover {
.btn-shadow(@btn-primary-bg);
} }
.btn-success, // Typography =================================================================
.btn-success:hover {
.btn-shadow(@btn-success-bg);
}
.btn-info,
.btn-info:hover {
.btn-shadow(@btn-info-bg);
}
.btn-warning, h1, h2, h3, h4, h5, h6 {
.btn-warning:hover { text-transform: uppercase;
.btn-shadow(@btn-warning-bg);
} }
.btn-danger, p {
.btn-danger:hover { margin-bottom: 1.4em;
.btn-shadow(@btn-danger-bg);
} }
// Typography =================================================================
// Tables ===================================================================== // Tables =====================================================================
// Forms ====================================================================== // Forms ======================================================================
......
readable/thumbnail.png

26 KB | W: | H:

readable/thumbnail.png

29.8 KB | W: | H:

readable/thumbnail.png
readable/thumbnail.png
readable/thumbnail.png
readable/thumbnail.png
  • 2-up
  • Swipe
  • Onion skin
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
// Brand colors // Brand colors
// ------------------------- // -------------------------
@brand-primary: #428bca; @brand-primary: #4582EC;
@brand-success: #5cb85c; @brand-success: #5cb85c;
@brand-warning: #f0ad4e; @brand-warning: #f0ad4e;
@brand-danger: #d9534f; @brand-danger: #d9534f;
...@@ -27,24 +27,24 @@ ...@@ -27,24 +27,24 @@
// Scaffolding // Scaffolding
// ------------------------- // -------------------------
@body-bg: #f9f9f9; @body-bg: #fcfcfc;
@text-color: @gray-dark; @text-color: @gray-dark;
// Links // Links
// ------------------------- // -------------------------
@link-color: @brand-primary; @link-color: @brand-primary;
@link-hover-color: @link-color; @link-hover-color: darken(@link-color, 20%);
// Typography // Typography
// ------------------------- // -------------------------
@font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif; @font-family-sans-serif: "Raleway", "Helvetica Neue", Helvetica, Arial, sans-serif;
@font-family-serif: "Lora", Georgia, "Times New Roman", Times, serif; @font-family-serif: Georgia, "Times New Roman", Times, serif;
@font-family-monospace: Monaco, Menlo, Consolas, "Courier New", monospace; @font-family-monospace: Monaco, Menlo, Consolas, "Courier New", monospace;
@font-family-base: @font-family-serif; @font-family-base: @font-family-serif;
@font-size-base: 17px; @font-size-base: 16px;
@font-size-large: ceil(@font-size-base * 1.25); // ~18px @font-size-large: ceil(@font-size-base * 1.25); // ~18px
@font-size-small: ceil(@font-size-base * 0.85); // ~12px @font-size-small: ceil(@font-size-base * 0.85); // ~12px
...@@ -58,7 +58,7 @@ ...@@ -58,7 +58,7 @@
@line-height-base: 1.428571429; // 20/14 @line-height-base: 1.428571429; // 20/14
@line-height-computed: floor(@font-size-base * @line-height-base); // ~20px @line-height-computed: floor(@font-size-base * @line-height-base); // ~20px
@headings-font-family: @font-family-base; @headings-font-family: @font-family-sans-serif;
@headings-font-weight: bold; @headings-font-weight: bold;
@headings-line-height: 1.1; @headings-line-height: 1.1;
@headings-color: inherit; @headings-color: inherit;
...@@ -260,16 +260,16 @@ ...@@ -260,16 +260,16 @@
@navbar-padding-horizontal: floor(@grid-gutter-width / 2); @navbar-padding-horizontal: floor(@grid-gutter-width / 2);
@navbar-padding-vertical: ((@navbar-height - @line-height-computed) / 2); @navbar-padding-vertical: ((@navbar-height - @line-height-computed) / 2);
@navbar-default-color: @gray; @navbar-default-color: @text-color;
@navbar-default-bg: @body-bg; @navbar-default-bg: @body-bg;
@navbar-default-border: darken(@navbar-default-bg, 6.5%); @navbar-default-border: transparent;
// Navbar links // Navbar links
@navbar-default-link-color: @navbar-default-color; @navbar-default-link-color: @link-color;
@navbar-default-link-hover-color: @gray-dark; @navbar-default-link-hover-color: @link-hover-color;
@navbar-default-link-hover-bg: transparent; @navbar-default-link-hover-bg: transparent;
@navbar-default-link-active-color: @navbar-default-link-hover-color; @navbar-default-link-active-color: @navbar-default-link-color;
@navbar-default-link-active-bg: darken(@navbar-default-bg, 10%); @navbar-default-link-active-bg: transparent;
@navbar-default-link-disabled-color: #333; @navbar-default-link-disabled-color: #333;
@navbar-default-link-disabled-bg: transparent; @navbar-default-link-disabled-bg: transparent;
...@@ -289,14 +289,14 @@ ...@@ -289,14 +289,14 @@
// Reset inverted navbar basics // Reset inverted navbar basics
@navbar-inverse-color: @gray-light; @navbar-inverse-color: @gray-light;
@navbar-inverse-bg: @text-color; @navbar-inverse-bg: @text-color;
@navbar-inverse-border: darken(@navbar-inverse-bg, 10%); @navbar-inverse-border: transparent;
// Inverted navbar links // Inverted navbar links
@navbar-inverse-link-color: @gray-light; @navbar-inverse-link-color: @gray-light;
@navbar-inverse-link-hover-color: #fff; @navbar-inverse-link-hover-color: #fff;
@navbar-inverse-link-hover-bg: transparent; @navbar-inverse-link-hover-bg: transparent;
@navbar-inverse-link-active-color: @navbar-inverse-link-hover-color; @navbar-inverse-link-active-color: @navbar-inverse-link-color;
@navbar-inverse-link-active-bg: darken(@navbar-inverse-bg, 10%); @navbar-inverse-link-active-bg: transparent;
@navbar-inverse-link-disabled-color: #ccc; @navbar-inverse-link-disabled-color: #ccc;
@navbar-inverse-link-disabled-bg: transparent; @navbar-inverse-link-disabled-bg: transparent;
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment