diff --git a/app/javascript/elements/site_sidebar.js b/app/javascript/elements/site_sidebar.js index 7ebce95..343e86d 100644 --- a/app/javascript/elements/site_sidebar.js +++ b/app/javascript/elements/site_sidebar.js @@ -41,21 +41,17 @@ export class SiteSidebar extends LitElement { padding-inline: var(--padding); } - .toggle-button { - display: inline-block; - - font-size: 1.5rem; - height: var(--_button-size); - width: var(--_button-size); - padding: 0; - text-align: center; - vertical-align: middle; - - border-radius: 50%; - box-sizing: border-box; - + .toggle-button-container { + background-color: var(--pico-muted-border-color); + border: 3px solid var(--pico-muted-color); + border-radius: 1000px; + corner-shape: squircle; position: absolute; left: calc(100% + var(--_button-offset)); + + /* Mostly to fix the oversized hamburger */ + scale: 60%; + transform-origin: 0 50%; } .bg { @@ -89,9 +85,9 @@ export class SiteSidebar extends LitElement { return html`