fix: use @variant for tailwind 4.0

This commit is contained in:
ZhenShuo Leo
2025-07-13 21:31:59 +08:00
parent 2c71bda97f
commit 367be5c6d4
2 changed files with 24 additions and 24 deletions

View File

@@ -3746,7 +3746,7 @@ pre {
[id^="fn"], [id^="fnref"] {
scroll-margin-top: 145px;
}
@screen sm {
@media (width >= 640px) {
.thumbnail {
min-width: 100%;
height: 180px;
@@ -3755,7 +3755,7 @@ pre {
flex-wrap: wrap;
}
}
@screen md {
@media (width >= 853px) {
.thumbnail {
min-width: 300px;
min-height: 180px;
@@ -3873,7 +3873,7 @@ pre {
width: calc(100% - 5px);
margin: 0px !important;
}
@screen sm {
@media (width >= 640px) {
.sm\:grid-w10 {
width: calc(10% - 5px);
margin: 0px !important;
@@ -3959,7 +3959,7 @@ pre {
margin: 0px !important;
}
}
@screen md {
@media (width >= 853px) {
.md\:grid-w10 {
width: calc(10% - 5px);
margin: 0px !important;
@@ -4045,7 +4045,7 @@ pre {
margin: 0px !important;
}
}
@screen lg {
@media (width >= 1024px) {
.lg\:grid-w10 {
width: calc(10% - 5px);
margin: 0px !important;
@@ -4131,7 +4131,7 @@ pre {
margin: 0px !important;
}
}
@screen xl {
@media (width >= 1280px) {
.xl\:grid-w10 {
width: calc(10% - 5px);
margin: 0px !important;
@@ -4217,7 +4217,7 @@ pre {
margin: 0px !important;
}
}
@screen 2xl {
@media (width >= 1536px) {
.2xl\:grid-w10 {
width: calc(10% - 5px);
margin: 0px !important;
@@ -4312,7 +4312,7 @@ pre {
.ratio-32-9 {
padding-top: 28.125%;
}
@screen sm {
@media (width >= 640px) {
.sm\:ratio-16-9 {
padding-top: 56.25%;
}
@@ -4323,7 +4323,7 @@ pre {
padding-top: 28.125%;
}
}
@screen md {
@media (width >= 853px) {
.md\:ratio-16-9 {
padding-top: 56.25%;
}
@@ -4334,7 +4334,7 @@ pre {
padding-top: 28.125%;
}
}
@screen lg {
@media (width >= 1024px) {
.lg\:ratio-16-9 {
padding-top: 56.25%;
}
@@ -4345,7 +4345,7 @@ pre {
padding-top: 28.125%;
}
}
@screen xl {
@media (width >= 1280px) {
.xl\:ratio-16-9 {
padding-top: 56.25%;
}
@@ -4356,7 +4356,7 @@ pre {
padding-top: 28.125%;
}
}
@screen 2xl {
@media (width >= 1536px) {
.2xl\:ratio-16-9 {
padding-top: 56.25%;
}

View File

@@ -457,7 +457,7 @@ pre {
scroll-margin-top: 145px;
}
@screen sm {
@variant sm {
.thumbnail {
min-width: 100%;
height: 180px;
@@ -467,7 +467,7 @@ pre {
}
}
@screen md {
@variant md {
.thumbnail {
min-width: 300px;
min-height: 180px;
@@ -599,7 +599,7 @@ pre {
margin: 0px !important;
}
@screen sm {
@variant sm {
.sm\:grid-w10 {
width: calc(10% - 5px);
margin: 0px !important;
@@ -686,7 +686,7 @@ pre {
}
}
@screen md {
@variant md {
.md\:grid-w10 {
width: calc(10% - 5px);
margin: 0px !important;
@@ -773,7 +773,7 @@ pre {
}
}
@screen lg {
@variant lg {
.lg\:grid-w10 {
width: calc(10% - 5px);
margin: 0px !important;
@@ -860,7 +860,7 @@ pre {
}
}
@screen xl {
@variant xl {
.xl\:grid-w10 {
width: calc(10% - 5px);
margin: 0px !important;
@@ -947,7 +947,7 @@ pre {
}
}
@screen 2xl {
@variant 2xl {
.2xl\:grid-w10 {
width: calc(10% - 5px);
margin: 0px !important;
@@ -1045,7 +1045,7 @@ pre {
padding-top: 28.125%;
} /* 32:9 Aspect Ratio */
@screen sm {
@variant sm {
.sm\:ratio-16-9 {
padding-top: 56.25%;
} /* 16:9 Aspect Ratio */
@@ -1057,7 +1057,7 @@ pre {
} /* 32:9 Aspect Ratio */
}
@screen md {
@variant md {
.md\:ratio-16-9 {
padding-top: 56.25%;
} /* 16:9 Aspect Ratio */
@@ -1069,7 +1069,7 @@ pre {
} /* 32:9 Aspect Ratio */
}
@screen lg {
@variant lg {
.lg\:ratio-16-9 {
padding-top: 56.25%;
} /* 16:9 Aspect Ratio */
@@ -1081,7 +1081,7 @@ pre {
} /* 32:9 Aspect Ratio */
}
@screen xl {
@variant xl {
.xl\:ratio-16-9 {
padding-top: 56.25%;
} /* 16:9 Aspect Ratio */
@@ -1093,7 +1093,7 @@ pre {
} /* 32:9 Aspect Ratio */
}
@screen 2xl {
@variant 2xl {
.2xl\:ratio-16-9 {
padding-top: 56.25%;
} /* 16:9 Aspect Ratio */