CSS Meme Slider

[semion-sergeenko]

1. Task: https://github.com/rolling-scopes-school/tasks/tree/master/tasks/css-meme-slider

2. Screenshot:

   • PC version:
     
   • mobile version:
     

3. Deploy: https://semion-sergeenko.github.io/cssMemeSlider/cssMemeSlider/index.html

4. Done 15.09.2024 / deadline 16.09.2024

5. Score: 150 / 150

   • Выполнено всё из секции Требования к репозиторию и как сабмитить задание +30
   • Слайдер позиционируется с равными отступами слева и справа +10
   • Соблюдено расположение картинок, подписей к ним и контролов +10
   • Имеется плавная анимация смены картинок +20
   • Имеется плавная анимация смены подписей к картинкам +10
   • Подписи к картинкам должны быть строковыми значениями (текстом), т.е. текст не должен быть частью картинки +15
   • Каждый контрол имеет большую область нажатия, чем размер самого контрола +5
   • Контролы имеют интерактивность (момент наведения, момент нажатия, активный контрол, изменение курсора) +10
   • Имеется мобильная версия слайдера, и соблюдено расположение картинок, подписей к ним и контролов +20
   • Используются только относительные единицы измерения для основных блоков (картинки, контролы, подписи). Относительные единицы: rem, em, %, vh, vw, fr and etc... - присутствует "резиновость" слайдера +10
   • Все блоки/составные части слайдера (контролы, картинки, подписи к слайдеру) находятся в базовом потоке дом-элементов, не позиционируются (position) с помощью top, left, right, bottom, не используется float. Можно: flex, grid, margin-left and etc... - все, что не упомянуто в запретах выше. Свойство position может быть только static. +5
   • Не используются псевдоэлементы (не путать с псевдоклассами, псевдоклассы можно). +5

6. Details:

   • PC version resolution: 1920×1080
   • mobile version resolution: 320x568