Skip to content

Commit fc000c2

Browse files
committed
UPDATE: Readme. ADD: Menu
1 parent c12ea7f commit fc000c2

File tree

14 files changed

+96
-18
lines changed

14 files changed

+96
-18
lines changed

README.md

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,17 @@
11
Webpack project starter with Pug, Sass/Stylus, jQuery, VanillaJS, Babel and Yarn
22
===================
33

4-
The purpose if this Webpack Starter is to allow people to create websites without frameworks/libraries like React, Angular, Vue only using simple but powerful technologies to build quality websites.
4+
The purpose of this Webpack Starter is to allow people to create websites without frameworks/libraries like React, Angular, Vue but only using simple but powerful technologies to build quality websites.
5+
6+
With this starter you can have your URLs clean by removing the .html extension. For example:
7+
8+
- *website.com/contact*
9+
- *website.com/blog*
10+
- *website.com/profile*
11+
12+
## Demo
13+
14+
🔗 https://webpack-starter.netlify.app/
515

616
## Technologies used
717

@@ -20,6 +30,11 @@ The purpose if this Webpack Starter is to allow people to create websites withou
2030
- Yarn instead NPM
2131
- PostCSS
2232

33+
## Run dev server in a different port
34+
```
35+
yarn dev --port your_port_number
36+
```
37+
2338
## Contributions
2439

2540
You can contribute directly to this repository or create a fork and perform your own modifications.

src/app.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@
33
// Styles
44
import 'styles/_app.scss';
55

6-
$(document).ready(() => {
6+
$(function() {
77
console.log('Ready!');
88

99
require('scripts/demo');
10-
});
10+
})

src/assets/styles/_app.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@
1919
@import './components/footer';
2020
@import './components/button';
2121
@import './components/link';
22+
@import './components/_menu';
2223

2324
/*
2425
Layout

src/assets/styles/components/_footer.scss

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,14 +5,16 @@
55
position: fixed;
66
bottom: 0;
77
right: 0;
8-
width: 250px;
8+
width: 150px;
99
padding: 10px;
1010
border-top-left-radius: 5px;
11+
text-align: center;
1112
p {
1213
font-size: 12px;
1314
}
1415
a {
1516
font-size: 15px;
17+
font-weight: bold;
1618
}
1719
}
1820

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
/* src/assets/styles/components/_menu.scss */
2+
3+
.menu {
4+
position: fixed;
5+
top: 0;
6+
color: white;
7+
width: 100%;
8+
padding: 15px;
9+
}
10+
.menu__ul {
11+
@include isFlex(center, flex-start);
12+
}
13+
.menu__item {
14+
& + .menu__item {
15+
margin-left: 20px;
16+
}
17+
}
18+
.menu__link {
19+
color: white;
20+
border-bottom: 2px solid transparent;
21+
font-size: 15px;
22+
&:hover,
23+
&.active {
24+
border-color: white;
25+
}
26+
}

src/assets/styles/layout/_general.scss

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,9 @@ h1, h2, h3, h4, h5, h6 {
2121
}
2222
a {
2323
text-decoration: none;
24+
&:visited {
25+
color: white;
26+
}
2427
}
2528
p {
2629
margin: 0;

src/views/components/footer.pug

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
//- src/views/components/footer.pug
22
33
footer.footer
4-
p Built by #[a(href='https://edgardorl.com') Edgardo Ramírez León]
4+
p By #[a(href='https://edgardorl.com') Edgardo]

src/views/components/menu.pug

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
mixin menu(currentPage)
2+
nav.menu
3+
ul.menu__ul.ml-auto
4+
li.menu__item
5+
a.menu__link(href='/', class=currentPage === 'home' ? 'active' : '') Home
6+
li.menu__item
7+
a.menu__link(href='/contact', class=currentPage === 'contact' ? 'active' : '') Contact
8+
li.menu__item
9+
a.menu__link(href='/blog', class=currentPage === 'blog' ? 'active' : '') Blog
10+
li.menu__item
11+
a.menu__link(href='/blog/example-post', class=currentPage === 'blog-post' ? 'active' : '') Blog Post

src/views/index.pug

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
extends ./layouts/master.pug
22

3+
include ./mixins/support.pug
4+
35
block title
46
title My Page - Home
57

@@ -9,10 +11,10 @@ block manifestBrowserconfigFiles
911

1012
block content
1113

14+
// Menu
15+
+menu('home')
16+
1217
//- Desktop page
1318
section.page.home__page
1419
h1.page__title # Index page
15-
p Thank you for your supporting :)
16-
p
17-
a(href="https://www.buymeacoffee.com/edgardo" target="_blank")
18-
img(src="https://www.buymeacoffee.com/assets/img/custom_images/orange_img.png" alt="Buy Me A Coffee" style="height: auto !important;width: auto !important;")
20+
+support()

src/views/layouts/master.pug

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,11 +52,14 @@ html(lang='en')
5252

5353
//- Manifest browserconfig files
5454
block manifestBrowserconfigFiles
55-
link(rel='manifest', href='./manifest.json' crossorigin)
55+
link(rel='manifest', href='./manifest.json', crossorigin)
5656
meta(name='msapplication-config' content='./browserconfig.xml')
5757

5858
body
5959

60+
//- Menu
61+
include ../components/menu.pug
62+
6063
//- block content
6164
block content
6265

0 commit comments

Comments
 (0)