Skip to content

Commit a75a085

Browse files
morshadunnurmorshadunnur
committed
page layout
1 parent b7ac94e commit a75a085

File tree

10 files changed

+382
-470
lines changed

10 files changed

+382
-470
lines changed

‎components/Footer.vue

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
<template>
2+
<div class="bottom-area bg-[#393e3a]">
3+
<div class="container mx-auto">
4+
<div class="flex flex-wrap">
5+
<div class="w-full pt-20 pb-20">
6+
<div class="main-menu justify-between border-b-4 border-[#CCCCCC] pb-10">
7+
<ul class="menu-list justify-between flex">
8+
<li class="bottom-menu-list-item">
9+
<a
10+
class=" text-[24px] text-[#F7F7F7] font-bold leading-[36px] transition duration-350 linear hover:text-[#d6d6d6]"
11+
href="#">Home</a>
12+
</li>
13+
<li class="bottom-menu-list-item">
14+
<a
15+
class=" text-[24px] text-[#F7F7F7] font-bold leading-[36px] transition duration-350 linear hover:text-[#d6d6d6]"
16+
href="#web-dev">Web Development</a>
17+
</li>
18+
<li class="bottom-menu-list-item">
19+
<a
20+
class=" text-[24px] text-[#F7F7F7] font-bold leading-[36px] transition duration-350 linear hover:text-[#d6d6d6]"
21+
href="#">Laravel</a>
22+
</li>
23+
<li class="bottom-menu-list-item">
24+
<a
25+
class=" text-[24px] text-[#F7F7F7] font-bold leading-[36px] transition duration-350 linear hover:text-[#d6d6d6]"
26+
href="#source">Open
27+
Source</a>
28+
</li>
29+
<li class="bottom-menu-list-item">
30+
<a
31+
class=" text-[24px] text-[#F7F7F7] font-bold leading-[36px] transition duration-350 linear hover:text-[#d6d6d6]"
32+
href="#">About Us</a>
33+
</li>
34+
</ul>
35+
</div>
36+
37+
38+
<!-- .................................................................................... -->
39+
40+
41+
<div class="flex flex-wrap justify-start pt-10">
42+
<div class="w-6/12">
43+
<ul class="menu-list">
44+
<li class="bottom-menu-list-item mr-[80px] text-[16px] text-[#F7F7F7] font-medium
45+
leading-[24px] transition duration-350 linear hover:text-[#d6d6d6]">
46+
Instagram
47+
</li>
48+
<li class="bottom-menu-list-item mr-[80px] text-[16px] text-[#F7F7F7] font-medium
49+
leading-[24px] transition duration-350 linear hover:text-[#d6d6d6]">
50+
Github
51+
</li>
52+
<li class="bottom-menu-list-item mr-[80px] text-[16px] text-[#F7F7F7] font-medium
53+
leading-[24px] transition duration-350 linear hover:text-[#d6d6d6]">
54+
Patreon
55+
</li>
56+
<li class="bottom-menu-list-item mr-[80px] text-[16px] text-[#F7F7F7] font-medium
57+
leading-[24px] transition duration-350 linear hover:text-[#d6d6d6]">
58+
Twitter
59+
</li>
60+
</ul>
61+
</div>
62+
<div class="w-6/12 flex flex-wrap justify-end">
63+
<div class="mr-[90px] ">
64+
<p class="text-[16px] text-[#F7F7F7] font-medium
65+
leading-[24px] transition duration-350 linear hover:text-[#d6d6d6] justify-end
66+
flex">
67+
House-06, Road-12/A, Sector-10
68+
</p>
69+
<p class="text-[16px] text-[#F7F7F7] font-medium
70+
leading-[24px] transition duration-350 linear hover:text-[#d6d6d6] flex justify-end
71+
">
72+
<svg class="w-6 h-6 mr-2" fill="none" stroke="white" viewBox="0 0 24 24"
73+
xmlns="http://www.w3.org/2000/svg">
74+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
75+
d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z">
76+
</path>
77+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
78+
d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"></path>
79+
</svg>
80+
Uttara, Dhaka-1230
81+
</p>
82+
</div>
83+
<div>
84+
<a href="#" class="text-[16px] text-[#F7F7F7] font-medium
85+
leading-[24px] transition duration-350 linear hover:text-[#d6d6d6]">
86+
<h4>info@qbytesoft.com</h4>
87+
</a>
88+
<a href="#" class="text-[16px] text-[#F7F7F7] font-medium
89+
leading-[24px] transition duration-350 linear hover:text-[#d6d6d6]">
90+
<h4>+8801611 032464</h4>
91+
</a>
92+
</div>
93+
</div>
94+
<div class="w-3/12 flex flex-wrap mt-8">
95+
<a href="#" class="mr-[20px] text-[16px] text-[#F7F7F7] font-medium
96+
leading-[24px] transition duration-350 linear hover:underline">
97+
<h4>Privacy</h4>
98+
</a>
99+
<a href="#" class="text-[16px] text-[#F7F7F7] font-medium
100+
leading-[24px] transition duration-350 linear hover:underline">
101+
<h4>Disclaimer</h4>
102+
</a>
103+
</div>
104+
</div>
105+
</div>
106+
</div>
107+
</div>
108+
</div>
109+
</template>
110+
111+
<script>
112+
export default {
113+
// eslint-disable-next-line vue/multi-word-component-names
114+
name: "Footer"
115+
}
116+
</script>
117+
118+
<style scoped>
119+
120+
</style>

‎components/Header.vue

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
<template>
2+
<div class="header-area">
3+
<div class="container mx-auto">
4+
<div class="flex flex-wrap items-center">
5+
<div class="w-3/12 px-3">
6+
<a href="#" class="logo inline-block">
7+
<img src="~/assets/img/logo.png" alt="logo">
8+
</a>
9+
</div>
10+
<div class="w-9/12 px-3">
11+
<div class="main-menu text-right">
12+
<ul class="menu-list">
13+
<li class="menu-list-item">
14+
<a class="menu-list-link" href="#">Home</a>
15+
</li>
16+
<li class="menu-list-item">
17+
<a class="menu-list-link" href="#">Web Development</a>
18+
</li>
19+
<li class="menu-list-item">
20+
<a class="menu-list-link" href="#">Laravel</a>
21+
</li>
22+
<li class="menu-list-item">
23+
<a class="menu-list-link" href="#">Open Source</a>
24+
</li>
25+
<li class="menu-list-item">
26+
<a class="menu-list-link" href="#">About Us</a>
27+
</li>
28+
</ul>
29+
</div>
30+
</div>
31+
</div>
32+
</div>
33+
</div>
34+
</template>
35+
36+
<script>
37+
export default {
38+
// eslint-disable-next-line vue/multi-word-component-names
39+
name: "Header"
40+
}
41+
</script>
42+
43+
<style scoped>
44+
45+
</style>

‎components/NuxtLogo.vue

Lines changed: 0 additions & 19 deletions
This file was deleted.

‎components/Tutorial.vue

Lines changed: 0 additions & 125 deletions
This file was deleted.

0 commit comments

Comments
 (0)