Skip to content

Commit 7989185

Browse files
MiniRobotDevMiniRobotDev
committed
recover-password page static header,footer and sidebar added
1 parent ea3e067 commit 7989185

2 files changed

Lines changed: 225 additions & 41 deletions

File tree

‎assets/js/pages/my-account/recover-password.js‎

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

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

‎pages/my-account/recover-password.html‎

Lines changed: 218 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -9,57 +9,238 @@
99
integrity="sha512-Fo3rlrZj/k7ujTnHg4CGR2D7kSs0v4LLanw2qksYuRlEzO+tcaEPQogQ0KaoGN26/zrn20ImR1DfuLWnOo7aBA=="
1010
crossorigin="anonymous" referrerpolicy="no-referrer" />
1111

12-
<!-- scripts -->
13-
<script type="module" src="/assets/js/pages/my-account/recover-password.js"></script>
12+
<!-- styles -->
13+
<link rel="stylesheet" href="/assets/css/styles.css" />
1414

1515
<title>reactapp recover-password</title>
1616
</head>
1717

1818
<body>
19-
<!-- recover password -->
20-
<main class="recover-pass">
21-
<!-- breadcrumb -->
22-
<div class="breadcrumb">
23-
<div class="breadcrumb__wrapper">
24-
<h1>بازیابی رمز عبور</h1>
25-
<nav class="breadcrumb__list">
26-
<li><a href="/">خانه</a></li>
27-
<li><a href="/pages/my-account.html">حساب من</a></li>
28-
<li>بازیابی رمز عبور</li>
29-
</nav>
19+
<!-- start sidebar -->
20+
<div class="sidebar no-select">
21+
<!-- sidebar search -->
22+
<div class="sidebar__search">
23+
<form class="search__form" role="search" method="get" action="/">
24+
<input class="search-field" type="search" name="s" placeholder="ورود واژه کلیدی..." />
25+
<button class="search-submit" type="submit">
26+
<i class="fa fa-search" aria-hidden="true"></i>
27+
</button>
28+
</form>
29+
</div>
30+
31+
<!-- sidebar navigation -->
32+
<nav class="sidebar__nav">
33+
<ul class="sidebar__list">
34+
<li><a href="/">صفحه اصلی</a></li>
35+
36+
<!-- dropdown template -->
37+
<li class="list__dropdown">
38+
<div class="dropdown__header">
39+
<a href="/pages/courses.html">دوره ها</a>
40+
41+
<i class="sidebar__dropdown--toggle fa fa-angle-left"></i>
42+
</div>
43+
<ul class="dropdown__list">
44+
<li>
45+
<a href="/pages/learning-steps.html">راهنمای یادگیری</a>
46+
</li>
47+
</ul>
48+
</li>
49+
50+
<li>
51+
<a href="/pages/blog.html">بلاگ</a>
52+
</li>
53+
54+
<li>
55+
<a href="/pages/forums.html">تالار گفتمان</a>
56+
</li>
57+
58+
<li>
59+
<a href="#tel">کانال تلگرام</a>
60+
</li>
61+
</ul>
62+
</nav>
63+
</div>
64+
<!-- end sidebar -->
65+
66+
<!-- start body wrap -->
67+
<div class="body--wrap">
68+
<!-- overlay all elements -->
69+
<div class="body--overlay"></div>
70+
71+
<!-- start topbar -->
72+
<div class="topbar no-select">
73+
<div class="topbar__container">
74+
<ul class="topbar__links">
75+
<li>
76+
<a class="topbar__link" href="/pages/about-us.html">درباره ما</a>
77+
</li>
78+
<li>
79+
<a class="topbar__link" href="/pages/contact.html">تماس با ما</a>
80+
</li>
81+
</ul>
82+
<div class="topbar__icons">
83+
<div class="topbar__icon topbar__search">
84+
<a><i class="topbar__search--toggle fa fa-search" aria-hidden="true"></i></a>
85+
</div>
86+
<div class="topbar__icon topbar__bag">
87+
<a href="#"><i class="fa fa-shopping-bag" aria-hidden="true"></i></a>
88+
</div>
89+
<div class="topbar__icon topbar__perm">
90+
<a href="/pages/my-account.html"><i class="fas fa-user" aria-hidden="true"></i></a>
91+
</div>
92+
</div>
3093
</div>
3194
</div>
95+
<!-- end topbar -->
96+
97+
<!-- start navbar -->
98+
<div class="navbar no-select">
99+
<div class="navbar__container">
100+
<!-- navbar search -->
101+
<div class="navbar__search">
102+
<form class="search__form" role="search" method="get" action="/">
103+
<input class="search-input" type="search" name="s" placeholder="جستجوی دوره، استاد، مطالب و ..." />
104+
<button class="search-submit" type="submit">
105+
<i class="fa fa-search" aria-hidden="true"></i>
106+
</button>
107+
</form>
108+
</div>
109+
<!-- navbar menu -->
110+
<nav class="navbar__menu">
111+
<!-- menu list -->
112+
<ul class="menu__list">
113+
<li><a href="/">صفحه اصلی</a></li>
114+
115+
<!-- dropdown template -->
116+
<li class="list__dropdown">
117+
<div class="dropdown__header">
118+
<a href="/pages/courses.html">دوره ها</a>
119+
<i class="fa fa-angle-down"></i>
120+
</div>
121+
<ul class="dropdown__list">
122+
<li>
123+
<a href="/pages/learning-steps.html">راهنمای یادگیری</a>
124+
</li>
125+
</ul>
126+
</li>
32127

33-
<!-- main recover password -->
34-
<section class="recover-pass__main">
35-
<div class="main__wrapper">
36-
<div class="wrapper__header">
37-
<div class="wrapper__img">
38-
<img src="/assets/images/my-account/recover-password.svg" />
128+
<li>
129+
<a href="/pages/blog.html">بلاگ</a>
130+
</li>
131+
132+
<li>
133+
<a href="/pages/forums.html">تالار گفتمان</a>
134+
</li>
135+
136+
<li>
137+
<a href="#tel">کانال تلگرام</a>
138+
</li>
139+
</ul>
140+
<!-- menu button -->
141+
<a class="menu__account" href="/pages/my-account.html">
142+
<i class="account__icon fa fa-user-lock">&nbsp;</i> ورود و ثبت نام
143+
</a>
144+
</nav>
145+
<!-- navbar brand -->
146+
<div class="navbar__brand">
147+
<!-- brand image -->
148+
<div class="brand__img">
149+
<a href="/">
150+
<img src="/assets/images/navbar/brand.png" alt="reactapp brand" />
151+
</a>
39152
</div>
40-
<div class="wrapper__text">
41-
گذرواژه خود را فراموش کرده اید؟ نام کاربری یا ایمیل خود را وارد
42-
کنید. یک لینک برای ساختن رمز جدید در ایمیل خود دریافت خواهید کرد
153+
<!-- sidebar toggle in navbar as toggle -->
154+
<div class="navbar--toggle">
155+
<div class="toggle__top"></div>
156+
<div class="toggle__mid"></div>
157+
<div class="toggle__btm"></div>
158+
</div>
159+
</div>
160+
</div>
161+
</div>
162+
<!-- end navbar -->
163+
164+
<!-- main recover-password -->
165+
<main class="recover-pass">
166+
<!-- breadcrumb -->
167+
<div class="breadcrumb">
168+
<div class="breadcrumb__wrapper">
169+
<h1>بازیابی رمز عبور</h1>
170+
<nav class="breadcrumb__list">
171+
<li><a href="/">خانه</a></li>
172+
<li><a href="/pages/my-account.html">حساب من</a></li>
173+
<li>بازیابی رمز عبور</li>
174+
</nav>
175+
</div>
176+
</div>
177+
178+
<!-- main recover password -->
179+
<section class="recover-pass__main">
180+
<div class="main__wrapper">
181+
<div class="wrapper__header">
182+
<div class="wrapper__img">
183+
<img src="/assets/images/my-account/recover-password.svg" />
184+
</div>
185+
<div class="wrapper__text">
186+
گذرواژه خود را فراموش کرده اید؟ نام کاربری یا ایمیل خود را وارد
187+
کنید. یک لینک برای ساختن رمز جدید در ایمیل خود دریافت خواهید کرد
188+
</div>
43189
</div>
190+
<form class="wrapper__form" action="/pages/my-account/recover-password.html" method="post">
191+
<label class="form__label" for="form-input">کلمه کاربری یا ایمیل
192+
</label>
193+
<div class="form-input__box">
194+
<i class="fas fa-unlock-alt"></i>
195+
<input class="form__input" id="form-input" type="text" name="input" />
196+
</div>
197+
<button class="form__submit no-select" type="submit">
198+
بازیابی رمز عبور
199+
</button>
200+
</form>
44201
</div>
45-
<form class="wrapper__form" action="/pages/my-account/recover-password.html" method="post">
46-
<label class="form__label" for="form-input">کلمه کاربری یا ایمیل
47-
</label>
48-
<div class="form-input__box">
49-
<i class="fas fa-unlock-alt"></i>
50-
<input class="form__input" id="form-input" type="text" name="input" />
202+
</section>
203+
</main>
204+
<!-- end main recover-password -->
205+
206+
<!-- start footer -->
207+
<div class="footer">
208+
<div class="footer__content">
209+
<div class="footer__contact-info">
210+
<h3 class="contact-info__title">منتظرتون هستیم</h3>
211+
<div class="info-box">
212+
<i class="fas fa-phone" aria-hidden="true"></i>09109999999
213+
</div>
214+
<div class="info-box">
215+
<i class="fa fa-envelope" aria-hidden="true"></i>
216+
<a href="mailto:reactapp.ir@gmail.com">reactapp.ir@gmail.com</a>
51217
</div>
52-
<button class="form__submit no-select" type="submit">
53-
بازیابی رمز عبور
54-
</button>
55-
</form>
218+
</div>
219+
<div class="footer__links">
220+
<ul>
221+
<li><a href="/pages/blog.html">بلاگ</a></li>
222+
<li><a href="#">ویدیو کست</a></li>
223+
<li><a href="/pages/terms.html">قوانین</a></li>
224+
</ul>
225+
</div>
226+
<div class="footer__text">
227+
تمام تلاش ما در برند reactapp در کنار آموزش با کیفیت و استفاده از
228+
دانش روز، اضافه کردن چاشنی تجربه چندین ساله فعالیت در پروژه های
229+
داخلی و خارجی بوده. زمانی که شما به یادگیری اختصاص دادید برای ما
230+
اهمیت بسیار بالایی داره و به همین دلیل سعی میکنیم متحوای تولید شده،
231+
غنی، پر بار و در راستای نیاز های بازار کار باشه.
232+
</div>
233+
</div>
234+
<div class="footer__copyright">
235+
کلیه حقوق این سایت محفوظ و متعلق به reactapp.ir میباشد.
56236
</div>
57-
</section>
58-
</main>
59-
<!-- end recover-password -->
237+
</div>
238+
<!-- end footer -->
239+
</div>
240+
<!-- end body wrap -->
60241

61-
<!-- styles -->
62-
<link rel="stylesheet" href="/assets/css/styles.css" />
242+
<!-- scripts -->
243+
<script type="module" src="/assets/js/pages/my-account/recover-password.js"></script>
63244
</body>
64245

65246
</html>

0 commit comments

Comments
 (0)