CSS Эффекты #20 Интересный Hover-эффект карточки | HTML, CSS (SCSS)

#YauhenK #webDev #CSS #HTML
Всех приветствую в видеокасте «CSS Эффекты».
В данном видео-касте мы с вами будем рассматривать и создавать различные дизайнерские элементы пользовательского интерфейса (UI).
Примерами будут служить оригинальные анимации, необычные трансформации и переходы.
Любой элемент можно можно использовать для вдохновения, а так же дорабатывать или переделывать самостоятельно, т.к. весь код можно найти в GitHub репозитории.
Разметка будет писаться на HTML, а все эффекты создаваться только с помощью CSS (с использованием препроцессора SASS).
✒ Репозиторий видеокаста:
✔ github.com/Yau...
✒ Полный список готовых и планируемых курсов:
✔ Trello: trello.com/b/R...
✒ Автор курса:
✔ TH-cam: / yauhenkavalchuk
✔ Instagram: / yauhenkavalchuk
✔ Twitter: / yauhenkavalchuk
✔ VK: YauhenK...
✔ LinkedIn: / yauhenkavalchuk
✔ GitHub: github.com/Yau...
✔ VK (Группа): webdevcom
✒ Поддержать развитие канала: github.com/Yau...

[@АндрейСилецкий-м4ц]

шикардос

[@AlinaDotsenko-d6q]

Я в восторге!

[@prostoproger1393]

ПУШКА!!!

[@waden666]

Евгений, привет! Большое спасибо за CSS Inspiration, так вдохновился, что в проект позаимствовал социальные кнопки и вот думаю этот Hover для картинки тоже взять =).
Если у нас на десктопной версии сайта такое отображение hover'a. Для мобильной отдельно лучше вынести?
Не знаю еще, может на канале есть об этом информация, если у нас большой Scss файл получается, лучше его на подфайлы разбивать (через @import)?

[@YauhenKavalchuk]

Всё большое нужно дробить. Отдельно десктопные стили, отдельно мобильные стили.
Все стили можно даже разбить по секциям и подключать с помощью import

[@waden666]

@@YauhenKavalchuk ясно, большое спасибо =).

[@i.am.rossalex]

Codrops inspired? "Кради как художник" в действии :)))

[@YauhenKavalchuk]

Что-то вроде

[@floppa8440]

можно пожалуйста название редактора которым вы пользуйтесь

[@YauhenKavalchuk]

Это онлайн-песочница codepen

[@Константин-х2х4э]

Я в экстазе