Skip to content

Commit 448cd97

Browse files
author
Emmanouil Konstantinidis
committed
Scroll to top & More
1 parent fee51b1 commit 448cd97

File tree

8 files changed

+112
-54
lines changed

8 files changed

+112
-54
lines changed

‎docs/css/styles.css‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,36 @@ body {
7272
/* @end Footer */
7373

7474

75+
/* @group Scroll to Top */
76+
77+
.scroll-to-top {
78+
padding: 10px;
79+
background-color: #ecf0f1;
80+
color: #18bc9c;
81+
font-size: 12px;
82+
text-decoration: none;
83+
84+
position: fixed;
85+
bottom: 40px;
86+
right: 40px;
87+
display:none;
88+
89+
-webkit-border-radius: 5px;
90+
-moz-border-radius: 5px;
91+
border-radius: 5px;
92+
-moz-background-clip: padding;
93+
-webkit-background-clip: padding-box;
94+
background-clip: padding-box;
95+
}
96+
97+
.scroll-to-top:hover {
98+
text-decoration: none;
99+
}
100+
101+
/* @end Scroll to Top */
102+
103+
104+
75105
/* @group Github Ribbon - SVG */
76106

77107
.github-corner:hover .octo-arm {

‎docs/installation.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ source_filename: "installation"
55

66
The installation itself should not take more than a couple of minutes. Follow the simple steps below.
77

8-
Install using pip:
8+
### Install from PyPI
99

1010
pip install drfdocs
1111

‎docs/js/index.js‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
$(document).ready(function(){
2+
$(window).scroll(function(){
3+
if ($(this).scrollTop() > 100) {
4+
$('.scroll-to-top').fadeIn();
5+
} else {
6+
$('.scroll-to-top').fadeOut();
7+
}
8+
});
9+
$('.scroll-to-top').click(function(){
10+
$('html, body').animate({scrollTop : 0},800);
11+
return false;
12+
});
13+
});

‎docs/settings.md‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,6 @@ Then set the value of the environment variable `SHOW_DRFDOCS` for each environme
2424

2525
### List of Settings
2626

27-
{:.table .table-striped}
2827
| Setting | Type | Options | Default |
2928
|---------|---------|-----------------|---------|
3029
|HIDE_DOCS| Boolean | `True`, `False` | `False` |

‎docs/template/base.html‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
{% if page_description %}<meta name="description" content="{{ page_description }}">{% endif %}
88
{% if site_author %}<meta name="author" content="{{ site_author }}">{% endif %}
99
{% if canonical_url %}<link rel="canonical" href="{{ canonical_url }}">{% endif %}
10-
10+
1111
{% if favicon %}
1212
<link rel="shortcut icon" href="{{ favicon }}">
1313
{% else %}
@@ -101,5 +101,7 @@ <h4 class="modal-title" id="exampleModalLabel">Search</h4>
101101
</div>
102102
</div>
103103
</div>
104+
105+
<a href="#" class="scroll-to-top"><i class="fa fa-chevron-up"></i></a>
104106
</body>
105107
</html>

‎docs/template/css/base.css‎

Lines changed: 52 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,25 @@
11
body {
2-
padding-top: 70px;
2+
padding-top: 70px;
33
}
44

55
h1[id]:before, h2[id]:before, h3[id]:before, h4[id]:before, h5[id]:before, h6[id]:before {
6-
content: "";
7-
display: block;
8-
margin-top: -75px;
9-
height: 75px;
10-
}
11-
12-
ul.nav li.main {
13-
font-weight: bold;
6+
content: "";
7+
display: block;
8+
margin-top: -75px;
9+
height: 75px;
1410
}
1511

1612
div.col-md-3 {
17-
padding-left: 0;
13+
padding-left: 0;
14+
padding-right: 0;
1815
}
1916

2017
div.col-md-9 {
21-
padding-bottom: 100px;
18+
padding-bottom: 100px;
2219
}
2320

2421
div.source-links {
25-
float: right;
22+
float: right;
2623
}
2724

2825
div.col-md-9 img {
@@ -47,42 +44,46 @@ div.col-md-9 img {
4744

4845
/* First level of nav */
4946
.bs-sidenav {
50-
margin-top: 30px;
51-
margin-bottom: 30px;
52-
padding-top: 10px;
53-
padding-bottom: 10px;
54-
border-radius: 5px;
47+
margin-top: 30px;
48+
margin-bottom: 30px;
49+
padding-top: 10px;
50+
padding-bottom: 10px;
51+
border-radius: 5px;
5552
}
5653

5754
/* All levels of nav */
5855
.bs-sidebar .nav > li > a {
59-
display: block;
60-
padding: 5px 20px;
61-
z-index: 1;
56+
display: block;
57+
padding: 5px 20px;
58+
z-index: 1;
6259
}
60+
6361
.bs-sidebar .nav > li > a:hover,
6462
.bs-sidebar .nav > li > a:focus {
65-
text-decoration: none;
66-
border-right: 1px solid;
63+
text-decoration: none;
64+
border-right: 1px solid;
6765
}
66+
6867
.bs-sidebar .nav > .active > a,
6968
.bs-sidebar .nav > .active:hover > a,
7069
.bs-sidebar .nav > .active:focus > a {
71-
font-weight: bold;
72-
background-color: transparent;
73-
border-right: 1px solid;
70+
font-weight: bold;
71+
background-color: transparent;
72+
border-right: 1px solid;
7473
}
7574

7675
/* Nav: second level (shown on .active) */
7776
.bs-sidebar .nav .nav {
78-
display: none; /* Hide by default, but at >768px, show it */
79-
margin-bottom: 8px;
77+
display: none; /* Hide by default, but at >768px, show it */
78+
margin-bottom: 8px;
8079
}
80+
8181
.bs-sidebar .nav .nav > li > a {
82-
padding-top: 3px;
83-
padding-bottom: 3px;
84-
padding-left: 30px;
85-
font-size: 90%;
82+
padding-top: 3px;
83+
padding-bottom: 3px;
84+
padding-left: 30px;
85+
font-size: 90%;
86+
color: #2c3e50;
8687
}
8788

8889
/* Show and affix the side nav when space allows it */
@@ -123,36 +124,36 @@ div.col-md-9 img {
123124

124125
/* sub menu stlye */
125126
.dropdown-submenu>.dropdown-menu {
126-
top: 0;
127-
left: 100%;
128-
margin-top: 0px;
129-
margin-left: -1px;
130-
-webkit-border-radius: 0 4px 4px 4px;
131-
-moz-border-radius: 0 4px 4px;
132-
border-radius: 0 4px 4px 4px;
127+
top: 0;
128+
left: 100%;
129+
margin-top: 0px;
130+
margin-left: -1px;
131+
-webkit-border-radius: 0 4px 4px 4px;
132+
-moz-border-radius: 0 4px 4px;
133+
border-radius: 0 4px 4px 4px;
133134
}
134135

135136
/* display sub menu on hover*/
136137
.dropdown-submenu:hover>.dropdown-menu {
137-
display: block;
138+
display: block;
138139
}
139140

140141
/* little arrow */
141142
.dropdown-submenu>a:after {
142-
display: block;
143-
content: " ";
144-
float: right;
145-
width: 0;
146-
height: 0;
147-
border-color: transparent;
148-
border-style: solid;
149-
border-width: 5px 0 5px 5px;
150-
border-left-color: #ccc;
151-
margin-top: 5px;
152-
margin-right: -10px;
143+
display: block;
144+
content: " ";
145+
float: right;
146+
width: 0;
147+
height: 0;
148+
border-color: transparent;
149+
border-style: solid;
150+
border-width: 5px 0 5px 5px;
151+
border-left-color: #ccc;
152+
margin-top: 5px;
153+
margin-right: -10px;
153154
}
154155

155156
/* little arrow of parent menu */
156157
.dropdown-submenu:hover>a:after {
157-
border-left-color: #404040;
158+
border-left-color: #404040;
158159
}

‎docs/template/scroll-to-top.html‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
$(window).scroll(function(){
2+
if ($(this).scrollTop() > 100) {
3+
$('.scroll-to-top').fadeIn();
4+
} else {
5+
$('.scroll-to-top').fadeOut();
6+
}
7+
});
8+
$('.scroll-to-top').click(function(){
9+
$('html, body').animate({scrollTop : 0},800);
10+
return false;
11+
});

‎mkdocs.yml‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,8 @@ pages:
1515
theme_dir: 'docs/template'
1616
extra_css:
1717
- css/styles.css
18+
extra_javascript:
19+
- js/index.js
1820

1921
copyright: Copyright © 2015 Emmanouil Konstantinidis.
2022
google_analytics: ['UA-71505240-1', 'drfdocs.com']

0 commit comments

Comments
 (0)