Fix bugs I created

Make bars prettier

static/css/style.sass

@@ -130,7 +130,7 @@ nav
 
     z-index: 2
     box-sizing: border-box
-    overflow: hidden
+    //overflow: hidden
 
     h1
         margin: 0 // 0 1rem 0
@@ -220,64 +220,75 @@ p.subtitle
     justify-content: space-between
     gap: 0.5rem
 
-    overflow: hidden
+    //overflow: hidden
+
+.bar-chart
+    margin: 0
+    padding: 0
 
-$languages: ("python": #3776AB, "js": #F7DF1E, "html": #E34F26, "css": #1572B6, "sass": #CC6699, "php": #777BB4, "sql": #4479A1, "shell": #89E051, "rust": #CE422B)
-$os: ("ubuntu": #E95420, "arch": #1793D1, "proxmox": #E57000, "manjaro": #35BF5C, "windows": #0078D6)
-.sub_experiance
-    padding-left: 0.25rem !important
     position: relative
-    color: $white !important
+    
+    display: flex
+    flex-direction: column
+    gap: 0.5rem
 
-    &::before
-        content: ''
+.marker
+    width: 2px
+    height: 100%
 
-        width: 2px
+    position: absolute
+    top: 0
+    left: 0
+
+    background-color: rgba($white, 0.1)
+
+    z-index: -2
+
+.sub_experiance
+    width: 0%
+    height: 1.69rem
+
+    position: relative
+
+    background-color: $primary
+    border-radius: 2px
+
+    transition: width 2s cubic-bezier(.86,0,.07,1)
+
+    .fg
+        width: 100%
         height: 100%
 
         position: absolute
-        top: 0
-        left: 0
 
-        background-color: $primary
-        border-radius: 2px
+        overflow: hidden
+
+        span
+            position: absolute
+            top: 50%
+            left: 1.5rem
+            transform: translateY(-50%)
+
+            font-size: 0.9rem
+            font-weight: 600
+            white-space: nowrap
+
+            color: $black
+
+    .bg
+        position: absolute
+        top: 50%
+        left: 1.5rem
+        transform: translateY(-50%)
+
+        font-size: 0.9rem
+        font-weight: 600
+        white-space: nowrap
+
+        color: $white
 
-        opacity: 0.5
         z-index: -1
 
-    @each $lang, $color in $languages
-        &.#{$lang}
-            &::before
-                background-color: $color
-
-    @each $os, $color in $os
-        &.#{$os}
-            &::before
-                background-color: $color
-
-    &.vbad
-        &::before
-            width: 2px
-    &.bad
-        &::before
-            width: 10%
-    &.ok
-        &::before
-            width: 20%
-    &.good
-        &::before
-            width: 40%
-    &.vgood
-        &::before
-            width: 80%
-    &.excellent
-        &::before
-            width: 100%
-
-    span
-        font-size: 0.8rem
-
-
 @keyframes loader
     0%
         width: 0
@@ -338,8 +349,13 @@ $os: ("ubuntu": #E95420, "arch": #1793D1, "proxmox": #E57000, "manjaro": #35BF5C
 .track-image
     padding: 0px
 
+    // Its too late for me to be bothered to fix a bug I have
+    min-width: 5rem
     width: 5rem
+    max-width: 5rem
+    min-height: 5rem
     height: 5rem
+    max-height: 5rem
 
     border-radius: 2px
     background-color: $black