Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/andrew--r/stylus-utilities
Набор полезных Stylus-миксинов.
https://github.com/andrew--r/stylus-utilities
Last synced: about 6 hours ago
JSON representation
Набор полезных Stylus-миксинов.
- Host: GitHub
- URL: https://github.com/andrew--r/stylus-utilities
- Owner: andrew--r
- Created: 2015-04-05T07:52:18.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2015-04-05T07:52:57.000Z (over 9 years ago)
- Last Synced: 2024-05-14T00:44:50.777Z (6 months ago)
- Language: CSS
- Size: 85 KB
- Stars: 12
- Watchers: 5
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Stylus Utilities
Набор готовых к использованию миксинов для ускорения и упрощения процесса вёрстки.
## Документация
### container(width)
Задаёт блоку определённую ширину и центрирует его по горизонтали.
```stylus
.container
container(960px)
```
### center-both(width)
Задаёт блоку указанную ширину и центрирует его по вертикали и горизонтали.
```stylus
.centered
center-both(300px)
```
### clearfix()
Сбрасывает обтекание у элемента, в который вложены плавающие блоки.
```stylus
.parent
clearfix()
.child
float left
```
### justify()
Применяется для выравнивания нескольких потомков по ширине родителя.
#### justify-child(font-size = 16px)
Применяется к потомкам блока, к которому применён `justify`. Если значение размера шрифта не задано, то размер шрифта по умолчанию равен 16 пикселям.
```stylus
.justified
justify()
li
.justify-child(14px)
```
### placeholder-color(color)
Задаёт цвет плейсхолдера.
```stylus
input[type="text"]
placeholder-color(#ccc)
```
### opacity(level)
Задаёт степень непрозрачности для нормальных браузеров и для IE8.
```stylus
.block
opacity(0.5)
```
### rems(value)
Задаёт размер шрифта в `rem` с фоллбэком в `px`.
```stylus
p
rems(18px)
```
### bgi(path)
Задаёт блоку фоновую картинку при условии, что размер блока должен совпадать с размерами картинки.
**Важно**: следует в начале файла с миксинами прописать пути к директории с картинками: абсолютный путь в переменную `path-to-images`, путь относительно данного файла с миксинами в переменную `path-to-images-from-this`.
```stylus
.btn
bgi("btn.png")
```
### clearlist()
Сброс стандартных стилей у списков. Полезно при вёрстке различных меню.
### text-overflow()
Обрезает лишний текст, оставляя многоточие.
### hidetext()
Делает текст в блоке невидимым.
### noselection()
Запрещает выделение текста.
### gpu()
Хак для включения аппаратного ускорения при анимациях.