basic project card and projects page setup

2023-05-10 22:40:04 -06:00
parent 1e7af0b94b
commit 6d1099590e
108 changed files with 673 additions and 154 deletions
@@ -0,0 +1,149 @@
+/* GENERAL */
+body {
+    margin:0;
+    height:100vh;
+    background-size:300% 100%,cover;
+}
+
+/* TEXT */
+* {
+    font-family: Lato, sans-serif;
+    color: white;
+}
+
+h1, h2 {
+    font-weight: bold;
+    margin: 0;
+}
+
+h1 {
+    margin: 5vw 0 5vw 0;
+    font-size: 8vw;
+}
+
+
+h2 {
+    font-size: 4vw;
+}
+
+h3 {
+    font-size: 3vw;
+}
+
+p {
+    font-size: 2vw;
+}
+
+.dark-text {
+    color: #4A245E;
+}
+
+.light-text {
+    color: white;
+}
+
+/* NAV-BAR */
+.bg-light {
+    background-color: white !important;
+    padding: 0;
+}
+
+.navbar-brand {
+    padding-left: .5vw;
+    color: #4A245E;
+    font-size: 2vw;
+    font-weight: bold;
+
+    animation: 500ms;
+}
+
+.navbar-toggler {
+    border: none;
+}
+
+.navbar-toggler:focus {
+    box-shadow: none;
+    border:none;
+}
+
+.navbar-light .navbar-toggler-icon {
+    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(74, 36, 94, 1)' stroke-width='3.5' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
+}
+
+.navbar-brand:hover {
+    color: #4A245E;
+}
+
+.nav-item {
+    padding: 1.5vw;
+    color: #4A245E;
+    font-size: 1.3vw;
+
+    transition: color 500ms;
+    transition: background-color 500ms;
+}
+
+.nav-item:hover {
+    color: white;
+    background-color: #4A245E;
+}
+
+/* MISC */
+
+.custom-container {
+    align-content: center;
+
+    padding: 5vw;
+
+    width: 90% !important;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+.bar {
+    display: block;
+    width: 100%;
+    border-top: 5px #4A245E solid;
+    padding-bottom: 1vw;
+}
+
+.card-text {
+    font-size: 2vw;
+}
+
+@media (max-width: 991px) {
+    h1 {
+        font-size: 12vw;
+    }
+
+    h2 {
+        font-size: 8vw;
+    }
+
+    h3, .navbar-brand {
+        font-size: 6vw;
+    }
+
+    h4 {
+      font-size: 4vw;
+    }
+
+    p, .nav-link, .nav-link > .nav-item {
+        font-size: 3vw;
+    }
+
+    .nav-link > .nav-item {
+        font-weight: bold;
+    }
+}
+
+/*Buttons*/
+.btn {
+  background-color: #4A245E;
+  border: none;
+  transition: background-color 300ms;
+}
+
+.btn:hover {
+  background-color: #673283;
+}