nishiki/hugo-theme-relearn
1
0
Fork 0
mirror of https://github.com/McShelby/hugo-theme-relearn.git synced 2024-11-23 15:57:57 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Fix custom theme's variable typo in --MENU-HOME-LINK-HOVERED-color

Browse source
This commit is contained in:
Helder Pereira 2021-08-23 23:37:10 +01:00
parent 757d2f06dc
commit c52ef52f2b
5 changed files with 76 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
exampleSite/content/basics/customization/_index.en.md
View file

@ -97,6 +97,9 @@ First, create a new CSS file in your local `static/css` folder prefixed by `them
--MAIN-LINK-HOVER-color:#167ad0; /* Color of hovered links */ --MAIN-LINK-HOVER-color:#167ad0; /* Color of hovered links */
--MAIN-ANCHOR-color: #1C90F3; /* color of anchors on titles */ --MAIN-ANCHOR-color: #1C90F3; /* color of anchors on titles */
--MENU-HOME-LINK-color: #323232; /* Color of the home button text */
--MENU-HOME-LINK-HOVER-color: #5e5e5e; /* Color of the hovered home button text */
--MENU-HEADER-BG-color:#1C90F3; /* Background color of menu header */ --MENU-HEADER-BG-color:#1C90F3; /* Background color of menu header */
--MENU-HEADER-BORDER-color:#33a1ff; /*Color of menu header border */ --MENU-HEADER-BORDER-color:#33a1ff; /*Color of menu header border */
@ -155,21 +158,26 @@ a:hover {
transition: width 0.5s ease; transition: width 0.5s ease;
background-color: var(--MAIN-LINK-HOVER-color); background-color: var(--MAIN-LINK-HOVER-color);
} }
#sidebar { #sidebar {
background-color: var(--MENU-SECTIONS-BG-color); background-color: var(--MENU-SECTIONS-BG-color);
} }
#sidebar #header-wrapper { #sidebar #header-wrapper {
background: var(--MENU-HEADER-BG-color); background: var(--MENU-HEADER-BG-color);
color: var(--MENU-SEARCH-BOX-color); color: var(--MENU-SEARCH-BOX-color);
border-color: var(--MENU-HEADER-BORDER-color); border-color: var(--MENU-HEADER-BORDER-color);
} }
#sidebar .searchbox { #sidebar .searchbox {
border-color: var(--MENU-SEARCH-BOX-color); border-color: var(--MENU-SEARCH-BOX-color);
background: var(--MENU-SEARCH-BG-color); background: var(--MENU-SEARCH-BG-color);
} }
#sidebar ul.topics > li.parent, #sidebar ul.topics > li.active { #sidebar ul.topics > li.parent, #sidebar ul.topics > li.active {
background: var(--MENU-SECTIONS-ACTIVE-BG-color); background: var(--MENU-SECTIONS-ACTIVE-BG-color);
} }
#sidebar .searchbox * { #sidebar .searchbox * {
color: var(--MENU-SEARCH-BOX-ICONS-color); color: var(--MENU-SEARCH-BOX-ICONS-color);
} }
@ -190,6 +198,28 @@ a:hover {
#sidebar hr { #sidebar hr {
border-color: var(--MENU-SECTION-HR-color); border-color: var(--MENU-SECTION-HR-color);
} }
#body .tags a.tag-link {
background-color: var(--MENU-HEADER-BG-color);
}
#body .tags a.tag-link:before {
border-right-color: var(--MENU-HEADER-BG-color);
}
#homelinks {
background: var(--MENU-HEADER-BG-color);
background-color: var(--MENU-HEADER-BORDER-color);
border-bottom-color: var(--MENU-HEADER-BORDER-color);
}
#homelinks a {
color: var(--MENU-HOME-LINK-color);
}
#homelinks a:hover {
color: var(--MENU-HOME-LINK-HOVER-color);
}
``` ```
Then, set the `themeVariant` value with the name of your custom theme file. That's it! Then, set the `themeVariant` value with the name of your custom theme file. That's it!

8
static/css/theme-blue.css
View file

@ -24,7 +24,6 @@
--MENU-VISITED-color: #33a1ff; /* Color of 'page visited' icons in menu */ --MENU-VISITED-color: #33a1ff; /* Color of 'page visited' icons in menu */
--MENU-SECTION-HR-color: #20272b; /* Color of <hr> separator in menu */ --MENU-SECTION-HR-color: #20272b; /* Color of <hr> separator in menu */
} }
body { body {
@ -67,21 +66,26 @@ a:hover {
transition: width 0.5s ease; transition: width 0.5s ease;
background-color: var(--MAIN-LINK-HOVER-color); background-color: var(--MAIN-LINK-HOVER-color);
} }
#sidebar { #sidebar {
background-color: var(--MENU-SECTIONS-BG-color); background-color: var(--MENU-SECTIONS-BG-color);
} }
#sidebar #header-wrapper { #sidebar #header-wrapper {
background: var(--MENU-HEADER-BG-color); background: var(--MENU-HEADER-BG-color);
color: var(--MENU-SEARCH-BOX-color); color: var(--MENU-SEARCH-BOX-color);
border-color: var(--MENU-HEADER-BORDER-color); border-color: var(--MENU-HEADER-BORDER-color);
} }
#sidebar .searchbox { #sidebar .searchbox {
border-color: var(--MENU-SEARCH-BOX-color); border-color: var(--MENU-SEARCH-BOX-color);
background: var(--MENU-SEARCH-BG-color); background: var(--MENU-SEARCH-BG-color);
} }
#sidebar ul.topics > li.parent, #sidebar ul.topics > li.active { #sidebar ul.topics > li.parent, #sidebar ul.topics > li.active {
background: var(--MENU-SECTIONS-ACTIVE-BG-color); background: var(--MENU-SECTIONS-ACTIVE-BG-color);
} }
#sidebar .searchbox * { #sidebar .searchbox * {
color: var(--MENU-SEARCH-BOX-ICONS-color); color: var(--MENU-SEARCH-BOX-ICONS-color);
} }
@ -122,5 +126,5 @@ a:hover {
} }
#homelinks a:hover { #homelinks a:hover {
color: var(--MENU-HOME-LINK-HOVERED-color); color: var(--MENU-HOME-LINK-HOVER-color);
} }

8
static/css/theme-green.css
View file

@ -24,7 +24,6 @@
--MENU-VISITED-color: #599a3e; /* Color of 'page visited' icons in menu */ --MENU-VISITED-color: #599a3e; /* Color of 'page visited' icons in menu */
--MENU-SECTION-HR-color: #18211c; /* Color of <hr> separator in menu */ --MENU-SECTION-HR-color: #18211c; /* Color of <hr> separator in menu */
} }
body { body {
@ -67,21 +66,26 @@ a:hover {
transition: width 0.5s ease; transition: width 0.5s ease;
background-color: var(--MAIN-LINK-HOVER-color); background-color: var(--MAIN-LINK-HOVER-color);
} }
#sidebar { #sidebar {
background-color: var(--MENU-SECTIONS-BG-color); background-color: var(--MENU-SECTIONS-BG-color);
} }
#sidebar #header-wrapper { #sidebar #header-wrapper {
background: var(--MENU-HEADER-BG-color); background: var(--MENU-HEADER-BG-color);
color: var(--MENU-SEARCH-BOX-color); color: var(--MENU-SEARCH-BOX-color);
border-color: var(--MENU-HEADER-BORDER-color); border-color: var(--MENU-HEADER-BORDER-color);
} }
#sidebar .searchbox { #sidebar .searchbox {
border-color: var(--MENU-SEARCH-BOX-color); border-color: var(--MENU-SEARCH-BOX-color);
background: var(--MENU-SEARCH-BG-color); background: var(--MENU-SEARCH-BG-color);
} }
#sidebar ul.topics > li.parent, #sidebar ul.topics > li.active { #sidebar ul.topics > li.parent, #sidebar ul.topics > li.active {
background: var(--MENU-SECTIONS-ACTIVE-BG-color); background: var(--MENU-SECTIONS-ACTIVE-BG-color);
} }
#sidebar .searchbox * { #sidebar .searchbox * {
color: var(--MENU-SEARCH-BOX-ICONS-color); color: var(--MENU-SEARCH-BOX-ICONS-color);
} }
@ -122,5 +126,5 @@ a:hover {
} }
#homelinks a:hover { #homelinks a:hover {
color: var(--MENU-HOME-LINK-HOVERED-color); color: var(--MENU-HOME-LINK-HOVER-color);
} }

8
static/css/theme-red.css
View file

@ -24,7 +24,6 @@
--MENU-VISITED-color: #ff3333; /* Color of 'page visited' icons in menu */ --MENU-VISITED-color: #ff3333; /* Color of 'page visited' icons in menu */
--MENU-SECTION-HR-color: #2b2020; /* Color of <hr> separator in menu */ --MENU-SECTION-HR-color: #2b2020; /* Color of <hr> separator in menu */
} }
body { body {
@ -67,21 +66,26 @@ a:hover {
transition: width 0.5s ease; transition: width 0.5s ease;
background-color: var(--MAIN-LINK-HOVER-color); background-color: var(--MAIN-LINK-HOVER-color);
} }
#sidebar { #sidebar {
background-color: var(--MENU-SECTIONS-BG-color); background-color: var(--MENU-SECTIONS-BG-color);
} }
#sidebar #header-wrapper { #sidebar #header-wrapper {
background: var(--MENU-HEADER-BG-color); background: var(--MENU-HEADER-BG-color);
color: var(--MENU-SEARCH-BOX-color); color: var(--MENU-SEARCH-BOX-color);
border-color: var(--MENU-HEADER-BORDER-color); border-color: var(--MENU-HEADER-BORDER-color);
} }
#sidebar .searchbox { #sidebar .searchbox {
border-color: var(--MENU-SEARCH-BOX-color); border-color: var(--MENU-SEARCH-BOX-color);
background: var(--MENU-SEARCH-BG-color); background: var(--MENU-SEARCH-BG-color);
} }
#sidebar ul.topics > li.parent, #sidebar ul.topics > li.active { #sidebar ul.topics > li.parent, #sidebar ul.topics > li.active {
background: var(--MENU-SECTIONS-ACTIVE-BG-color); background: var(--MENU-SECTIONS-ACTIVE-BG-color);
} }
#sidebar .searchbox * { #sidebar .searchbox * {
color: var(--MENU-SEARCH-BOX-ICONS-color); color: var(--MENU-SEARCH-BOX-ICONS-color);
} }
@ -122,5 +126,5 @@ a:hover {
} }
#homelinks a:hover { #homelinks a:hover {
color: var(--MENU-HOME-LINK-HOVERED-color); color: var(--MENU-HOME-LINK-HOVER-color);
} }

8
static/css/theme-relearn.css
View file

@ -24,7 +24,6 @@
--MENU-VISITED-color: #506397; /* Color of 'page visited' icons in menu */ --MENU-VISITED-color: #506397; /* Color of 'page visited' icons in menu */
--MENU-SECTION-HR-color: #28292e; /* Color of <hr> separator in menu */ --MENU-SECTION-HR-color: #28292e; /* Color of <hr> separator in menu */
} }
body { body {
@ -67,21 +66,26 @@ a:hover {
transition: width 0.5s ease; transition: width 0.5s ease;
background-color: var(--MAIN-LINK-HOVER-color); background-color: var(--MAIN-LINK-HOVER-color);
} }
#sidebar { #sidebar {
background-color: var(--MENU-SECTIONS-BG-color); background-color: var(--MENU-SECTIONS-BG-color);
} }
#sidebar #header-wrapper { #sidebar #header-wrapper {
background: var(--MENU-HEADER-BG-color); background: var(--MENU-HEADER-BG-color);
color: var(--MENU-SEARCH-BOX-color); color: var(--MENU-SEARCH-BOX-color);
border-color: var(--MENU-HEADER-BORDER-color); border-color: var(--MENU-HEADER-BORDER-color);
} }
#sidebar .searchbox { #sidebar .searchbox {
border-color: var(--MENU-SEARCH-BOX-color); border-color: var(--MENU-SEARCH-BOX-color);
background: var(--MENU-SEARCH-BG-color); background: var(--MENU-SEARCH-BG-color);
} }
#sidebar ul.topics > li.parent, #sidebar ul.topics > li.active { #sidebar ul.topics > li.parent, #sidebar ul.topics > li.active {
background: var(--MENU-SECTIONS-ACTIVE-BG-color); background: var(--MENU-SECTIONS-ACTIVE-BG-color);
} }
#sidebar .searchbox * { #sidebar .searchbox * {
color: var(--MENU-SEARCH-BOX-ICONS-color); color: var(--MENU-SEARCH-BOX-ICONS-color);
} }
@ -122,7 +126,7 @@ a:hover {
} }
#homelinks a:hover { #homelinks a:hover {
color: var(--MENU-HOME-LINK-HOVERED-color); color: var(--MENU-HOME-LINK-HOVER-color);
} }
#shortcuts h3 { #shortcuts h3 {