Ark/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma synced 2026-03-21 04:34:30 -07:00
Code Issues Packages Projects Releases Wiki Activity

Add responsive button sizes (#3484)

Browse Source 
* Add responsive button sizes

* Clean up code

* Add responsive buttons playground
This commit is contained in:
Jeremy Thomas
2022-02-06 15:57:04 +00:00
committed by GitHub
parent 80e0396424
commit d773f4dcd5
18 changed files with 259 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
sass/elements/button.sass
View File

@@ -44,6 +44,7 @@ $button-static-background-color: $scheme-main-ter !default
$button-static-border-color: $border !default
$button-colors: $colors !default
$button-responsive-sizes: ("mobile": ("small": ($size-small * 0.75), "normal": ($size-small * 0.875), "medium": $size-small, "large": $size-normal), "tablet-only": ("small": ($size-small * 0.875), "normal": ($size-small), "medium": $size-normal, "large": $size-medium)) !default
// The button sizes use mixins so they can be used at different breakpoints
=button-small
@@ -343,3 +344,14 @@ $button-colors: $colors !default
.button:not(.is-fullwidth)
margin-left: 0.25rem
margin-right: 0.25rem
@each $bp-name, $bp-sizes in $button-responsive-sizes
+breakpoint($bp-name)
@each $size, $value in $bp-sizes
@if $size != "normal"
.button.is-responsive.is-#{$size}
font-size: $value
@else
.button.is-responsive,
.button.is-responsive.is-normal
font-size: $value