crunk/csv-library-website
1
0
Fork 0
Code Issues 2 Pull Requests Projects Releases Activity

first small changes for mobile and slow computers

Browse Source
This commit is contained in:
crunk 2021-05-03 12:31:08 +02:00
parent b9a42b219a
commit a1256bbaa9
3 changed files with 25 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
library/static/css/dropdown.css
View File

@ -53,3 +53,15 @@
/* Change the background color of the dropdown button when the dropdown content is shown */ /* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {background-color: #3e8e41;} .dropdown:hover .dropbtn {background-color: #3e8e41;}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
.dropdown-content button {
font-size: 1.6em;
}
.container > button {
font-size: 1.6em;
}
.dropdown > button {
font-size: 1.6em;
}
}

8
library/static/css/style.css
View File

@ -5,7 +5,6 @@ html, body {
body:after { body:after {
font-size: .8em; font-size: .8em;
background-color: #EB4377;
position: fixed; position: fixed;
width: 100%; width: 100%;
text-align: center; text-align: center;
@ -16,7 +15,6 @@ body:after {
width: 1px; height: 1px; width: 1px; height: 1px;
transform: translate(-100%, -100%); transform: translate(-100%, -100%);
border-radius: 50%; border-radius: 50%;
filter: url(#filter);
z-index: -1; z-index: -1;
position: fixed; position: fixed;
} }
@ -148,3 +146,9 @@ a:link { text-decoration: none; }
a:visited { text-decoration: none; } a:visited { text-decoration: none; }
a:hover { text-decoration: none; } a:hover { text-decoration: none; }
a:active { text-decoration: none; } a:active { text-decoration: none; }
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
td {
font-size: 1.6em;
}
}

9
library/static/js/script.js
View File

@ -11,7 +11,7 @@ function boxShadows(max) {
let ret = []; let ret = [];
for (let i = 0; i < max; ++i) { for (let i = 0; i < max; ++i) {
ret.push(` ret.push(`
${ rn(1, 100) }vw ${ rn(1, 100) }vh ${ rn(20, 60) }vmin ${ rn(10, 30) }vmin ${ rn(1, 110) }vw ${ rn(1, 110) }vh ${ rn(20, 30) }vmin ${ rn(10, 60) }vmin
${ rs('#F52D75', '#CCBD4F', '#32497F', '#EB4377') } ${ rs('#F52D75', '#CCBD4F', '#32497F', '#EB4377') }
`) `)
} }
@ -21,7 +21,12 @@ function boxShadows(max) {
const cloud = document.querySelector('#cloud'); const cloud = document.querySelector('#cloud');
function update() { function update() {
cloud.style.boxShadow = boxShadows(30); if (window.screen.availWidth > 400 && window.screen.availHeight > 400 ) {
cloud.style.boxShadow = boxShadows(15);
}
else {
document.body.style.backgroundImage = "linear-gradient(to bottom right, white, #F52D75)";
}
} }
window.addEventListener('load', update); window.addEventListener('load', update);