skills/angular__angular
1
0
Fork 0
mirror of https://github.com/angular/angular.git synced 2026-09-14 13:54:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(docs-infra): prevent tab labels from being clipped

Browse Source 
The active docs tab applied a 2px bottom border that inactive tabs lacked,
which shrank the active label's content box and clipped its descenders. It
also set `line-height: 1.5` only on the active label, so switching tabs
nudged the text. Reserve the border as transparent on every tab and recolor
it on the active one, and share the label `line-height`, so the letters are
no longer cut and the label stays put when switching.
This commit is contained in:
Kam
2026-07-03 22:31:29 +03:00
committed by Leon Senft
parent 205acb3494
commit 12a4e60a4a
1 changed files with 2 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
adev/shared-docs/styles/_resets.scss
+2 -3
View File
@@ -310,16 +310,15 @@
.mdc-tab {
padding-inline: 15px !important;
border-block-end: 2px solid transparent;
}
.mdc-tab__text-label {
transition: none;
line-height: 1.5;
}
.mdc-tab--active {
border: 0;
border-block-end-width: 2px;
border-style: solid;
border-image: var(--purple-to-blue-horizontal-gradient) 1;
.mdc-tab__text-label {