Imported the dark-mode toggle.
This commit is contained in:
parent
4390a00604
commit
a4435a45ec
2 changed files with 31 additions and 1 deletions
|
@ -56,6 +56,11 @@
|
|||
</div><!-- #nav-wrapper -->
|
||||
|
||||
<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">
|
||||
<i class="fab fa-github-alt"></i>
|
||||
</a>
|
||||
|
@ -69,4 +74,5 @@
|
|||
<a href="{{ site.baseurl }}/feed.xml" target="_blank">
|
||||
<i class="fas fa-rss"></i>
|
||||
</a>
|
||||
|
||||
</div>
|
|
@ -231,10 +231,26 @@ body {
|
|||
/*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;
|
||||
}
|
||||
|
||||
#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 ---*/
|
||||
|
||||
#topbar-wrapper {
|
||||
|
@ -1107,6 +1123,10 @@ div.tooltip-inner { /* Overrided BS4 Tooltip */
|
|||
padding: 0 0.6rem;
|
||||
}
|
||||
|
||||
#mode-toggle-wrapper {
|
||||
padding-left: 1.2rem;
|
||||
}
|
||||
|
||||
#main-wrapper {
|
||||
margin-left: 210px;
|
||||
}
|
||||
|
@ -1362,6 +1382,10 @@ div.tooltip-inner { /* Overrided BS4 Tooltip */
|
|||
padding-top: .45rem;
|
||||
}
|
||||
|
||||
#mode-toggle-wrapper {
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
|
||||
footer>div.d-flex {
|
||||
max-width: 1130px;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue