Llloooggg/Jarvis
1
0
Fork 0
mirror of https://github.com/Llloooggg/Jarvis.git synced 2026-03-06 03:56:23 +03:00
Code Issues 21 Packages Projects Releases Wiki Activity

Merge pull request #1 from Llloooggg/frontend

Browse Source 
Frontend
This commit is contained in:
Sergei
2020-03-15 15:14:29 +03:00
committed by GitHub
parent c2bbcf13c0 5802d087f5
commit 88f99010cf
4 changed files with 126 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
static/css/components/header.css
View File

@@ -4,7 +4,7 @@
background: #131415; background: #131415;
height: 75px; height: 75px;
} }
.header_left, .header_right { .header_left, .header_right, .header_center {
float: left; float: left;
width: 50%; width: 50%;
} }
@@ -13,8 +13,8 @@
} }
.header_right { .header_right {
text-align: right; text-align: right;
/* margin-top: 12px; */ /* margin-top: 12px;
padding-top: 20px; padding-top: 12px; */
} }
.header_center{ .header_center{
text-align: center; text-align: center;
@@ -75,11 +75,22 @@
.nav-menu__link:hover .not_none { .nav-menu__link:hover .not_none {
display: none; display: none;
} }
.nav-menu__text { .nav-menu__text {
font-size: 12px; font-size: 12px;
color: white; color: white;
text-transform: uppercase; text-transform: uppercase;
} }
.active .nav-menu__text{
color: #f89513;
}
.active .none{
display: inline-block;
}
.active .not_none{
display: none;
}
.contacts { .contacts {
display: inline-block; display: inline-block;
} }
@@ -89,6 +100,72 @@
color: white; color: white;
display: block; display: block;
} }
.contacts__schedule {
font-size: 14px;
color: #c77814;
opacity: .7;
display: block;
padding: 27px 0;
}
/* выпадашка */
.drop {
position: relative;
}
.drop:hover .dropdown {
left: -167px;
background: #afadab;
padding-top: 0px;
border-radius: 9px;
}
.drop:hover .contacts__schedule {
color: #b9b9b9;
}
.dropdown {
position: absolute;
left: -9999px;
}
.drop-block {
z-index: 20;
border-radius: 10px;
border: 1px ;
box-shadow: 0px 0px 10px 0px rgba(23, 59, 117, 0.55); /* гардиент бордера */
position: relative;
padding: 18px 0;
background: #565454d6;
}
.triangle {
width: 25px;
height: 25px;
border-bottom: 1px ;
border-right: 1px ;
box-shadow: -7px -8px 6px -6px rgba(23, 59, 117, 0.55);
position: absolute;
transform: rotate(45deg);
left: 84%;
bottom: 92%;
background: #646261;
}
.drop-block p {
font-family: 'OpenSans';
font-weight: 300;
font-size: 14px;
color : #ffffff;
margin: 0;
text-align: center;
margin-bottom: 8px;
}
.drop-block b {
font-family: 'OpenSans';
font-weight: bold;
font-size: 14px;
color : #fff;
display: block;
margin: 0 auto;
text-align: center;
}
.contacts__schedule { .contacts__schedule {
font-size: 14px; font-size: 14px;
color: #c77814; color: #c77814;
@@ -101,6 +178,7 @@
float: left; float: left;
width: 190px; width: 190px;
margin-right: 15px; margin-right: 15px;
margin-left: 15px;
} }
.form__input-text-mod{ .form__input-text-mod{
width: 100%; width: 100%;
@@ -126,7 +204,6 @@
.header_btn { .header_btn {
padding: 10px 13px; padding: 10px 13px;
display: block;
text-align: center; text-align: center;
border-radius: 5px; border-radius: 5px;
font-size: 12px; font-size: 12px;
@@ -139,8 +216,18 @@
background: #f89513; background: #f89513;
border: 0; border: 0;
cursor: pointer; cursor: pointer;
margin: -2 auto; margin-right: 15px;
} }
.header_btn:hover { .header_btn:hover {
background: #834c05; background: #834c05;
}
/* выпадашка в регистрации */
.drop:hover .dropdown_mod {
left: -80px;
}
.triangle_mod {
left: 81%;
bottom: 88%;
} }

2
static/css/main.css
View File

@@ -1,6 +1,6 @@
@import "layout/base.css"; @import "layout/base.css";
@import "layout/fonts.css"; @import "layout/fonts.css";
@import "layout/normolize.css"; @import "layout/normalize.css";
@import "components/footer.css"; @import "components/footer.css";
@import "components/header.css"; @import "components/header.css";

21
templates/index.html
View File

@@ -19,12 +19,25 @@
<p class="logo-text">J.a.r.v.i.s </p> <p class="logo-text">J.a.r.v.i.s </p>
</a> </a>
</div> </div>
<!-- menu -->
</nav>
<div class="header_right"> <div class="header_right">
<div class="contacts"> <div class="contacts">
<a href="/registration" class="contacts__schedule">Войти</a> <div class="drop">
<a href="" class="contacts__schedule">Войти</a>
<div class="dropdown">
<div class="drop-block">
<div class="triangle"></div>
<label class="form__cell-header ">
<input type="text" class="form__input-text-mod" placeholder="Логин" >
</label>
<label class="form__cell-header">
<input type="password" class="form__input-text-mod" placeholder="Пароль">
</label>
<a href="" class="input">
<input type="button" href="/content.html" name="scriptbutton" class="header_btn" value="Войти" >
</a>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

64
templates/registration.html
View File

@@ -19,16 +19,18 @@
<p class="logo-text">J.a.r.v.i.s </p> <p class="logo-text">J.a.r.v.i.s </p>
</a> </a>
</div> </div>
<div class="header_right clearfix"> <div class="header_right">
<label class="form__cell-header "> <div class="contacts">
<input type="text" class="form__input-text-mod" placeholder="email" > <div class="drop">
</label> <a href="" class="contacts__schedule">Нужна помощь?</a>
<label class="form__cell-header"> <div class="dropdown dropdown_mod">
<input type="text" class="form__input-text-mod" placeholder="password"> <div class="drop-block drop-block_mod">
</label> <div class="triangle triangle_mod"></div>
<a href="" class="input"> <p>Обратитесь в службу поддержки по адресу:<b>jarvis@mail.ru</b> </p>
<input type="button" href="/content.html" name="scriptbutton" class="header_btn" value="Войти" > </div>
</a> </div>
</div>
</div>
</div> </div>
</div> </div>
</header> </header>
@@ -44,57 +46,23 @@
<div class="form__fields"> <div class="form__fields">
<div class="form__element"> <div class="form__element">
<div class="form__row clearfix"> <div class="form__row clearfix">
<!-- <label class="form__cell">
<div class="form__field-title">
Ваше имя
</div>
<input type="text" class="form__input-text" placeholder="Введите имя">
</label>
<label class="form__cell">
<div class="form__field-title">
Ваша фамилия
</div>
<input type="text" class="form__input-text" placeholder="Введите фамилию">
</label> -->
<label class="form__log"> <label class="form__log">
<div class="form__field-title"> <div class="form__field-title">
Введите логин Введите логин
</div> </div>
<input type="text" class="form__input-text" placeholder="Введите login" name = "UserLogin"> <input type="text" class="form__input-text" placeholder="Введите логин" name = "UserLogin">
</label> </label>
<label class="form__log">
<div class="form__field-title">
Введите email
</div>
<input type="text" class="form__input-text" placeholder="Введите email">
</label>
<label class="form__log"> <label class="form__log">
<div class="form__field-title" > <div class="form__field-title" >
Введите пароль Введите пароль
</div> </div>
<input type="text" class="form__input-text" placeholder="Введите пароль" name = "UserPassw"> <input type="password" class="form__input-text" placeholder="Введите пароль" name = "UserPassw">
</label> </label>
</div> </div>
<div class="form__btns"> <div class="form__btns">
<div class="form__controls"> <div class="form__controls">
<div class="form__controls-btns clearfix"> <div class="form__controls-btns clearfix">
<!-- <div class="form__container-left">
<p class="form__field-title">
Пол
</p>
<div class="form__controls-left">
<label class="form__radio">
<input type="radio" name="review" class="form__radio-elem" checked>
<div class="form__radio-fake"></div>
<div class="form__radio-text">Муж.</div>
</label>
<label class="form__radio">
<input type="radio" name="review" class="form__radio-elem" >
<div class="form__radio-fake"></div>
<div class="form__radio-text ">Жен.</div>
</label>
</div>
</div> -->
<div class="form__controls-right"> <div class="form__controls-right">
<button type="submit" value="Отправить" class="form__submit" name="RegButton" href="/content" >Регистрация</button> <button type="submit" value="Отправить" class="form__submit" name="RegButton" href="/content" >Регистрация</button>
</div> </div>