Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 

README.md

Turnerabend Page

Repository: GitLab - turnerabend
Link: Turnerabend.ch
pipeline status

Install

Install project dependencies:

npm install
npm install gulp -g

Build the project with gulp:

npm run build

Or run the dev server:

npm run watch

Features

  • Ready for GitLab pages deployment
  • Static website contact form
  • Advanced gulp worfklow
  • Configurable theme
  • Responsive images

Screenrecord

Todo

[ ] Update favicon from svg logo
[ ] Gulp cache responsive images
[ ] Uglify js and css
[x] Add screenshot and publish on Github
[x] Fix Google Analytics or use Piwik
[x] Fix image enlargement bug in gulp build
[x] Enable ticket frog
[x] Update pictures, sponsoring content (resize sponsor images)
[x] Google Analytics
[x] Update static Image Gallery with flexbox
[x] Create sponsoring section
[x] Increase size of navigation
[x] Add nav mobile shadow
[x] Add favicon
[x] Update form mail
[x] Decrease image size with gulp
[x] Sponsoring slider
[x] Update layout
[x] Update new font
[x] Optimize images with gulp
[x] Import css without path
[x] Find solution to send mail from contact form
[x] Increase line-height
[x] Add logo
[x] Make everything black
[x] Change font color for default to #ababab except for links, small, strong tags
[x] Center navigation
[x] Remove spacing variables
[x] Make background black
[x] Make inverse button
[x] Capital letters for navigation
[x] Make a display of all fonts
[x] Format ul list

Media query classes

// extra small devices
@media (max-width: 543px) {

}
// small devices
@media (min-width: 544px) and (max-width: 767px) {

}
// medium devices
@media (min-width: 768px) and (max-width: 991px) {

}
// large devices
@media (min-width: 992px) and (max-width: 1199px) {

}
// extra large devices
@media (min-width: 1200px) {

}

Source

Setup gulp
https://css-tricks.com/gulp-for-beginners/

Normalize CSS
http://nicolasgallagher.com/about-normalize-css/

Parallax scrollling
https://github.com/nk-o/jarallax

Smooth scrolling and jump links
https://github.com/cferdinandi/smooth-scroll

Inspiration
https://jsfiddle.net/oneeezy/rrfwogxm/

Inspiration for mobile navigation
https://www.panter.ch/

HTML5 semantics
http://www.sichtweise.co/blog/artikel/html5-wann-verwende-ich-article-oder-section

Color palette
https://coolors.co/05668d-028090-00a896-02c39a-f0f3bd

Lorem Ipsum placeholder
https://www.webpagefx.com/web-design/html-ipsum/

Triangle bullet list
https://codepen.io/leetech/pen/bIAah

Send mail from a static site
https://formspree.io/

Slider
https://flickity.metafizzy.co/

About

A minimal one pager for a sports event built with gulp.

Resources

Releases

No releases published

Packages

No packages published
You can’t perform that action at this time.