changed link hover font

lilianzlettuce · Oct 28, 2023 · e7b3310 · e7b3310
1 parent 94ec1f5
commit e7b3310
Show file tree

Hide file tree

Showing 4 changed files with 50 additions and 2 deletions.
diff --git a/global.css b/global.css
@@ -48,4 +48,5 @@ a:hover,
 a:focus, 
 a:active{
     color: var(--magenta);
+    font-family: 'Pixelify Sans', sans-serif;
 }
diff --git a/index-style.css b/index-style.css
@@ -210,13 +210,18 @@ div{
 
 #greeting {
     color: var(--text-color);
-    font-family: Inter;
     font-size: 3rem;
     font-weight: 500;
     margin-bottom: 10px;
 }
 
 .lettuce {
+    font-family: 'Gajraj One', sans-serif;
+    font-family: 'Anton', sans-serif;
+    font-family: 'Bebas Neue', sans-serif;
+    font-family: 'Staatliches', sans-serif;
+    font-family: 'Pixelify Sans', sans-serif;
+    font-family: inherit;
     color: var(--lettuce);
     height: 20px;
 }

diff --git a/index.html b/index.html
@@ -8,8 +8,19 @@
         <!--fonts-->
         <link href="https://fonts.googleapis.com/css2?family=Barlow:wght@300&family=Inter:wght@200;300;400&family=Koulen&family=Monoton&family=Open+Sans&display=swap" rel="stylesheet">
         <link href="https://fonts.googleapis.com/css2?family=Quicksand&family=Roboto+Mono&family=Inconsolata&family=Nanum+Gothic+Coding&display=swap" rel="stylesheet">
+
+        <link rel="preconnect" href="https://fonts.googleapis.com">
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+        <link href="https://fonts.googleapis.com/css2?family=Agbalumo&family=Arvo&family=Josefin+Sans&family=Rokkitt&family=Sanchez&display=swap" rel="stylesheet">
+        <link href="https://fonts.googleapis.com/css2?family=Anton&family=Bebas+Neue&family=Staatliches&display=swap" rel="stylesheet">
+        <link href="https://fonts.googleapis.com/css2?family=Pixelify+Sans&family=Press+Start+2P&display=swap" rel="stylesheet">
+        <link href="https://fonts.googleapis.com/css2?family=Fira+Mono&family=Noto+Sans+Mono&family=Sometype+Mono&display=swap" rel="stylesheet">
+        <link href="https://fonts.googleapis.com/css2?family=Gajraj+One&display=swap" rel="stylesheet">
+        <link href="https://fonts.googleapis.com/css2?family=Libre+Barcode+128&family=Libre+Barcode+128+Text&family=Libre+Barcode+39+Extended+Text&family=Libre+Barcode+39+Text&family=Linefont:wght@200&display=swap" rel="stylesheet">
+
         <!--FontAwesome Icons-->
         <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
+
         <!--my css-->
         <link rel="stylesheet" href="global.css">
         <link rel="stylesheet" href="index-style.css">

diff --git a/top-bar.css b/top-bar.css
@@ -4,7 +4,24 @@
     font-size: 2.8rem;
     font-weight: 400;
     padding: 0px 0px 0px 0px;
+    width: 150px;
     height: 20px;
+    position: relative;
+    text-align: center;
+}
+#name:hover{
+    font-family: 'Pixelify Sans', sans-serif;
+    font-weight: 800;
+    color: var(--magenta);
+    font-size: 3rem;
+    background-color: white;
+
+    /*font-family: 'Libre Barcode 128 Text', 'Pixelify Sans', sans-serif;
+    background-color: transparent;
+    top: 10px;
+    height: fit-content;
+    font-size: 3.4rem;
+    color: white;*/
 }
 
 .top-bar{
@@ -26,7 +43,7 @@
 }
 
 #toilet-model-container {
-    padding-left: 10px;
+    padding-left: 0px;
 }
 
 #toilet-model {
@@ -57,10 +74,24 @@
     height: 10px;
     padding: 0px 10px 0px 10px;
     text-align: center;
+    font-weight: 800;
+    position: relative;
+    /*font-size: 2rem;
+    font-family: 'Anton', sans-serif;
+    font-family: 'Bebas Neue', sans-serif;
+    font-family: 'Staatliches', sans-serif;*/
 }
 .menu-link:hover,
 .menu-link:focus,
 .menu-link:active {
     font-weight: 800;
     background-color: var(--cyan);
+    background-color: white;
+    color: var(--magenta);
+    font-size: 3rem;
+
+    /*background-color: transparent;
+    top: 10px;
+    height: fit-content;
+    font-family: 'Libre Barcode 128 Text', 'Pixelify Sans', sans-serif;*/
 }