diff --git a/src/styles/commonRadioStyles.scss b/src/styles/commonRadioStyles.scss index bc74ab260..5d4c4afc0 100644 --- a/src/styles/commonRadioStyles.scss +++ b/src/styles/commonRadioStyles.scss @@ -18,7 +18,7 @@ label { position: relative; background: $white; - height: 3rem; + min-height: 3rem; transition: all 150ms linear; border-radius: $border-radius-lg; border: 1px solid $gray-500; @@ -37,7 +37,8 @@ color: $danger; } } - @include spinner; + //Add spinner. Specify width and height + @include spinner(1rem,1rem); } } } diff --git a/src/styles/mixins/customMixins.scss b/src/styles/mixins/customMixins.scss index fafd5894e..77b4be470 100644 --- a/src/styles/mixins/customMixins.scss +++ b/src/styles/mixins/customMixins.scss @@ -7,7 +7,7 @@ //Spinner //Choose color and position -@mixin spinner { +@mixin spinner($width, $height) { &.spinner { //Open an overlay to prevent page interaction &:before { @@ -27,8 +27,8 @@ mask: url(../../assets/img/icons/spinner.svg); mask-size: cover; position: absolute; - width: 1rem; - height: 1rem; + width: $width; + height: $height; animation: rotation 1s infinite linear; @keyframes rotation { 100% { diff --git a/src/uxComponents/alert/alert.vue b/src/uxComponents/alert/alert.vue index b47d75f3c..811dcb133 100644 --- a/src/uxComponents/alert/alert.vue +++ b/src/uxComponents/alert/alert.vue @@ -51,6 +51,8 @@ export default { } svg { fill: $blue-700; + width: 1rem; + height: 1rem; } } &.alert-danger { @@ -59,6 +61,8 @@ export default { } svg { fill: $red-700; + width: 1rem; + height: 1rem; } } &.alert-warning { @@ -67,6 +71,8 @@ export default { } svg { fill: $yellow-700; + width: 1rem; + height: 1rem; } } &.alert-success { @@ -75,6 +81,8 @@ export default { } svg { fill: $green-700; + width: 1rem; + height: 1rem; } } }