lvwerra HF Staff commited on
Commit
add93e4
·
verified ·
1 Parent(s): ff9734e

Toolbar buttons: lock line-height + min-height so a and button render same size

Browse files
Files changed (1) hide show
  1. static/index.html +6 -1
static/index.html CHANGED
@@ -103,7 +103,12 @@
103
  font-size: 10px; font-weight: 400; letter-spacing: 0.5px;
104
  padding: 5px 11px; border: 1px solid #ccc; border-radius: 3px;
105
  background: #fff; color: var(--muted); cursor: pointer;
106
- transition: all 0.15s; text-decoration: none; display: inline-block;
 
 
 
 
 
107
  }
108
  .btn:hover { border-color: var(--muted-3); color: var(--ink); }
109
  .btn:disabled { opacity: 0.6; cursor: wait; }
 
103
  font-size: 10px; font-weight: 400; letter-spacing: 0.5px;
104
  padding: 5px 11px; border: 1px solid #ccc; border-radius: 3px;
105
  background: #fff; color: var(--muted); cursor: pointer;
106
+ transition: all 0.15s; text-decoration: none;
107
+ /* inline-flex + fixed line-height + min-height keeps <a> and <button>
108
+ the same size — the ↗ glyph would otherwise inflate the link's
109
+ line-box height. */
110
+ display: inline-flex; align-items: center;
111
+ line-height: 1.4; min-height: 26px; box-sizing: border-box;
112
  }
113
  .btn:hover { border-color: var(--muted-3); color: var(--ink); }
114
  .btn:disabled { opacity: 0.6; cursor: wait; }