|
|
|
|
/* VARIABLES
|
|
|
|
|
----------------------------------------------------- */
|
|
|
|
|
|
|
|
|
|
/* COLOR SCHEME
|
|
|
|
|
================================================== */
|
|
|
|
|
@color-theme-dark: darken(@color-theme, 15);
|
|
|
|
|
@color-theme-complement: spin(@color-theme, 180);
|
|
|
|
|
@color-theme-complement-dark: darken(@color-theme-complement, 15);
|
|
|
|
|
|
|
|
|
|
@color-theme-split1: spin(@color-theme, -158);
|
|
|
|
|
@color-theme-split2: spin(@color-theme, 158);
|
|
|
|
|
|
|
|
|
|
@color-theme-triad1: spin(@color-theme, -135);
|
|
|
|
|
@color-theme-triad2: spin(@color-theme, 135);
|
|
|
|
|
|
|
|
|
|
@color-theme-tetra1: spin(@color-theme, -90);
|
|
|
|
|
@color-theme-tetra2: spin(@color-theme, 90);
|
|
|
|
|
|
|
|
|
|
@color-theme-analog1: spin(@color-theme, -22);
|
|
|
|
|
@color-theme-analog2: spin(@color-theme, 22);
|
|
|
|
|
|
|
|
|
|
@color-background: @color-base;
|
|
|
|
|
|
|
|
|
|
@white: @color-base;
|
|
|
|
|
|
|
|
|
|
/* NAVIGATION COLORS
|
|
|
|
|
================================================== */
|
|
|
|
|
@color-nav-date: #AAA; // 33%
|
|
|
|
|
@color-nav-description: @color-dark-fourth; // 40%
|
|
|
|
|
@color-nav-title: @color-dark-fourth;
|
|
|
|
|
|
|
|
|
|
@color-navigation-time: @color-dark-third; // 60%
|
|
|
|
|
@color-navigation-major-time: @color-dark-second; // 80%
|
|
|
|
|
@color-navigation-time-strong: @color-dark; // 100%
|
|
|
|
|
|
|
|
|
|
@era-background: #E2E2E2; //#E3E3E3; // 11%
|
|
|
|
|
@era-line: @color-line;
|
|
|
|
|
@era-text: @color-feature-date;
|
|
|
|
|
|
|
|
|
|
/* FEATURE COLORS
|
|
|
|
|
================================================== */
|
|
|
|
|
@color-feature-date: @color-dark-fourth;
|
|
|
|
|
@color-feature-description: @color-dark-third;
|
|
|
|
|
@color-feature-title: @color-dark;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@color-caption: @color-dark-third;
|
|
|
|
|
@color-credit: @color-dark-fourth;
|
|
|
|
|
|
|
|
|
|
/* BASE SIZES
|
|
|
|
|
================================================== */
|
|
|
|
|
@base-font: 15px;
|
|
|
|
|
@base-line: 20px;
|
|
|
|
|
@base-space: 15px;
|
|
|
|
|
@base-font-small: 11px;
|
|
|
|
|
@base-thumb: 24px;
|
|
|
|
|
|
|
|
|
|
/* FEATURE SIZES
|
|
|
|
|
================================================== */
|
|
|
|
|
@feature-content-text: 200px;
|
|
|
|
|
@feature-content-width: 720px;
|
|
|
|
|
@feature-content-height: 400px;
|
|
|
|
|
@feature-nav-width: 100px;
|
|
|
|
|
@feature-nav-height: 200px;
|
|
|
|
|
@feature-nav-icon-wh: 24px;
|
|
|
|
|
|
|
|
|
|
/* NAVIGATION SIZES
|
|
|
|
|
================================================== */
|
|
|
|
|
@navigation-height: 200px;
|
|
|
|
|
@navigation-time-height: 50px;
|
|
|
|
|
@navigation-content-height: @navigation-height - @navigation-time-height;
|
|
|
|
|
@navigation-marker-height: 6px;
|
|
|
|
|
|
|
|
|
|
/* MIXINS
|
|
|
|
|
================================================== */
|
|
|
|
|
.box-shadow(@shadow: 1px 1px 7px rgba(0,0,0,.30)) {
|
|
|
|
|
-webkit-box-shadow: @shadow;
|
|
|
|
|
-moz-box-shadow: @shadow;
|
|
|
|
|
box-shadow: @shadow;
|
|
|
|
|
}
|
|
|
|
|
.media-shadow(@shadow: 0 1px 3px 0px @color-dark-fourth) {
|
|
|
|
|
-webkit-box-shadow: @shadow;
|
|
|
|
|
-moz-box-shadow: @shadow;
|
|
|
|
|
box-shadow: @shadow;
|
|
|
|
|
border: 1px solid;
|
|
|
|
|
border-color: @color-line @color-dark-fourth @color-dark-fourth @color-line;
|
|
|
|
|
}
|
|
|
|
|
.text-font(@fontsize: 15px) {
|
|
|
|
|
font-size: @fontsize;
|
|
|
|
|
line-height: round((@fontsize/100) * 130);
|
|
|
|
|
}
|
|
|
|
|
|
