File components/home/carousel.vue added (mode: 100644) (index 0000000..5bcd770) |
|
1 |
|
<template> |
|
2 |
|
<div> |
|
3 |
|
<b-carousel |
|
4 |
|
id="carousel-1" |
|
5 |
|
v-model="slide" |
|
6 |
|
:interval="4000" |
|
7 |
|
@sliding-start="onSlideStart" |
|
8 |
|
@sliding-end="onSlideEnd" |
|
9 |
|
controls |
|
10 |
|
indicators |
|
11 |
|
background="#ababab" |
|
12 |
|
img-width="1024" |
|
13 |
|
img-height="480" |
|
14 |
|
style="text-shadow: 1px 1px 2px #333;" |
|
15 |
|
> |
|
16 |
|
<!-- Slides with custom text --> |
|
17 |
|
<b-carousel-slide img-src="/images/carousel/home_02.jpg"> |
|
18 |
|
<h1>Ashihara Karate</h1> |
|
19 |
|
</b-carousel-slide> |
|
20 |
|
|
|
21 |
|
<b-carousel-slide img-src="/images/carousel/home_06.jpg"> |
|
22 |
|
<h1>Aerobic - Tae Bo</h1> |
|
23 |
|
</b-carousel-slide> |
|
24 |
|
|
|
25 |
|
<b-carousel-slide img-src="/images/carousel/home_03.jpg" /> |
|
26 |
|
<b-carousel-slide img-src="/images/carousel/home_04.jpg" /> |
|
27 |
|
<b-carousel-slide img-src="/images/carousel/home_05.jpg" /> |
|
28 |
|
</b-carousel> |
|
29 |
|
|
|
30 |
|
<!-- <p class="mt-4"> |
|
31 |
|
Slide #: {{ slide }}<br> |
|
32 |
|
Sliding: {{ sliding }} |
|
33 |
|
</p> --> |
|
34 |
|
</div> |
|
35 |
|
</template> |
|
36 |
|
|
|
37 |
|
<script> |
|
38 |
|
export default { |
|
39 |
|
data () { |
|
40 |
|
return { |
|
41 |
|
slide: 0, |
|
42 |
|
sliding: null |
|
43 |
|
} |
|
44 |
|
}, |
|
45 |
|
methods: { |
|
46 |
|
onSlideStart (slide) { |
|
47 |
|
this.sliding = true |
|
48 |
|
}, |
|
49 |
|
onSlideEnd (slide) { |
|
50 |
|
this.sliding = false |
|
51 |
|
} |
|
52 |
|
} |
|
53 |
|
} |
|
54 |
|
</script> |
File components/icons/menu.vue added (mode: 100644) (index 0000000..c6a947d) |
|
1 |
|
<template> |
|
2 |
|
<i :class="`menu-icon ${isOpen ? 'open' : ''}`" :data-open="isOpen"> |
|
3 |
|
<span></span> |
|
4 |
|
</i> |
|
5 |
|
</template> |
|
6 |
|
|
|
7 |
|
<script> |
|
8 |
|
export default { |
|
9 |
|
name: 'IconMenu', |
|
10 |
|
props: ['isOpen'] |
|
11 |
|
} |
|
12 |
|
</script> |
|
13 |
|
|
|
14 |
|
<style lang="scss"> |
|
15 |
|
.menu-icon { |
|
16 |
|
position: relative; |
|
17 |
|
display: block; |
|
18 |
|
width: 2.5em; |
|
19 |
|
height: 2.5em; |
|
20 |
|
cursor: pointer; |
|
21 |
|
} |
|
22 |
|
.menu-icon:hover span { |
|
23 |
|
background: #222; |
|
24 |
|
} |
|
25 |
|
.menu-icon:hover span:before, .menu-icon:hover span:after { |
|
26 |
|
background: #222; |
|
27 |
|
} |
|
28 |
|
|
|
29 |
|
.menu-icon > span { |
|
30 |
|
position: absolute; |
|
31 |
|
top: 50%; |
|
32 |
|
display: block; |
|
33 |
|
width: 100%; |
|
34 |
|
height: 0.25em; |
|
35 |
|
background-color: #bbbbbb; |
|
36 |
|
border-radius: 3px; |
|
37 |
|
-webkit-transition: -webkit-transform 0.3s, background 0.25s ease; |
|
38 |
|
-webkit-transition: background 0.25s ease, -webkit-transform 0.3s; |
|
39 |
|
transition: background 0.25s ease, -webkit-transform 0.3s; |
|
40 |
|
transition: transform 0.3s, background 0.25s ease; |
|
41 |
|
transition: transform 0.3s, background 0.25s ease, -webkit-transform 0.3s; |
|
42 |
|
} |
|
43 |
|
|
|
44 |
|
.menu-icon > span:before, |
|
45 |
|
.menu-icon > span:after { |
|
46 |
|
content: ""; |
|
47 |
|
position: absolute; |
|
48 |
|
width: 100%; |
|
49 |
|
height: 100%; |
|
50 |
|
background-color: #bbbbbb; |
|
51 |
|
border-radius: 3px; |
|
52 |
|
-webkit-transition: -webkit-transform 0.3s, background 0.25s ease; |
|
53 |
|
-webkit-transition: background 0.25s ease, -webkit-transform 0.3s; |
|
54 |
|
transition: background 0.25s ease, -webkit-transform 0.3s; |
|
55 |
|
transition: transform 0.3s, background 0.25s ease; |
|
56 |
|
transition: transform 0.3s, background 0.25s ease, -webkit-transform 0.3s; |
|
57 |
|
} |
|
58 |
|
|
|
59 |
|
.menu-icon > span:before { |
|
60 |
|
-webkit-transform: translateY(-0.75em); |
|
61 |
|
transform: translateY(-0.75em); |
|
62 |
|
} |
|
63 |
|
|
|
64 |
|
.menu-icon > span:after { |
|
65 |
|
-webkit-transform: translateY(0.75em); |
|
66 |
|
transform: translateY(0.75em); |
|
67 |
|
} |
|
68 |
|
|
|
69 |
|
/* OPENED */ |
|
70 |
|
.menu-icon.open { |
|
71 |
|
-webkit-transform: rotate(45deg); |
|
72 |
|
transform: rotate(45deg); |
|
73 |
|
} |
|
74 |
|
|
|
75 |
|
.menu-icon.open > span:before { |
|
76 |
|
-webkit-transform: rotate(90deg); |
|
77 |
|
transform: rotate(90deg); |
|
78 |
|
} |
|
79 |
|
|
|
80 |
|
.menu-icon.open > span:after { |
|
81 |
|
-webkit-transform: rotate(90deg); |
|
82 |
|
transform: rotate(90deg); |
|
83 |
|
} |
|
84 |
|
</style> |
File components/layout/footer.vue added (mode: 100644) (index 0000000..c92f848) |
|
1 |
|
<template> |
|
2 |
|
<footer> |
|
3 |
|
<b-container class="my-4"> |
|
4 |
|
<b-row> |
|
5 |
|
<b-col cols="8" sm="5" class="my-4">Copyright © 2020 <strong>Shingitai Karate Cub</strong> <br/> Powered by <a href="http://bitvice.ro" target="_blank" rel="noopener noreferrer">BitVice</a>.</b-col> |
|
6 |
|
<b-col cols="0" sm="2" class="text-center uHide-lapDown"> |
|
7 |
|
<img src="/images/logo/skc_color_128.png" width="96" alt="Shingitai Karate Club"> |
|
8 |
|
</b-col> |
|
9 |
|
<b-col cols="4" sm="5" class="my-4 text-right"> |
|
10 |
|
<a href="https://www.facebook.com/Shingitai-Karate-Club-Sensei-LiviuTabacaru-172072603137070/" target="_blank" rel="noopener noreferrer"> |
|
11 |
|
<i class="footer_icon"> |
|
12 |
|
<svg |
|
13 |
|
aria-hidden="true" |
|
14 |
|
focusable="false" |
|
15 |
|
data-prefix="fab" |
|
16 |
|
data-icon="facebook" |
|
17 |
|
role="img" |
|
18 |
|
xmlns="http://www.w3.org/2000/svg" |
|
19 |
|
viewBox="0 0 512 512" |
|
20 |
|
class="svg-inline--fa fa-facebook fa-w-16 fa-2x" |
|
21 |
|
> |
|
22 |
|
<path fill="currentColor" d="M504 256C504 119 393 8 256 8S8 119 8 256c0 123.78 90.69 226.38 209.25 245V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.28c-30.8 0-40.41 19.12-40.41 38.73V256h68.78l-11 71.69h-57.78V501C413.31 482.38 504 379.78 504 256z" class=""></path> |
|
23 |
|
</svg> |
|
24 |
|
</i> |
|
25 |
|
</a> |
|
26 |
|
<a href="https://www.youtube.com/channel/UC3h9v4wkkH44jDvxyZbslAA" target="_blank" rel="noopener noreferrer"> |
|
27 |
|
<i class="footer_icon"> |
|
28 |
|
<svg |
|
29 |
|
aria-hidden="true" |
|
30 |
|
focusable="false" |
|
31 |
|
data-prefix="fab" |
|
32 |
|
data-icon="youtube" |
|
33 |
|
role="img" |
|
34 |
|
xmlns="http://www.w3.org/2000/svg" |
|
35 |
|
viewBox="0 0 576 512" |
|
36 |
|
class="svg-inline--fa fa-youtube fa-w-18 fa-2x" |
|
37 |
|
> |
|
38 |
|
<path fill="currentColor" d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z" class=""></path> |
|
39 |
|
</svg> |
|
40 |
|
</i> |
|
41 |
|
</a> |
|
42 |
|
</b-col> |
|
43 |
|
</b-row> |
|
44 |
|
</b-container> |
|
45 |
|
</footer> |
|
46 |
|
</template> |
|
47 |
|
|
|
48 |
|
<style lang="scss"> |
|
49 |
|
.footer_icon { |
|
50 |
|
display: inline-block; |
|
51 |
|
width: 2rem; |
|
52 |
|
height: 2rem; |
|
53 |
|
margin-left: 2rem; |
|
54 |
|
} |
|
55 |
|
|
|
56 |
|
footer { |
|
57 |
|
a { |
|
58 |
|
color: #666; |
|
59 |
|
|
|
60 |
|
&:hover { |
|
61 |
|
color: red; |
|
62 |
|
} |
|
63 |
|
} |
|
64 |
|
} |
|
65 |
|
</style> |
File components/layout/header.vue added (mode: 100644) (index 0000000..95a581d) |
|
1 |
|
<template> |
|
2 |
|
<div class="pHead_wrapper"> |
|
3 |
|
<header class="pHead_mobile uHide-lapUp"> |
|
4 |
|
<b-row> |
|
5 |
|
<b-col cols="6" class="text-left"> |
|
6 |
|
<img src="/images/logo/skc_color_128.png" width="48" alt="Shingitai Karate Club" class="mx-3 my-2"> |
|
7 |
|
</b-col> |
|
8 |
|
<b-col cols="6" class="text-right"> |
|
9 |
|
<span |
|
10 |
|
style="text-align: left; display: inline-block; width: 2rem; margin: .8rem 1rem 0 0; font-size: .8rem;" |
|
11 |
|
@click="toggleMenu" |
|
12 |
|
> |
|
13 |
|
<menu-icon :isOpen="menuOpen" /> |
|
14 |
|
</span> |
|
15 |
|
</b-col> |
|
16 |
|
</b-row> |
|
17 |
|
</header> |
|
18 |
|
<header class="pHead uHide-lapDown"> |
|
19 |
|
<aside class="pHead_side" aria-label="Left menu"> |
|
20 |
|
<nuxt-link to="/" no-prefetch> |
|
21 |
|
Despre noi |
|
22 |
|
</nuxt-link> |
|
23 |
|
<nuxt-link to="/echipa" no-prefetch> |
|
24 |
|
Echipa |
|
25 |
|
</nuxt-link> |
|
26 |
|
<nuxt-link to="/echipa" no-prefetch> |
|
27 |
|
Locații |
|
28 |
|
</nuxt-link> |
|
29 |
|
</aside> |
|
30 |
|
|
|
31 |
|
<div class="pHead_midd"> |
|
32 |
|
<h1>Shingitai Karate Club</h1> |
|
33 |
|
<nuxt-link to="/about" no-prefetch> |
|
34 |
|
<img src="/images/logo/skc_128.png" alt="Shingitai Karate Club"> |
|
35 |
|
</nuxt-link> |
|
36 |
|
</div> |
|
37 |
|
|
|
38 |
|
<aside class="pHead_side" aria-label="Right menu"> |
|
39 |
|
<nav role="navigation"> |
|
40 |
|
<nuxt-link to="/karate" no-prefetch> |
|
41 |
|
Karate |
|
42 |
|
</nuxt-link> |
|
43 |
|
<nuxt-link to="/karate" no-prefetch> |
|
44 |
|
Fitnes |
|
45 |
|
</nuxt-link> |
|
46 |
|
<nuxt-link to="/about" no-prefetch> |
|
47 |
|
Contact |
|
48 |
|
</nuxt-link> |
|
49 |
|
</nav> |
|
50 |
|
</aside> |
|
51 |
|
</header> |
|
52 |
|
</div> |
|
53 |
|
</template> |
|
54 |
|
|
|
55 |
|
<script> |
|
56 |
|
import MenuIcon from '../icons/menu'; |
|
57 |
|
|
|
58 |
|
export default { |
|
59 |
|
name: 'LayoutHeader', |
|
60 |
|
components: { |
|
61 |
|
MenuIcon |
|
62 |
|
}, |
|
63 |
|
data () { |
|
64 |
|
return { |
|
65 |
|
menuOpen: false |
|
66 |
|
} |
|
67 |
|
}, |
|
68 |
|
methods: { |
|
69 |
|
toggleMenu () { |
|
70 |
|
this.menuOpen = !this.menuOpen; |
|
71 |
|
} |
|
72 |
|
} |
|
73 |
|
} |
|
74 |
|
</script> |
|
75 |
|
|
|
76 |
|
<style lang="scss"> |
|
77 |
|
.pHead { |
|
78 |
|
position: absolute; |
|
79 |
|
top: 1rem; |
|
80 |
|
left: 0; |
|
81 |
|
right: 0; |
|
82 |
|
z-index: 2; |
|
83 |
|
|
|
84 |
|
display: flex; |
|
85 |
|
width: 100%; |
|
86 |
|
// background-color: rgba(0,0,0, .5); |
|
87 |
|
// background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 40%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.7) 60%, rgba(0,0,0,0.0) 100%); |
|
88 |
|
|
|
89 |
|
border-radius: 2rem; |
|
90 |
|
// box-shadow: 0 0 3px #666; |
|
91 |
|
margin: 2rem 0; |
|
92 |
|
padding: 1rem; |
|
93 |
|
color: #fff; |
|
94 |
|
|
|
95 |
|
&_wrapper { |
|
96 |
|
position: relative; |
|
97 |
|
} |
|
98 |
|
|
|
99 |
|
&_midd { |
|
100 |
|
display: inline-block; |
|
101 |
|
text-align: center; |
|
102 |
|
// overflow: hidden; |
|
103 |
|
flex-grow: 1; |
|
104 |
|
flex-shrink: 1; |
|
105 |
|
order: 0; |
|
106 |
|
min-width: 128px; |
|
107 |
|
margin: -2.5rem 0; |
|
108 |
|
|
|
109 |
|
h1 { |
|
110 |
|
position: absolute; |
|
111 |
|
top: -80rem; |
|
112 |
|
} |
|
113 |
|
|
|
114 |
|
img { |
|
115 |
|
transition: transform .8s; |
|
116 |
|
transform: scale(.8); |
|
117 |
|
|
|
118 |
|
&:hover { |
|
119 |
|
transform: scale(1); |
|
120 |
|
} |
|
121 |
|
} |
|
122 |
|
} |
|
123 |
|
|
|
124 |
|
&_side { |
|
125 |
|
display: inline-block; |
|
126 |
|
overflow: hidden; |
|
127 |
|
flex-grow: 1; |
|
128 |
|
flex-shrink: 1; |
|
129 |
|
order: 0; |
|
130 |
|
|
|
131 |
|
&:first-child { |
|
132 |
|
text-align: right; |
|
133 |
|
} |
|
134 |
|
|
|
135 |
|
&:last-child { |
|
136 |
|
text-align: left; |
|
137 |
|
} |
|
138 |
|
|
|
139 |
|
a { |
|
140 |
|
transition: color .4s; |
|
141 |
|
color: rgba(#eee, 1); |
|
142 |
|
text-decoration: none; |
|
143 |
|
text-transform: uppercase; |
|
144 |
|
font-weight: bold; |
|
145 |
|
line-height: 3; |
|
146 |
|
margin: 0 .5rem; |
|
147 |
|
text-shadow: 1px 1px 1px #333; |
|
148 |
|
transition: all .5s; |
|
149 |
|
padding: 0 1rem; |
|
150 |
|
border-radius: 4rem; |
|
151 |
|
|
|
152 |
|
&:hover { |
|
153 |
|
padding: 1rem; |
|
154 |
|
background-color: rgba(0,0,0,.5); |
|
155 |
|
color: #fff; |
|
156 |
|
} |
|
157 |
|
} |
|
158 |
|
} |
|
159 |
|
|
|
160 |
|
&_menu { |
|
161 |
|
display: inline-block; |
|
162 |
|
width: 48px; |
|
163 |
|
height: 48px; |
|
164 |
|
} |
|
165 |
|
} |
|
166 |
|
|
|
167 |
|
.carousel-inner:after { |
|
168 |
|
content: ' '; |
|
169 |
|
position: absolute; |
|
170 |
|
bottom: 0; |
|
171 |
|
left: 0; |
|
172 |
|
right: 0; |
|
173 |
|
height: 100%; |
|
174 |
|
background-color: rgba(0,0,0,1); |
|
175 |
|
background: linear-gradient(0deg, #000 0%, rgba(0,0,0,.5) 50%); |
|
176 |
|
|
|
177 |
|
} |
|
178 |
|
</style> |
File layouts/default.vue added (mode: 100644) (index 0000000..c0eecee) |
|
1 |
|
<template> |
|
2 |
|
<div> |
|
3 |
|
<LayoutHeader /> |
|
4 |
|
|
|
5 |
|
<nuxt /> |
|
6 |
|
|
|
7 |
|
<LayoutFooter /> |
|
8 |
|
</div> |
|
9 |
|
</template> |
|
10 |
|
|
|
11 |
|
<script> |
|
12 |
|
import LayoutHeader from '~/components/layout/header.vue'; |
|
13 |
|
import LayoutFooter from '~/components/layout/footer.vue'; |
|
14 |
|
|
|
15 |
|
export default { |
|
16 |
|
components: { |
|
17 |
|
LayoutHeader, |
|
18 |
|
LayoutFooter |
|
19 |
|
} |
|
20 |
|
} |
|
21 |
|
</script> |
|
22 |
|
|
|
23 |
|
<style lang="scss"> |
|
24 |
|
body { |
|
25 |
|
// font-family: 'Montserrat Alternates', Arial, Helvetica, sans-serif; |
|
26 |
|
font-family: 'Montserrat Alternates', sans-serif; |
|
27 |
|
} |
|
28 |
|
|
|
29 |
|
@media (max-width: 768px) { |
|
30 |
|
.uHide-lapDown { |
|
31 |
|
display: none !important; |
|
32 |
|
} |
|
33 |
|
} |
|
34 |
|
|
|
35 |
|
@media (min-width: 769px) { |
|
36 |
|
.uHide-lapUp { |
|
37 |
|
display: none !important; |
|
38 |
|
} |
|
39 |
|
} |
|
40 |
|
</style> |
File pages/index.vue added (mode: 100644) (index 0000000..801e676) |
|
1 |
|
<template> |
|
2 |
|
<main> |
|
3 |
|
<home-carousel /> |
|
4 |
|
<band theme="Dark"> |
|
5 |
|
<b-row> |
|
6 |
|
<b-col md="6"> |
|
7 |
|
<aside class="oBand_text" aria-labelledby="#Section1Title"> |
|
8 |
|
<h2 id="Section1Title">Shingitai Karate Club</h2> |
|
9 |
|
<p><strong>Shingitai Karate Club</strong>, a luat naștere la |
|
10 |
|
Brașov, în luna februarie 1992, avându-l drept |
|
11 |
|
fondator pe <strong>antrenorul emerit al sportului Sensei Liviu Tăbăcaru</strong>. Printre primele |
|
12 |
|
cluburi private de arte marțiale întemeiate în |
|
13 |
|
Brașov după 1990, <strong>Shingitai</strong> este afiliat la |
|
14 |
|
<strong>Federația Română de Arte Marțiale (FRAM)</strong> și |
|
15 |
|
<strong>New International Karate Organization (NIKO)</strong> – |
|
16 |
|
for cu sediul la <strong>Matsuyama (Japonia)</strong> și prezidat |
|
17 |
|
de <strong>Kancho Hidenori Ashihara</strong>. În limba japoneză, |
|
18 |
|
"shin" înseamnă spirit, "gi" se traduce printr-o bună |
|
19 |
|
pregătire fizică și tehnică, iar "tai", prin corp. Într-o |
|
20 |
|
traducere liberă, <strong>Shingitai</strong> înseamnă <strong>"luptător |
|
21 |
|
complet"</strong>.</p> |
|
22 |
|
</aside> |
|
23 |
|
</b-col> |
|
24 |
|
<div class="oBand_img toRight-lapUp" style="background-image: url('/images/LiviuTabacaru_01.jpg'); background-position: top center;"></div> |
|
25 |
|
</b-row> |
|
26 |
|
</band> |
|
27 |
|
|
|
28 |
|
<band theme="Light"> |
|
29 |
|
<b-row> |
|
30 |
|
<div class="oBand_img toLeft-lapUp" style="background-image: url('/images/carousel/home_01.jpg')"></div> |
|
31 |
|
<b-col md="6"></b-col> |
|
32 |
|
<b-col md="6"> |
|
33 |
|
<aside clas="oBand_text"> |
|
34 |
|
<h2>Shingitai Karate Club</h2> |
|
35 |
|
<p><strong>Shingitai Karate Club</strong>, a luat naștere la |
|
36 |
|
Brașov, în luna februarie 1992, avându-l drept |
|
37 |
|
fondator pe <strong>antrenorul emerit al sportului Sensei Liviu Tăbăcaru</strong>. Printre primele |
|
38 |
|
cluburi private de arte marțiale întemeiate în |
|
39 |
|
Brașov după 1990, <strong>Shingitai</strong> este afiliat la |
|
40 |
|
<strong>Federația Română de Arte Marțiale (FRAM)</strong> și |
|
41 |
|
<strong>New International Karate Organization (NIKO)</strong> – |
|
42 |
|
for cu sediul la <strong>Matsuyama (Japonia)</strong> și prezidat |
|
43 |
|
de <strong>Kancho Hidenori Ashihara</strong>. În limba japoneză, |
|
44 |
|
"shin" înseamnă spirit, "gi" se traduce printr-o bună |
|
45 |
|
pregătire fizică și tehnică, iar "tai", prin corp. Într-o |
|
46 |
|
traducere liberă, <strong>Shingitai</strong> înseamnă <strong>"luptător |
|
47 |
|
complet"</strong>.</p> |
|
48 |
|
</aside> |
|
49 |
|
</b-col> |
|
50 |
|
</b-row> |
|
51 |
|
</band> |
|
52 |
|
|
|
53 |
|
</main> |
|
54 |
|
</template> |
|
55 |
|
|
|
56 |
|
<script> |
|
57 |
|
import HomeCarousel from '~/components/home/carousel' |
|
58 |
|
import Band from '~/components/base/band' |
|
59 |
|
|
|
60 |
|
export default { |
|
61 |
|
components: { |
|
62 |
|
HomeCarousel, |
|
63 |
|
Band |
|
64 |
|
} |
|
65 |
|
} |
|
66 |
|
</script> |
|
67 |
|
|
|
68 |
|
<style> |
|
69 |
|
|
|
70 |
|
</style> |
File server/index.js added (mode: 100644) (index 0000000..f613fc2) |
|
1 |
|
const Koa = require('koa') |
|
2 |
|
const consola = require('consola') |
|
3 |
|
const { Nuxt, Builder } = require('nuxt') |
|
4 |
|
|
|
5 |
|
const app = new Koa() |
|
6 |
|
|
|
7 |
|
// Import and Set Nuxt.js options |
|
8 |
|
const config = require('../nuxt.config.js') |
|
9 |
|
config.dev = app.env !== 'production' |
|
10 |
|
|
|
11 |
|
async function start () { |
|
12 |
|
// Instantiate nuxt.js |
|
13 |
|
const nuxt = new Nuxt(config) |
|
14 |
|
|
|
15 |
|
const { |
|
16 |
|
host = process.env.HOST || '127.0.0.1', |
|
17 |
|
port = process.env.PORT || 3000 |
|
18 |
|
} = nuxt.options.server |
|
19 |
|
|
|
20 |
|
// Build in development |
|
21 |
|
if (config.dev) { |
|
22 |
|
const builder = new Builder(nuxt) |
|
23 |
|
await builder.build() |
|
24 |
|
} else { |
|
25 |
|
await nuxt.ready() |
|
26 |
|
} |
|
27 |
|
|
|
28 |
|
app.use((ctx) => { |
|
29 |
|
ctx.status = 200 |
|
30 |
|
ctx.respond = false // Bypass Koa's built-in response handling |
|
31 |
|
ctx.req.ctx = ctx // This might be useful later on, e.g. in nuxtServerInit or with nuxt-stash |
|
32 |
|
nuxt.render(ctx.req, ctx.res) |
|
33 |
|
}) |
|
34 |
|
|
|
35 |
|
app.listen(port, host) |
|
36 |
|
consola.ready({ |
|
37 |
|
message: `Server listening on http://${host}:${port}`, |
|
38 |
|
badge: true |
|
39 |
|
}) |
|
40 |
|
} |
|
41 |
|
|
|
42 |
|
start() |