ViMaSter/hackertours-theme
Watch
0
0
Fork
You've already forked hackertours-theme
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add explicit button class to style buttons like the mobile menu toggle.

Browse source
This commit is contained in:
Fredrik Jonsson 2025-05-30 08:29:43 +02:00
commit 53826053a1
3 changed files with 2 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

2
README.md
View file

@ -559,7 +559,7 @@ The users choice is stored in localStorage item "cookieconsent".
It it recommended to add a link or button to allow users to change their choice. Adding the class "clearcookieconsent" is all that is needed. It it recommended to add a link or button to allow users to change their choice. Adding the class "clearcookieconsent" is all that is needed.
```html ```html
<button class="clearcookieconsent">Cookie settings</button> <button class="button clearcookieconsent">Cookie settings</button>
<a href="#" class="clearcookieconsent">Cookie settings</a> <a href="#" class="clearcookieconsent">Cookie settings</a>
``` ```

8
assets/sass/components/button/_button.scss
View file

@ -1,12 +1,4 @@
// Button // Button
//
// In addition to the default styling of `<button>` and
// `<input type="submit|image|reset|button">` elements, the `.button` class and
// its variants can apply buttons styles to various elements (like an `<a>`
// link).
//
// :hover - Hover styling.
// :active - Depressed button styling.
.button, .button,
%button, %button,

2
layouts/_partials/mobilemenu.html
View file

@ -1,6 +1,6 @@
<div class="mobile-nav" dir="ltr" hidden> <div class="mobile-nav" dir="ltr" hidden>
<div class="mobile-nav__cover"></div> <div class="mobile-nav__cover"></div>
<button class="mobile-nav__toggle{{ if $.Param "mobilemenuoutline" }} button--outline{{ end }}" aria-expanded="false" aria-controls="sheet"> <button class="mobile-nav__toggle button{{ if $.Param "mobilemenuoutline" }} button--outline{{ end }}" aria-expanded="false" aria-controls="sheet">
{{ i18n "menu_mobile" }} {{ i18n "menu_mobile" }}
<svg class="mobile-nav__hamburger" viewBox="0 0 100 100" focusable="false" aria-hidden="true"> <svg class="mobile-nav__hamburger" viewBox="0 0 100 100" focusable="false" aria-hidden="true">
<rect width="80" height="12" x="10" y="20" rx="5"></rect> <rect width="80" height="12" x="10" y="20" rx="5"></rect>