@stackoverflow/stacks 1.1.0 → 1.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/css/stacks.css +43 -5
- package/dist/css/stacks.min.css +1 -1
- package/lib/css/components/badges.less +45 -0
- package/lib/css/components/post-summary.less +24 -13
- package/package.json +17 -17
package/dist/css/stacks.css
CHANGED
|
@@ -599,6 +599,9 @@ a.s-badge:hover {
|
|
|
599
599
|
margin-right: var(--su1);
|
|
600
600
|
margin-left: calc((var(--su4) + var(--su1)) * -1);
|
|
601
601
|
}
|
|
602
|
+
.s-badge__icon {
|
|
603
|
+
gap: 0.3em;
|
|
604
|
+
}
|
|
602
605
|
.s-badge__sm {
|
|
603
606
|
min-width: 18px;
|
|
604
607
|
align-self: flex-start;
|
|
@@ -725,6 +728,36 @@ body.theme-highcontrast .s-badge__moderator {
|
|
|
725
728
|
body.theme-highcontrast .s-badge__staff {
|
|
726
729
|
border-color: currentColor;
|
|
727
730
|
}
|
|
731
|
+
.s-badge__danger {
|
|
732
|
+
color: var(--red-900);
|
|
733
|
+
background-color: var(--red-100);
|
|
734
|
+
border-color: var(--red-600);
|
|
735
|
+
}
|
|
736
|
+
.s-badge__danger.s-badge__filled {
|
|
737
|
+
color: hsl(0, 0%, 100%);
|
|
738
|
+
background-color: var(--red-500);
|
|
739
|
+
border-color: transparent;
|
|
740
|
+
}
|
|
741
|
+
.s-badge__info {
|
|
742
|
+
color: var(--blue-900);
|
|
743
|
+
background-color: var(--blue-100);
|
|
744
|
+
border-color: var(--blue-600);
|
|
745
|
+
}
|
|
746
|
+
.s-badge__warning {
|
|
747
|
+
color: var(--yellow-900);
|
|
748
|
+
background-color: var(--yellow-100);
|
|
749
|
+
border-color: var(--yellow-600);
|
|
750
|
+
}
|
|
751
|
+
.s-badge__muted {
|
|
752
|
+
color: var(--black-900);
|
|
753
|
+
background-color: var(--black-100);
|
|
754
|
+
border-color: var(--black-600);
|
|
755
|
+
}
|
|
756
|
+
.s-badge__muted.s-badge__filled {
|
|
757
|
+
color: var(--white);
|
|
758
|
+
background-color: var(--black-700);
|
|
759
|
+
border-color: transparent;
|
|
760
|
+
}
|
|
728
761
|
.s-award-bling {
|
|
729
762
|
display: flex;
|
|
730
763
|
align-items: center;
|
|
@@ -2312,7 +2345,7 @@ body.theme-system .theme-dark__forced .s-popover--arrow {
|
|
|
2312
2345
|
font-size: var(--fs-body1);
|
|
2313
2346
|
color: var(--fc-light);
|
|
2314
2347
|
}
|
|
2315
|
-
.s-post-summary--stats .s-post-summary--stats-item {
|
|
2348
|
+
.s-post-summary--stats .s-post-summary--stats-item:not(.s-badge) {
|
|
2316
2349
|
display: inline-flex;
|
|
2317
2350
|
gap: 0.3em;
|
|
2318
2351
|
align-items: center;
|
|
@@ -2326,6 +2359,11 @@ body.theme-system .theme-dark__forced .s-popover--arrow {
|
|
|
2326
2359
|
.s-post-summary--stats .s-post-summary--stats-item .s-post-summary--stats-item-number {
|
|
2327
2360
|
font-weight: 500;
|
|
2328
2361
|
}
|
|
2362
|
+
.s-post-summary--stats .s-post-summary--stats-item.s-badge {
|
|
2363
|
+
font-size: var(--fs-body1);
|
|
2364
|
+
line-height: var(--lh-md);
|
|
2365
|
+
padding: var(--su2) var(--su4);
|
|
2366
|
+
}
|
|
2329
2367
|
.s-post-summary--stats .s-post-summary--stats-item.has-answers,
|
|
2330
2368
|
.s-post-summary--stats .s-post-summary--stats-item.has-bounty,
|
|
2331
2369
|
.s-post-summary--stats .s-post-summary--stats-item.is-deleted,
|
|
@@ -2551,12 +2589,12 @@ body.theme-highcontrast .s-post-summary--answer:before {
|
|
|
2551
2589
|
color: hsl(0, 0%, 100%);
|
|
2552
2590
|
background-color: var(--red-500);
|
|
2553
2591
|
}
|
|
2554
|
-
.s-post-summary__ignored .s-post-summary--content,
|
|
2555
|
-
.s-post-summary__deleted .s-post-summary--content {
|
|
2592
|
+
.s-post-summary__ignored .s-post-summary--content > *:not(.s-post-summary--content-menu-button),
|
|
2593
|
+
.s-post-summary__deleted .s-post-summary--content > *:not(.s-post-summary--content-menu-button) {
|
|
2556
2594
|
opacity: 0.6;
|
|
2557
2595
|
}
|
|
2558
|
-
.s-post-summary__ignored .s-post-summary--stats-item:not(.is-deleted),
|
|
2559
|
-
.s-post-summary__deleted .s-post-summary--stats-item:not(.is-deleted) {
|
|
2596
|
+
.s-post-summary__ignored .s-post-summary--stats-item:not(.s-badge):not(.is-deleted),
|
|
2597
|
+
.s-post-summary__deleted .s-post-summary--stats-item:not(.s-badge):not(.is-deleted) {
|
|
2560
2598
|
opacity: 0.6;
|
|
2561
2599
|
filter: grayscale(100%);
|
|
2562
2600
|
}
|