From: Danilo M. Date: Sat, 18 Apr 2026 13:14:29 +0000 (+0200) Subject: style: resize social share icons to 50px and tighten grid gap X-Git-Tag: release_22042026-1342~107 X-Git-Url: https://git.danix.xyz/?a=commitdiff_plain;h=e6c8bf78ce3eafaa2a2643be175c39cd57de3d53;p=danix.xyz-2.git style: resize social share icons to 50px and tighten grid gap --- diff --git a/themes/danix-xyz-hacker/assets/css/main.css b/themes/danix-xyz-hacker/assets/css/main.css index 99a278d..0fac3be 100644 --- a/themes/danix-xyz-hacker/assets/css/main.css +++ b/themes/danix-xyz-hacker/assets/css/main.css @@ -273,14 +273,27 @@ html.theme-light { /* Icon button (for icons without text) */ .btn-icon { - @apply p-2 rounded-full inline-flex items-center justify-center; - width: 40px; - height: 40px; + @apply rounded-full inline-flex items-center justify-center; + width: auto; + height: auto; + padding: 0.5rem; } - .btn-icon svg { - width: 20px; - height: 20px; + .btn-icon svg, + .btn-icon i { + width: auto !important; + height: auto !important; + } + + /* Force Feather icons to match size */ + .btn-icon [data-feather] { + width: 50px !important; + height: 50px !important; + } + + .btn-icon [data-feather] svg { + width: 50px !important; + height: 50px !important; } /* Badge base style */ diff --git a/themes/danix-xyz-hacker/assets/css/main.min.css b/themes/danix-xyz-hacker/assets/css/main.min.css index d2db799..7a38ef4 100644 --- a/themes/danix-xyz-hacker/assets/css/main.min.css +++ b/themes/danix-xyz-hacker/assets/css/main.min.css @@ -1414,14 +1414,27 @@ button, align-items: center; justify-content: center; border-radius: 9999px; + width: auto; + height: auto; padding: 0.5rem; - width: 40px; - height: 40px; } -.btn-icon svg { - width: 20px; - height: 20px; +.btn-icon svg, + .btn-icon i { + width: auto !important; + height: auto !important; +} + +/* Force Feather icons to match size */ + +.btn-icon [data-feather] { + width: 50px !important; + height: 50px !important; +} + +.btn-icon [data-feather] svg { + width: 50px !important; + height: 50px !important; } /* Badge base style */ @@ -1818,6 +1831,10 @@ article.border.border-border\/30.rounded-lg.card.group.bg-bg { height: 1.25rem; } +.h-\[50px\] { + height: 50px; +} + .h-auto { height: auto; } @@ -1850,6 +1867,10 @@ article.border.border-border\/30.rounded-lg.card.group.bg-bg { width: 1.25rem; } +.w-\[50px\] { + width: 50px; +} + .w-full { width: 100%; } diff --git a/themes/danix-xyz-hacker/layouts/partials/social-share.html b/themes/danix-xyz-hacker/layouts/partials/social-share.html index 6934f4e..d7b6562 100644 --- a/themes/danix-xyz-hacker/layouts/partials/social-share.html +++ b/themes/danix-xyz-hacker/layouts/partials/social-share.html @@ -3,9 +3,9 @@ {{ $url := $page.Permalink | urlquery }} {{ $title := $page.Title | urlquery }} -{{ $gridClass := "grid-cols-2 gap-2" }} +{{ $gridClass := "grid-cols-2 gap-2 justify-items-center" }} {{ if eq $mode "inline" }} - {{ $gridClass = "grid-cols-5 gap-3 justify-items-center" }} + {{ $gridClass = "grid-cols-5 gap-2 justify-items-center" }} {{ end }}
@@ -20,8 +20,8 @@ :aria-label="copied ? '{{ i18n "linkCopied" }}' : '{{ i18n "copyLink" }}'" class="btn-icon hover:text-accent hover:bg-surface transition-colors focus-visible:ring-2 focus-visible:ring-accent" > - - + +
@@ -31,7 +31,7 @@ aria-label="{{ i18n "shareViaEmail" }}" class="btn-icon hover:text-accent hover:bg-surface transition-colors focus-visible:ring-2 focus-visible:ring-accent" > - + @@ -41,7 +41,7 @@ aria-label="{{ i18n "facebook" }}" class="btn-icon hover:text-accent hover:bg-surface transition-colors focus-visible:ring-2 focus-visible:ring-accent" > -