From c16391e27ec883c801e290028f088072451b2dc4 Mon Sep 17 00:00:00 2001 From: Justin Date: Tue, 22 Aug 2023 21:22:21 +0800 Subject: [PATCH] styling for screensaver div --- static/style.css | 85 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 85 insertions(+) diff --git a/static/style.css b/static/style.css index f813ca0..46be141 100755 --- a/static/style.css +++ b/static/style.css @@ -1468,3 +1468,88 @@ input[type=checkbox]:hover { } } + + +#screensaver-div { + width: 500px; + height: 430px; + border-radius:20px; +/* background-color: #282828;*/ + background-color: rgba(5,5,5,0.7); + backdrop-filter: blur(6px); + border-color: #5D5D5D; + border-style: solid; + border-width: thin; + + position: fixed; /*Can also be `fixed`*/ + left: 0; + right: 0; + top: 0; + bottom: 0; + margin: auto; + /*Solves a problem in which the content is being cut when the div is smaller than its' wrapper:*/ + max-width: 100%; + max-height: 100%; + overflow: auto; + z-index:98; +} + +#screensaver-close-btn { + background-color: transparent; + border: none; + color: white; + text-decoration: underline; + margin-left:42%; + +} + +#screensaver-close-btn:hover { + background-color: transparent; + border: none; + color: darkgray; + text-decoration: underline; +} + +#screensaver-close-btn:active { + background-color: transparent; + border: none; + color: #4B4B4B; + text-decoration: underline; +} + +#screensaver-p { + font-size:20px; + display: inline; +} + +#clock1-p { + margin-top: 5%; + margin-bottom: 2%; +} + +#clock2-p { + margin-top:6%; + margin-bottom:2%; +} + +#worldclock-p { + margin-top:6%; + margin-bottom:2%; +} + +#screensaver-top { + margin-top:3%; + padding: 5%; + padding-top: 1%; +} + +#inside-screensaver-div { + margin-left: 5%; +} + +.screensaver-hour-select { + display: inline; + zoom:1.2; +} + +