From 5ac0ac6614e3c45d810a1594a2009d3febfa2793 Mon Sep 17 00:00:00 2001 From: Eva Decker Date: Fri, 28 Jun 2024 12:02:25 -0400 Subject: [PATCH] fix: Add inline padding to `Select` (#2062) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Ricardo Jaime Gil Simões Co-authored-by: Chris Swithinbank --- .changeset/angry-pots-yawn.md | 5 +++++ packages/starlight/components/Select.astro | 6 ++++-- 2 files changed, 9 insertions(+), 2 deletions(-) create mode 100644 .changeset/angry-pots-yawn.md diff --git a/.changeset/angry-pots-yawn.md b/.changeset/angry-pots-yawn.md new file mode 100644 index 00000000000..53bbde92ca9 --- /dev/null +++ b/.changeset/angry-pots-yawn.md @@ -0,0 +1,5 @@ +--- +'@astrojs/starlight': patch +--- + +Increase theme and language select inline padding diff --git a/packages/starlight/components/Select.astro b/packages/starlight/components/Select.astro index 0975a678939..b4301042b01 100644 --- a/packages/starlight/components/Select.astro +++ b/packages/starlight/components/Select.astro @@ -31,6 +31,7 @@ interface Props { label { --sl-label-icon-size: 0.875rem; --sl-caret-size: 1.25rem; + --sl-inline-padding: 0.5rem; position: relative; display: flex; align-items: center; @@ -62,8 +63,9 @@ interface Props { select { border: 0; padding-block: 0.625rem; - padding-inline: calc(var(--sl-label-icon-size) + 0.25rem) calc(var(--sl-caret-size) + 0.25rem); - width: var(--sl-select-width); + padding-inline: calc(var(--sl-label-icon-size) + var(--sl-inline-padding) + 0.25rem) calc(var(--sl-caret-size) + var(--sl-inline-padding) + 0.25rem); + margin-inline: calc(var(--sl-inline-padding) * -1); + width: calc(var(--sl-select-width) + var(--sl-inline-padding) * 2); background-color: transparent; text-overflow: ellipsis; color: inherit;