half progress on revamped sneexy page

_includes/styles/base.css

@@ -194,16 +194,6 @@ span[title] {
     }
 }
 
-/* the tabler icons svgs styling */
-.tabler-icon,
-.icon .icon-tabler {
-    width: 1.3rem;
-    height: 1.3rem;
-    padding-bottom: .2rem;
-    vertical-align: middle !important;
-    color: var(--foreground) !important;
-}
-
 /* code (enforced monospace) */
 .code {
     font-family: 'JetBrains Mono', monospace, 'Segoe UI', Tahoma, Geneva, Verdana, system-ui, sans-serif !important;
@@ -438,22 +428,22 @@ card-container {
 }
 
 /* Dashed border */
-hr.dashed {
+hr[dashed] {
     border: .1rem dashed var(--border);
 }
 
 /* Dotted border */
-hr.dotted {
+hr[dotted] {
     border: .1rem dotted var(--border);
 }
 
 /* Solid border */
-hr.solid {
+hr[solid] {
     border: .1rem solid var(--border);
 }
 
 /* Rounded border */
-hr.rounded {
+hr[rounded] {
     border: .2rem solid var(--border);
     border-radius: 5px;
 }

_includes/styles/pages/home.css

@@ -22,8 +22,9 @@ article#home {
                 margin-bottom: 0.5rem;
 
                 img[src="/assets/synth.download/logo_web.svg"] {
-                    width: 40rem;
-                    height: auto;
+                    min-width: 3rem;
+                    max-width: 100%;
+                    max-height: 25rem;
                 }
             }
         }

_includes/styles/pages/sneexy.css

@@ -9,13 +9,14 @@
 /  ~sneexy - breeeep! my page! slooosh~ */
 
 /* my page has goop in html to set goopy colors */
-html[page-is="goopy"] {
+html:has(article#sneexy) {
     --accent: #00d131 !important;
 
-    #sneexy > window-contents {
+    article#sneexy window-contents {
         #logo {
-            width: 40rem;
-            height: auto;
+            min-width: 3rem;
+            max-width: 100%;
+            max-height: 13rem;
         }
 
         h1 #pfp {
@@ -30,6 +31,21 @@ html[page-is="goopy"] {
             transform: scale(2);
         }
 
+        card-container[selfinfo] {
+            text-align: start;
+            margin-top: .8rem;
+
+            ul {
+                margin-top: 0;
+                margin-bottom: 0;
+
+                li {
+                    margin-left: -1rem;
+                    &::marker { content: ""; }
+                }
+            }
+        }
+
         .selfinfo {
             display: grid;
             padding-top: 5px;