diff options
Diffstat (limited to 'theme/stylesheets/website/variables.less')
| -rw-r--r-- | theme/stylesheets/website/variables.less | 177 |
1 files changed, 177 insertions, 0 deletions
diff --git a/theme/stylesheets/website/variables.less b/theme/stylesheets/website/variables.less new file mode 100644 index 0000000..a4c75f6 --- /dev/null +++ b/theme/stylesheets/website/variables.less @@ -0,0 +1,177 @@ +@staticPath: "./"; + +// Sizes +@mobileMaxWidth: 1240px; + +// Header +@header-height: 50px; +@header-color: hsl(194, 5%, 52%); +@header-background: white; +@header-border: rgba(0, 0, 0, 0.07); +@header-button-color: hsl(194, 5%, 52%); +@header-button-hover-color: #151515; +@header-button-hover-background: hsl(207, 15%, 95%); + +// Body +@body-background: white; + +// Sidebar +@sidebar-width: 250px; +@sidebar-breakpoint: 600px; +@sidebar-color: hsl(207, 15%, 80%); +@sidebar-background: @body-background; +@sidebar-border: @header-border; + +@sidebar-nested-padding: 20px; + +@sidebar-search-padding: 6px; +@sidebar-search-background: transparent; +@sidebar-search-input-border-color: @sidebar-border; + +@sidebar-divider-color: @sidebar-border; + +@sidebar-link-color: hsl(207, 15%, 25%); +@sidebar-link-background: transparent; +@sidebar-link-hover-color: hsl(207, 100%, 50%); +@sidebar-link-hover-background: transparent; + +@sidebar-icon-color: @bar-progress-background; +@sidebar-link-completed: @sidebar-link-color; +@sidebar-link-completed-weight: normal; + +// Page +@page-color: black; +@page-background: @body-background; + +// Content +@content-line-height: 1.6em; + +// Progress Bar +@chapter-display: none; +@chapter-size: 16px; + +@progress-height: 0px; + +@bar-height: 2px; +@bar-left: @sidebar-width; +@bar-right: 0; +@bar-top: 50px; +@bar-position: static; +@bar-background: white; +@bar-progress-background: hsl(120, 60%, 50%); + +// Basics of a navbar +@navbar-height: 50px; +@navbar-margin-bottom: @line-height-computed; +@navbar-default-border: #d5d5d5; +@navbar-border-radius: 0px; +@navbar-padding-horizontal: floor(@grid-gutter-width / 2); +@navbar-padding-vertical: ((@navbar-height - @line-height-computed) / 2); + +// Navbar brand label +@navbar-default-color: #333; +@navbar-default-link-color: #333; +@navbar-default-brand-color: @navbar-default-link-color; +@navbar-default-brand-hover-color: @navbar-default-link-color; +@navbar-default-brand-hover-bg: transparent; + +// Border Radius +@border-radius-base: 1px; +@border-radius-large: 3px; +@border-radius-small: 1px; + +// Fonts +@font-family-serif: "Merriweather", Georgia, serif; +@font-family-sans: "Open Sans", "Clear Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; +@font-family-base: @font-family-sans; +@headings-font-family: inherit; + +@FontPath: '@{staticPath}/fonts'; +@fa-font-path: "@{FontPath}/fontawesome"; + +@s-font-size: 1.2rem; +@m-font-size: 1.4rem; +@l-font-size: 1.6rem; +@xl-font-size: 2.2rem; +@xxl-font-size: 4.0rem; +@default-font-size: @l-font-size; + +/* +,--------.,--. +'--. .--'| ,---. ,---. ,--,--,--. ,---. ,---. .--. + | | | .-. || .-. :| || .-. :( .-' '--' + | | | | | |\ --.| | | |\ --..-' `).--. + `--' `--' `--' `----'`--`--`--' `----'`----' '--' +*/ +// Header +@header-color-1: #AFA790; +@header-color-2: #7e888b; +@header-background-1: #ECE3C4; +@header-background-2: #1d1f21; +@header-button-color-1: #AFA790; +@header-button-color-2: #7e888b; +@header-button-hover-color-1: #73553C; +@header-button-hover-color-2: #C9C9C9; +@header-button-hover-background-1: #E2DABE; +@header-button-hover-background-2: #0B0D0E; + +// Body +@body-background-1: #F3EACB; +@body-background-2: #1d1f21; + +// Sidebar +@sidebar-color-1: #AFA790; +@sidebar-color-2: hsl(207, 15%, 80%); +@sidebar-background-1: @body-background-1; +@sidebar-background-2: @body-background-2; + +@sidebar-search-background-1: transparent; +@sidebar-search-background-2: transparent; +@sidebar-search-input-border-color-1: #D6CFBA; +@sidebar-search-input-border-color-2: #000; + +@sidebar-divider-color-1: @sidebar-divider-color; +@sidebar-divider-color-2: #1d1f21; + +@sidebar-link-color-1: #877F6A; +@sidebar-link-color-2: hsl(207, 15%, 50%); +@sidebar-link-background-1: transparent; +@sidebar-link-background-2: transparent; +@sidebar-link-hover-color-1: #704214; +@sidebar-link-hover-color-2: hsl(207, 100%, 50%); +@sidebar-link-hover-background-1: transparent; +@sidebar-link-hover-background-2: transparent; + +@sidebar-icon-color-1: @bar-progress-background; +@sidebar-icon-color-2: @bar-progress-background; +@sidebar-link-completed-1: @sidebar-link-color-1; +@sidebar-link-completed-2: @sidebar-link-color-2; +@sidebar-link-completed-weight-1: normal; +@sidebar-link-completed-weight-2: normal; + +// Page +@page-color-1: #704214; +@page-color-2: #a4b1b1; +@page-background-1: #F3EACB; +@page-background-2: #1d1f21; + +@bar-background-1: #F3EACB; +@bar-background-2: #1d1f21; +@bar-progress-background-1: #704214; +@bar-progress-background-2: hsl(120, 60%, 50%); + +// Basics of a navbar +@navbar-default-border-1: #d5d5d5; +@navbar-default-border-2: #d5d5d5; + +// Navbar brand label +@navbar-default-color-1: #333; +@navbar-default-color-2: #333; +@navbar-default-link-color-1: #333; +@navbar-default-link-color-2: #333; +@navbar-default-brand-color-1: @navbar-default-link-color; +@navbar-default-brand-color-2: @navbar-default-link-color; +@navbar-default-brand-hover-color-1: @navbar-default-link-color; +@navbar-default-brand-hover-color-2: @navbar-default-link-color; +@navbar-default-brand-hover-bg-1: transparent; +@navbar-default-brand-hover-bg-2: transparent; |