Skip to content

IbrahimAlsabr/Kasper-Template

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Kasper-Template

This is a project for creating a [Kasper Template] using HTML and CSS. I created it to improve my coding skills by building realistic projects.

Table of contents

Overview

The objective

Users should be able to:

  • View the optimal layout depending on their device's screen size (Responsive Design)
  • See hover states for interactive elements

Screenshot

Landing Screen

Landing Screen

Portfolio Screen

Landing Screen

About Screen

Landing Screen

Skills Screen

Landing Screen

Pricing Screen

Landing Screen

Contact Screen

Landing Screen

Links

  • Source Code URL: here
  • Live Site URL: here

My process

Built with

HTML

CSS3

CSS properties used

  • Media Queries And Responsive Design
  • Flexbox
  • CSS Grid
  • Position
  • Mobile-first workflow

Layout

The designs were created to the following widths:

  • Small screen: 768px
  • Medium screen: 992px
  • Large screen: 1200px

Useful resources

Author

GitHub

LinkedIn

Twitter

Acknowledgments