diff --git a/res/wrapper.png b/assets/images/city.png similarity index 100% rename from res/wrapper.png rename to assets/images/city.png diff --git a/assets/style.css b/assets/style.css new file mode 100644 index 0000000..87a8382 --- /dev/null +++ b/assets/style.css @@ -0,0 +1,146 @@ +@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap'); + +:root { + --primary-bg: rgb(27, 21, 41); + --secondary-bg: #1a1a1a; + --primary-text: #d2d6e5; + --error: rgb(255, 55, 0); + --primary: #2a9dd6; + --primary-hover: #2489bb; +} + +body { + background: linear-gradient(127deg, var(--secondary-bg), var(--primary-bg)); + background-repeat: no-repeat; + background-attachment: fixed; + background-size: cover; + height: 100%; + width: 100%; + font-family: 'Poppins', sans-serif; + color: var(--primary-text); + margin: 0; + padding: 0; +} + +nav { + display: flex; + flex-direction: row; + justify-content: space-between; + padding: 1.2rem 1rem; + background-color: rgba(0, 0, 0, 0.2); + -webkit-box-shadow: 0px 20px 28px 0px rgba(0,0,0,0.2); + -moz-box-shadow: 0px 20px 28px 0px rgba(0,0,0,0.2); + box-shadow: 0px 20px 28px 0px rgba(0,0,0,0.2); +} + +nav #login { + color: var(--primary-text); + text-decoration: none; + background-color: #2a9dd6; + padding: 0.35rem 0.65rem; + transition: all 0.3s ease; + border-radius: 15px; +} + +nav #login:hover, nav #login.active{ + transition: all 0.3s ease; + background-color: var(--primary-hover); + color: var(--primary-text); +} + +nav #login:hover::after, nav #login.active::after { + width: 0; +} + +ul { + display: flex; + flex-direction: row; + gap: 2rem; +} + +li { + list-style: none; +} + +li a { + position: relative; + padding-bottom: 0.45rem; + color: var(--primary-text); + text-decoration: none; + transition: all 0.3s ease; +} + +li a::after { + content: ""; + position: absolute; + height: 4px; + width: 0; + bottom: 0; + left: 0; + background-color: var(--primary); + transition: all 0.3s ease; + border-radius: 15px; +} + +li a:hover::after { + width: 85%; +} + +li a:hover, li a.active { + color: var(--primary); + transition: all 0.3s ease; +} + +.wrapper-404 { + text-align: center; +} + +.wrapper-404 h1 { + font-size: 10rem; + margin: 0; +} + +.wrapper-404 .error { + color: var(--error); +} + +.wrapper-404 h3 { + margin-bottom: 2rem; +} + +.error-code { + color: var(--primary); +} + +.back { + color: var(--primary-text); + text-decoration: none; + background-color: #2a9dd6; + padding: 0.35rem 0.65rem; + transition: all 0.3s ease; + border-radius: 15px; +} + +.back:hover { + transition: all 0.3s ease; + background-color: var(--primary-hover); +} + +header { + width: 100%; + align-items: center; + text-align: center; +} +header h1 { + margin: 0; + padding: 0; +} +header a { + color: var(--primary); +} + +header hr { + border-color: var(--primary); + opacity: 0.5; + width: 30%; +} \ No newline at end of file diff --git a/index.html b/index.html deleted file mode 100644 index 672cf3a..0000000 --- a/index.html +++ /dev/null @@ -1,11 +0,0 @@ - - -
- - - -Skoro ako r/adlerka - ale lepšie.
+