progress report

style.css

@@ -0,0 +1,148 @@
+/* class-based and id-based Stylings */
+.ticker {
+    background: #000000;
+    border-bottom: solid 0.25rem #AD88F2;
+    padding: 0;
+    margin: 0;
+    font-size: 2.5rem;
+    border-radius: 0.2rem;
+    white-space: nowrap;
+    position: sticky;
+    top: 0;
+    overflow: hidden;
+}
+
+#announcements {
+    display: flex;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    transform: translate(100vw);
+    animation: scroll 25s infinite linear;
+    width: fit-content;
+}
+
+.IN-flag {
+    background-image: url("https://knowindia.india.gov.in/assets/images/national_flag_inner.jpg");
+    background-repeat: repeat;
+    background-size: contain;
+    -webkit-background-clip: text;
+    color: transparent;
+}
+
+/* Scrollbar Stylings */
+::-webkit-scrollbar {
+    width: 1rem;
+}
+
+::-webkit-scrollbar-track {
+    background: #000000;
+}
+
+::-webkit-scrollbar-thumb {
+    background: #FFFFFF;
+    border-radius: 5px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+    background: #EEEEEE;
+}
+
+/* General Stylings */
+* {
+    font-family: "MiSans Devanagari";
+    font-family: "MiSans Latin";
+    color: #FFFFFF;
+    box-sizing: border-box;
+    text-decoration: none;
+
+    &::selection {
+        background: #AD88F2;
+        color: #FFFFFF;
+    }
+}
+
+html {
+    cursor: default;
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+
+body {
+    background: #000000;
+}
+
+input,
+button {
+    outline: none;
+    border: none;
+}
+
+footer {
+    border-top: solid 0.25rem #AD88F2;
+    font-size: 1rem;
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    width: 100%;
+    height: 3vh;
+    background: #000000;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 2;
+}
+
+a {
+    text-decoration: none;
+    cursor: pointer;
+    color: inherit;
+
+    &:hover {
+        text-decoration: underline 0.25rem #FFFFFF;
+        transition: text-decoration 100ms ease;
+    }
+}
+
+/* @keyframe Queries */
+@keyframes scroll {
+    0% {
+        transform: translate(100%);
+    }
+
+    100% {
+        transform: translate(-100%);
+    }
+}
+
+@keyframes blink {
+    0% {
+        opacity: 100%;
+    }
+
+    50% {
+        opacity: 25%;
+    }
+
+    100% {
+        opacity: 100%;
+    }
+}
+
+@keyframes highlight {
+    0% {
+        filter: drop-shadow(0rem 0rem 0rem #AD88F2);
+    }
+
+    25% {
+        filter: drop-shadow(0rem 0rem 0.25rem #AD88F2);
+    }
+
+    100% {
+        filter: drop-shadow(0rem 0rem 0.5rem #AD88F2);
+    }
+}