deblan-mirror/papercss
1
0
Fork 0
mirror of https://github.com/papercss/papercss synced 2024-06-15 12:15:22 +02:00
Code Issues Projects Releases Wiki Activity

Merge pull request #79 from afzalsayed96/feature-back2top

Browse source 
Adding a back to top button feature
This commit is contained in:
Rhyne 2017-12-01 16:04:49 -05:00 committed by GitHub
parent e7d27d5d1a 8beaf6b282
commit 837c7bb826
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 23 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
demo.css
View file

@ -13,4 +13,23 @@ body {
}
.summary a {
color: #41403e;
}
.to-top {
opacity: 1;
display: inline-block;
padding: 1em;
position: fixed;
bottom: 1em;
right: 1em
}
.to-top .paper-btn {
padding: .6em 1em;
background: #fff;
border-top-left-radius: 185px 160px;
border-top-right-radius: 200px 195px;
border-bottom-right-radius: 160px 195px;
border-bottom-left-radius: 185px 190px
}
.demo-title:hover + .to-top {
opacity: 0
}

6
index.html
View file

@ -30,7 +30,7 @@
<body>
<div class="container">
<div class=" paper">
<div class="demo-title">
<div id="top" class="demo-title">
<div class="row flex-center">
<div class="text-center">
<h1>PaperCSS</h1>
@ -67,7 +67,9 @@
<li><a href="#article">Article</a></li>
</ul>
</div>
<div class="to-top">
<a href="#top" class="paper-btn margin">^</a>
</div>
<div id="flexbox" class="section">
<h2>Flexbox</h2>
<h4>Flexgrid</h4>