KO
|
EN
gitlite — search
Search
#python
#ai
#llm
#javascript
#css3
#html5
#agent
#automation
#docker
#vanilla-js
#github-config
#machine-learning
bttn.css
★ 2,050
Open GitHub ↗
Awesome buttons for awesome projects!
Download README (.md)
Explore Similar Repositories
typhoon
:
Minimal and free Kubernetes distribution with Terraform
DeepStream-Yolo
:
NVIDIA DeepStream SDK 8.0 / 7.1 / 7.0 / 6.4 / 6.3 / 6.2 / 6.1.1 / 6.1 / 6.0.1 / 6.0 / 5.1 implementation for YOLO models
pixivpy
:
Pixiv API for Python
goawk
:
A POSIX-compliant AWK interpreter written in Go, with CSV support
hoverzoom
:
Google Chrome extension for zooming images on mouse hover
// repository documentation
Was this content helpful?
★ 0
(0 ratings)
Select Rating:
★
★
★
★
★
Submit Feedback
Recent Feedback
×
Download README
Do you want to download the
README.md
file for
bttn.css
?
Download (.md)
# bttn.css Awesome buttons for awesome projects! [Demo](https://bttn.surge.sh/) | [Medium Article](https://medium.com/@ganapativs/bttn-css-awesome-buttons-for-awesome-projects-baa2486bcb3d) | [ProductHunt](https://www.producthunt.com/posts/bttn-css) | [cdnjs](https://cdnjs.com/libraries/bttn.css) <img src="http://imgur.com/mqPa6Ac.png" width="600" /> #### Button style classes - `bttn-simple` - `bttn-bordered` - `bttn-minimal` - `bttn-stretch` - `bttn-jelly` - `bttn-gradient` - `bttn-fill` - `bttn-material-circle` - `bttn-material-flat` - `bttn-pill` - `bttn-float` - `bttn-unite` - `bttn-slant` *(Beta)* #### Button sizes - `bttn-xs` - `bttn-sm` - `bttn-md` - `bttn-lg` #### Button Colors - `bttn-default` - `bttn-primary` - `bttn-warning` - `bttn-success` - `bttn-danger` - `bttn-royal` #### Button helper classes - `bttn-block` - `bttn-no-outline` (Don't show outline when navigating with keyboard/interact using mouse or touch) ### Install #### Bower <pre> bower install bttn.css </pre> #### CDN - [cdnjs](https://cdnjs.com/libraries/bttn.css) <pre> https://cdnjs.com/libraries/bttn.css </pre> #### CSS File <pre> <link type="text/css" src="./dist/bttn.min.css"/> </pre> ### Usage Include `bttn.min.css` in head of your html file and start using bttn CSS classes in your button. <pre> <button class="bttn-material-circle bttn-md"> <i class="icon-menu"></i> </button> </pre> ### Environment Setup > :information_source: Build process uses [yarn](https://yarnpkg.com), you can also use npm instead. #### Install dependencies - stylus, autoprefixer-stylus and clean-css <pre> yarn </pre> #### Compile stylus to css <pre> yarn start </pre> #### Dev environment <pre> yarn run dev </pre> #### Minify css for production and build example folder javascript files(Webpack) <pre> yarn run build </pre> #### View bttn.css demo in browser <pre> open build/index.html in browser </pre> ## TODO - Add loading & done state animations - Test on older version of the browsers ### Mentions - [Hongkiat](http://www.hongkiat.com/blog/css-buttons-bttncss/) - [Tutorialspoint](https://www.tutorialspoint.com/css_buttons/css_buttons_bttnscss.htm) - [Betapage](https://betapage.co/product/bttn-css) - [Tutorialzine](http://tutorialzine.com/2017/01/15-interesting-javascript-and-css-libraries-for-january-2017/) - [Webmaster.kitchen](https://webmaster.kitchen/bttn-css-4kbdan-kucuk-mukemel-css-butonlari/) - [Dr.Web](https://www.drweb.de/magazin/css-huebsche-buttons-mit-bttn-css/) - [SiloMag](http://www.silocreativo.com/silomag-04/)
