UNPKG

@nitro-ui/utility-hide

Version:

Utility hide component for Nitro UI.

83 lines (51 loc) 1.85 kB
# Nitro UI: Utility Hide Utility Hide component for Nitro UI. ## Getting Started Get latest version by installing via [NPM @nitro-ui/utility-hide](https://www.npmjs.com/package/@nitro-ui/utility-hide): ```sh npm install @nitro-ui/utility-hide ``` ## Usage: Hide is the alternative of `display:none` property. Element will be rendered in 1x1 px. ```html <div class="u-hide">This element will hide</div> ``` ## Responsive Usage Hide support `mobile`,`tablet`, `portable`, `desktop` and `tablet-desktop` responsive class ```html <div class="u-hide@mobile">Hide element</div> <div class="u-hide@tablet">Hide element</div> <div class="u-hide@portable">Hide element</div> <div class="u-hide@desktop">Hide element</div> <div class="u-hide@tablet-desktop">Hide element</div> ``` ## Development To extends, develop or contribute to this component, you're required to fork our main [repository](https://github.com/icarasia/nitro-ui) and made a pull request. ### Development Requirements Development tools required for this component are: - [NodeJS](https://nodejs.org/en/) - [Grunt CLI](https://gruntjs.com) - [Ruby](https://www.ruby-lang.org/en/) (optional) - [SASS](https://sass-lang.com) (optional) Ruby and SASS are optional if you're fully using [node-sass](https://github.com/sass/node-sass) from npm for development. ### Development Setup Run: ```sh npm install ``` ### Compile Run: ```sh grunt ``` --- # TODO Nothing todo for now. --- # CHANGELOG All notable changes to this project will be documented in this file. **For now, let's keep TODO and CHANGELOG in README file. Keeping things simple.** The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). ## [0.0.0-beta] - 2019-07-18 ### Added - Initial setup