Главные темы. Последние записи с тегом «cyz». Страница 50

Сегодня 17 ноября, воскресенье

Какой рейтинг вас больше интересует?

получить код

Главная /

Главные темы

Тэг «cyz»

Подборка полезных утилит SCSS

2016-02-04 14:07:58

Для успешной реализации проекта разработчикам фронтенда не обойтись без проверенного арсенала ...
+ развернуть текст сохранённая копия

Для успешной реализации проекта разработчикам фронтенда не обойтись без проверенного арсенала расширения SCSS. Ниже представлены утилиты, которые могут пригодиться в работе.

Triangle

Примесь triangle (которую дизайнеры Sagi предпочитают называть «chupchick»), добавляет к всплывающей подсказке треугольник. И tooltips становится похожим на диалоговое окно. Но triangle также может использоваться в качестве автономного элемента.

/* 
* @include triangle within a pseudo element and add positioning properties (ie. top, left)
* $direction: up, down, left, right
*/
@mixin triangle($direction, $size: 6px, $color: #222){
  content: '';
  display: block;
  position: absolute;
  height: 0; width: 0;
  @if ($direction == 'up'){
    border-bottom: $size solid $color;
    border-left: 1/2*$size solid transparent;
    border-right: 1/2*$size solid transparent;
  }
  @else if ($direction == 'down'){
    border-top: $size solid $color;
    border-left: 1/2*$size solid transparent;
    border-right: 1/2*$size solid transparent;
  }
  @else if ($direction == 'left'){
    border-top: 1/2*$size solid transparent;
    border-bottom: 1/2*$size solid transparent;
    border-right: $size solid $color;
  }
  @else if ($direction == 'right'){
    border-top: 1/2*$size solid transparent;
    border-bottom: 1/2*$size solid transparent;
    border-left: $size solid $color;
  }
}

Читать дальше →

Тэги: css, ua-hosting.company, блог, веб, веб-дизайн, веб-разработка, дизайн, компании, примесь, разработка, утилиты, функции

[Из песочницы] Конец эры глобального CSS

2016-02-02 13:15:56

Все CSS-селекторы живут в глобальной области видимости.

Каждому, кто когда-либо имел ...
+ развернуть текст сохранённая копия

Тэги: css, javascript, webpack, бэм, веб-разработка, изоляция, модульность, перевод, ресурсов, сборки, системы

Записи с конференции Web Standards Days — Москва 2015

2016-02-02 12:09:41

+ развернуть текст сохранённая копия

Тэги: css, csso, days, edge, html, javascript, microsoft, shower, standards, svg, vorlon.js, wcag, web, блог, веб-приложения, веб-разработка, веб-стандарты, доступность, компании, статистика, фронтэнд

Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю №196 (25 — 31 января 2016)

2016-01-31 23:20:04

Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT- ...
+ развернуть текст сохранённая копия

Тэги: angular, css, es6, group, html5, javascript, react, svg, zfort, анимация, блог, браузеры, веб-дизайн, веб-разработка, дайджест, компании, новости, ссылки

Лучшие бесплатные коллекции векторных иконок

2016-01-31 06:05:03

Привет, Хабр! Сегодня я хочу представить вам огромную коллекцию из 51 набора бесплатных ...
+ развернуть текст сохранённая копия

Привет, Хабр! Сегодня я хочу представить вам огромную коллекцию из 51 набора бесплатных векторных иконок. Да, есть потрясающие ресурсы Flaticon или Iconfinder, но бывают случаи, когда необходима именно группа иконок в едином стилистическом оформлении. Определиться с выбором, вам поможет эта подборка. Я старался собрать не как можно больше, а действительно самое лучшее.

Среди веб-разработчиков существует много споров о том, что лучше: иконочный шрифт или SVG спратй? Четкого ответа на этот вопрос нет. Каждый выбирает свое. Данные наборы иконок вас неограничиывают в выборе, поскольку представлены в различных форматах: @font-face, SVG, EPS, AI, PSD, Sketch.

В целом данная подборка содержит более 10 000 иконок, охватывающих множество категорий: интерфейсы, технологии, наука, спорт, маркетинг, среда, транспорт и тд. Полые, заполненные, цветные, во Flat, Material, Elegant, Cartoon, Hand drawing стилях.