Skip to content
This repository was archived by the owner on Dec 20, 2023. It is now read-only.

Commit 0f927d1

Browse files
SlddevSlddev
authored
Add files via upload
1 parent 70c6073 commit 0f927d1

1 file changed

Lines changed: 360 additions & 0 deletions

File tree

  • red-orange-theme/loginSystem/templates/loginSystem

‎red-orange-theme/loginSystem/templates/loginSystem/login.html‎

Lines changed: 360 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,360 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<style>
6+
.d-flex {
7+
display: flex;
8+
}
9+
10+
.flex-column {
11+
flex-direction: column;
12+
}
13+
14+
.justify-content-between {
15+
justify-content: space-between;
16+
}
17+
18+
.col-login {
19+
height: 100vh;
20+
display: flex;
21+
flex-direction: column;
22+
23+
}
24+
25+
.col-login-left {
26+
background: #f12711; /* fallback for old browsers */
27+
background: -webkit-linear-gradient(to right, #f5af19, #f12711); /* Chrome 10-25, Safari 5.1-6 */
28+
background: linear-gradient(to right, #f5af19, #f12711); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
29+
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#33cccc", endColorstr="#00007a", GradientType=1);
30+
justify-content: space-between;
31+
}
32+
33+
.form-group .input-group select.form-control,
34+
.form-group .input-group input.form-control,
35+
button.btn.btn-login {
36+
height: 45px;
37+
38+
}
39+
button.btn.btn-login {
40+
background-color: rgb(51, 204, 204);
41+
box-shadow: 0 0 px 0px rgba(0, 0, 0, 0), 0 1px 2px rgba(0, 0, 0, 0);
42+
transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
43+
}
44+
button.btn.btn-login:hover {
45+
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
46+
}
47+
48+
.form-group .input-group select.form-control:focus,
49+
.form-group .input-group input.form-control:focus,
50+
button.btn.btn-login {
51+
border: 1px solid rgb(51, 204, 204);
52+
}
53+
54+
.col-login-right {
55+
background: #ffffff;
56+
justify-content: center;
57+
}
58+
59+
.col-login-right .login-wrapper {
60+
display: flex;
61+
flex-direction: column;
62+
justify-content: space-around;
63+
}
64+
a.login-changelogs {
65+
border-top: 1px solid #fff;
66+
}
67+
68+
.login-changelogs .card {
69+
padding: 1em;
70+
background-color: #fff;
71+
border-radius: 8px;
72+
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
73+
transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
74+
}
75+
76+
.login-changelogs .card:hover {
77+
color: rgb(51, 204, 204);
78+
box-shadow: 0 12px 24px rgba(0, 0, 0, 0.16), 0 10px 10px rgba(0, 0, 0, 0.18);
79+
}
80+
.card-body {
81+
padding-left: 15px;
82+
}
83+
84+
.object-fit {
85+
height: 100%;
86+
width: 100%;
87+
object-fit: cover;
88+
border-radius: 6px;
89+
}
90+
91+
h4.card-learnmore {
92+
margin-top: 15px;
93+
position: relative;
94+
color: rgb(51, 204, 204);
95+
font-weight: 500;
96+
font-size: 1.2em;
97+
98+
}
99+
100+
h4.card-learnmore span {
101+
display: inline;
102+
padding-bottom: 4px;
103+
border-bottom: 1px solid rgb(51, 204, 204);
104+
}
105+
.alert.alert-danger {
106+
text-align: center;
107+
margin: 1em 2em 1em 2em;
108+
padding-top: 1em;
109+
padding-bottom: 1em;
110+
border: 1px solid red;
111+
}
112+
113+
114+
/* Loading Spinner */
115+
.spinner {
116+
margin: 0;
117+
width: 70px;
118+
height: 18px;
119+
margin: -35px 0 0 -9px;
120+
position: absolute;
121+
top: 50%;
122+
left: 50%;
123+
text-align: center
124+
}
125+
126+
.spinner>div {
127+
width: 18px;
128+
height: 18px;
129+
background-color: #333;
130+
border-radius: 100%;
131+
display: inline-block;
132+
-webkit-animation: bouncedelay 1.4s infinite ease-in-out;
133+
animation: bouncedelay 1.4s infinite ease-in-out;
134+
-webkit-animation-fill-mode: both;
135+
animation-fill-mode: both
136+
}
137+
138+
.spinner .bounce1 {
139+
-webkit-animation-delay: -.32s;
140+
animation-delay: -.32s
141+
}
142+
143+
.spinner .bounce2 {
144+
-webkit-animation-delay: -.16s;
145+
animation-delay: -.16s
146+
}
147+
148+
@-webkit-keyframes bouncedelay {
149+
150+
0%,
151+
80%,
152+
100% {
153+
-webkit-transform: scale(0.0)
154+
}
155+
156+
40% {
157+
-webkit-transform: scale(1.0)
158+
}
159+
}
160+
161+
@keyframes bouncedelay {
162+
163+
0%,
164+
80%,
165+
100% {
166+
transform: scale(0.0);
167+
-webkit-transform: scale(0.0)
168+
}
169+
170+
40% {
171+
transform: scale(1.0);
172+
-webkit-transform: scale(1.0)
173+
}
174+
}
175+
</style>
176+
<meta charset="UTF-8">
177+
<!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><![endif]-->
178+
<title> Login - CyberPanel </title>
179+
<meta name="description" content="Login to your CypberPanel account">
180+
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
181+
182+
<!-- Favicons -->
183+
{% load static %}
184+
185+
<link rel="stylesheet" type="text/css" href="{% static 'baseTemplate/assets/finalLoginPageCSS/allCss.css' %}">
186+
187+
<!-- HELPERS -->
188+
189+
<!-- ELEMENTS -->
190+
191+
<!-- ICONS -->
192+
193+
<!-- Admin theme -->
194+
195+
<!-- Components theme -->
196+
197+
<!-- JS Core -->
198+
199+
<script type="text/javascript" src="{% static 'baseTemplate/assets/js-core/jquery-core.min.js' %}"></script>
200+
201+
<script type="text/javascript">
202+
$(window).load(function() {
203+
setTimeout(function() {
204+
$('#loading').fadeOut(400, "linear");
205+
}, 300);
206+
});
207+
</script>
208+
209+
<!-- JS Ends -->
210+
211+
<style type="text/css">
212+
html,
213+
body {
214+
height: 100%;
215+
background: #ffffff;
216+
}
217+
</style>
218+
219+
</head>
220+
221+
<body>
222+
<div id="loading">
223+
<div class="spinner">
224+
<div class="bounce1"></div>
225+
<div class="bounce2"></div>
226+
<div class="bounce3"></div>
227+
</div>
228+
</div>
229+
230+
<div class>
231+
<div class="col-md-6 col-sm-12 hidden-md col-login col-login-left">
232+
<div class="row panel-body my-30" style="padding-bottom: 0px;">
233+
<div class="col-lg-6 col-md-12 panel-body">
234+
<h2 class="text-transform-upr text-white my-30 text-bold">WEB HOSTING CONTROL PANEL
235+
</br />FOR EVERYONE
236+
237+
</h2>
238+
<h4 class="text-white">Powered By OpenLiteSpeed/LiteSpeed Enterprise. Built For Speed, Security and
239+
Reliability.</h4>
240+
</div>
241+
<div class="col-lg-6 col-md-12 text-center panel-body">
242+
<img class="" src="/static/images/cyberpanel-banner-graphics.png" alt="" width="96%">
243+
</div>
244+
</div>
245+
<div class="row panel-body">
246+
<div class="row panel-body">
247+
<a class=" login-changelogs" href="https://go.cyberpanel.net/updates" target='_blank'>
248+
<div class="card mb-3" style="max-width: 540px;">
249+
<div class="row g-0">
250+
<div class="col-md-3">
251+
<img src="/static/images/new-design-list-websites-square.png" alt="..." class="object-fit">
252+
</div>
253+
<div class="col-md-8 ml-5">
254+
<div class="card-body d-flex flex-column justify-content-around">
255+
<h3 class="card-title mb-5 font-weight-bold">Change Logs</h3>
256+
<p class="card-text mt-10">Stay up to date about new releases and features.</p>
257+
<h4 class="card-learnmore">
258+
<span>
259+
Learn More
260+
<i>
261+
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" aria-hidden="true" focusable="false" data-icon="external-link-alt" role="img" viewBox="0 0 512 512">
262+
<path fill="currentColor"
263+
d="M432,320H400a16,16,0,0,0-16,16V448H64V128H208a16,16,0,0,0,16-16V80a16,16,0,0,0-16-16H48A48,48,0,0,0,0,112V464a48,48,0,0,0,48,48H400a48,48,0,0,0,48-48V336A16,16,0,0,0,432,320ZM488,0h-128c-21.37,0-32.05,25.91-17,41l35.73,35.73L135,320.37a24,24,0,0,0,0,34L157.67,377a24,24,0,0,0,34,0L435.28,133.32,471,169c15,15,41,4.5,41-17V24A24,24,0,0,0,488,0Z" />
264+
</svg>
265+
</i>
266+
</span>
267+
</h4>
268+
</div>
269+
</div>
270+
</div>
271+
</div>
272+
</a>
273+
</div>
274+
</div>
275+
</div>
276+
277+
<div ng-app="loginSystem" ng-controller="loginSystem" class="col-md-6 col-sm-12 col-login col-login-right" style="">
278+
<div class="login-wrapper">
279+
<form id="loginForm" action="/" class="col-md-8 col-md-offset-2">
280+
<h1 class="text-transform-upr text-center panel-body text-bold" style="padding-bottom: 0px; color: #33CCCC;">
281+
<img class="center-block text-center my-20" src="{% static 'images/cyber-panel-logo.svg' %}">
282+
CyberPanel
283+
<span class="opacity-80">v 2.1</span>
284+
</h1>
285+
<h4 class="text-muted text-center mb-10">Web Hosting Control Panel</h4>
286+
<div class="">
287+
<div class="mx-30">
288+
<div class="content-box-wrapper panel-body my-10 mx-30">
289+
<div class="form-group">
290+
<div class="input-group">
291+
<input ng-model="username" type="text" class="form-control" name="username" placeholder="Enter username" required style="height: 45px;">
292+
<span class="input-group-addon bg-blue">
293+
<i class="glyph-icon icon-envelope-o"></i>
294+
</span>
295+
</div>
296+
</div>
297+
<div class="form-group">
298+
<div class="input-group">
299+
<input ng-keypress="initiateLogin($event)" ng-model="password" type="password" class="form-control" id="password" placeholder="Password" required name="password" style="height: 45px;">
300+
<span class="input-group-addon bg-blue">
301+
<i class="glyph-icon icon-unlock-alt"></i>
302+
</span>
303+
</div>
304+
<img id="verifyingLogin" class="center-block" src="{% static 'images/loading.gif' %}">
305+
</div>
306+
307+
<div ng-hide="verifyCode" class="form-group">
308+
<div class="input-group">
309+
<input ng-model="twofa" type="text" class="form-control" name="twofa" placeholder="Enter code from Google Authenticator" required style="height: 45px;">
310+
<span class="input-group-addon bg-blue">
311+
<i class="glyph-icon icon-unlock-alt"></i>
312+
</span>
313+
</div>
314+
</div>
315+
316+
317+
<div class="form-group">
318+
<div class="input-group">
319+
<select ng-model="languageSelection" ng-init="languageSelection='english'" class="form-control">
320+
<option value="english">English</option>
321+
<option>Bangla</option>
322+
<option>Bosnian</option>
323+
<option>Bulgarian</option>
324+
<option>Chinese</option>
325+
<option>French</option>
326+
<option>German</option>
327+
<option>Greek</option>
328+
<option>Italian</option>
329+
<option>Indonesian</option>
330+
<option>Japanese</option>
331+
<option>Polish</option>
332+
<option>Portuguese</option>
333+
<option>Russian</option>
334+
<option>Spanish</option>
335+
<option>Turkish</option>
336+
<option>Vietnamese</option>
337+
</select>
338+
</div>
339+
</div>
340+
341+
342+
<button type="button" style="background-color: #33CCCC;" ng-click="verifyLoginCredentials()" class="btn btn-success btn-block btn-login">Sign In
343+
</button>
344+
</div>
345+
</div>
346+
</div>
347+
</form>
348+
<div id="loginFailed" class="alert alert-danger">
349+
<p>Could Not Login, Error message: {$ errorMessage $}</p>
350+
</div>
351+
</div>
352+
</div>
353+
</div>
354+
<script src="https://code.angularjs.org/1.6.5/angular.min.js"></script>
355+
<script src="https://code.angularjs.org/1.6.5/angular-route.min.js"></script>
356+
<script src="{% static 'loginSystem/login-system.js' %}"></script>
357+
358+
</body>
359+
360+
</html>

0 commit comments

Comments
 (0)