More updates
- Add Back to top link in footer component. - Remove unused slider css for now.
This commit is contained in:
parent
382c9d9fc6
commit
167ead42d9
@ -1,3 +1,4 @@
|
|||||||
<footer class="container py-3">
|
<footer class="container py-3">
|
||||||
<p>© 2020-2021 Quartznet | <a href="./policy">Policy</a></p>
|
<p>© 2020-2021 Quartznet | <a href="./policy">Policy</a></p>
|
||||||
|
<p><a href="#">Back to top</a></p>
|
||||||
</footer>
|
</footer>
|
@ -27,8 +27,7 @@
|
|||||||
|
|
||||||
<main class="container">
|
<main class="container">
|
||||||
<section>
|
<section>
|
||||||
<h1>Recent posts</h1>
|
<h2>Posts</h2>
|
||||||
|
|
||||||
<ul>
|
<ul>
|
||||||
{#each posts as post}
|
{#each posts as post}
|
||||||
<!-- we're using the non-standard `rel=prefetch` attribute to
|
<!-- we're using the non-standard `rel=prefetch` attribute to
|
||||||
|
@ -113,63 +113,12 @@ section {
|
|||||||
padding: 5px 20px;
|
padding: 5px 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Simple css to style it like a toggle switch */
|
|
||||||
.theme-switch-wrapper {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.theme-switch {
|
|
||||||
display: inline-block;
|
|
||||||
height: 24px;
|
|
||||||
position: relative;
|
|
||||||
width: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.theme-switch input {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.slider {
|
|
||||||
background-color: #ccc;
|
|
||||||
bottom: 0;
|
|
||||||
cursor: pointer;
|
|
||||||
left: 0;
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
top: 0;
|
|
||||||
transition: .2s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.slider:before {
|
|
||||||
background-color: #fff;
|
|
||||||
bottom: 4px;
|
|
||||||
content: "";
|
|
||||||
height: 16px;
|
|
||||||
left: 4px;
|
|
||||||
position: absolute;
|
|
||||||
transition: .2s;
|
|
||||||
width: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
input:checked + .slider {
|
|
||||||
background-color: #66bb6a;
|
|
||||||
}
|
|
||||||
|
|
||||||
input:checked + .slider:before {
|
|
||||||
transform: translateX(16px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.slider.round {
|
|
||||||
border-radius: 34px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.slider.round:before {
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
footer {
|
footer {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
border-top: 3px solid var(--border-color);
|
border-top: 3px solid var(--border-color);
|
||||||
|
color: var(--font-color);
|
||||||
|
font-family: var(--font1);
|
||||||
margin-top: 30px;
|
margin-top: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user