Skip to content

Commit b7b1731

Browse files
Valentin Mladenovweb-flow
andauthored
fix(label): remove has pseudo class selector (port of #1020) (#1025)
## PR Checklist Please check if your PR fulfills the following requirements: - [ ] Tests for the changes have been added (for bug fixes / features) - [ ] Docs have been added / updated (for bug fixes / features) - [ ] If applicable, have a visual design approval ## PR Type What kind of change does this PR introduce? <!-- Please check the one that applies to this PR using "x". --> - [x] Bugfix - [ ] Feature - [ ] Code style update (formatting, local variables) - [x] Refactoring (no functional changes, no api changes) - [ ] Build related changes - [ ] CI related changes - [ ] Documentation content changes - [ ] Other... Please describe: ## What is the current behavior? <!-- Please describe the current behavior that you are modifying, or link to a relevant issue. --> Issue Number: N/A ## What is the new behavior? ## Does this PR introduce a breaking change? - [ ] Yes - [x] No <!-- If this PR contains a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information --------- Co-authored-by: GitHub <noreply@github.com>
1 parent a481c9a commit b7b1731

3 files changed

Lines changed: 24 additions & 8 deletions

File tree

projects/ui/src/shim.cds-core.scss

Lines changed: 24 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -505,7 +505,7 @@
505505

506506
/* Labels */
507507
--clr-label-padding: var(--cds-global-space-3) var(--cds-global-space-5);
508-
--clr-label-gap-size: var(--cds-global-space-5);
508+
--clr-label-gap-size: var(--cds-global-space-3);
509509
--clr-label-box-shadow: 0;
510510

511511
// ATM - remove and use as default or think a better way express clicked state
@@ -580,17 +580,33 @@
580580

581581
// ATM - use as default state for labels
582582
// Two state: 1. label with text only 2. labels with icons or badges should have lower padding on the right
583-
.label {
584-
&:has(> .badge),
585-
&:has(> cds-icon) {
586-
padding-right: var(--cds-global-space-3);
587-
}
583+
.label,
584+
a.label {
585+
text-decoration: none;
588586

589-
.badge,
590-
cds-icon {
587+
> .badge,
588+
> cds-icon {
591589
margin: 0;
592590
text-decoration: none;
593591
}
592+
593+
cds-icon {
594+
margin-left: var(--cds-global-space-3);
595+
}
596+
597+
.badge + cds-icon {
598+
margin-left: 0;
599+
}
600+
601+
// constrain to cds-icon (close) and badge class, so combobox pills should not be affected
602+
& > cds-icon:last-child,
603+
& > span:last-child.badge {
604+
margin-right: calc(-1 * var(--cds-global-space-3));
605+
}
606+
607+
&.clickable > .text {
608+
text-decoration: underline;
609+
}
594610
}
595611

596612
/* Badges */
-20 Bytes
Loading
-24 Bytes
Loading

0 commit comments

Comments
 (0)