#59, Allow customize SASS vars, add example of dark theme
This commit is contained in:
parent
77255304f3
commit
3e3a3346e1
7 changed files with 47 additions and 41 deletions
|
@ -1,43 +1,43 @@
|
|||
// Used in layout
|
||||
$padding-1: 1px;
|
||||
$padding-4: 0.25rem;
|
||||
$padding-8: 0.5rem;
|
||||
$padding-16: 1rem;
|
||||
$padding-1: 1px !default;
|
||||
$padding-4: 0.25rem !default;
|
||||
$padding-8: 0.5rem !default;
|
||||
$padding-16: 1rem !default;
|
||||
|
||||
$font-size-base: 16px;
|
||||
$font-size-12: 0.75rem;
|
||||
$font-size-14: 0.875rem;
|
||||
$font-size-16: 1rem;
|
||||
$font-size-base: 16px !default;
|
||||
$font-size-12: 0.75rem !default;
|
||||
$font-size-14: 0.875rem !default;
|
||||
$font-size-16: 1rem !default;
|
||||
|
||||
$border-radius: 0.15rem;
|
||||
$border-radius: 0.15rem !default;
|
||||
|
||||
// Grayscale
|
||||
$white: #ffffff;
|
||||
$gray-100: #f8f9fa;
|
||||
$gray-200: #e9ecef;
|
||||
$gray-300: #dee2e6;
|
||||
$gray-400: #ced4da;
|
||||
$gray-500: #adb5bd;
|
||||
$gray-600: #868e96;
|
||||
$gray-700: #495057;
|
||||
$gray-800: #343a40;
|
||||
$gray-900: #212529;
|
||||
$black: #000;
|
||||
$white: #ffffff !default;
|
||||
$gray-100: #f8f9fa !default;
|
||||
$gray-200: #e9ecef !default;
|
||||
$gray-300: #dee2e6 !default;
|
||||
$gray-400: #ced4da !default;
|
||||
$gray-500: #adb5bd !default;
|
||||
$gray-600: #868e96 !default;
|
||||
$gray-700: #495057 !default;
|
||||
$gray-800: #343a40 !default;
|
||||
$gray-900: #212529 !default;
|
||||
$black: #000 !default;
|
||||
|
||||
$color-link: #004ed0;
|
||||
$color-visited-link: #8440f1;
|
||||
$color-dark-link: $gray-800;
|
||||
$color-link: #004ed0 !default;
|
||||
$color-visited-link: #8440f1 !default;
|
||||
$color-dark-link: $gray-800 !default;
|
||||
|
||||
$body-background: white;
|
||||
$body-font-color: $gray-800;
|
||||
$body-font-weight: normal;
|
||||
$body-background: white !default;
|
||||
$body-font-color: $gray-800 !default;
|
||||
$body-font-weight: normal !default;
|
||||
|
||||
$body-min-width: 20rem;
|
||||
$container-max-width: 80rem;
|
||||
$body-min-width: 20rem !default;
|
||||
$container-max-width: 80rem !default;
|
||||
|
||||
$header-height: 3.5rem;
|
||||
$menu-width: 16rem;
|
||||
$toc-width: 16rem;
|
||||
$header-height: 3.5rem !default;
|
||||
$menu-width: 16rem !default;
|
||||
$toc-width: 16rem !default;
|
||||
|
||||
$md-breakpoint: $menu-width + $body-min-width * 1.25 + $toc-width;
|
||||
$sm-breakpoint: $menu-width + $body-min-width;
|
||||
$md-breakpoint: $menu-width + $body-min-width * 1.25 + $toc-width !default;
|
||||
$sm-breakpoint: $menu-width + $body-min-width !default;
|
||||
|
|
|
@ -1 +1,2 @@
|
|||
@import "variables";
|
||||
// You can add custom styles here.
|
||||
|
|
13
exampleSite/assets/_variables.scss
Normal file
13
exampleSite/assets/_variables.scss
Normal file
|
@ -0,0 +1,13 @@
|
|||
// You can override SASS variables here. Below example of simple dark theme.
|
||||
|
||||
/*
|
||||
$gray-100: rgba(255, 255, 255, 0.1);
|
||||
$gray-200: rgba(255, 255, 255, 0.2);
|
||||
|
||||
$body-background: #343a40;
|
||||
$body-font-color: #e9ecef;
|
||||
|
||||
$color-link: #84b2ff;
|
||||
$color-visited-link: #b88dff;
|
||||
$color-dark-link: $body-font-color;
|
||||
*/
|
File diff suppressed because one or more lines are too long
|
@ -1 +0,0 @@
|
|||
{"Target":"search-data.min.d8cb1397d75559602eb3c92473e1c14b41f6d6198ea34823cb48fc4298b46ee8.js","MediaType":"application/javascript","Data":{"Integrity":"sha256-2MsTl9dVWWAus8kkc+HBS0H21hmOo0gjy0j8Qpi0bug="}}
|
|
@ -1,5 +0,0 @@
|
|||
(function(){const input=document.querySelector("#book-search-input");const results=document.querySelector("#book-search-results");input.addEventListener("focus",init);input.addEventListener("keyup",search);function init(){input.removeEventListener("focus",init);input.required=true;loadScript("/theme/hugo-book/lunr.min.js");loadScript("/theme/hugo-book/search-data.min.d8cb1397d75559602eb3c92473e1c14b41f6d6198ea34823cb48fc4298b46ee8.js",function(){input.readOnly=false;input.required=false;search();});}
|
||||
function search(){while(results.firstChild){results.removeChild(results.firstChild);}
|
||||
if(!input.value){return;}
|
||||
const terms=lunr.tokenizer(input.value);const searchHits=window.bookSearch.idx.query(function(query){query.term(terms,{boost:100});query.term(terms,{boost:10,wildcard:lunr.Query.wildcard.LEADING|lunr.Query.wildcard.TRAILING});query.term(terms,{editDistance:2});});searchHits.slice(0,10).forEach(function(hit){const page=window.bookSearch.pages[hit.ref];const li=document.createElement("li"),a=li.appendChild(document.createElement("a"));a.href=page.href;a.textContent=page.title;results.appendChild(li);});}
|
||||
function loadScript(src,callback){const script=document.createElement("script");script.defer=true;script.src=src;script.onload=callback;document.head.append(script);}})();
|
|
@ -1 +0,0 @@
|
|||
{"Target":"search.min.da4874ea4f4a57ac6e394d9c0e5d4c8a0aee75879f3d801250bf2fe7d72e1ff9.js","MediaType":"application/javascript","Data":{"Integrity":"sha256-2kh06k9KV6xuOU2cDl1MigrudYefPYASUL8v59cuH/k="}}
|
Loading…
Reference in a new issue