1 files changed, 23 insertions, 39 deletions

diff --git a/assets/css/buttons.page.css b/assets/css/buttons.page.css
index 57e23dc..99db1b2 100644
--- a/assets/css/buttons.page.css
+++ b/assets/css/buttons.page.css
@@ -3,25 +3,23 @@ main > div {
     width: 100%;
 }
 
-p {
-    
-}
-
-p > img {
-    width: 20%;
+#my_button > div > img {
     border-radius: var(--border-radius);
-    display: block;
 }
 
 #buttons {
-    display: grid;
     margin-top: var(--padding-big);
-    grid-template-columns: repeat(3, 1fr);
-    gap: var(--padding-big);
     flex-grow: 1;
     height: min-content;
 }
 
+#buttons,
+#my_button > div {
+    display: grid;
+    gap: var(--padding-big);
+    grid-template-columns: repeat(3, 1fr);
+}
+
 main a {
     position: relative;
     display: block;
@@ -32,39 +30,23 @@ main a {
     color: var(--fg) !important;
 }
 
-main a:focus,
-main a:hover {
-    font-weight: normal;
-}
-
-main a > .icon > img {
+main a > .icon > div {
     width: 1em;
     height: 1em;
-    display: block;
-}
-
-@keyframes ticker {
-    0% {
-        transform: rotate(-90deg) translateX(-9ch);
-    }
-
-    100% {
-        transform: rotate(-90deg) translateX(0ch);
-    }
+    background-color: var(--fg);
+    mask-image: url("/assets/svg/external.svg");
+    mask-size: cover;
 }
 
 main a > img,
-p > img {
+#my_button > div > img {
+    width: 100%;
+    display: block;
     image-rendering: -webkit-optimize-contrast;
     image-rendering: -moz-crisp-edges;
     image-rendering: crisp-edges;
 }
 
-main a > img {
-    width: 100%;
-    display: block;
-}
-
 main a > .icon,
 main a > .link {
     --color: var(--bg);
@@ -84,10 +66,6 @@ main a > .link {
     padding: var(--padding);
 }
 
-main a:hover > .link {
-    transform: translate(-50%, 0);
-}
-
 main a > .icon {
     top: 50%;
     right: -0.5px;
@@ -98,6 +76,12 @@ main a > .icon {
     border-right: none;
 }
 
-main a:hover > .icon {
-    transform: translate(0, -50%);
+@media (hover: hover) {
+    main a:hover > .link {
+        transform: translate(-50%, 0);
+    }
+
+    main a:hover > .icon {
+        transform: translate(0, -50%);
+    }
 }