Skip to content

Xeraxlabs/responsive-testimonial-slider

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Project Overview

responsive-testimonial-slider

A Simple testimonial slider made with swiper JS, A complete guide about how to build this project from scratch is covered in this Youtube video

Preview Application

Youtube Tutorial Link

Steps to use Application

  • Download Entire code
  • locate and open the folder named "final"
  • Open the index.html file

Feel free to edit and use as you like, A credit to the original authors Israel Akinwumi and Xerax labs will be appreciated.

Help / Collaboration

Need help making this project work, want to collaborate on future project or hire me? you can reach out via

Technologies Used

  • HTML
  • CSS [ Styling ]
  • Bootstrap icons [ Icons ]
  • Swiper JS

Defaults

Swiper break points

breakpoints: {
        640: {
            slidesPerView: 2,
            spaceBetween: 20,
        },
        768: {
            slidesPerView: 3,
            spaceBetween: 30,
        },
        1024: {
            slidesPerView: 4,
            spaceBetween: 20,
        },
    }

Default variables used

/* Common page resets */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* Common page resets */

/*  variable declarations */
:root {
  --white-color: #fff;
  --support-color: #fb175f;
  --box-shadow: rgb(0 0 0 / 16%) 0px 2px 8px;
  --green-gradient: linear-gradient(
    to right,
    rgba(0, 128, 0, 0.7),
    rgba(0, 128, 0, 0.5)
  );
}

/*  variable declarations */

Related

Disclaimer

We do not claim to be the original authors of the images used in this project, all image credits belong to their respective owners. credits Unsplash

License

responsive-testimonial-slider is licensed under the MIT license.

Releases

No releases published

Packages

No packages published