tonyair
/
webpack-bootstrap-ui-kit
mirror of https://github.com/a2nt/webpack-bootstrap-ui-kit.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

IMPROVEMENT: field gutter variables

This commit is contained in:
Tony Air 2020-02-24 22:16:06 +07:00
parent 5136435b8f
commit 1fc7394550
3 changed files with 102 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/js/_components/_ui.form.basics.js
View File

@ -3,7 +3,7 @@ import $ from 'jquery';
//import 'bootstrap-select/dist/js/bootstrap-select';
//$.fn.selectpicker.Constructor.BootstrapVersion = '4';
import select2 from 'select2/dist/js/select2.js';
import Inputmask from 'inputmask';
//import Inputmask from 'inputmask';
//import select2 from 'jquery.inputmask/dist/jquery.inputmask.bundle';
@ -11,7 +11,7 @@ import Events from '../_events';
import SpinnerUI from './_ui.spinner';
import FormFieldUI from './_ui.form.fields';
const FormBasics = (($) => {
const FormBasics = ($ => {
// Constants
const NAME = 'jsFormBasics';
const DATA_KEY = NAME;
@ -59,7 +59,7 @@ const FormBasics = (($) => {
}
});
$radioOptions.on('change', (e) => {
$radioOptions.on('change', e => {
const $el = $(e.currentTarget);
const $parent = $el.parents('.radio');
@ -76,7 +76,7 @@ const FormBasics = (($) => {
}
});
$el.on('submit', (e) => {
$el.on('submit', e => {
SpinnerUI.show();
});

8
src/scss/_components/_ui.main.scss
View File

@ -112,12 +112,12 @@ textarea,
}
.btn-toolbar {
margin-top: $grid-gutter-height / 2;
margin-top: $field-gutter-height;
}
.field {
position: relative;
margin: ($grid-gutter-height / 2) 0;
margin: $field-gutter-height 0;
&.composite {
margin-top: 0;
@ -173,8 +173,8 @@ textarea,
// element col paddings
.col-block {
padding-top: $grid-gutter-height / 4;
padding-bottom: $grid-gutter-height / 4;
padding-top: $col-block-gutter-height;
padding-bottom: $col-block-gutter-height;
}
// rewrite btn opacity on hover

3
src/scss/_variables.scss
View File

@ -36,6 +36,9 @@ $grid-gutter-height: 2rem !default;
$grid-gutter-xs-width: $grid-gutter-width / 2 !default;
$grid-gutter-element-height: $grid-gutter-height * 2 !default;
$field-gutter-height: $grid-gutter-height / 2 !default;
$col-block-gutter-height: $grid-gutter-height / 4 !default;
$footer-size: 18.5rem !default;
$footer-bar-size: 2.5rem !default;