Skip to content

add sidebar + sort modules #2225

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 20 commits into from
Closed

add sidebar + sort modules #2225

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
20 commits
Select commit Hold shift + click to select a range
98d0ea0
added sidebar + sorted modules by sections
NOTMEE12 Jun 2, 2023
0793527
added gradient
NOTMEE12 Jun 2, 2023
06e3b64
docs are functioning
NOTMEE12 Jun 3, 2023
d5d7822
fixed issue https://github.com/pygame-community/pygame-ce/issues/2224
NOTMEE12 Jun 3, 2023
fe2cab5
opening/closing sections is saved.
NOTMEE12 Jun 3, 2023
8c4e685
custom scrollbars
NOTMEE12 Jun 3, 2023
177598f
added arrows
NOTMEE12 Jun 5, 2023
b18202c
added many things
NOTMEE12 Jun 10, 2023
5f62c5a
Merge branch 'main' into main
NOTMEE12 Jun 10, 2023
bc31c29
fixed https://github.com/pygame-community/pygame-ce/pull/2225#pullreq…
NOTMEE12 Jun 11, 2023
2268e2b
approving changes
NOTMEE12 Jun 11, 2023
afb5917
update
NOTMEE12 Jun 11, 2023
8eea316
more changes
NOTMEE12 Jun 16, 2023
e9b6281
replaces tabs with spaces
NOTMEE12 Jun 17, 2023
5c219c6
removed additional bracket at the end
NOTMEE12 Jun 17, 2023
d136cb5
changed scrollbar color in light mode to lighter
NOTMEE12 Jun 23, 2023
f65cdde
removed unnecesary comments
NOTMEE12 Jun 24, 2023
a4cb056
replaced 40vh with 40%
NOTMEE12 Jun 26, 2023
4baa953
fix some problems with the search bar
NOTMEE12 Oct 13, 2023
a51c5d3
changed the arrows from pointing up to pointing right
NOTMEE12 Oct 13, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
49 changes: 24 additions & 25 deletions docs/reST/_static/sections.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,32 +1,31 @@
function toggleSectionVisibility(section, message){
document.getElementById(section).hidden = ! document.getElementById(section).hidden;
if (document.getElementById(section).hidden === true){ // show
items = sessionStorage.getItem('hidden');
if (items !== null){
if (!(items.includes(section))){
items = items + section + '|';
}
sessionStorage.setItem('hidden', items);
} else {
sessionStorage.setItem('hidden', section + '|');
}
document.getElementById(section[0]).innerHTML = document.getElementById(section[0]).innerHTML.replace('▼', '▲');
} else { // hide
items = sessionStorage.getItem('hidden');
if (items !== null){
if (items.includes(section)){
items = items.replace(section + '|', '');
}
sessionStorage.setItem('hidden', items);
}
document.getElementById(section[0]).innerHTML = document.getElementById(section[0]).innerHTML.replace('▲', '▼');
}
function toggleSectionVisibility(section){
document.getElementById(section).hidden = ! document.getElementById(section).hidden;
if (document.getElementById(section).hidden === true){ // show
items = sessionStorage.getItem('hidden');
if (items !== null){
if (!(items.includes(section))){
items = items + section + '|';
}
sessionStorage.setItem('hidden', items);
} else {
sessionStorage.setItem('hidden', section + '|');
}
document.getElementById(section[0]).innerHTML = document.getElementById(section[0]).innerHTML.replace('▼', '▲');
} else { // hide
items = sessionStorage.getItem('hidden');
if (items !== null){
if (items.includes(section)){
items = items.replace(section + '|', '');
}
sessionStorage.setItem('hidden', items);
}
document.getElementById(section[0]).innerHTML = document.getElementById(section[0]).innerHTML.replace('▲', '▼');
}
}

function toggleChecked(classname){
if (window.innerWidth <= 1100) {
el = document.getElementsByClassName(classname)[0];
console.log(el.id);
if (el.id !== 'clicked') {
el.id = 'clicked';
htmlElement.classList.add('clicked');
Expand All @@ -35,4 +34,4 @@ function toggleChecked(classname){
htmlElement.classList.remove('clicked');
}
}
}
}
88 changes: 2 additions & 86 deletions docs/reST/_static/three_lines.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion docs/reST/themes/classic/elements.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ <h5>pygame-ce documentation</h5>
<img class="theme-icon" data-theme="light-theme" src="{{ pathto('_static/dark-theme-icon.svg', 1) }}" width="24" height="24" alt="Dark Theme Icon">
</div>
<form action="{{ pathto('search') }}" method="get" class="searchbar-form" style="display:inline;float:right;">
<input name="q" value="" type="text" placeholder="search..." style=":-webkit-border-radius: 20px;-moz-border-radius: 20px; border-radius: 20px;padding-left:1em;width: 10vw;">
<input name="q" value="" type="text" placeholder="search...">
<img class="searchbar-button" src="{{ pathto('_static/searchbar-icon.svg', 1) }}" alt="Search">
<input class="searchbar-submit" value="search" type="submit">
</form>
Expand Down
77 changes: 51 additions & 26 deletions docs/reST/themes/classic/static/pygame.css_t
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -114,16 +114,16 @@ div.header > div {
/* border: {{ theme_headerborder }}; */
border-collapse: collapse;
background-color: {{ theme_headerbgcolor }};
background-image: linear-gradient(to bottom, {{ theme_headerbgcolor}}, {{ theme_bgcolor }});
/* background-image: linear-gradient(to bottom, {{ theme_headerbgcolor}}, {{ theme_bgcolor }}); */
}
.dark-theme div.header > div {
background-color: {{ theme_dark_headerbgcolor }};
border: {{ theme_dark_headerborder }};
background-image: linear-gradient(to bottom, {{ theme_dark_headerbgcolor }}, {{ theme_dark_bgcolor }});
/* background-image: linear-gradient(to bottom, {{ theme_dark_headerbgcolor }}, {{ theme_dark_bgcolor }}); */
}
div.header .logo {
background-color: {{ theme_logobgcolor }};
background-image: linear-gradient(to bottom, {{ theme_logobgcolor }}, {{ theme_headerbgcolor }});
/* background-image: linear-gradient(to bottom, {{ theme_logobgcolor }}, {{ theme_headerbgcolor }}); */
padding: 0.3em;
/* border-right: 3px solid black; */
display: flex;
Expand All @@ -133,12 +133,14 @@ div.header .logo {
}
.dark-theme div.header .logo {
background-color: {{ theme_dark_logobgcolor }};
background-image: linear-gradient(to bottom, {{ theme_dark_logobgcolor}}, {{ theme_dark_headerbgcolor }});
/* background-image: linear-gradient(to bottom, {{ theme_dark_logobgcolor}}, {{ theme_dark_headerbgcolor }}); */
border: none;
}
div.header .logo img {
div.header .logo a > img {
min-width: 200px;
min-height: 60px;
width: auto;
height: auto;
border-style: none;
}

Expand Down Expand Up @@ -254,6 +256,16 @@ input[type="text"]:focus{
input[type="submit"]{
display: none;
}
input[name="q"]{
:-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

image
border-radius seems to be supported pretty much everywhere, why do you use -mox-border-radius and :-webkit-border-radius ?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

should I remove it?

padding-left:1em;
width: 10vw;
}
.clicked input[name="q"]{
width: 40vh;
}

.searchbar-form{
display: flex;
Expand Down Expand Up @@ -333,20 +345,31 @@ div.document {
border: 0;
margin: 0;
padding: 0;
font-size: 20px
font-size: 20px;
padding-right: 25px;
min-width: 65px;
min-height: 35px;
}
.three-lines:hover {
cursor: pointer;
}

#Sections {
overflow-y: auto;
position: fixed;
height: -webkit-fill-available;
height: -moz-available;
height: fill-available;
height: -moz-available;
width: inherit;
padding-bottom: 2.5rem;
}
.dark-theme #Sections {
overflow-y: auto;
position: fixed;
height: -webkit-fill-available;
height: -moz-available;
height: fill-available;
width: inherit;
padding-bottom: 2.5rem;
}
Expand Down Expand Up @@ -418,26 +441,28 @@ div.document {
display: inherit;
}
/* clicked the navbar */
.clicked {
.pagelinks {
content-visibility: visible;
display: initial;
}
#Sections {content-visibility: visible};
.flex-container {
width: 100%;
height: 100%;
}
.header {
top: 0;
}
.documentwrapper {
overflow: hidden;
display: none;
}
.related {
content-visibility: hidden;
}
.clicked .pagelinks {
content-visibility: visible;
display: initial;
}
.clicked #Sections {content-visibility: visible};
.clicked .flex-container {
width: 100%;
height: 100%;
}
.clicked .header {
top: 0;
}
.clicked .documentwrapper {
overflow: hidden;
display: none;
}
.clicked .related {
content-visibility: hidden;
display: none;
}
.clicked div.header .logo {
padding-right: 15px;
}
.div.header > div {height: 25vh;}
div.header .logo {
Expand Down