Initial commit

frontend/css/styles.css

@@ -0,0 +1,115 @@
+:root {
+  --primary: #150135;
+
+  --secondary: #6c2bad;
+
+  --secondary-hover: #3c7aca;
+
+  --pink: #ff00f2;
+}
+
+.bg-img {
+  /* background-image: url(/frontend/Images/Black\ Background\ Abstract.jpg); */
+
+  background:
+    linear-gradient(var(--primary), #6c2bad4d, var(--primary)),
+    radial-gradient(
+      circle 700px at 20% 30%,
+
+      rgba(255, 0, 179, 0.445),
+      transparent
+    ),
+    radial-gradient(
+      circle 500px at 80% 70%,
+
+      rgba(255, 0, 179, 0.445),
+      transparent
+    );
+
+  min-height: 90vh;
+
+  height: auto;
+
+  background-size: cover;
+
+  background-position: center center;
+
+  background-repeat: no-repeat;
+
+  /* background-blend-mode: overlay; */
+
+  /* background-color: rgba(0, 0, 0, 0.467); */
+}
+
+.bg-img.dashboard {
+  min-height: auto;
+}
+
+body {
+  background-color: var(--primary);
+}
+
+nav,
+footer {
+  background-color: var(--primary);
+
+  color: white;
+}
+
+.nav-link {
+  color: white;
+}
+
+.nav-link:hover {
+  color: var(--secondary);
+}
+
+.navbar-toggler {
+  border: none !important;
+
+  box-shadow: none !important;
+}
+
+.btn-primary {
+  background-color: var(--secondary);
+
+  color: white;
+
+  border-color: transparent;
+}
+
+.btn-primary:hover {
+  background-color: var(--secondary-hover);
+
+  color: white;
+
+  border-color: transparent;
+}
+
+form a {
+  text-decoration: none;
+
+  color: white;
+
+  transition: 0.2s ease-in-out;
+}
+
+form a:hover {
+  color: var(--secondary);
+}
+
+.bg-translucent {
+  background-color: #00000063;
+}
+
+#sortSelect:hover {
+  cursor: pointer;
+}
+
+.pinkBorder {
+  border: var(--pink) 1px solid;
+}
+
+textarea {
+  resize: none;
+}