nitro theme: tuck adjacent buttons under the right slant
A -0.8em right margin pulls whatever follows an article button (another button or text) under the slant's empty top triangle: adjacent buttons' slant bands overlap horizontally by ~0.3em while the painted parallel edges keep a constant ~0.3em clearance — overlapping but never touching.
This commit is contained in:
1 parent
cb046fe867
commit
d14fcbc4f3
1 file changed
+7
-1
@@ -151,7 +151,12 @@
|
||||
subordinate). border-radius is the fallback for browsers without
|
||||
shape(). Asymmetric inline padding keeps the text clear of the
|
||||
slants (wider on the right: the wide bottom-right sweep cuts deeper
|
||||
into the label's end side). Editor chrome (.icon-btn pens, .copy)
|
||||
into the label's end side). The negative right margin tucks whatever
|
||||
follows — another button or plain text — under the right slant's
|
||||
empty top triangle: adjacent buttons' slant bands overlap by ~0.3em
|
||||
horizontally while the painted edges keep ~0.3em apart (the slants
|
||||
are parallel, so the clearance is constant top to bottom).
|
||||
Editor chrome (.icon-btn pens, .copy)
|
||||
keeps its own styling. The {contact:} envelope's line-height is
|
||||
reduced in the base stylesheet so it doesn't outgrow this height. */
|
||||
.contact-trigger,
|
||||
@@ -161,6 +166,7 @@ article button:not(.icon-btn):not(.copy) {
|
||||
justify-content: center;
|
||||
height: 1.7em;
|
||||
padding: 0 1.3em 0 1em;
|
||||
margin-right: -0.8em;
|
||||
white-space: nowrap;
|
||||
/* Same typography as the contact trigger (raw <button>s otherwise get
|
||||
the small UA font): nav family/weight, article size and leading. */
|
||||
|
||||
Reference in new issue
Block a user