diff --git a/Frontend/assets/css/frame.css b/Frontend/assets/css/frame.css index 9031730..a2ffc17 100644 --- a/Frontend/assets/css/frame.css +++ b/Frontend/assets/css/frame.css @@ -1,7 +1,12 @@ @import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200&display=swap'); +html { + background-image: url("../images/background.jpg"); +} + body { font-family: 'Nunito', sans-serif; + color: #2e3133; font-weight: normal; margin: 0px; @@ -19,9 +24,10 @@ body { } div#header { - background-color: #FFFFFF; + background-color: transparent; width: 100%; height: 80px; + backdrop-filter: blur(10px); } #logo { @@ -31,18 +37,20 @@ div#header { iframe#frame { flex-grow: 1; + background-color: #FFFFFF; } div#content { width: 100%; height: calc(100% - 80px); display: flex; + backdrop-filter: blur(10px); } div#toolList { float: left; width: 200px; - background-color: #FFFFFF; + background-color: transparent; height: 100%; } @@ -66,17 +74,19 @@ div#copyright a, a:visited, a:active { ul#toolList { list-style-type: none; margin: 0; - padding: 0; + padding: 10px 0 0 0; overflow: hidden; display: block; float: left; - background-color: #FFFFFF; + background-color: transparent; width: 100%; + height: calc(100% - 80px); + backdrop-filter: blur(10px); } #toolListRow a { display: block; - color: black; + color: white; text-align: center; padding: 20px 50px 25px; text-decoration: none; @@ -85,6 +95,32 @@ ul#toolList { #toolListRow a:hover { background-color: #2A93B0; color: white; - transform: scale(1.25, 1.25); + transform: matrix(1.25, 0, 0, 1.25, 15, 0); transition-duration: .3s; +} + +@media (prefers-color-scheme: dark) { + + + + div#header { + background-color: #00000000; + backdrop-filter: blur(10px); + } + + ul#toolList { + background-color: #00000000; + backdrop-filter: blur(10px); + } + + div#toolList { + background-color: #00000000; + backdrop-filter: blur(10px); + + } + + #toolListRow a { + color: white; + } + } \ No newline at end of file diff --git a/Frontend/assets/images/background.jpg b/Frontend/assets/images/background.jpg new file mode 100644 index 0000000..3cbefc4 Binary files /dev/null and b/Frontend/assets/images/background.jpg differ diff --git a/Frontend/assets/images/logo_biale.svg b/Frontend/assets/images/logo_biale.svg new file mode 100644 index 0000000..7852133 --- /dev/null +++ b/Frontend/assets/images/logo_biale.svg @@ -0,0 +1,101 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/Frontend/assets/images/logo.svg b/Frontend/assets/images/logo_czarne.svg similarity index 100% rename from Frontend/assets/images/logo.svg rename to Frontend/assets/images/logo_czarne.svg diff --git a/Frontend/index.html b/Frontend/index.html index f402256..9a4a2bc 100644 --- a/Frontend/index.html +++ b/Frontend/index.html @@ -14,7 +14,7 @@