footer
This commit is contained in:
@@ -46,6 +46,7 @@ button {
|
||||
.overflow-hidden { overflow: hidden; }
|
||||
.z-10 { z-index: 10; }
|
||||
.mx-auto { margin-left: auto; margin-right: auto; }
|
||||
.ml-auto { margin-left: auto; }
|
||||
.mb-4 { margin-bottom: 1rem; }
|
||||
.mb-8 { margin-bottom: 2rem; }
|
||||
.mb-12 { margin-bottom: 3rem; }
|
||||
@@ -112,6 +113,9 @@ button {
|
||||
.text-6xl { font-size: 3.75rem; }
|
||||
.text-7xl { font-size: 4.5rem; }
|
||||
|
||||
/* Extra small text sizes */
|
||||
.text-xs { font-size: 0.75rem; }
|
||||
.text-xxs { font-size: 0.65rem; }
|
||||
/* Button styles */
|
||||
.btn-primary {
|
||||
background: transparent;
|
||||
@@ -377,3 +381,86 @@ button {
|
||||
.text-base { font-size: 1rem; }
|
||||
.text-xl { font-size: 1.25rem; }
|
||||
.text-2xl { font-size: 1.5rem; }
|
||||
/* Flex utilities (small missing subset similar to Tailwind) */
|
||||
.flex-1 { flex: 1 1 0%; }
|
||||
.flex-row { flex-direction: row; }
|
||||
.items-start { align-items: flex-start; }
|
||||
.justify-between { justify-content: space-between; }
|
||||
|
||||
/* Text alignment utilities */
|
||||
.text-right { text-align: right; }
|
||||
.text-left { text-align: left; }
|
||||
|
||||
/* ===== Footer layout utilities (added) ===== */
|
||||
.max-w-7xl { max-width: 80rem; margin-left: auto; margin-right: auto; }
|
||||
|
||||
.w-1\/2 { width: 50%; }
|
||||
|
||||
.justify-end { justify-content: flex-end; }
|
||||
|
||||
.gap-12 { gap: 3rem; }
|
||||
|
||||
.space-y-2 > * + * { margin-top: 0.5rem; }
|
||||
|
||||
.mt-8 { margin-top: 2rem; }
|
||||
|
||||
.border-t { border-top-width: 1px; }
|
||||
|
||||
/* Border color utilities */
|
||||
.border-white { border-color: #ffffff; }
|
||||
|
||||
/* Border style utility */
|
||||
.border-solid { border-style: solid; }
|
||||
|
||||
/* Tailwind-like color opacity utility used in footer borders */
|
||||
.border-bright-cyan\/20 { border-color: rgba(0, 217, 255, 0.2); }
|
||||
|
||||
/* Simple social icon circles used in footer */
|
||||
.social-circle {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 9999px;
|
||||
background: #ffffff;
|
||||
color: #000000;
|
||||
font-family: 'Roboto Mono', monospace;
|
||||
font-weight: 700;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
pointer-events: auto;
|
||||
box-shadow: 0 0 0 1px rgba(255,255,255,0.15) inset;
|
||||
transition: transform 150ms ease, box-shadow 150ms ease, background 150ms ease;
|
||||
}
|
||||
|
||||
.social-circle:hover {
|
||||
transform: scale(1.05);
|
||||
box-shadow: 0 0 0 2px rgba(0,217,255,0.5) inset, 0 0 10px rgba(0,217,255,0.25);
|
||||
}
|
||||
|
||||
/* ===== Footer responsive helpers ===== */
|
||||
.w-full { width: 100%; }
|
||||
|
||||
@media (min-width: 640px) {
|
||||
.sm\:w-1\/2 { width: 50%; }
|
||||
.sm\:mt-0 { margin-top: 0; }
|
||||
}
|
||||
|
||||
/* Missing utility used by footer links */
|
||||
.tracking-wide { letter-spacing: 0.05em; }
|
||||
|
||||
/* Solid royal blue background to match reference footer */
|
||||
.bg-royal-blue { background-color: #0b1fd1; }
|
||||
.bg-bright-cyan { background-color: #00d9ff; }
|
||||
|
||||
/* Footer separator (cyan blue, thinner) */
|
||||
.footer-separator {
|
||||
width: 100%;
|
||||
height: 1px; /* Thinner line */
|
||||
background: #ffffff; /* Bright white */
|
||||
opacity: 0.95; /* Slightly toned */
|
||||
box-shadow: 0 0 8px rgba(0, 217, 255, 0.25); /* subtle cyan glow */
|
||||
}
|
||||
|
Reference in New Issue
Block a user