Skip to content

Commit 7a9f719

Browse files
MiniRobotDevMiniRobotDev
committed
forums page static header,footer and sidebar added
1 parent 761487c commit 7a9f719

2 files changed

Lines changed: 209 additions & 28 deletions

File tree

‎assets/js/pages/forums.js‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
1-
import { renderDefaultTemplate } from "/assets/js/global/render.js";
1+
import { topbarEvent, navbarEvent, sidebarEvent } from "/assets/js/global/headerEvents.js";
22

33
//* runs when page load
44
window.addEventListener("DOMContentLoaded", function () {
5-
// header, footer
6-
renderDefaultTemplate(document.body.innerHTML);
7-
85
// code here
6+
7+
// Header Events
8+
topbarEvent();
9+
navbarEvent();
10+
sidebarEvent();
911
});

‎pages/forums.html‎

Lines changed: 203 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,169 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8" />
5-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6-
<!-- font awesome -->
7-
<link
8-
rel="stylesheet"
9-
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"
10-
integrity="sha512-Fo3rlrZj/k7ujTnHg4CGR2D7kSs0v4LLanw2qksYuRlEzO+tcaEPQogQ0KaoGN26/zrn20ImR1DfuLWnOo7aBA=="
11-
crossorigin="anonymous"
12-
referrerpolicy="no-referrer"
13-
/>
14-
15-
<!-- styles -->
16-
<link rel="stylesheet" href="/assets/css/styles.css" />
17-
18-
<!-- scripts -->
19-
<script type="module" src="/assets/js/pages/forums.js"></script>
20-
21-
<title>reactapp forums</title>
22-
</head>
23-
24-
<body>
3+
4+
<head>
5+
<meta charset="UTF-8" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<!-- font awesome -->
8+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"
9+
integrity="sha512-Fo3rlrZj/k7ujTnHg4CGR2D7kSs0v4LLanw2qksYuRlEzO+tcaEPQogQ0KaoGN26/zrn20ImR1DfuLWnOo7aBA=="
10+
crossorigin="anonymous" referrerpolicy="no-referrer" />
11+
12+
<!-- styles -->
13+
<link rel="stylesheet" href="/assets/css/styles.css" />
14+
15+
<!-- scripts -->
16+
<script type="module" src="/assets/js/pages/forums.js"></script>
17+
18+
<title>reactapp forums</title>
19+
</head>
20+
21+
<body>
22+
<!-- start sidebar -->
23+
<div class="sidebar no-select">
24+
<!-- sidebar search -->
25+
<div class="sidebar__search">
26+
<form class="search__form" role="search" method="get" action="/">
27+
<input class="search-field" type="search" name="s" placeholder="ورود واژه کلیدی..." />
28+
<button class="search-submit" type="submit">
29+
<i class="fa fa-search" aria-hidden="true"></i>
30+
</button>
31+
</form>
32+
</div>
33+
34+
<!-- sidebar navigation -->
35+
<nav class="sidebar__nav">
36+
<ul class="sidebar__list">
37+
<li><a href="/">صفحه اصلی</a></li>
38+
39+
<!-- dropdown template -->
40+
<li class="list__dropdown">
41+
<div class="dropdown__header">
42+
<a href="/pages/courses.html">دوره ها</a>
43+
44+
<i class="sidebar__dropdown--toggle fa fa-angle-left"></i>
45+
</div>
46+
<ul class="dropdown__list">
47+
<li>
48+
<a href="/pages/learning-steps.html">راهنمای یادگیری</a>
49+
</li>
50+
</ul>
51+
</li>
52+
53+
<li>
54+
<a href="/pages/blog.html">بلاگ</a>
55+
</li>
56+
57+
<li>
58+
<a class="is-active" href="/pages/forums.html">تالار گفتمان</a>
59+
</li>
60+
61+
<li>
62+
<a href="#tel">کانال تلگرام</a>
63+
</li>
64+
</ul>
65+
</nav>
66+
</div>
67+
<!-- end sidebar -->
68+
69+
<!-- start body wrap -->
70+
<div class="body--wrap">
71+
<!-- overlay all elements -->
72+
<div class="body--overlay"></div>
73+
74+
<!-- start topbar -->
75+
<div class="topbar no-select">
76+
<div class="topbar__container">
77+
<ul class="topbar__links">
78+
<li>
79+
<a class="topbar__link" href="/pages/about-us.html">درباره ما</a>
80+
</li>
81+
<li>
82+
<a class="topbar__link" href="/pages/contact.html">تماس با ما</a>
83+
</li>
84+
</ul>
85+
<div class="topbar__icons">
86+
<div class="topbar__icon topbar__search">
87+
<a><i class="topbar__search--toggle fa fa-search" aria-hidden="true"></i></a>
88+
</div>
89+
<div class="topbar__icon topbar__bag">
90+
<a href="#"><i class="fa fa-shopping-bag" aria-hidden="true"></i></a>
91+
</div>
92+
<div class="topbar__icon topbar__perm">
93+
<a href="/pages/my-account.html"><i class="fas fa-user" aria-hidden="true"></i></a>
94+
</div>
95+
</div>
96+
</div>
97+
</div>
98+
<!-- end topbar -->
99+
100+
<!-- start navbar -->
101+
<div class="navbar no-select">
102+
<div class="navbar__container">
103+
<!-- navbar search -->
104+
<div class="navbar__search">
105+
<form class="search__form" role="search" method="get" action="/">
106+
<input class="search-input" type="search" name="s" placeholder="جستجوی دوره، استاد، مطالب و ..." />
107+
<button class="search-submit" type="submit">
108+
<i class="fa fa-search" aria-hidden="true"></i>
109+
</button>
110+
</form>
111+
</div>
112+
<!-- navbar menu -->
113+
<nav class="navbar__menu">
114+
<!-- menu list -->
115+
<ul class="menu__list">
116+
<li><a href="/">صفحه اصلی</a></li>
117+
118+
<!-- dropdown template -->
119+
<li class="list__dropdown">
120+
<div class="dropdown__header">
121+
<a "href=" /pages/courses.html">دوره ها</a>
122+
<i class="fa fa-angle-down"></i>
123+
</div>
124+
<ul class="dropdown__list">
125+
<li>
126+
<a href="/pages/learning-steps.html">راهنمای یادگیری</a>
127+
</li>
128+
</ul>
129+
</li>
130+
131+
<li>
132+
<a href="/pages/blog.html">بلاگ</a>
133+
</li>
134+
135+
<li>
136+
<a class="is-active" href="/pages/forums.html">تالار گفتمان</a>
137+
</li>
138+
139+
<li>
140+
<a href="#tel">کانال تلگرام</a>
141+
</li>
142+
</ul>
143+
<!-- menu button -->
144+
<a class="menu__account" href="/pages/my-account.html">
145+
<i class="account__icon fa fa-user-lock">&nbsp;</i> ورود و ثبت نام
146+
</a>
147+
</nav>
148+
<!-- navbar brand -->
149+
<div class="navbar__brand">
150+
<!-- brand image -->
151+
<div class="brand__img">
152+
<a href="/">
153+
<img src="/assets/images/navbar/brand.png" alt="reactapp brand" />
154+
</a>
155+
</div>
156+
<!-- sidebar toggle in navbar as toggle -->
157+
<div class="navbar--toggle">
158+
<div class="toggle__top"></div>
159+
<div class="toggle__mid"></div>
160+
<div class="toggle__btm"></div>
161+
</div>
162+
</div>
163+
</div>
164+
</div>
165+
<!-- end navbar -->
166+
25167
<!--main forums-->
26168
<main class="forums">
27169
<!-- breadcrumb -->
@@ -124,5 +266,42 @@ <h1>انجمن ها</h1>
124266
</section>
125267
</main>
126268
<!--end main forums-->
127-
</body>
128-
</html>
269+
270+
<!-- start footer -->
271+
<div class="footer">
272+
<div class="footer__content">
273+
<div class="footer__contact-info">
274+
<h3 class="contact-info__title">منتظرتون هستیم</h3>
275+
<div class="info-box">
276+
<i class="fas fa-phone" aria-hidden="true"></i>09109999999
277+
</div>
278+
<div class="info-box">
279+
<i class="fa fa-envelope" aria-hidden="true"></i>
280+
<a href="mailto:reactapp.ir@gmail.com">reactapp.ir@gmail.com</a>
281+
</div>
282+
</div>
283+
<div class="footer__links">
284+
<ul>
285+
<li><a href="/pages/blog.html">بلاگ</a></li>
286+
<li><a href="#">ویدیو کست</a></li>
287+
<li><a href="/pages/terms.html">قوانین</a></li>
288+
</ul>
289+
</div>
290+
<div class="footer__text">
291+
تمام تلاش ما در برند reactapp در کنار آموزش با کیفیت و استفاده از
292+
دانش روز، اضافه کردن چاشنی تجربه چندین ساله فعالیت در پروژه های
293+
داخلی و خارجی بوده. زمانی که شما به یادگیری اختصاص دادید برای ما
294+
اهمیت بسیار بالایی داره و به همین دلیل سعی میکنیم متحوای تولید شده،
295+
غنی، پر بار و در راستای نیاز های بازار کار باشه.
296+
</div>
297+
</div>
298+
<div class="footer__copyright">
299+
کلیه حقوق این سایت محفوظ و متعلق به reactapp.ir میباشد.
300+
</div>
301+
</div>
302+
<!-- end footer -->
303+
</div>
304+
<!-- end body wrap -->
305+
</body>
306+
307+
</html>

0 commit comments

Comments
 (0)