mirror of
https://github.com/Llloooggg/Jarvis.git
synced 2026-03-06 03:56:23 +03:00
Добавил выпадающее меню, исправил поля ввода
This commit is contained in:
Pro100ser
@@ -4,7 +4,7 @@
|
||||
background: #131415;
|
||||
height: 75px;
|
||||
}
|
||||
.header_left, .header_right {
|
||||
.header_left, .header_right, .header_center {
|
||||
float: left;
|
||||
width: 50%;
|
||||
}
|
||||
@@ -13,8 +13,8 @@
|
||||
}
|
||||
.header_right {
|
||||
text-align: right;
|
||||
/* margin-top: 12px; */
|
||||
padding-top: 20px;
|
||||
/* margin-top: 12px;
|
||||
padding-top: 12px; */
|
||||
}
|
||||
.header_center{
|
||||
text-align: center;
|
||||
@@ -75,11 +75,22 @@
|
||||
.nav-menu__link:hover .not_none {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
.nav-menu__text {
|
||||
font-size: 12px;
|
||||
color: white;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.active .nav-menu__text{
|
||||
color: #f89513;
|
||||
}
|
||||
.active .none{
|
||||
display: inline-block;
|
||||
}
|
||||
.active .not_none{
|
||||
display: none;
|
||||
}
|
||||
.contacts {
|
||||
display: inline-block;
|
||||
}
|
||||
@@ -89,6 +100,72 @@
|
||||
color: white;
|
||||
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 {
|
||||
font-size: 14px;
|
||||
color: #c77814;
|
||||
@@ -101,6 +178,7 @@
|
||||
float: left;
|
||||
width: 190px;
|
||||
margin-right: 15px;
|
||||
margin-left: 15px;
|
||||
}
|
||||
.form__input-text-mod{
|
||||
width: 100%;
|
||||
@@ -126,7 +204,6 @@
|
||||
|
||||
.header_btn {
|
||||
padding: 10px 13px;
|
||||
display: block;
|
||||
text-align: center;
|
||||
border-radius: 5px;
|
||||
font-size: 12px;
|
||||
@@ -139,8 +216,18 @@
|
||||
background: #f89513;
|
||||
border: 0;
|
||||
cursor: pointer;
|
||||
margin: -2 auto;
|
||||
margin-right: 15px;
|
||||
|
||||
}
|
||||
.header_btn:hover {
|
||||
background: #834c05;
|
||||
}
|
||||
/* выпадашка в регистрации */
|
||||
.drop:hover .dropdown_mod {
|
||||
left: -80px;
|
||||
}
|
||||
|
||||
.triangle_mod {
|
||||
left: 81%;
|
||||
bottom: 88%;
|
||||
}
|
||||
@@ -19,12 +19,25 @@
|
||||
<p class="logo-text">J.a.r.v.i.s </p>
|
||||
</a>
|
||||
</div>
|
||||
<!-- menu -->
|
||||
|
||||
</nav>
|
||||
<div class="header_right">
|
||||
<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>
|
||||
|
||||
@@ -19,16 +19,18 @@
|
||||
<p class="logo-text">J.a.r.v.i.s </p>
|
||||
</a>
|
||||
</div>
|
||||
<div class="header_right clearfix">
|
||||
<label class="form__cell-header ">
|
||||
<input type="text" class="form__input-text-mod" placeholder="email" >
|
||||
</label>
|
||||
<label class="form__cell-header">
|
||||
<input type="text" class="form__input-text-mod" placeholder="password">
|
||||
</label>
|
||||
<a href="" class="input">
|
||||
<input type="button" href="/content.html" name="scriptbutton" class="header_btn" value="Войти" >
|
||||
</a>
|
||||
<div class="header_right">
|
||||
<div class="contacts">
|
||||
<div class="drop">
|
||||
<a href="" class="contacts__schedule">Нужна помощь?</a>
|
||||
<div class="dropdown dropdown_mod">
|
||||
<div class="drop-block drop-block_mod">
|
||||
<div class="triangle triangle_mod"></div>
|
||||
<p>Обратитесь в службу поддержки по адресу:<b>jarvis@mail.ru</b> </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
@@ -44,57 +46,23 @@
|
||||
<div class="form__fields">
|
||||
<div class="form__element">
|
||||
<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">
|
||||
<div class="form__field-title">
|
||||
Введите логин
|
||||
</div>
|
||||
<input type="text" class="form__input-text" placeholder="Введите login" name = "UserLogin">
|
||||
</label>
|
||||
<label class="form__log">
|
||||
<div class="form__field-title">
|
||||
Введите email
|
||||
</div>
|
||||
<input type="text" class="form__input-text" placeholder="Введите email">
|
||||
</label>
|
||||
<input type="text" class="form__input-text" placeholder="Введите логин" name = "UserLogin">
|
||||
</label>
|
||||
<label class="form__log">
|
||||
<div class="form__field-title" >
|
||||
Введите пароль
|
||||
</div>
|
||||
<input type="text" class="form__input-text" placeholder="Введите пароль" name = "UserPass">
|
||||
<input type="password" class="form__input-text" placeholder="Введите пароль" name = "UserPass">
|
||||
</label>
|
||||
</div>
|
||||
<div class="form__btns">
|
||||
<div class="form__controls">
|
||||
<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">
|
||||
<button type="submit" value="Отправить" class="form__submit" name="RegButton" href="/content" >Регистрация</button>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user