aboutsummaryrefslogtreecommitdiff
path: root/themes/even/src/css/_variables.scss
diff options
context:
space:
mode:
authorJulio Capote <jcapote@gmail.com>2018-11-06 02:49:16 +0000
committerJulio Capote <jcapote@gmail.com>2018-11-06 02:49:16 +0000
commita62a3e7755579d93ce3a87243dd277575930fffe (patch)
tree6d074f7294c5b7a45bed7ac229a6802830da2a04 /themes/even/src/css/_variables.scss
downloadcapotej.com-a62a3e7755579d93ce3a87243dd277575930fffe.tar.gz
init
Diffstat (limited to 'themes/even/src/css/_variables.scss')
-rw-r--r--themes/even/src/css/_variables.scss336
1 files changed, 336 insertions, 0 deletions
diff --git a/themes/even/src/css/_variables.scss b/themes/even/src/css/_variables.scss
new file mode 100644
index 0000000..06d7507
--- /dev/null
+++ b/themes/even/src/css/_variables.scss
@@ -0,0 +1,336 @@
+// ==============================
+// Variables
+// ==============================
+
+// ========== Theme Color ========== //
+// Config here to change theme color
+// Default | Mint Green | Cobalt Blue | Hot Pink | Dark Violet
+$theme-color-config: 'Default';
+
+// Default theme color map
+$theme-color-map: (
+ 'Default': #c05b4d #f8f5ec,
+ 'Mint Green': #16982B #f5f5f5,
+ 'Cobalt Blue': #0047AB #f0f2f5,
+ 'Hot Pink': #FF69B4 #f8f5f5,
+ 'Dark Violet': #9932CC #f5f4fa
+);
+
+// Check theme color config.
+// if it does not exist, use default theme color.
+@if not(map-has-key($theme-color-map, $theme-color-config)) {
+ $theme-color-config: 'Default';
+}
+$theme-color-list: map-get($theme-color-map, $theme-color-config);
+
+// Default theme color of the site.
+$theme-color: nth($theme-color-list, 1) !default;
+
+// Deputy theme color of the site.
+$deputy-color: nth($theme-color-list, 2) !default;
+
+
+// ========== Color ========== //
+$black: #0a0a0a !default;
+$white: #fefefe !default;
+$light-gray: #e6e6e6 !default;
+$gray: #cacaca !default;
+$dark-gray: #8a8a8a !default;
+
+
+// ========== Global ========== //
+// Text color of the body.
+$global-font-color: #34495e !default;
+
+// Font size attribute applied to '<html>' and '<body>'.
+$global-font-size: 16px !default;
+
+// Global width of '<body>'.
+$global-body-width: 800px !default;
+
+// Padding of container main
+$global-container-padding: 0 20px !default;
+
+// Default line height for all type. `$global-lineheight` is 24px while `$global-font-size` is 16px.
+$global-lineheight: 1.5 !default;
+
+// Font family of the site.
+$global-font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif !default;
+
+// Serif font family of the site.
+$global-serif-font-family: Athelas, STHeiti, Microsoft Yahei, serif !default;
+
+// Background color of the site.
+$global-background: $white !default;
+
+// Headings font size of the site.
+$global-headings: (
+ h1: 26px,
+ h2: 24px,
+ h3: 20px,
+ h4: 16px,
+ h5: 14px,
+ h6: 14px
+) !default;
+
+
+// ========== Header ========== //
+// Padding of the site header.
+$header-padding: 20px 20px !default;
+
+// Font family: Chancery
+@font-face {
+ font-family: 'Chancery';
+ src: url('../fonts/chancery/apple-chancery-webfont.eot');
+ src: local('Apple Chancery'), url('../fonts/chancery/apple-chancery-webfont.eot?#iefix') format('embedded-opentype'),
+ url('../fonts/chancery/apple-chancery-webfont.woff2') format('woff2'),
+ url('../fonts/chancery/apple-chancery-webfont.woff') format('woff'),
+ url('../fonts/chancery/apple-chancery-webfont.ttf') format('truetype'),
+ url('../fonts/chancery/apple-chancery-webfont.svg#apple-chancery') format('svg');
+ font-weight: lighter;
+ font-style: normal;
+}
+
+// Font size of the logo.
+$logo-font-size: 48px !default;
+
+// Font family of the logo.
+$logo-font-family: 'Chancery', cursive, LiSu, sans-serif !default;
+
+// Margin of menu item.
+$menu-item-margin-left: 10px !default;
+
+// Margin of menu item in mobile.
+$menu-item-mobile-margin: 5px !default;
+
+// Font size of menu item link.
+$menu-link-font-size: 18px !default;
+
+// Height of the mobile header.
+$mobile-navbar-height: 50px !default;
+
+// ========== Post ========== //
+// Margin bottom of post list.
+$post-list-margin-bottom: 20px !default;
+
+// Padding of the post.
+$post-padding: 1.5em 0 !default;
+
+// Border top of the post + post.
+$post-border: 1px solid $light-gray !default;
+
+// Font size of post title.
+$post-title-font-size: 27px !default;
+
+// Font weight of post title.
+$post-title-font-weight: 400 !default;
+
+// Margin top of the post meta (post time).
+$post-meta-margin-top: 5px !default;
+
+// Font color of the post meta.
+$post-meta-font-color: $dark-gray !default;
+
+// Border bottom of the read more link when hover it.
+$post-readMore-border-bottom: 1px solid $theme-color !default;
+
+// Margin top of the post footer.
+$post-footer-margin-top: 20px !default;
+
+// Border top of post footer.
+$post-footer-border-top: 1px solid $light-gray !default;
+
+// Padding of the post tags.
+$post-tags-padding: 15px 0 !default;
+
+// Font size of post pagination.
+$post-nav-font-size: 18px !default;
+
+
+// ========== TOC ========== //
+// Width of the post toc.
+$post-toc-width: 200px !default;
+
+// Backgroud color of the post toc.
+$post-toc-backgroud: rgba($deputy-color, 0.6) !default;
+
+// Margin left of the post toc.
+$post-toc-margin-left: $global-body-width - 15px !default;
+
+// Font size of the post toc title.
+$post-toc-title-size: 20px !default;
+
+// Font size of the post toc content.
+$post-toc-content: 15px !default;
+
+// List style of the post toc list.
+$post-toc-list-style: square !default;
+
+// Max screen media of the post toc.
+$toc-max-sreen-width: 2 * $post-toc-width + $post-toc-margin-left !default;
+
+// ========== Content ========== //
+// Headings anchor.
+$content-headings-anchor: "" !default;
+
+// Border bottom of the link when hover it.
+$content-link-border: 1px solid $theme-color !default;
+
+// Background color of the blockquote.
+$content-blockquote-backgroud: rgba($theme-color, 0.05) !default;
+
+// Border left of the blockquote.
+$content-blockquote-border-left: 3px solid rgba($theme-color, 0.3) !default;
+
+// Border color of the table.
+$content-table-border-color: darken($deputy-color, 3%) !default;
+
+// ========== Code ========== //
+// Color of the code.
+$code-color: #c7254e !default;
+
+// Font size of code.
+$code-font-size: 13px !default;
+
+// Font family of the code.
+$code-font-family: Consolas, Monaco, Menlo, Consolas, monospace !default;
+
+// Color of code highlight, solarized.
+$code-highlight-color: (
+ comment: #93a1a1,
+ keyword: #859900,
+ number: #2aa198,
+ title: #268bd2,
+ attribute: #b58900,
+ symbol: #cb4b16,
+ built_in: #dc322f,
+ formula: #eee8d5
+) !default;
+
+// Code type list.
+$code-type-list: (
+ // Custom code type
+ language-bash: "Bash",
+ language-c: "C",
+ language-cs: "C#",
+ language-cpp: "C++",
+ language-css: "CSS",
+ language-coffeescript: "CoffeeScript",
+ language-html: "HTML",
+ language-xml: "XML",
+ language-http: "HTTP",
+ language-json: "JSON",
+ language-java: "Java",
+ language-js: "JavaScript",
+ language-javascript: "JavaScript",
+ language-makefile: "Makefile",
+ language-markdown: "Markdown",
+ language-objectivec: "Objective-C",
+ language-php: "PHP",
+ language-perl: "Perl",
+ language-python: "Python",
+ language-ruby: "Ruby",
+ language-sql: "SQL",
+ language-shell: "Shell",
+
+ language-erlang: "Erlang",
+ language-go: "Go",
+ language-groovy: "Groovy",
+ language-haskell: "Haskell",
+ language-kotlin: "Kotlin",
+ language-less: "Less",
+ language-lisp: "Lisp",
+ language-lua: "Lua",
+ language-matlab: "Matlab",
+ language-rust: "Rust",
+ language-scss: "Scss",
+ language-scala: "Scala",
+ language-swift: "Swift",
+ language-typescript: "TypeScript",
+ language-yml: "YAML",
+ language-yaml: "YAML",
+ language-toml: "TOML"
+) !default;
+
+// Color of the code background.
+$code-background: $deputy-color !default;
+
+
+// ========== Pagination ========== //
+// Margin of the pagination.
+$pagination-margin: 2em 0 !default;
+
+// Font size of the pagination (Without post, post pagination see line 140).
+$pagination-font-size: 20px !default;
+
+
+// ========== Footer ========== //
+// Margin top of the footer.
+$footer-margin-top: 2em !default;
+
+// Margin left of the social link.
+$social-link-margin-left: 10px !default;
+
+// Font size of the social icon.
+$social-icon-font-size: 30px !default;
+
+// Margin of the copyright.
+$copyright-margin: 10px 0 !default;
+
+
+// ========== Archive ========== //
+// Margin of the archive.
+$archive-margin: 2em 0px !default;
+
+// Max width of the archive.
+$archive-max-width: 550px !default;
+
+// Font size of the archive name.
+$archive-name-font-size: 30px !default;
+
+// Font size of the collection title.
+$collection-title-font-size: 28px !default;
+
+// Padding of the archive post.
+$archive-post-padding: 3px 20px !default;
+
+// Padding of the archive post in mobile.
+$archive-post-mobile-padding: 5px 10px !default;
+
+// Font size of the archive post time in mobile.
+$archive-post-mobile-time-font-size: 13px !default;
+
+// Border left of the archive post, use $archive-post-hover-border-left when hover it.
+$archive-post-border-left: 1px solid $gray !default;
+$archive-post-hover-border-left: 3px solid $theme-color !default;
+
+// Transition of the archive post when hover it.
+$archive-post-hover-transition: 0.2s ease-out !default;
+
+// Transform of the archive post when hover it.
+$archive-post-hover-transform: translateX(4px) !default;
+
+
+// ========== Tags ========== //
+// Font soze of the tag cloud title.
+$tag-cloud-title-size: 18px !default;
+
+// Border bottom of the tag cloud title.
+$tag-cloud-title-border-bottom: 2px solid $theme-color !default;
+
+// Margin of the tag cloud tags link.
+$tag-cloud-tags-link-margin: 5px 10px !default;
+
+
+// ========== Categories ========== //
+// Font soze of the categories title.
+$categories-title-size: 18px !default;
+
+// Border bottom of the categories title.
+$categories-title-border-bottom: 2px solid $theme-color !default;
+
+// Margin of the categories tags link.
+$categories-tags-link-margin: 5px 10px !default;
+
+// Font size of the category count
+$category-count-font-size: 12px !default;