Skip to content

Commit 87a5611

Browse files
sdrassdras
committed
📦 add in nuxt setup2
1 parent b463440 commit 87a5611

File tree

21 files changed

+5422
-0
lines changed

21 files changed

+5422
-0
lines changed

‎setup2/.editorconfig‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
# editorconfig.org
2+
root = true
3+
4+
[*]
5+
indent_size = 2
6+
indent_style = space
7+
end_of_line = lf
8+
charset = utf-8
9+
trim_trailing_whitespace = true
10+
insert_final_newline = true
11+
12+
[*.md]
13+
trim_trailing_whitespace = false

‎setup2/.eslintrc.js‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
module.exports = {
2+
root: true,
3+
parser: 'babel-eslint',
4+
env: {
5+
browser: true,
6+
node: true
7+
},
8+
extends: 'standard',
9+
// required to lint *.vue files
10+
plugins: [
11+
'html'
12+
],
13+
// add your custom rules here
14+
rules: {},
15+
globals: {}
16+
}

‎setup2/.gitignore‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
# dependencies
2+
node_modules
3+
4+
# logs
5+
npm-debug.log
6+
7+
# Nuxt build
8+
.nuxt
9+
10+
# Nuxt generate
11+
dist

‎setup2/README.md‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
# setup2
2+
3+
> Nuxt.js project
4+
5+
## Build Setup
6+
7+
``` bash
8+
# install dependencies
9+
$ npm install # Or yarn install
10+
11+
# serve with hot reload at localhost:3000
12+
$ npm run dev
13+
14+
# build for production and launch server
15+
$ npm run build
16+
$ npm start
17+
18+
# generate static project
19+
$ npm run generate
20+
```
21+
22+
For detailed explanation on how things work, checkout the [Nuxt.js docs](https://github.com/nuxt/nuxt.js).

‎setup2/assets/README.md‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
# ASSETS
2+
3+
This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.
4+
5+
More information about the usage of this directory in the documentation:
6+
https://nuxtjs.org/guide/assets#webpacked
7+
8+
**This directory is not required, you can delete it if you don't want to use it.**

‎setup2/components/Child.vue‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
<template>
2+
<div>
3+
<div class="item">
4+
<h2>{{ item }}</h2>
5+
<img :src="url" width="235" height="300"/>
6+
<div class="quantity">
7+
<button class="inc" @click="counter > 0 ? counter -= 1 : 0">-</button>
8+
<span class="quant-text">Quantity: {{ counter }}</span>
9+
<button class="inc" @click="counter += 1">+</button>
10+
</div>
11+
<button class="submit">Submit</button>
12+
</div>
13+
</div>
14+
</template>
15+
16+
17+
<script>
18+
export default {
19+
data() {
20+
return {
21+
counter: 0
22+
}
23+
},
24+
props: ["item", "url"],
25+
}
26+
</script>
27+
28+
<style scoped>
29+
30+
</style>

‎setup2/components/MainMenu.vue‎

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
<template>
2+
<div>
3+
<header>
4+
<nuxt-link exact to="/" class="logo">
5+
<svg class="menusvg stamp" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path fill="white" d="M99.2 86.9l-6.7-58.3c-.1-.6-.6-1.1-1.2-1.1h-6.2V12.9c0-.7-.6-1.2-1.2-1.2H64.2V5.5c0-.7-.6-1.2-1.2-1.2H37c-.7 0-1.2.6-1.2 1.2v6.2H16.2c-.7 0-1.2.6-1.2 1.2v14.6H8.7c-.6 0-1.2.5-1.2 1.1L.8 86.9c0 .4.1.7.3 1s.6.4.9.4h17.4l-.7 6c0 .4.1.7.3 1s.6.4.9.4h60c.4 0 .7-.2.9-.4s.3-.6.3-1l-.7-6H98c.4 0 .7-.2.9-.4s.4-.6.3-1zm-35-72.7h18.3v13.3h-9l-.4-3.1c-.1-.6-.6-1.1-1.2-1.1h-7.8l.1-9.1zm-26-7.4h23.5v16.5h-2.5V10.5c0-.7-.6-1.2-1.2-1.2H42c-.7 0-1.2.6-1.2 1.2v12.8h-2.5l-.1-16.5zm18.6 5v11.5H43.2V11.8h13.6zm-39.4 2.4h18.3v9.1H28c-.6 0-1.2.5-1.2 1.1l-.4 3.1h-9V14.2zm2.3 71.6H3.4L9.8 30h16.3l-6.4 55.8zm1.7 7.4l7.7-67.5h41.8l7.7 67.5H21.4zm58.9-7.4L73.9 30h16.3l6.4 55.8H80.3z"/></svg>
6+
</nuxt-link>
7+
<ul>
8+
<li v-for="item in menuitems">
9+
<a href="#">{{ item }}</a>
10+
</li>
11+
</ul>
12+
<nuxt-link to="/cart">
13+
<svg class="menusvg cart" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path fill="white" d="M29.5 61h47.27c2.8 0 5.23-2.62 5.23-5.6V36.03l-55-7.46v-7.16l-9-3.75c-.77-.32-1.65.04-1.97.8-.32.78.04 1.65.8 1.97L24 23.42v44.4c0 2.8 2.52 5.18 5.5 5.18h3.27c-.66 1-1.05 2.2-1.05 3.5 0 3.55 2.9 6.43 6.44 6.43 3.55 0 6.43-2.88 6.43-6.43 0-1.3-.4-2.5-1.05-3.5H70.1c-.67 1-1.05 2.2-1.05 3.5 0 3.55 2.88 6.43 6.43 6.43s6.44-2.88 6.44-6.43c0-3.38-2.6-6.15-5.92-6.4V70H29.5c-1.34 0-2.5-1-2.5-2.17v-7.5c.76.42 1.6.67 2.5.67zm8.66 18.93c-1.9 0-3.44-1.54-3.44-3.43 0-1.9 1.54-3.44 3.44-3.44s3.43 1.54 3.43 3.44-1.55 3.43-3.44 3.43zm40.76-3.43c0 1.9-1.54 3.43-3.44 3.43s-3.43-1.54-3.43-3.43c0-1.9 1.54-3.44 3.43-3.44 1.9 0 3.44 1.54 3.44 3.44zM27 31.6l52 7.06V55.4c0 1.3-1.1 2.6-2.23 2.6H29.5c-1.22 0-2.5-1.34-2.5-2.6V31.6z"/></svg>
14+
</nuxt-link>
15+
</header>
16+
</div>
17+
</template>
18+
19+
20+
<script>
21+
export default {
22+
data() {
23+
return {
24+
menuitems : [
25+
'shirts',
26+
'shorts',
27+
'accesories',
28+
'outerwear'
29+
]
30+
}
31+
},
32+
}
33+
</script>
34+
35+
<style scoped>
36+
header {
37+
background: #222;
38+
padding: 5px 10px 10px;
39+
width: 100vw;
40+
color: white;
41+
position: fixed;
42+
display: -webkit-box;
43+
display: -ms-flexbox;
44+
display: flex;
45+
-ms-flex-line-pack: center;
46+
align-content: center;
47+
-webkit-box-pack: center;
48+
-ms-flex-pack: center;
49+
justify-content: center;
50+
}
51+
header ul {
52+
padding-left: 0;
53+
}
54+
header a {
55+
color: white;
56+
text-decoration: none;
57+
padding: 0 10px;
58+
-webkit-transition: all 0.2s ease;
59+
transition: all 0.2s ease;
60+
}
61+
header a:hover {
62+
color: #E6534B;
63+
}
64+
65+
.stamp {
66+
width: 30px;
67+
height: 30px;
68+
margin: 10px;
69+
float: left;
70+
}
71+
72+
.cart {
73+
width: 40px;
74+
height: 40px;
75+
margin: 5px;
76+
}
77+
</style>

‎setup2/components/README.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
# COMPONENTS
2+
3+
The components directory contains your Vue.js Components.
4+
Nuxt.js doesn't supercharge these components.
5+
6+
**This directory is not required, you can delete it if you don't want to use it.**

‎setup2/layouts/README.md‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
# LAYOUTS
2+
3+
This directory contains your Application Layouts.
4+
5+
More information about the usage of this directory in the documentation:
6+
https://nuxtjs.org/guide/views#layouts
7+
8+
**This directory is not required, you can delete it if you don't want to use it.**

‎setup2/layouts/default.vue‎

Lines changed: 130 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,130 @@
1+
<template>
2+
<div>
3+
<MainMenu />
4+
<nuxt/>
5+
</div>
6+
</template>
7+
8+
<script>
9+
import MainMenu from './../components/MainMenu.vue';
10+
11+
export default {
12+
components: {
13+
MainMenu
14+
}
15+
}
16+
</script>
17+
18+
<style>
19+
body, html {
20+
font-family: 'PT Serif', serif;
21+
margin: 0;
22+
}
23+
24+
a {
25+
transition: 0.2s all ease;
26+
text-decoration: none;
27+
color: #E6534B;
28+
}
29+
30+
a:hover {
31+
color: #fc7c5f;
32+
}
33+
34+
.flexrow {
35+
padding-top: 80px;
36+
display: -webkit-box;
37+
display: -ms-flexbox;
38+
display: flex;
39+
-webkit-box-pack: center;
40+
-ms-flex-pack: center;
41+
justify-content: center;
42+
}
43+
44+
.special, h1, h2, h3, li, button.submit, .quant-text {
45+
font-family: 'Montserrat', sans-serif;
46+
text-transform: uppercase;
47+
letter-spacing: 0.08em;
48+
font-size: 12px;
49+
}
50+
51+
h2 {
52+
font-size: 20px;
53+
margin: 0 0 5px;
54+
text-align: center;
55+
}
56+
57+
li {
58+
list-style: none;
59+
display: inline-block;
60+
}
61+
62+
input {
63+
background: #eee;
64+
}
65+
66+
button {
67+
border: none;
68+
border-radius: 1000px;
69+
padding: 8px 13px;
70+
outline: none;
71+
cursor: pointer;
72+
}
73+
button.inc {
74+
background: white;
75+
color: black;
76+
}
77+
button.submit {
78+
background: black;
79+
color: white;
80+
margin-left: 20px;
81+
padding: 12px 14px;
82+
width: 240px;
83+
-webkit-transition: 0.25s all ease-in;
84+
transition: 0.25s all ease-in;
85+
}
86+
button.submit:hover {
87+
opacity: 0.8;
88+
-webkit-transition: 0.25s all ease-out;
89+
transition: 0.25s all ease-out;
90+
}
91+
92+
.quant-text {
93+
display: inline-block;
94+
text-align: center;
95+
width: 140px;
96+
padding: 8px;
97+
padding: 8px;
98+
}
99+
100+
.quantity {
101+
border: 2px solid black;
102+
width: 235px;
103+
padding-left: 3px;
104+
border-radius: 1000px;
105+
background: #fff;
106+
margin-left: 20px;
107+
}
108+
109+
.item {
110+
display: -webkit-box;
111+
display: -ms-flexbox;
112+
display: flex;
113+
-webkit-box-orient: vertical;
114+
-webkit-box-direction: normal;
115+
-ms-flex-direction: column;
116+
flex-direction: column;
117+
width: 280px;
118+
height: 440px;
119+
-ms-flex-pack: distribute;
120+
justify-content: space-around;
121+
background: #eee;
122+
padding: 20px 10px;
123+
margin: 30px;
124+
}
125+
.item img {
126+
-ms-flex-item-align: center;
127+
-ms-grid-row-align: center;
128+
align-self: center;
129+
}
130+
</style>

0 commit comments

Comments
 (0)