mirror of
https://git.kh3group.com/georgebiri/khy_website.git
synced 2026-10-16 22:51:47 +00:00
refactor: enhance product detail page layout and specifications display
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
- Updated product-detail.html to improve spacing and layout for product description and specifications. - Removed static size and color options sections to streamline the design. - Added dynamic rendering of product specifications in JavaScript for better user experience. - Adjusted CSS for improved margin and height settings across various elements.
This commit is contained in:
parent
8c42edd511
commit
197f862045
4 changed files with 385 additions and 778 deletions
File diff suppressed because it is too large
Load diff
|
|
@ -217,38 +217,14 @@
|
||||||
|
|
||||||
<!-- Product Description -->
|
<!-- Product Description -->
|
||||||
<p
|
<p
|
||||||
class="font-playfair font-normal text-sm text-black mb-12 max-w-md"
|
class="font-playfair font-normal text-sm text-black mb-8 max-w-md"
|
||||||
id="product-description"
|
id="product-description"
|
||||||
>
|
>
|
||||||
<!-- Product description will be populated dynamically -->
|
<!-- Product description will be populated dynamically -->
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<!-- Size Options -->
|
|
||||||
<div class="mb-8">
|
|
||||||
<h3
|
|
||||||
class="font-playfair font-normal text-sm text-quick-silver mb-4"
|
|
||||||
>
|
|
||||||
Size
|
|
||||||
</h3>
|
|
||||||
<div class="grid grid-cols-6 gap-2" id="size-buttons-container">
|
|
||||||
<!-- Size buttons will be populated dynamically -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Color Options -->
|
|
||||||
<div class="mb-8">
|
|
||||||
<h3
|
|
||||||
class="font-playfair font-normal text-sm text-quick-silver mb-4"
|
|
||||||
>
|
|
||||||
Color
|
|
||||||
</h3>
|
|
||||||
<div class="flex gap-4" id="color-buttons-container">
|
|
||||||
<!-- Color buttons will be populated dynamically -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Quantity and Action Buttons -->
|
<!-- Quantity and Action Buttons -->
|
||||||
<div class="flex flex-col md:flex-row gap-4 md:gap-6 mb-8">
|
<div class="flex flex-col md:flex-row gap-4 md:gap-6 mb-3">
|
||||||
<!-- Action Buttons -->
|
<!-- Action Buttons -->
|
||||||
<a
|
<a
|
||||||
href="contact.html"
|
href="contact.html"
|
||||||
|
|
@ -265,7 +241,14 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Divider -->
|
<!-- Divider -->
|
||||||
<div class="w-full h-px bg-light-silver mb-8"></div>
|
<div class="w-full h-px bg-light-silver mb-3"></div>
|
||||||
|
|
||||||
|
<!-- Product Specifications -->
|
||||||
|
<div class="mb-8">
|
||||||
|
<div class="space-y-2" id="product-specifications">
|
||||||
|
<!-- Product specifications will be populated dynamically -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- Product Metadata -->
|
<!-- Product Metadata -->
|
||||||
<div class="space-y-4">
|
<div class="space-y-4">
|
||||||
|
|
|
||||||
125
scripts/main.js
125
scripts/main.js
|
|
@ -332,9 +332,9 @@ function addThumbnailClickListeners() {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Product detail page functionality
|
// Product detail page functionality
|
||||||
async function initProductDetail() {
|
async function initProductDetail() {
|
||||||
console.log("Product detail script running...");
|
console.log("Product detail script running...");
|
||||||
console.log("Current URL:", window.location.href);
|
console.log("Current URL:", window.location.href);
|
||||||
|
|
@ -445,48 +445,99 @@ async function initProductDetail() {
|
||||||
addThumbnailClickListeners();
|
addThumbnailClickListeners();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Update size options
|
// Update product specifications
|
||||||
const sizeContainer = document.getElementById("size-buttons-container");
|
const specificationsContainer = document.getElementById(
|
||||||
console.log("Size container:", sizeContainer);
|
"product-specifications"
|
||||||
if (sizeContainer && product.sizes) {
|
);
|
||||||
sizeContainer.innerHTML = product.sizes
|
console.log("Specifications container:", specificationsContainer);
|
||||||
.map(
|
if (specificationsContainer && product.additionalInformation) {
|
||||||
(size, index) => `
|
const specifications = [];
|
||||||
<button
|
|
||||||
class="w-8 h-8 ${
|
// Add key specifications from additionalInformation
|
||||||
index === 0
|
if (product.additionalInformation.Material) {
|
||||||
? "bg-uc-gold text-white"
|
specifications.push({
|
||||||
: "bg-floral-white text-black"
|
label: "Material",
|
||||||
} font-playfair font-normal text-sm rounded flex items-center justify-center size-button"
|
value: product.additionalInformation.Material,
|
||||||
>
|
});
|
||||||
${size}
|
|
||||||
</button>
|
|
||||||
`
|
|
||||||
)
|
|
||||||
.join("");
|
|
||||||
console.log("Updated size options with", product.sizes.length, "sizes");
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Update color options
|
if (product.additionalInformation.Design) {
|
||||||
const colorContainer = document.getElementById("color-buttons-container");
|
specifications.push({
|
||||||
console.log("Color container:", colorContainer);
|
label: "Design",
|
||||||
if (colorContainer && product.colors) {
|
value: product.additionalInformation.Design,
|
||||||
colorContainer.innerHTML = product.colors
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (product.additionalInformation["Finish Options"]) {
|
||||||
|
specifications.push({
|
||||||
|
label: "Finish Options",
|
||||||
|
value: product.additionalInformation["Finish Options"],
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (product.additionalInformation.Headrest) {
|
||||||
|
specifications.push({
|
||||||
|
label: "Headrest",
|
||||||
|
value: product.additionalInformation.Headrest,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (product.additionalInformation["Use Cases"]) {
|
||||||
|
specifications.push({
|
||||||
|
label: "Use Cases",
|
||||||
|
value: product.additionalInformation["Use Cases"],
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (product.additionalInformation.Ergonomics) {
|
||||||
|
specifications.push({
|
||||||
|
label: "Ergonomics",
|
||||||
|
value: product.additionalInformation.Ergonomics,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (product.additionalInformation.Maintenance) {
|
||||||
|
specifications.push({
|
||||||
|
label: "Maintenance",
|
||||||
|
value: product.additionalInformation.Maintenance,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (product.additionalInformation.Durability) {
|
||||||
|
specifications.push({
|
||||||
|
label: "Durability",
|
||||||
|
value: product.additionalInformation.Durability,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (product.additionalInformation.Warranty) {
|
||||||
|
specifications.push({
|
||||||
|
label: "Warranty",
|
||||||
|
value: product.additionalInformation.Warranty,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Render specifications
|
||||||
|
specificationsContainer.innerHTML = specifications
|
||||||
.map(
|
.map(
|
||||||
(color, index) => `
|
(spec) => `
|
||||||
<button
|
<div class="flex justify-between items-start py-1 border-b border-gray-100 last:border-b-0">
|
||||||
class="w-8 h-8 rounded-full ${
|
<span class="font-playfair font-normal text-xs text-quick-silver flex-shrink-0 mr-4">
|
||||||
index === 0 ? "border-2 border-black" : ""
|
${spec.label}:
|
||||||
}"
|
</span>
|
||||||
style="background-color: ${color}"
|
<span class="font-playfair font-normal text-xs text-black text-right">
|
||||||
></button>
|
${spec.value}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
`
|
`
|
||||||
)
|
)
|
||||||
.join("");
|
.join("");
|
||||||
|
|
||||||
console.log(
|
console.log(
|
||||||
"Updated color options with",
|
"Updated specifications with",
|
||||||
product.colors.length,
|
specifications.length,
|
||||||
"colors"
|
"items"
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
214
styles/main.css
214
styles/main.css
|
|
@ -783,6 +783,10 @@ video {
|
||||||
margin-top: 2.5rem;
|
margin-top: 2.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mt-2 {
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
.mt-20 {
|
.mt-20 {
|
||||||
margin-top: 5rem;
|
margin-top: 5rem;
|
||||||
}
|
}
|
||||||
|
|
@ -791,16 +795,12 @@ video {
|
||||||
margin-top: 0.75rem;
|
margin-top: 0.75rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mt-12 {
|
|
||||||
margin-top: 3rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mt-6 {
|
.mt-6 {
|
||||||
margin-top: 1.5rem;
|
margin-top: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mt-2 {
|
.mr-4 {
|
||||||
margin-top: 0.5rem;
|
margin-right: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.box-border {
|
.box-border {
|
||||||
|
|
@ -891,22 +891,22 @@ video {
|
||||||
height: 24rem;
|
height: 24rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-\[145px\] {
|
.h-\[22vh\] {
|
||||||
height: 145px;
|
height: 22vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-\[301px\] {
|
.h-\[29vh\] {
|
||||||
height: 301px;
|
height: 29vh;
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[446px\] {
|
|
||||||
height: 446px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-\[64px\] {
|
.h-\[64px\] {
|
||||||
height: 64px;
|
height: 64px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.h-\[6vh\] {
|
||||||
|
height: 6vh;
|
||||||
|
}
|
||||||
|
|
||||||
.h-auto {
|
.h-auto {
|
||||||
height: auto;
|
height: auto;
|
||||||
}
|
}
|
||||||
|
|
@ -923,54 +923,6 @@ video {
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-\[320px\] {
|
|
||||||
height: 320px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[220px\] {
|
|
||||||
height: 220px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[100px\] {
|
|
||||||
height: 100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[25vh\] {
|
|
||||||
height: 25vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[18vh\] {
|
|
||||||
height: 18vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[7vh\] {
|
|
||||||
height: 7vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[30vh\] {
|
|
||||||
height: 30vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[22vh\] {
|
|
||||||
height: 22vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[8vh\] {
|
|
||||||
height: 8vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[29vh\] {
|
|
||||||
height: 29vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[21vh\] {
|
|
||||||
height: 21vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[6vh\] {
|
|
||||||
height: 6vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[31vh\] {
|
.h-\[31vh\] {
|
||||||
height: 31vh;
|
height: 31vh;
|
||||||
}
|
}
|
||||||
|
|
@ -983,6 +935,10 @@ video {
|
||||||
height: 32vh;
|
height: 32vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.h-\[25vh\] {
|
||||||
|
height: 25vh;
|
||||||
|
}
|
||||||
|
|
||||||
.h-\[95vh\] {
|
.h-\[95vh\] {
|
||||||
height: 95vh;
|
height: 95vh;
|
||||||
}
|
}
|
||||||
|
|
@ -1111,10 +1067,6 @@ video {
|
||||||
max-width: 20rem;
|
max-width: 20rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.max-w-4xl {
|
|
||||||
max-width: 56rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.max-w-full {
|
.max-w-full {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
@ -1248,14 +1200,14 @@ video {
|
||||||
gap: 1.5rem;
|
gap: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.gap-8 {
|
|
||||||
gap: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.gap-7 {
|
.gap-7 {
|
||||||
gap: 1.75rem;
|
gap: 1.75rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.gap-8 {
|
||||||
|
gap: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
.space-x-10 > :not([hidden]) ~ :not([hidden]) {
|
.space-x-10 > :not([hidden]) ~ :not([hidden]) {
|
||||||
--tw-space-x-reverse: 0;
|
--tw-space-x-reverse: 0;
|
||||||
margin-right: calc(2.5rem * var(--tw-space-x-reverse));
|
margin-right: calc(2.5rem * var(--tw-space-x-reverse));
|
||||||
|
|
@ -1292,12 +1244,6 @@ video {
|
||||||
margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
|
margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
|
||||||
}
|
}
|
||||||
|
|
||||||
.space-y-16 > :not([hidden]) ~ :not([hidden]) {
|
|
||||||
--tw-space-y-reverse: 0;
|
|
||||||
margin-top: calc(4rem * calc(1 - var(--tw-space-y-reverse)));
|
|
||||||
margin-bottom: calc(4rem * var(--tw-space-y-reverse));
|
|
||||||
}
|
|
||||||
|
|
||||||
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
|
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
|
||||||
--tw-space-y-reverse: 0;
|
--tw-space-y-reverse: 0;
|
||||||
margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
|
margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
|
||||||
|
|
@ -1322,6 +1268,12 @@ video {
|
||||||
margin-bottom: calc(2rem * var(--tw-space-y-reverse));
|
margin-bottom: calc(2rem * var(--tw-space-y-reverse));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.space-y-3 > :not([hidden]) ~ :not([hidden]) {
|
||||||
|
--tw-space-y-reverse: 0;
|
||||||
|
margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
|
||||||
|
margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
|
||||||
|
}
|
||||||
|
|
||||||
.overflow-hidden {
|
.overflow-hidden {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
@ -1688,10 +1640,6 @@ video {
|
||||||
padding-right: 1.5rem;
|
padding-right: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.pt-0 {
|
|
||||||
padding-top: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pt-12 {
|
.pt-12 {
|
||||||
padding-top: 3rem;
|
padding-top: 3rem;
|
||||||
}
|
}
|
||||||
|
|
@ -1716,6 +1664,10 @@ video {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.text-right {
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
.text-justify {
|
.text-justify {
|
||||||
text-align: justify;
|
text-align: justify;
|
||||||
}
|
}
|
||||||
|
|
@ -1772,6 +1724,10 @@ video {
|
||||||
line-height: 1rem;
|
line-height: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.text-\[10px\] {
|
||||||
|
font-size: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
.font-bold {
|
.font-bold {
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
|
|
@ -2051,6 +2007,10 @@ video {
|
||||||
transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
|
transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.last\:border-b-0:last-child {
|
||||||
|
border-bottom-width: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
.hover\:-translate-y-0\.5:hover {
|
.hover\:-translate-y-0\.5:hover {
|
||||||
--tw-translate-y: -0.125rem;
|
--tw-translate-y: -0.125rem;
|
||||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||||
|
|
@ -2390,90 +2350,18 @@ video {
|
||||||
margin-left: 2rem;
|
margin-left: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.lg\:mt-16 {
|
|
||||||
margin-top: 4rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:mt-8 {
|
.lg\:mt-8 {
|
||||||
margin-top: 2rem;
|
margin-top: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.lg\:h-\[70vh\] {
|
|
||||||
height: 70vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:h-\[90vh\] {
|
|
||||||
height: 90vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:h-\[50vh\] {
|
|
||||||
height: 50vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:h-\[600px\] {
|
|
||||||
height: 600px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:h-\[500px\] {
|
|
||||||
height: 500px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:h-\[85vh\] {
|
|
||||||
height: 85vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:h-\[60vh\] {
|
|
||||||
height: 60vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:h-\[65vh\] {
|
.lg\:h-\[65vh\] {
|
||||||
height: 65vh;
|
height: 65vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.lg\:min-h-screen {
|
|
||||||
min-height: 100vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:min-h-\[90vh\] {
|
|
||||||
min-height: 90vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:min-h-\[100vh\] {
|
|
||||||
min-height: 100vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:min-h-\[150vh\] {
|
|
||||||
min-height: 150vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:min-h-\[900px\] {
|
|
||||||
min-height: 900px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:min-h-\[800px\] {
|
|
||||||
min-height: 800px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:min-h-\[700px\] {
|
|
||||||
min-height: 700px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:min-h-\[600px\] {
|
|
||||||
min-height: 600px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:min-h-\[60vh\] {
|
|
||||||
min-height: 60vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:min-h-\[65vh\] {
|
.lg\:min-h-\[65vh\] {
|
||||||
min-height: 65vh;
|
min-height: 65vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.lg\:min-h-\[80vh\] {
|
|
||||||
min-height: 80vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:w-36 {
|
.lg\:w-36 {
|
||||||
width: 9rem;
|
width: 9rem;
|
||||||
}
|
}
|
||||||
|
|
@ -2510,18 +2398,6 @@ video {
|
||||||
gap: 2rem;
|
gap: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.lg\:space-y-10 > :not([hidden]) ~ :not([hidden]) {
|
|
||||||
--tw-space-y-reverse: 0;
|
|
||||||
margin-top: calc(2.5rem * calc(1 - var(--tw-space-y-reverse)));
|
|
||||||
margin-bottom: calc(2.5rem * var(--tw-space-y-reverse));
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:space-y-6 > :not([hidden]) ~ :not([hidden]) {
|
|
||||||
--tw-space-y-reverse: 0;
|
|
||||||
margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
|
|
||||||
margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:space-y-4 > :not([hidden]) ~ :not([hidden]) {
|
.lg\:space-y-4 > :not([hidden]) ~ :not([hidden]) {
|
||||||
--tw-space-y-reverse: 0;
|
--tw-space-y-reverse: 0;
|
||||||
margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
|
margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
|
||||||
|
|
@ -2545,11 +2421,6 @@ video {
|
||||||
padding-top: 12rem;
|
padding-top: 12rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.lg\:text-2xl {
|
|
||||||
font-size: 1.5rem;
|
|
||||||
line-height: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:text-3xl {
|
.lg\:text-3xl {
|
||||||
font-size: 1.875rem;
|
font-size: 1.875rem;
|
||||||
line-height: 2.25rem;
|
line-height: 2.25rem;
|
||||||
|
|
@ -2570,11 +2441,6 @@ video {
|
||||||
line-height: 1.75rem;
|
line-height: 1.75rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.lg\:text-lg {
|
|
||||||
font-size: 1.125rem;
|
|
||||||
line-height: 1.75rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:leading-snug {
|
.lg\:leading-snug {
|
||||||
line-height: 1.375;
|
line-height: 1.375;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue