Skip to content

Latest commit

 

History

History
80 lines (52 loc) · 1.99 KB

README.md

File metadata and controls

80 lines (52 loc) · 1.99 KB

Testimonials Slider

In promotion and advertising, a testimonial or show consists of a person's written or spoken statement extolling the virtue of a product. This project made with HTML, CSS/Sass and JavaScript.

Table of contents

Overview

The challenge

Users should be able to:

  • View the optimal layout for the component depending on their device's screen size
  • Navigate the slider using either their mouse/trackpad or keyboard

Screenshot

testimonials-slider

Links

My process

Built with

  • Semantic HTML5 markup
  • CSS, Sass
  • Flexbox
  • Desktop-first workflow
  • JavaScript
  • If statement
  • Increment and Decrement
  • JavaScript Callbacks
  • KeyboardEvent key Property

Useful resources

Front-end Style Guide

Layout

The designs were created to the following widths:

  • Mobile: 375px
  • Desktop: 1440px

Colors

Primary

  • Dark Blue: hsl(240, 38%, 20%)
  • Grayish Blue: hsl(240, 18%, 77%)

Typography

Body Copy

  • Font size: 32px

Font

  • Family: Inter
  • Weights: 300, 500, 700