Kirisame/dzura
1
0
Fork 0
Code Issues 4 Pull Requests Packages Projects 1 Releases Wiki Activity

Add scrollbar to list pages.

Browse Source
This commit is contained in:
yukirij 2024-10-13 21:30:24 -07:00
parent b4aa82c74d
commit 86e92716be
4 changed files with 45 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
www/css/main.css
View File

@ -101,6 +101,14 @@ main{
background-color:#202020;
}
main>div.box {
display: block;
position: relative;
width: 100%;
height: 100%;
flex-grow: 1;
overflow-y: scroll;
}
main>nav{
display:flex;

48
www/css/ui.css
View File

@ -1,15 +1,15 @@
main>table.list{
main table.list{
width:100%;
border-collapse:collapse;
}
main>table.list tr{
main table.list tr{
height:2.5rem;
background-color:#242424;
}
main>table.list tr:nth-child(odd){
main table.list tr:nth-child(odd){
background-color:#262626;
}
main>table.list th{
main table.list th{
width:1px;
padding:0 2rem 0 2rem;
@ -22,7 +22,7 @@ main>table.list th{
color:#f0f0f0;
border-bottom:1px solid #404040;
}
main>table.list td{
main table.list td{
width:1px;
height:100%;
padding:0 2rem 0 2rem;
@ -34,24 +34,24 @@ main>table.list td{
color:#f0f0f0;
border-right: 1px solid #282828;
}
main>table.list td:last-child, main>table.list th:last-child{
main table.list td:last-child, main table.list th:last-child{
width:auto;
padding:0;
text-align:left;
}
main>table.list td:last-child{
main table.list td:last-child{
background-color: #282828;
border:0;
}
main>table.list.session th:nth-child(1){width:10rem;}
main>table.list.session th:nth-child(2){width:10rem;}
main table.list.session th:nth-child(1){width:10rem;}
main table.list.session th:nth-child(2){width:10rem;}
main>table.list.session-resume th:nth-child(1){width:10rem;}
main table.list.session-resume th:nth-child(1){width:10rem;}
main>table.list.challenge th:nth-child(2){width:10rem;}
main table.list.challenge th:nth-child(2){width:10rem;}
main>table.list td:last-child>button{
main table.list td:last-child>button{
display:inline-block;
position:relative;
min-width:8rem;
@ -67,14 +67,14 @@ main>table.list td:last-child>button{
border:0;
outline:0;
}
main>table.list td:last-child>button.highlight {
main table.list td:last-child>button.highlight {
background-color:#772d43;
}
main>table.list td:last-child>button:hover{
main table.list td:last-child>button:hover{
background-color:#303030;
}
main>table.list td>canvas {
main table.list td>canvas {
display: block;
position: relative;
width: 8em;
@ -82,7 +82,7 @@ main>table.list td>canvas {
margin: 0 -1.5rem 0 -1.5rem;
}
main>article{
main article{
display:block;
position:relative;
width:100%;
@ -97,7 +97,7 @@ main>article{
overflow:auto;
}
main>article>h1{
main article>h1{
padding:0.5rem;
margin:0 0 0.5rem 0;
@ -106,7 +106,7 @@ main>article>h1{
background-color:#a0a0a0;
color:#202020;
}
main>article>h2{
main article>h2{
padding:0 0 0.5rem 0.25rem;
margin:1.5rem 0 0.5rem 0;
@ -115,7 +115,7 @@ main>article>h2{
border-bottom:2px solid #c0c0c0;
color:#c0c0c0;
}
main>article>h3{
main article>h3{
padding:0 0 0 0.25rem;
margin:1.5rem 0 0.5rem 0;
@ -124,7 +124,7 @@ main>article>h3{
text-decoration:underline;
color:#b0b0b0;
}
main>article>h4{
main article>h4{
padding:0 0 0 0.25rem;
margin:1.5rem 0 0.5rem 0;
@ -132,18 +132,18 @@ main>article>h4{
text-decoration:underline;
color:#a0a0a0;
}
main>article>p{
main article>p{
padding:0 0.5rem 0 0.5rem;
}
main>article a{
main article a{
color:#db758e;
text-decoration:none;
}
main>article>a:hover{
main article>a:hover{
text-decoration:underline;
}
main>div.turn-slider-padding{
main div.turn-slider-padding{
display:block;
position:relative;
width:100%;

12
www/js/scene.js
View File

@ -256,7 +256,7 @@ const SCENES = {
let table = document.createElement("table");
table.setAttribute("id", "content");
table.setAttribute("class", "list session");
MAIN.appendChild(table);
UI.maincontent(table);
SCENE.refresh();
@ -320,7 +320,7 @@ const SCENES = {
let table = document.createElement("table");
table.setAttribute("id", "content");
table.setAttribute("class", "list session-resume");
MAIN.appendChild(table);
UI.maincontent(table);
SCENE.refresh();
@ -435,7 +435,7 @@ const SCENES = {
let table = document.createElement("table");
table.setAttribute("id", "content");
table.setAttribute("class", "list session");
MAIN.appendChild(table);
UI.maincontent(table);
SCENE.refresh();
@ -494,7 +494,7 @@ const SCENES = {
let table = document.createElement("table");
table.setAttribute("id", "content");
table.setAttribute("class", "list session");
MAIN.appendChild(table);
UI.maincontent(table);
SCENE.refresh();
@ -534,7 +534,7 @@ const SCENES = {
let body = document.createElement("article");
body.setAttribute("id", "article");
MAIN.appendChild(body);
UI.maincontent(body);
this.refresh("game.html");
@ -562,7 +562,7 @@ const SCENES = {
let body = document.createElement("article");
body.setAttribute("id", "article");
MAIN.appendChild(body);
UI.maincontent(body);
this.refresh("main.html");

7
www/js/ui.js
View File

@ -80,6 +80,13 @@ const UI = {
return div;
},
maincontent(element) {
let box = document.createElement("div");
box.setAttribute("class", "box");
box.appendChild(element);
MAIN.appendChild(box);
},
table_content(header, rows) {
let tbody = document.createElement("tbody");