asandikci.com/web
1
0
Fork 0
Code Issues 5 Pull requests Projects Releases Packages Wiki Activity Actions

Imported the dark-mode toggle.

Browse source
This commit is contained in:
Cotes Chung 2020-02-13 17:46:05 +08:00
parent 4390a00604
commit a4435a45ec
2 changed files with 31 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
_includes/sidebar.html
View file

@ -56,6 +56,11 @@
</div><!-- #nav-wrapper --> </div><!-- #nav-wrapper -->
<div class="contact d-flex justify-content-around mt-4"> <div class="contact d-flex justify-content-around mt-4">
<span id="mode-toggle-wrapper" class="d-flex justify-content-center align-items-center">
{% include dark-mode-toggle.html %}
</span>
<a href="https://github.com/{{ site.github.username }}" target="_blank"> <a href="https://github.com/{{ site.github.username }}" target="_blank">
<i class="fab fa-github-alt"></i> <i class="fab fa-github-alt"></i>
</a> </a>
@ -69,4 +74,5 @@
<a href="{{ site.baseurl }}/feed.xml" target="_blank"> <a href="{{ site.baseurl }}/feed.xml" target="_blank">
<i class="fas fa-rss"></i> <i class="fas fa-rss"></i>
</a> </a>
</div> </div>

26
assets/css/main.scss
View file

@ -231,10 +231,26 @@ body {
/*box-shadow: inset 0 0 0.25em 0 rgba(0, 0, 0, 0.22);*/ /*box-shadow: inset 0 0 0.25em 0 rgba(0, 0, 0, 0.22);*/
} }
#sidebar .contact a:hover { #sidebar .contact a:hover,
#sidebar #mode-toggle-wrapper:hover {
color: #fff; color: #fff;
} }
#mode-toggle-wrapper {
color: rgb(103, 107, 109);
font-size: 1.05rem;
user-select: none;
transition: color 0.35s ease-in-out;
}
#sidebar #mode-toggle-wrapper>i::after {
content: "";
color: #525354;
border-right: 1px solid;
padding-left: .6rem;
}
/*--- top-bar ---*/ /*--- top-bar ---*/
#topbar-wrapper { #topbar-wrapper {
@ -1107,6 +1123,10 @@ div.tooltip-inner { /* Overrided BS4 Tooltip */
padding: 0 0.6rem; padding: 0 0.6rem;
} }
#mode-toggle-wrapper {
padding-left: 1.2rem;
}
#main-wrapper { #main-wrapper {
margin-left: 210px; margin-left: 210px;
} }
@ -1362,6 +1382,10 @@ div.tooltip-inner { /* Overrided BS4 Tooltip */
padding-top: .45rem; padding-top: .45rem;
} }
#mode-toggle-wrapper {
font-size: 1.6rem;
}
footer>div.d-flex { footer>div.d-flex {
max-width: 1130px; max-width: 1130px;
} }