x
This commit is contained in:
Your Name committed
1 parent
78b722e120
commit
75770ca122
18 files changed
+1119
-318
No files matched your search
+61
-12
@@ -306,10 +306,55 @@ html {
|
||||
}
|
||||
|
||||
.site-footer-navigation {
|
||||
@apply relative border-t border-pop-black/10 bg-night-900;
|
||||
@apply relative border-t border-pop-black/10 bg-night-900 px-6;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.site-footer-navigation-inner {
|
||||
@apply mx-auto grid;
|
||||
}
|
||||
|
||||
.site-footer--mobile-columns-1 .site-footer-navigation-inner { @apply grid-cols-1; }
|
||||
.site-footer--mobile-columns-2 .site-footer-navigation-inner { @apply grid-cols-2; }
|
||||
.site-footer--container-narrow .site-footer-navigation-inner { max-width: 56rem; }
|
||||
.site-footer--container-standard .site-footer-navigation-inner { max-width: 80rem; }
|
||||
.site-footer--container-wide .site-footer-navigation-inner { max-width: 96rem; }
|
||||
.site-footer--container-full .site-footer-navigation-inner { max-width: none; }
|
||||
.site-footer--padding-sm .site-footer-navigation { @apply py-8; }
|
||||
.site-footer--padding-md .site-footer-navigation { @apply py-12; }
|
||||
.site-footer--padding-lg .site-footer-navigation { @apply py-20; }
|
||||
.site-footer--padding-xl .site-footer-navigation { @apply py-28; }
|
||||
.site-footer--gap-sm .site-footer-navigation-inner { @apply gap-4; }
|
||||
.site-footer--gap-md .site-footer-navigation-inner { @apply gap-8; }
|
||||
.site-footer--gap-lg .site-footer-navigation-inner { @apply gap-12; }
|
||||
.site-footer--gap-xl .site-footer-navigation-inner { @apply gap-16; }
|
||||
.site-footer--heading-sm .site-footer-column-heading { @apply text-xs; }
|
||||
.site-footer--heading-md .site-footer-column-heading { @apply text-sm; }
|
||||
.site-footer--heading-lg .site-footer-column-heading { @apply text-base; }
|
||||
.site-footer--link-sm .site-footer-column-links { @apply text-xs; }
|
||||
.site-footer--link-md .site-footer-column-links { @apply text-sm; }
|
||||
.site-footer--link-lg .site-footer-column-links { @apply text-base; }
|
||||
.site-footer--brand-logo-sm .site-footer-brand-logo { @apply h-6 w-auto; }
|
||||
.site-footer--brand-logo-md .site-footer-brand-logo { @apply h-8 w-auto md:h-10; }
|
||||
.site-footer--brand-logo-lg .site-footer-brand-logo { @apply h-12 w-auto; }
|
||||
.site-footer--brand-logo-xl .site-footer-brand-logo { @apply h-16 w-auto; }
|
||||
.site-footer--social-sm .site-footer-social { @apply h-8 w-8 text-[9px]; }
|
||||
.site-footer--social-md .site-footer-social { @apply h-9 w-9 text-[10px]; }
|
||||
.site-footer--social-lg .site-footer-social { @apply h-11 w-11 text-xs; }
|
||||
.site-footer--finale-mobile-compact .site-footer-brand-finale { min-height: 35svh; }
|
||||
.site-footer--finale-mobile-medium .site-footer-brand-finale { min-height: 55svh; }
|
||||
.site-footer--finale-mobile-large .site-footer-brand-finale { min-height: 75svh; }
|
||||
.site-footer--finale-logo-sm .site-footer-finale-logo { max-height: 4rem; max-width: min(72vw, 18rem); }
|
||||
.site-footer--finale-logo-md .site-footer-finale-logo { max-height: 6rem; max-width: min(76vw, 24rem); }
|
||||
.site-footer--finale-logo-lg .site-footer-finale-logo { max-height: 8rem; max-width: min(82vw, 32rem); }
|
||||
.site-footer--finale-logo-xl .site-footer-finale-logo { max-height: 8rem; max-width: min(82vw, 32rem); }
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.site-footer--desktop-columns-2 .site-footer-navigation-inner { @apply grid-cols-2; }
|
||||
.site-footer--desktop-columns-3 .site-footer-navigation-inner { @apply grid-cols-3; }
|
||||
.site-footer--desktop-columns-4 .site-footer-navigation-inner { @apply grid-cols-4; }
|
||||
}
|
||||
|
||||
/* Desktop Fixed Curtain Reveal Effect (เปิดม่าน Logo แบบ Fixed ตาม pkh.kitizone.com) */
|
||||
@media (min-width: 1024px) {
|
||||
.global-main {
|
||||
@@ -318,11 +363,11 @@ html {
|
||||
background: var(--color-pop-bg);
|
||||
}
|
||||
|
||||
.site-footer-with-finale {
|
||||
.site-footer--finale-curtain {
|
||||
min-height: 100svh;
|
||||
}
|
||||
|
||||
.site-footer-stage {
|
||||
.site-footer--finale-curtain .site-footer-stage {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 0;
|
||||
@@ -332,32 +377,36 @@ html {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.site-footer-brand-finale {
|
||||
.site-footer--finale-curtain .site-footer-brand-finale {
|
||||
min-height: 0;
|
||||
padding-top: 4rem;
|
||||
padding-bottom: 4rem;
|
||||
}
|
||||
|
||||
.site-footer-finale-logo {
|
||||
@apply max-h-48 max-w-[min(68vw,48rem)];
|
||||
}
|
||||
|
||||
.site-footer-finale-wordmark {
|
||||
.site-footer--finale-curtain .site-footer-finale-wordmark {
|
||||
@apply text-8xl;
|
||||
}
|
||||
|
||||
.site-footer-navigation {
|
||||
.site-footer--finale-curtain .site-footer-navigation {
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
.site-footer--finale-static.site-footer--finale-desktop-compact .site-footer-brand-finale { min-height: 35svh; }
|
||||
.site-footer--finale-static.site-footer--finale-desktop-half .site-footer-brand-finale { min-height: 50svh; }
|
||||
.site-footer--finale-static.site-footer--finale-desktop-screen .site-footer-brand-finale { min-height: 100svh; }
|
||||
.site-footer--finale-curtain.site-footer--finale-desktop-compact .site-footer-stage { grid-template-rows: 35svh auto; align-content: end; }
|
||||
.site-footer--finale-curtain.site-footer--finale-desktop-half .site-footer-stage { grid-template-rows: 50svh auto; align-content: end; }
|
||||
.site-footer--finale-curtain.site-footer--finale-desktop-screen .site-footer-stage { grid-template-rows: minmax(0, 1fr) auto; }
|
||||
.site-footer--finale-logo-xl .site-footer-finale-logo { max-height: 12rem; max-width: min(68vw, 48rem); }
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.site-footer-stage {
|
||||
.site-footer--finale-curtain .site-footer-stage {
|
||||
display: block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.site-footer-with-finale {
|
||||
.site-footer--finale-curtain {
|
||||
min-height: 0;
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user