Skip to content

Simple one page website to practise HTML and CSS skills | free the Awwwesomes psd template used

Notifications You must be signed in to change notification settings

pinaska/we_create_rwd_one_page_site

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

30 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

we_create website

This project one-page html-css only website is to practise my HTML and CSS skills.

  • The project has been started on Canada Learning Code workshop, 17.02.2018 and developed since then.
  • psd file by The Awwwesomes

technologies used:

  • SASS partials
  • Gulp task runner
    • npm install, gulp-sourcemaps, gulp-eslint,gulp-uglify, gulp-cssnano, gulp-prettyerror, gulp-rename, browser-sync(check, why it is not working at my comp)
  • CSS grid and flexbox
  • page smooth scroll with jQuery cdn (check, if CSS property scroll-behavior has better browser support and try to implement it: link to mdn doc)

personal learnings:

I wanted to make this one page site responsive with mobile-first approach. All the CSS styling is written for three screen widths: mobile, min-width:620px and min-width:1080px (sass mixins used). Please let me know, if you find any responsivness issue.

📌 to-do: validate, check accessibility and performance;

📌 to-fix: ~~waves svgs; should they be html img tags or background properties - what's better for posisioning~~~ as sugested by @aroerick I used transform:translateY and it worked ❓

we_create_mockup


check my other projects

Kate

#kasiaikod

About

Simple one page website to practise HTML and CSS skills | free the Awwwesomes psd template used

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published