uniform-ui 3.0.0.beta2 → 3.0.0.beta4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/lib/assets/javascripts/uniform.js +21 -8
- data/lib/assets/javascripts/uniform/checkbox.js +3 -3
- data/lib/assets/javascripts/uniform/component.js +2 -2
- data/lib/assets/javascripts/uniform/floating-label-input.js +4 -4
- data/lib/assets/javascripts/uniform/modal.js +13 -17
- data/lib/assets/javascripts/uniform/popover.js +6 -9
- data/lib/assets/javascripts/uniform/resizer.js +3 -3
- data/lib/assets/javascripts/uniform/select.js +9 -9
- data/lib/assets/stylesheets/uniform/defaults.scss +0 -3
- data/lib/assets/stylesheets/uniform/utilities.scss +2 -0
- data/lib/assets/stylesheets/uniform/utilities/borders.scss +12 -13
- data/lib/assets/stylesheets/uniform/utilities/spacing.scss +14 -14
- data/lib/assets/stylesheets/uniform/utilities/svg.scss +5 -0
- data/lib/assets/stylesheets/uniform/variables.scss +31 -22
- data/lib/uniform/version.rb +1 -1
- metadata +3 -2
    
        checksums.yaml
    CHANGED
    
    | @@ -1,7 +1,7 @@ | |
| 1 1 | 
             
            ---
         | 
| 2 2 | 
             
            SHA256:
         | 
| 3 | 
            -
              metadata.gz:  | 
| 4 | 
            -
              data.tar.gz:  | 
| 3 | 
            +
              metadata.gz: 2430fe0dd6aee3aa8a1463025c1375a2fb999f9945aa4303a6d997911d022132
         | 
| 4 | 
            +
              data.tar.gz: dcc784665e6b469959382171c77cd2bd2d781c18776ccac40827bfa7b7c6d69d
         | 
| 5 5 | 
             
            SHA512:
         | 
| 6 | 
            -
              metadata.gz:  | 
| 7 | 
            -
              data.tar.gz:  | 
| 6 | 
            +
              metadata.gz: f27411ee8b95de89de612e492ab083617f33e4ff170151772ef3bdfabbd126087f59419cc0a3baf868d584a581bff9c61dd2ca246a2c317dd1b2e3fdd748875d
         | 
| 7 | 
            +
              data.tar.gz: d61f77703021262528d3b915b8ca563950fbd3fcf24fdc29a787856c4bce0dec61a3b7fda826e0b91812ec2245895bb4402255cb4b56b0be51dba7245e1f1aff
         | 
| @@ -1,8 +1,21 @@ | |
| 1 | 
            -
             | 
| 2 | 
            -
             | 
| 3 | 
            -
             | 
| 4 | 
            -
             | 
| 5 | 
            -
             | 
| 6 | 
            -
             | 
| 7 | 
            -
             | 
| 8 | 
            -
             | 
| 1 | 
            +
            import Dropdown from './uniform/dropdown';
         | 
| 2 | 
            +
            import Modal from './uniform/modal';
         | 
| 3 | 
            +
            import Select from './uniform/select';
         | 
| 4 | 
            +
            import FloatingLabelInput from './uniform/floating-label-input';
         | 
| 5 | 
            +
            import Resizer from './uniform/resizer';
         | 
| 6 | 
            +
            import Tooltip from './uniform/tooltip';
         | 
| 7 | 
            +
            import Popover from './uniform/popover';
         | 
| 8 | 
            +
            import {Checkbox, Radio, Toggle} from './uniform/checkbox';
         | 
| 9 | 
            +
             | 
| 10 | 
            +
            export {
         | 
| 11 | 
            +
              Dropdown,
         | 
| 12 | 
            +
              Modal,
         | 
| 13 | 
            +
              Select,
         | 
| 14 | 
            +
              FloatingLabelInput,
         | 
| 15 | 
            +
              Resizer,
         | 
| 16 | 
            +
              Tooltip,
         | 
| 17 | 
            +
              Popover,
         | 
| 18 | 
            +
              Checkbox,
         | 
| 19 | 
            +
              Radio,
         | 
| 20 | 
            +
              Toggle
         | 
| 21 | 
            +
            }
         | 
| @@ -1,5 +1,5 @@ | |
| 1 1 | 
             
            import Component from './component';
         | 
| 2 | 
            -
            import { | 
| 2 | 
            +
            import { trigger, createElement} from 'dolla';
         | 
| 3 3 |  | 
| 4 4 | 
             
            export class Checkbox extends Component {
         | 
| 5 5 | 
             
                static CSSClass = "uniformCheckbox";
         | 
| @@ -15,7 +15,7 @@ export class Checkbox extends Component { | |
| 15 15 | 
             
                    }
         | 
| 16 16 |  | 
| 17 17 | 
             
                    if(!options.tabindex) this.el.tabIndex = 0;
         | 
| 18 | 
            -
                     | 
| 18 | 
            +
                    this.el.classList.add(this.constructor.CSSClass);
         | 
| 19 19 |  | 
| 20 20 | 
             
                    this.listenTo(this.el, 'click', this.click);
         | 
| 21 21 | 
             
                    this.listenTo(this.input, 'change', this.change);
         | 
| @@ -38,7 +38,7 @@ export class Checkbox extends Component { | |
| 38 38 | 
             
                }
         | 
| 39 39 |  | 
| 40 40 | 
             
                change () {
         | 
| 41 | 
            -
                     | 
| 41 | 
            +
                    this.el.classList.toggle('checked', this.input.checked);
         | 
| 42 42 | 
             
                }
         | 
| 43 43 |  | 
| 44 44 | 
             
                click (e) {
         | 
| @@ -1,4 +1,4 @@ | |
| 1 | 
            -
            import {hasClass, HTML_ATTRIBUTES, createElement | 
| 1 | 
            +
            import {hasClass, HTML_ATTRIBUTES, createElement} from 'dolla';
         | 
| 2 2 |  | 
| 3 3 | 
             
            function uniqueId(prefix){
         | 
| 4 4 | 
             
                window.idCounter || (window.idCounter = 0);
         | 
| @@ -74,7 +74,7 @@ export default class Component { | |
| 74 74 | 
             
                        node,
         | 
| 75 75 | 
             
                        event,
         | 
| 76 76 | 
             
                        function(e){
         | 
| 77 | 
            -
                            if(!scope || (e.target.matches(scope) ||  | 
| 77 | 
            +
                            if(!scope || (e.target.matches(scope) || e.target.closest(scope))) {
         | 
| 78 78 | 
             
                              return callback.bind(context)(...arguments);
         | 
| 79 79 | 
             
                            }
         | 
| 80 80 | 
             
                        }.bind(context)
         | 
| @@ -1,5 +1,5 @@ | |
| 1 1 | 
             
            import Component from './component';
         | 
| 2 | 
            -
            import { isVisible, isFocus,  | 
| 2 | 
            +
            import { isVisible, isFocus, css, createElement } from 'dolla';
         | 
| 3 3 |  | 
| 4 4 | 
             
            export default class FloatingLabel extends Component {
         | 
| 5 5 |  | 
| @@ -17,7 +17,7 @@ export default class FloatingLabel extends Component { | |
| 17 17 | 
             
                    });
         | 
| 18 18 | 
             
                    this.input.setAttribute('aria-label', options.label);
         | 
| 19 19 |  | 
| 20 | 
            -
                     | 
| 20 | 
            +
                    this.el.classList.add('uniformFloatingLabelInput');
         | 
| 21 21 |  | 
| 22 22 | 
             
                    this.listenTo(this.input, 'focus', this.focus);
         | 
| 23 23 | 
             
                    this.listenTo(this.input, 'blur', this.blur);
         | 
| @@ -52,12 +52,12 @@ export default class FloatingLabel extends Component { | |
| 52 52 | 
             
                }
         | 
| 53 53 |  | 
| 54 54 | 
             
                focus (e) {
         | 
| 55 | 
            -
                     | 
| 55 | 
            +
                    this.el.classList.add('present');
         | 
| 56 56 | 
             
                }
         | 
| 57 57 |  | 
| 58 58 | 
             
                blur (e) {
         | 
| 59 59 | 
             
                    if(this.input.value == ""){
         | 
| 60 | 
            -
                       | 
| 60 | 
            +
                      this.el.classList.remove('present');
         | 
| 61 61 | 
             
                    }
         | 
| 62 62 | 
             
                }
         | 
| 63 63 | 
             
            }
         | 
| @@ -1,5 +1,5 @@ | |
| 1 1 | 
             
            import Component from './component';
         | 
| 2 | 
            -
            import { | 
| 2 | 
            +
            import {css, trigger, append} from 'dolla';
         | 
| 3 3 |  | 
| 4 4 | 
             
            /*  UniformModal.initialize
         | 
| 5 5 | 
             
                Options
         | 
| @@ -16,7 +16,7 @@ export default class Modal extends Component { | |
| 16 16 | 
             
                    this.content = options.content;
         | 
| 17 17 | 
             
                    this.el.removeAttribute('content');
         | 
| 18 18 |  | 
| 19 | 
            -
                     | 
| 19 | 
            +
                    this.el.classList.add('uniformModal');
         | 
| 20 20 | 
             
                    this.listenTo(document, 'keyup', this.keyup);
         | 
| 21 21 | 
             
                    this.listenTo(this.el, 'click', this.checkCloseButton);
         | 
| 22 22 | 
             
                }
         | 
| @@ -28,14 +28,13 @@ export default class Modal extends Component { | |
| 28 28 |  | 
| 29 29 | 
             
                render () {
         | 
| 30 30 | 
             
                    var that = this;
         | 
| 31 | 
            -
                    var content = typeof this.content == 'function' ? this.content() : this.content;
         | 
| 32 31 |  | 
| 33 32 | 
             
                    this.highest_z_index = 0;
         | 
| 34 33 | 
             
                    this.overlay = document.createElement('div');
         | 
| 35 | 
            -
                     | 
| 34 | 
            +
                    this.overlay.classList.add('uniformModal-overlay');
         | 
| 36 35 |  | 
| 37 36 | 
             
                    this.blur = document.createElement('div');
         | 
| 38 | 
            -
                     | 
| 37 | 
            +
                    this.blur.classList.add('uniformModal-blur');
         | 
| 39 38 |  | 
| 40 39 | 
             
                    this.original_scroll = window.scrollY;
         | 
| 41 40 | 
             
                    this.blur.style.top = 0 - this.original_scroll + "px";
         | 
| @@ -58,40 +57,37 @@ export default class Modal extends Component { | |
| 58 57 | 
             
                      }
         | 
| 59 58 | 
             
                    }
         | 
| 60 59 |  | 
| 61 | 
            -
                     | 
| 60 | 
            +
                    document.body.classList.add('uniformModal-active');
         | 
| 62 61 | 
             
                    document.body.appendChild(this.blur);
         | 
| 63 62 | 
             
                    document.body.appendChild(this.el);
         | 
| 64 63 |  | 
| 65 64 | 
             
                    var container = document.createElement('div');
         | 
| 66 | 
            -
                     | 
| 67 | 
            -
                     | 
| 68 | 
            -
             | 
| 69 | 
            -
                    } else {
         | 
| 70 | 
            -
                        container.innerHTML = content;
         | 
| 71 | 
            -
                    }
         | 
| 65 | 
            +
                    container.classList.add('uniformModal-container');
         | 
| 66 | 
            +
                    
         | 
| 67 | 
            +
                    append(container, this.content);
         | 
| 72 68 |  | 
| 73 69 | 
             
                    var closeButton = document.createElement('div');
         | 
| 74 | 
            -
                     | 
| 70 | 
            +
                    closeButton.classList.add('uniformModal-close');
         | 
| 75 71 | 
             
                    this.el.appendChild(closeButton);
         | 
| 76 72 |  | 
| 77 73 | 
             
                    this.el.style.top = window.scrollY;
         | 
| 78 74 | 
             
                    this.listenTo(this.overlay, 'click', this.close);
         | 
| 79 75 | 
             
                    this.el.appendChild(container);
         | 
| 80 76 |  | 
| 81 | 
            -
                    if (this.options.klass)  | 
| 82 | 
            -
                    if (content.innerHTML) trigger(content, 'rendered');
         | 
| 77 | 
            +
                    if (this.options.klass) container.classList.add(this.options.klass);
         | 
| 78 | 
            +
                    if (this.content.innerHTML) trigger(this.content, 'rendered');
         | 
| 83 79 | 
             
                    this.trigger('rendered');
         | 
| 84 80 |  | 
| 85 81 | 
             
                    return this;
         | 
| 86 82 | 
             
                }
         | 
| 87 83 |  | 
| 88 84 | 
             
                checkCloseButton (e) {
         | 
| 89 | 
            -
                    if( | 
| 85 | 
            +
                    if(e.target.classList.contains('uniformModal-close'))
         | 
| 90 86 | 
             
                        this.close();
         | 
| 91 87 | 
             
                }
         | 
| 92 88 |  | 
| 93 89 | 
             
                close () {
         | 
| 94 | 
            -
                     | 
| 90 | 
            +
                    document.querySelectorAll('uniformModal-active').forEach(el => el.classList.remove('uniformModal-active'));
         | 
| 95 91 | 
             
                    var elements = this.blur.children;
         | 
| 96 92 | 
             
                    var elementCount = elements.length
         | 
| 97 93 | 
             
                    for(var i=0; i < elementCount; i++){
         | 
| @@ -1,5 +1,5 @@ | |
| 1 1 | 
             
            import Component from './component';
         | 
| 2 | 
            -
            import {  | 
| 2 | 
            +
            import { offset, outerWidth, outerHeight, append } from 'dolla';
         | 
| 3 3 |  | 
| 4 4 | 
             
            /*
         | 
| 5 5 | 
             
                Requirements
         | 
| @@ -38,7 +38,7 @@ export default class Popover extends Component { | |
| 38 38 | 
             
                    });
         | 
| 39 39 |  | 
| 40 40 | 
             
                    if(typeof this.options.container == "string"){
         | 
| 41 | 
            -
                      this.options.container =  | 
| 41 | 
            +
                      this.options.container = this.options.anchor.closest(this.options.container)
         | 
| 42 42 | 
             
                    }
         | 
| 43 43 | 
             
                    this.options.container = this.options.container || document.body
         | 
| 44 44 |  | 
| @@ -49,10 +49,7 @@ export default class Popover extends Component { | |
| 49 49 | 
             
                    this.el.style.position = 'absolute';
         | 
| 50 50 | 
             
                    this.el.style.zIndex = this.options.zIndex;
         | 
| 51 51 |  | 
| 52 | 
            -
                     | 
| 53 | 
            -
                        this.el.appendChild(this.options.content);
         | 
| 54 | 
            -
                    else
         | 
| 55 | 
            -
                        this.el.innerHTML = this.options.content;
         | 
| 52 | 
            +
                    append(this.el, this.options.content)
         | 
| 56 53 |  | 
| 57 54 | 
             
                    this.options.container.appendChild(this.el);
         | 
| 58 55 | 
             
                    this.resize();
         | 
| @@ -154,9 +151,9 @@ export default class Popover extends Component { | |
| 154 151 | 
             
                    this.el.style.top = null;
         | 
| 155 152 | 
             
                    this.el.style.bottom = null;
         | 
| 156 153 | 
             
                    this.el.style.transform = null;
         | 
| 157 | 
            -
                     | 
| 158 | 
            -
                     | 
| 159 | 
            -
                     | 
| 154 | 
            +
                    this.el.classList.remove('popover-left', 'popover-right', 'popover-center', 'popover-top', 'popover-bottom');
         | 
| 155 | 
            +
                    this.el.classList.add('popover-' + topAlign);
         | 
| 156 | 
            +
                    this.el.classList.add('popover-' + leftAlign);
         | 
| 160 157 | 
             
                    Object.keys(position).forEach(function(key){
         | 
| 161 158 | 
             
                        this.el.style[key] = position[key] + (key != "transform" ? "px" : "");
         | 
| 162 159 | 
             
                    }, this);
         | 
| @@ -1,5 +1,5 @@ | |
| 1 1 | 
             
            import Component from './component';
         | 
| 2 | 
            -
            import { trigger | 
| 2 | 
            +
            import { trigger } from 'dolla';
         | 
| 3 3 |  | 
| 4 4 | 
             
            export default class Resizer extends Component {
         | 
| 5 5 |  | 
| @@ -28,9 +28,9 @@ export default class Resizer extends Component { | |
| 28 28 | 
             
                    }
         | 
| 29 29 |  | 
| 30 30 | 
             
                    if(attribute == "min-width") {
         | 
| 31 | 
            -
                       | 
| 31 | 
            +
                      this.el.classList.toggle(css_class, width > value)
         | 
| 32 32 | 
             
                    } else if (attribute == "max-width") {
         | 
| 33 | 
            -
                       | 
| 33 | 
            +
                      this.el.classList.toggle(css_class, width < value)
         | 
| 34 34 | 
             
                    } else {
         | 
| 35 35 | 
             
                      throw "unsupported media feature"
         | 
| 36 36 | 
             
                    }
         | 
| @@ -2,7 +2,7 @@ import Component from './component'; | |
| 2 2 | 
             
            import Popover from './popover';
         | 
| 3 3 | 
             
            import Modal from './modal';
         | 
| 4 4 | 
             
            import { check as checkIcon, arrow_down as arrowIcon, x as xIcon } from './icons';
         | 
| 5 | 
            -
            import { createElement, HTML_ATTRIBUTES, filter, css,  | 
| 5 | 
            +
            import { createElement, HTML_ATTRIBUTES, filter, css, isEmpty, trigger } from 'dolla';
         | 
| 6 6 |  | 
| 7 7 | 
             
            /*
         | 
| 8 8 | 
             
              options: array of html options, each item can be string | array | object
         | 
| @@ -98,9 +98,9 @@ export default class Select extends Component { | |
| 98 98 | 
             
              selectOption (e) {
         | 
| 99 99 | 
             
                const makeActive = !e.target.option.selected;
         | 
| 100 100 | 
             
                if (!this.options.multiple && makeActive) {
         | 
| 101 | 
            -
                   | 
| 101 | 
            +
                  e.target.offsetParent.querySelectorAll('.active').forEach(el => el.classList.remove('active'));
         | 
| 102 102 | 
             
                }
         | 
| 103 | 
            -
                 | 
| 103 | 
            +
                e.target.classList.toggle('active', makeActive);
         | 
| 104 104 | 
             
                e.target.option.selected = makeActive;
         | 
| 105 105 |  | 
| 106 106 | 
             
                if (!this.options.multiple) {
         | 
| @@ -114,7 +114,7 @@ export default class Select extends Component { | |
| 114 114 | 
             
                e.preventDefault();
         | 
| 115 115 | 
             
                e.stopPropagation();
         | 
| 116 116 | 
             
                var option = filter(this.select.querySelectorAll("option"), function(el){
         | 
| 117 | 
            -
                  return el.innerText.trim() ==  | 
| 117 | 
            +
                  return el.innerText.trim() == e.target.closest('.uniformSelect-selection').innerText.trim();
         | 
| 118 118 | 
             
                })[0];
         | 
| 119 119 | 
             
                if(!option) return;
         | 
| 120 120 | 
             
                option.selected = false;
         | 
| @@ -124,11 +124,11 @@ export default class Select extends Component { | |
| 124 124 | 
             
              }
         | 
| 125 125 |  | 
| 126 126 | 
             
              toggleOptions (e) {
         | 
| 127 | 
            -
                if(e && (e.target.matches('.uniformSelect-remove') ||  | 
| 127 | 
            +
                if(e && (e.target.matches('.uniformSelect-remove') || e.target.closest('.uniformSelect-remove'))){
         | 
| 128 128 | 
             
                  return;
         | 
| 129 129 | 
             
                }
         | 
| 130 | 
            -
                 | 
| 131 | 
            -
                if( | 
| 130 | 
            +
                this.el.classList.toggle('active')
         | 
| 131 | 
            +
                if(this.el.contains('active')){
         | 
| 132 132 | 
             
                  this.renderOptions()
         | 
| 133 133 | 
             
                } else {
         | 
| 134 134 | 
             
                  this.removeOptions()
         | 
| @@ -152,7 +152,7 @@ export default class Select extends Component { | |
| 152 152 | 
             
                  button.textContent = option.textContent;
         | 
| 153 153 | 
             
                  button.value = option.value;
         | 
| 154 154 | 
             
                  if (button.textContent == "") button.innerHTML = "<span class='text-italic text-muted'>None</span>";
         | 
| 155 | 
            -
                   | 
| 155 | 
            +
                  button.classList.toggle('active', option.selected);
         | 
| 156 156 |  | 
| 157 157 | 
             
                  console.log(this.options.limit, index);
         | 
| 158 158 | 
             
                  if (this.options.limit && (index + 1) > this.options.limit) {
         | 
| @@ -211,7 +211,7 @@ export default class Select extends Component { | |
| 211 211 | 
             
                e.preventDefault();
         | 
| 212 212 | 
             
                e.stopPropagation();
         | 
| 213 213 | 
             
                if(!this.popover) return;
         | 
| 214 | 
            -
                 | 
| 214 | 
            +
                this.popover.el.querySelectorAll('button.hide').forEach(el => el.classList.remove('hide'));
         | 
| 215 215 | 
             
                var button = this.popover.el.querySelector('.uniformSelect-show-all');
         | 
| 216 216 | 
             
                button.parentNode.removeChild(button);
         | 
| 217 217 | 
             
              }
         | 
| @@ -31,22 +31,21 @@ | |
| 31 31 | 
             
            //             Border Radius
         | 
| 32 32 | 
             
            //----------------------------------------------------------------
         | 
| 33 33 | 
             
            @include size-rule('.rounded') using ($size){ border-radius: $size;}
         | 
| 34 | 
            -
            @include  | 
| 35 | 
            -
             | 
| 36 | 
            -
                border-top- | 
| 37 | 
            -
                border-top-left-radius: 0.25em;
         | 
| 34 | 
            +
            @include size-rule('.rounded-top') using ($size){
         | 
| 35 | 
            +
                border-top-right-radius: $size;
         | 
| 36 | 
            +
                border-top-left-radius: $size;
         | 
| 38 37 | 
             
            }
         | 
| 39 | 
            -
            @include  | 
| 40 | 
            -
                border-bottom-right-radius:  | 
| 41 | 
            -
                border-bottom-left-radius:  | 
| 38 | 
            +
            @include size-rule('.rounded-bottom') using ($size){
         | 
| 39 | 
            +
                border-bottom-right-radius: $size;
         | 
| 40 | 
            +
                border-bottom-left-radius: $size;
         | 
| 42 41 | 
             
            }
         | 
| 43 | 
            -
            @include  | 
| 44 | 
            -
                border-top-left-radius:  | 
| 45 | 
            -
                border-bottom-left-radius:  | 
| 42 | 
            +
            @include size-rule('.rounded-left') using ($size){
         | 
| 43 | 
            +
                border-top-left-radius: $size;
         | 
| 44 | 
            +
                border-bottom-left-radius: $size;
         | 
| 46 45 | 
             
            }
         | 
| 47 | 
            -
            @include  | 
| 48 | 
            -
                border-top-right-radius:  | 
| 49 | 
            -
                border-bottom-right-radius:  | 
| 46 | 
            +
            @include size-rule('.rounded-right') using ($size){
         | 
| 47 | 
            +
                border-top-right-radius: $size;
         | 
| 48 | 
            +
                border-bottom-right-radius: $size;
         | 
| 50 49 | 
             
            }
         | 
| 51 50 |  | 
| 52 51 | 
             
            @include responsive-rule('.square') { border-radius: 0;}
         | 
| @@ -1,5 +1,19 @@ | |
| 1 1 | 
             
            @import 'uniform/mixins';
         | 
| 2 2 |  | 
| 3 | 
            +
            //----------------------------------------------------------------
         | 
| 4 | 
            +
            //             Spacing
         | 
| 5 | 
            +
            //----------------------------------------------------------------
         | 
| 6 | 
            +
            @include size-rule('.space-h') using ($size) {
         | 
| 7 | 
            +
                &  > * + * {
         | 
| 8 | 
            +
                    margin-left: $size;
         | 
| 9 | 
            +
                }
         | 
| 10 | 
            +
            }
         | 
| 11 | 
            +
            @include size-rule('.space-v') using ($size) {
         | 
| 12 | 
            +
                &  > * + * {
         | 
| 13 | 
            +
                    margin-top: $size
         | 
| 14 | 
            +
                }
         | 
| 15 | 
            +
            }
         | 
| 16 | 
            +
             | 
| 3 17 | 
             
            //----------------------------------------------------------------
         | 
| 4 18 | 
             
            //             Margin
         | 
| 5 19 | 
             
            //----------------------------------------------------------------
         | 
| @@ -36,20 +50,6 @@ | |
| 36 50 | 
             
            }
         | 
| 37 51 |  | 
| 38 52 |  | 
| 39 | 
            -
            //----------------------------------------------------------------
         | 
| 40 | 
            -
            //             Spacing
         | 
| 41 | 
            -
            //----------------------------------------------------------------
         | 
| 42 | 
            -
            @include size-rule('.space-h') using ($size) {
         | 
| 43 | 
            -
                &  > * + * {
         | 
| 44 | 
            -
                    margin-left: $size;
         | 
| 45 | 
            -
                }
         | 
| 46 | 
            -
            }
         | 
| 47 | 
            -
            @include size-rule('.space-v') using ($size) {
         | 
| 48 | 
            -
                &  > * + * {
         | 
| 49 | 
            -
                    margin-top: $size
         | 
| 50 | 
            -
                }
         | 
| 51 | 
            -
            }
         | 
| 52 | 
            -
             | 
| 53 53 |  | 
| 54 54 | 
             
            //----------------------------------------------------------------
         | 
| 55 55 | 
             
            //             Pad
         | 
| @@ -74,12 +74,12 @@ $sizes: map-merge(( | |
| 74 74 | 
             
                '4px': 4px
         | 
| 75 75 | 
             
              ),
         | 
| 76 76 | 
             
              rounded: (
         | 
| 77 | 
            -
                '':   | 
| 77 | 
            +
                '':  0.25rem,
         | 
| 78 78 | 
             
                'none': 0,
         | 
| 79 | 
            -
                "xs":        0. | 
| 80 | 
            -
                "sm":        0. | 
| 81 | 
            -
                "lg":         | 
| 82 | 
            -
                "xl":         | 
| 79 | 
            +
                "xs":        0.1rem,
         | 
| 80 | 
            +
                "sm":        0.2rem,
         | 
| 81 | 
            +
                "lg":        0.5rem,
         | 
| 82 | 
            +
                "xl":        1rem,
         | 
| 83 83 | 
             
              ),
         | 
| 84 84 | 
             
              margin: (
         | 
| 85 85 | 
             
                '':  1rem,
         | 
| @@ -110,25 +110,34 @@ $sizes: map-merge(( | |
| 110 110 | 
             
                "xl":        1.4rem,
         | 
| 111 111 | 
             
              ),
         | 
| 112 112 | 
             
              pad: (
         | 
| 113 | 
            -
                '': | 
| 114 | 
            -
                'none': 0,
         | 
| 115 | 
            -
                "1\\/4x": | 
| 116 | 
            -
                "1\\/2x": | 
| 117 | 
            -
                "3\\/4x": | 
| 118 | 
            -
                "xs": | 
| 119 | 
            -
                "sm": | 
| 120 | 
            -
                "lg": | 
| 121 | 
            -
                "xl": | 
| 122 | 
            -
                "2x": | 
| 113 | 
            +
                ''       : 1rem,
         | 
| 114 | 
            +
                'none'   : 0,
         | 
| 115 | 
            +
                "1\\/4x" : 0.25rem,
         | 
| 116 | 
            +
                "1\\/2x" : 0.5rem,
         | 
| 117 | 
            +
                "3\\/4x" : 0.75rem,
         | 
| 118 | 
            +
                "xs"     : 0.8rem,
         | 
| 119 | 
            +
                "sm"     : 0.9rem,
         | 
| 120 | 
            +
                "lg"     : 1.2rem,
         | 
| 121 | 
            +
                "xl"     : 1.4rem,
         | 
| 122 | 
            +
                "2x"     : 2rem,
         | 
| 123 | 
            +
             | 
| 123 124 | 
             
              ),
         | 
| 124 125 | 
             
              text: (
         | 
| 125 126 | 
             
                '':  1rem,
         | 
| 126 | 
            -
                "xs": | 
| 127 | 
            -
                "sm": | 
| 128 | 
            -
                "lg": | 
| 129 | 
            -
                "xl": | 
| 130 | 
            -
                "2x": | 
| 131 | 
            -
                "4x": | 
| 132 | 
            -
                "8x": | 
| 127 | 
            +
                "xs" : 0.8rem,
         | 
| 128 | 
            +
                "sm" : 0.9rem,
         | 
| 129 | 
            +
                "lg" : 1.2rem,
         | 
| 130 | 
            +
                "xl" : 1.4rem,
         | 
| 131 | 
            +
                "2x" : 2rem,
         | 
| 132 | 
            +
                "4x" : 4rem,
         | 
| 133 | 
            +
                "8x" : 8rem
         | 
| 134 | 
            +
             | 
| 135 | 
            +
              ),
         | 
| 136 | 
            +
              stroke: (
         | 
| 137 | 
            +
                  "sm" : 0.5px,
         | 
| 138 | 
            +
                  "md" : 1px,
         | 
| 139 | 
            +
                  "lg" : 1.5px,
         | 
| 140 | 
            +
                  "2x" : 2px,
         | 
| 141 | 
            +
                  "3x" : 3px
         | 
| 133 142 | 
             
              )
         | 
| 134 143 | 
             
            ), if(variable-exists('sizes'), $sizes, ()));
         | 
    
        data/lib/uniform/version.rb
    CHANGED
    
    
    
        metadata
    CHANGED
    
    | @@ -1,14 +1,14 @@ | |
| 1 1 | 
             
            --- !ruby/object:Gem::Specification
         | 
| 2 2 | 
             
            name: uniform-ui
         | 
| 3 3 | 
             
            version: !ruby/object:Gem::Version
         | 
| 4 | 
            -
              version: 3.0.0. | 
| 4 | 
            +
              version: 3.0.0.beta4
         | 
| 5 5 | 
             
            platform: ruby
         | 
| 6 6 | 
             
            authors:
         | 
| 7 7 | 
             
            - Ben Ehmke
         | 
| 8 8 | 
             
            autorequire:
         | 
| 9 9 | 
             
            bindir: bin
         | 
| 10 10 | 
             
            cert_chain: []
         | 
| 11 | 
            -
            date: 2021- | 
| 11 | 
            +
            date: 2021-04-01 00:00:00.000000000 Z
         | 
| 12 12 | 
             
            dependencies:
         | 
| 13 13 | 
             
            - !ruby/object:Gem::Dependency
         | 
| 14 14 | 
             
              name: sass
         | 
| @@ -86,6 +86,7 @@ files: | |
| 86 86 | 
             
            - lib/assets/stylesheets/uniform/utilities/position.scss
         | 
| 87 87 | 
             
            - lib/assets/stylesheets/uniform/utilities/sizing.scss
         | 
| 88 88 | 
             
            - lib/assets/stylesheets/uniform/utilities/spacing.scss
         | 
| 89 | 
            +
            - lib/assets/stylesheets/uniform/utilities/svg.scss
         | 
| 89 90 | 
             
            - lib/assets/stylesheets/uniform/utilities/text.scss
         | 
| 90 91 | 
             
            - lib/assets/stylesheets/uniform/variables.scss
         | 
| 91 92 | 
             
            - lib/uniform.rb
         |