>
Всего Online : 1
Гости сайта : 1
Пользователей: 0

Кто Online :

Кто посетил нас сегодня :
Всего : 387
Новых за месяц: 5
Новых за неделю: 0
Новых вчера: 0
Новых сегодня: 0
Из них :
Пользователей 380
Проверенных: 6
Модераторов: 0
Админов: 1
Из них :
Парней: 318
Девушек: 69
25 Ноября 18, Воскресенье, 11:33
Обновление от : andruha061

- Обновлена цветовая схема (частично, типо новый уровень)
- Исправлены ошибки, удален лишний код в стилях
- Новая система отображения личных сообщений
- Новая система окон
- Отчищены профили от мусора, в том числе и стены
- Все записи пользователей на стене как и комментарии к ним также удалены
- Чуток изменена страница с материалами
- Убран общий чат
- Новая система загрузки обложек в профили

PS. Нет, сайт не возрождён. Просто захожу и вижу что люди здесь есть, просмотры, посещения. Захотелось вернуться немного к этому всеми, вспомнить 7UARTS.


16 Февраля 18, Пятница, 01:05
Обновление от : andruha061

- Обновлен шаблон Torrent-Games для uCoz (Подробнее конце описания материала)
- Ссылка на шаблон : клик.


06 Февраля 18, Вторник, 17:47
Обновление от : andruha061

- Исправлен баг с личными сообщениями
- Вывод сообщений в Ajax-окне


04 Февраля 18, Воскресенье, 18:35
Обновление от : andruha061

- Обновлен вид персональных страниц для пользователей, у которых не установлена обложка.


04 Февраля 18, Воскресенье, 17:00
Обновление от : andruha061

- Обновлена система вывода комментариев на странице пользователя :

Теперь на странице пользователя отображается 30 последних комментариев которые он оставил. Если нужен полный список, то рядом есть кнопка для открытия страницы с полным списком комментариев. Плюс убрал показ комментариев через IFrame.


04 Февраля 18, Воскресенье, 15:02
Обновление от : andruha061

- Обновлена частично цветовая схема дизайна.
- Обновлены иконки в меню.
- Обновлена страница с материалами :
Если к материалу прикреплено больше 7 изображений, то будет использоваться прокрутка изображений в блоке.
- Обновлены табы на странице пользователя.
- Поставил эффект для BODY при загрузке страницы (не прелоадер)
- Обновлены цвет текста и заголовков.
- На странице пользователя во вкладке комментарии теперь можно перейти по ссылке к материалу где был оставлен комментарий.
- Может что-то еще...


03 Февраля 18, Суббота, 07:38
Обновление от : andruha061

 - Частично улучшен дизайн сайта (это не точно).
 - Шапка и подвал сайта на всю ширину страницы.
 - Улучшено отображение блоков.
 - Небольшие поправки в HTML-редакторе.
 - Обновлен дизайн чата.
 - Новая система вывода обновлений в окне.
 - Частично обновлена персональная страница пользователя.
 - Обновлен вид материалов для блога.
 - Частично обновлена главная страница.
- Обновлено меню навигации.


09 Января 18, Вторник, 05:28
Обновление от : andruha061

 - Оптимизация CSS и Java.
 - Улучшение стабильности сайта. 


08 Января 18, Понедельник, 21:29
Обновление от : andruha061

- Обновлена до конца мастерская сайта.


06 Января 18, Суббота, 12:29
Обновление от : andruha061

 - Исправлены баги после обновления.
 - Пофиксил отображение комментариев на странице пользователя.


01 Января 18, Понедельник, 01:27
Обновление от : andruha061

-  Открытие сайта после огромного обновления.
 - Подробнее в группе вк : https://vk.com/7uarts


Последних 10 новых тем на форуме.

VK Clear New Design (by 7uarts) для сайта ВКонтакте

Основной форум : Темы для сайтов | Дата : 29 Января 18

Заявка на бесплатные адаптации шаблонов под uCoz

Основной форум : Помощь сайтам созданных в системе uCoz | Дата : 24 Января 18

Тема BlackHead-Full Container для 7UARTS.

Основной форум : Темы для сайтов | Дата : 24 Января 18

Что такое Stylish и что тут создавать?

Основной форум : Темы для сайтов | Дата : 24 Января 18

Описание и правила форума

Основной форум : Темы для сайтов | Дата : 24 Января 18

Склонение числительных на uCoz

Основной форум : Уроки и решения для uCoz | Дата : 23 Декабря 17

Смена стилей сайта с запоминанием на Cookie

Основной форум : Прочее / Разное | Дата : 21 Декабря 17

Архив всех комментариев для uCoz

Основной форум : Уроки и решения для uCoz | Дата : 21 Декабря 17

1K вместо 1000

Основной форум : Уроки и решения для uCoz | Дата : 21 Декабря 17

Когда заходил пользователь на сайт (как Вконтакте) для uCoz

Основной форум : Уроки и решения для uCoz | Дата : 30 Ноября 17

Последних 10 новых комментариев.

good04717 / Minimal Soon - Страница технических работ

Не работает, сделал все по инструкции и кроме карт...

andruha061 / Современный качественный шаблон для uCoz - IPS4 Focus (Redesign)

нет конечно, какая мне с этого выгода?
ты ж...

Lexa9090 / Современный качественный шаблон для uCoz - IPS4 Focus (Redesign)

А можно приобрести лишь часть кода? Например, мне ...

rubik2092 / Шаблон Libra для uCoz

Подскажите последовательность действий? как что и ...

andruha061 / Современный качественный шаблон для uCoz - IPS4 Focus (Redesign)

обновил ссылку, вернул старый укозовский домен : <...

magomedomarov9 / Современный качественный шаблон для uCoz - IPS4 Focus (Redesign)

Ого супер, форум вообще класс...

andruha061 / Developer - шаблон для блога / материалов для uCoz

уже нету) значит убрал) я в первый раз когда зашел...

Mopnex / Developer - шаблон для блога / материалов для uCoz

Я поставил подгрузку css вниз страницы, что позвол...

andruha061 / Developer - шаблон для блога / материалов для uCoz

рад что ты воспользоваться моей адаптацией) молоде...

Mopnex / Developer - шаблон для блога / материалов для uCoz

если кому интересно, что получилось у меня из шабл...

Боковое меню авторизации как на uCoz (от 7uarts)

Дата и время публикации : 21 Сентября 17 в 16:07 | Раздел : Скрипты для uCoz


Параметр Значение
Дата публик. 21 Сентября 17, Четверг, 16:07
Размер файла 23.9 Kb
Авторский
Адапт. дизайн
Обновления Не производились
Просмотрен 554
Загружен 11

Давно приглянулось боковое меню авторизации как на официальном сайте uCoz. Решил сделать себе точно такое же. Просто собрал рабочий скрипт с сайта uCoz.

Очень долго мучился с адаптивностью данного скрипта, ибо в стилях CSS очень сильно намудрили. Пришлось исправлять отступы и настраивать все по новому, но в любом случае получилось очень даже не плохо.

Сразу хочу сказать что меню не много переделал, добавил логотип, и вместо кнопки UID сделал кнопку регистрации.

Главная особенность скрипта в том, что минимальное количество файлов (упаковал все стили в один файл), легкая установка и практичность, адаптивный дизайн.


Установка :

1. Загружаем папку menulog к себе на сайт.

2. В верхнюю часть сайта (после </header> как на сайте uCoz) вставляем код :

<?if($USER_LOGGED_IN$)?><?else?>
<section class="user-side pushy2 pushy-right">
 <div class="log-form">
 <span class="close hairline menu-btn2"></span>
 <img src="/menulog/img/uLogo.png" width="128" height="128">
 <h3>Вход в учетную запись</h3>
 <p>Авторизация в системе uCoz осуществляется через учетные данные uID</p>
 <div class="uid-login">
 <a class="uid-btn" href="/register">Регистрация</a>
 </div>
 <div class="fast-reg">
 <p class="title">Войдите пожалуйста через:</p>
 <center>$LOG_FORM$</center>
 </div>
 <span class="reg-comment">Если вы хотите привязать уже существующий uID аккаунт к аккаунту социальной сети, то сначала войдите через uID, а затем выполните привязку.</span>
 </div>
 </section><?endif?>


3. В нижнюю часть сайта :

<script type="text/javascript" src="/menulog/js/sidemenu.js"></script>


4. Устанавливаем стили : 

1 Вариант (Вставить в <<Управление дизайном CSS>> ) :

section#personal-page{background:#9a6e5d;background:-moz-radial-gradient(center, ellipse cover, #9a6e5d 0%, #7487a8 100%);background:-webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #9a6e5d), color-stop(100%, #7487a8));background:-webkit-radial-gradient(center, ellipse cover, #9a6e5d 0%, #7487a8 100%);background:-o-radial-gradient(center, ellipse cover, #9a6e5d 0%, #7487a8 100%);background:-ms-radial-gradient(center, ellipse cover, #9a6e5d 0%, #7487a8 100%);background:radial-gradient(ellipse at center, #9a6e5d 0%, #7487a8 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9a6e5d', endColorstr='#7487a8', GradientType=1);}
section#personal-page #carousel-personal-page{padding-left:20px;padding-top:70px;}
section#personal-page #carousel-personal-page .viewport{height:auto;background-color:#D2D2D2;-webkit-box-shadow:0px 5px 5px 0px rgba(50, 50, 50, 0.25);-moz-box-shadow:0px 5px 5px 0px rgba(50, 50, 50, 0.25);box-shadow:0px 5px 5px 0px rgba(50, 50, 50, 0.25);}
section#personal-page #carousel-personal-page .viewport img{width:100%;height:auto;top:1px;position:relative;max-height: 39vw;}
section#personal-page #carousel-personal-page{height:100vh;overflow:hidden;}
section#personal-page .side-right #info-personal-page{padding-bottom:0;padding-top:19%;padding-right:20%;padding-left:10%;color:#ffffff;}
section#personal-page .side-right #info-personal-page p{font-size:24px;font-weight:100;margin-bottom:15px;color:#ffffff;}
section#personal-page .side-right #info-personal-page h2{font-weight:100;font-size:36px;color:#ffffff;margin-bottom:30px;}
section#personal-page .side-right #info-personal-page p.lead{font-weight:100;font-size:70px;line-height:normal;color:#ffffff;margin-bottom:20px;}
section#personal-page .side-right #info-personal-page a.button{margin:40px 0;display:block;float:none;background-color:#D54340;}
section#personal-page .side-right #info-personal-page a.button:hover{color:#ffffff;background:#de6c6a;}
section#prof-templates{padding:0;}
section#prof-templates #info-prof-templates{padding-bottom:0;color:#000000;position:relative;padding-left:4.5%;padding-top:4.5%;}
section#prof-templates #info-prof-templates .box,
section#prof-templates #info-prof-templates .box-vew-content{z-index:10;}
section#prof-templates #info-prof-templates p{font-size:24px;font-weight:100;margin-bottom:15px;color:#000000;}
section#prof-templates #info-prof-templates p.p-first{width:40%;margin-bottom:0;}
section#prof-templates #info-prof-templates p.p-second{width:30%;}
section#prof-templates #info-prof-templates h2{font-weight:100;font-size:36px;color:#000000;margin-bottom:30px;}
section#prof-templates #info-prof-templates p.lead{font-weight:100;line-height:normal;color:#000000;margin-bottom:20px;}
section#prof-templates #info-prof-templates a.button{margin:40px 0;display:block;float:none;background-color:#D49026;margin-bottom:0;}
section#prof-templates #info-prof-templates a.button:hover{color:#000000;background:#dfa64e;}
section#prof-templates #info-prof-templates #image-cards{text-align:right;position:absolute;height:100%;bottom:0;background:transparent;right:0;z-index:1;width:63.5%;}
section#prof-templates #info-prof-templates #image-cards img{width:auto;position:absolute;bottom:0;z-index:1;-webkit-transition:0.2s all ease;-moz-transition:0.2s all ease;-ms-transition:0.2s all ease;-o-transition:0.2s all ease;transition:0.2s all ease;}
section#prof-templates #info-prof-templates #image-cards img:hover{z-index:2;margin-bottom:30px;}
section#prof-templates #info-prof-templates #image-cards img.pic1{height:51vh;right:72%;}
section#prof-templates #info-prof-templates #image-cards img.pic2{height:62vh;right:52%;}
section#prof-templates #info-prof-templates #image-cards img.pic3{height:73vh;right:28%;}
section#prof-templates #info-prof-templates #image-cards img.pic4{height:83vh;right:0;}
section#uran-browser{padding:0;background:#2f2f45;background:-moz-linear-gradient(top, #2f2f45 0%, #7b7bab 99%);background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #2f2f45), color-stop(99%, #7b7bab));background:-webkit-linear-gradient(top, #2f2f45 0%, #7b7bab 99%);background:-o-linear-gradient(top, #2f2f45 0%, #7b7bab 99%);background:-ms-linear-gradient(top, #2f2f45 0%, #7b7bab 99%);background:linear-gradient(to bottom, #2f2f45 0%, #7b7bab 99%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#2f2f45', endColorstr='#7b7bab', GradientType=0);}
section#uran-browser #image-uran-browser{margin-top:70px;width:98%;margin-left:10px;}
section#uran-browser #image-uran-browser .viewport{background-color:#37354c;}
section#uran-browser #image-uran-browser .viewport.tall{height:100vh;}
section#uran-browser #image-uran-browser .viewport.short{height:auto;}
section#uran-browser #image-uran-browser .viewport img{width:100%;height:auto;}
section#uran-browser #image-uran-browser .address-bar{overflow:hidden;text-overflow:ellipsis;}
section#uran-browser .side-right #info-uran-browser{padding-bottom:0;padding-top:20%;padding-right:15%;padding-left:8%;color:#ffffff;}
section#uran-browser .side-right #info-uran-browser p{font-size:24px;font-weight:100;margin-bottom:15px;color:#ffffff;}
section#uran-browser .side-right #info-uran-browser h2{font-weight:100;font-size:36px;color:#ffffff;margin-bottom:30px;}
section#uran-browser .side-right #info-uran-browser p.lead{font-weight:100;font-size:70px !important;line-height:normal;color:#ffffff;margin-bottom:20px;}
section#uran-browser .side-right #info-uran-browser a.button{margin:40px 0;display:block;float:none;background-color:#894C94;}
section#uran-browser .side-right #info-uran-browser a.button:hover{color:#ffffff;background:#a464af;}
.footer-section{background-color:#ffffff;padding:100px 0 50px;}
.footer-section .column-logo{text-align:center;}
.footer-section .column-logo img{width:150px;height:126px;margin-bottom:55px;}
.footer-section .column-logo p{white-space:nowrap;color:#989898;font-weight:200;font-size:16px !important;}
.footer-section .column-menu{font-size:15px;}
.footer-section .column-menu ul li{margin-bottom:13px;}
.footer-section .column-menu strong{font-weight:600;}
.footer-section .column-menu a{color:#000000;}
.footer-section .column-menu .social-links a:hover, .footer-section .column-menu .social-links a:active {text-decoration: none;}
.footer-section .column-menu a:active{color:#000000;text-decoration:underline;}
.footer-section .column-menu a.special{color:#F71C1B;}
.footer-section .column-menu a.special:hover,
.footer-section .column-menu a.special:active{color:#F71C1B;text-decoration:underline;}
.footer-section .payment-links {/*position:relative;left:-340px*/margin-left:-130px;margin-top:-27px;}
.footer-section .payment-links .visa { margin-right:12px }
.footer-section .payment-links .mastercard { margin-right:5px }
.footer-section .social-links {clear:both;margin:50px 0 0;overflow: hidden;}
.footer-section .social-links a{width:28px;height:28px;display:block;float:left;margin-right:15px;text-align:center;-webkit-border-radius:28px;-moz-border-radius:28px;border-radius:28px;-webkit-transition:0.2s all ease;-moz-transition:0.2s all ease;-ms-transition:0.2s all ease;-o-transition:0.2s all ease;transition:0.2s all ease;}
.footer-section .social-links a:last-child{margin-right:0;}
.footer-section .social-links a i:before{line-height:28px;color:#ffffff;}
.footer-section .social-links .facebook{background-color:#6685B6;}
.footer-section .social-links .facebook:hover,
.footer-section .social-links .facebook:active{background-color:#89a1c6;}
.footer-section .social-links .google{background-color:#E45D4C;}
.footer-section .social-links .google:hover,
.footer-section .social-links .google:active{background-color:#eb8578;}
.footer-section .social-links .twitter{background-color:#54C0DD;}
.footer-section .social-links .twitter:hover,
.footer-section .social-links .twitter:active{background-color:#7fd0e5;}
@media (max-width:992px){.footer-section{position:static;}
    .footer-section .footer-bar .row{width:100%;}
    section#personal-page #carousel-personal-page .viewport img{max-height: 63vw;}
}
section#personal-page .side-left{height:100vh;}
section#personal-page #carousel-personal-page{bottom:0;position:absolute;width:100%;height:100vh;}
section#personal-page .viewport{min-height:0;height:100vh;}
section#prof-templates #info-prof-templates{height:100vh;}
section#uran-browser .viewport{min-height:0;width:100%;left:0;}
.pushy{-webkit-transition:0.2s all ease;-moz-transition:0.2s all ease;-ms-transition:0.2s all ease;-o-transition:0.2s all ease;transition:0.2s all ease;}
.pushy-left{transform:translate3d(-300px, 0, 0);}
.pushy-right.pushy-open{right:0;transform:none;}
.navigation .logo{z-index:99;}
.nav-button a{width:22px;height:16px;position:relative;background-color:transparent;background-image:none;position:absolute;z-index:999;left:0;cursor:pointer;top:25px;left:30px;}
.nav-button a span{display:block;width:22px;height:3px;-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px;margin-bottom:3px;background-color:#3F3F3F;}
.nav-button a:hover span{background-color:#000;}
.nav-button a .over-box{position:absolute;top:0;left:0;width:22px;height:16px;background-color:transparent;z-index:9999;}
.pushy-active .nav-button a {position: fixed;}
.nav-button a.light span{background-color:#fff !important;}
.nav-button a.dark span{background-color:#3F3F3F !important;}
.pushy-active .nav-button a{z-index:22;}
.pushy-active .nav-button a span{background-color:#fff !important;}
.pushy-active .nav-button a:hover span{background-color:#d4d4d4;}
.main-nav{top:0;width:0;height:100%;background:#000000;padding-top:80px;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;transition:all 0.3s ease;position:fixed;left:0;z-index:21;overflow:auto;}
.main-nav.pushy-open{width:300px;}
.main-nav a{display:block;color:white;padding:8px 30px;white-space:nowrap;font-size:14px;word-break:normal;}
.main-nav a:hover,
.main-nav a:focus{background-color:#1a1a1a;text-decoration:none;}
.main-nav:after{content:'';position:absolute;top:0;right:0;height:100%;width:30px;}
.main-nav .sub{position:absolute;width:100%;bottom:15px;}
.main-nav .sub .sign-in{text-transform:uppercase;}
@media (max-height:600px){.main-nav .sub{position:static;}
}
.pushy-active .site-overlay,
.pushy-active2 .site-overlay2,
.active-over{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:19;background-color:rgba(0, 0, 0, 0.5);-webkit-animation:fade 500ms;-moz-animation:fade 500ms;-o-animation:fade 500ms;animation:fade 500ms;}

.user-side{padding-top:6%;font-family:'Avenir Next', sans-serif;top:0;width:0;height:100%;background:#2B2E31;padding-top:80px;z-index:2;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;transition:all 0.3s ease;position:fixed;width:540px;max-width:94%;right:-500%;z-index:1000;overflow:auto;padding:5%;text-align:center;overflow:hidden;}
.user-side .close{position:relative;display:inline-block;top:30px;right:30px;width:34px;height:34px;overflow:hidden;position:absolute;opacity:1;}
.user-side .close:hover:before,
.user-side .close:hover:after{background:#ffffff;}
.user-side .close:before,
.user-side .close:after{content:'';position:absolute;height:1px;width:100%;top:50%;left:0;margin-top:-1px;background:#D0D0D1;}
.user-side .close:before{transform:rotate(45deg);-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);}
.user-side .close:after{transform:rotate(-45deg);-ms-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);}
.user-side .login-form{margin-bottom:45px;}
.user-side .login-form label{display:none;}
.user-side .login-form .form-group{margin-bottom:30px;}
.user-side .login-form input{-webkit-transition:0.2s all ease;-moz-transition:0.2s all ease;-ms-transition:0.2s all ease;-o-transition:0.2s all ease;transition:0.2s all ease;height:72px;background-color:#8C908B;-webkit-border-radius:30px;-moz-border-radius:30px;border-radius:30px;border:none;color:#ffffff;padding-left:35px;line-height:72px;font-size:25px;font-weight:200;}
.user-side .login-form input:focus{background-color:#999c98;}
.user-side .login-form input::-webkit-input-placeholder{color:#B6B7B6;}
.user-side .login-form input:-moz-placeholder{color:#B6B7B6;}
.user-side .login-form input::-moz-placeholder{color:#B6B7B6;}
.user-side .login-form input:-ms-input-placeholder{color:#B6B7B6;}
.user-side .login-form button{-webkit-transition:0.2s all ease;-moz-transition:0.2s all ease;-ms-transition:0.2s all ease;-o-transition:0.2s all ease;transition:0.2s all ease;background-color:#6CAF24;height:75px;display:block;font-size:25px;font-weight:200;color:#ffffff;width:100%;text-align:center;border:none;-webkit-border-radius:30px;-moz-border-radius:30px;border-radius:30px;}
.user-side .login-form button:hover{background-color:#79c428;}
.user-side .uid-login p{color:#BBBBBC;margin-bottom:35px;font-size:20px !important;}
.user-side .uid-login .uid-btn{-webkit-transition:0.2s all ease;-moz-transition:0.2s all ease;-ms-transition:0.2s all ease;-o-transition:0.2s all ease;transition:0.2s all ease;-webkit-border-radius:72px;-moz-border-radius:72px;border-radius:72px;width:100%;display:block;background-color:#F2F2F2;font-size:25px;color:#8A898B;height:72px;padding-left:60px;line-height:72px;position:relative;max-width:350px;margin:0 auto;}
.user-side .uid-login .uid-btn:hover{color:#575658;}
.user-side .uid-login .uid-btn:hover:before{background-color:#519dfb;}
.user-side .uid-login .uid-btn:before{-webkit-transition:0.2s all ease;-moz-transition:0.2s all ease;-ms-transition:0.2s all ease;-o-transition:0.2s all ease;transition:0.2s all ease;-webkit-border-radius:72px;-moz-border-radius:72px;border-radius:72px;height:72px;width:72px;display:inline-block;content:'';background:url('../images/u-logo.svg') no-repeat center #388ffa;background-size:35px 35px;position:absolute;top:0;left:-1px;}

@media (max-width:1600px){a.button{width:230px;}
    section#choice #choice-for-shop a.button{width:240px;font-size:18px !important;}
    section#for-business .side-info{width:35vw;}
    section#for-me p.lead img{height:90px;}
    section#for-me .top-part{padding-top:3%;}
    section#my-sites #image-my-sites img{bottom:-29vh;top:inherit;}
}
@media (max-width:1250px){section#choice a.button{width:230px;}
    section#for-me p.info{padding:0px 28%;}
    section#my-sites .side-info{padding-right:5%;}
    section#prof-templates #image-cards img.pic1{height:41vh !important;right:62% !important;}
    section#prof-templates #image-cards img.pic2{height:52vh !important;right:42% !important;}
    section#prof-templates #image-cards img.pic3{height:63vh !important;right:18% !important;}
    section#prof-templates #image-cards img.pic4{height:73vh !important;right:-20% !important;}
    .footer-section .social-links { margin-top:80px }
}
@media (max-width:1350px){section#prof-templates #info-prof-templates p.p-first{width:32%;}
    section#prof-templates #info-prof-templates p.p-second{width:24%;}
}
@media (max-width:992px){section#choice header.main-header{margin-bottom:150px !important;}
    section#choice h2{padding-bottom:30px !important;}
    section#choice #choice-for-me{margin-bottom:20px;}
    section#choice #choice-for-business{margin-bottom:35px !important;}
    section#choice a.button{width:20%;border-width:2px;font-size:18px !important;}
    section#choice .or{position:static !important;line-height:normal !important;height:auto !important;margin-bottom:20px !important;border:none;}
    section#choice .or span{position:static !important;}
    section#choice .or span:after{display:none !important;}
    section#choice #choice-for-shop{border:none;}
    section#choice #choice-for-shop h2{padding-bottom:0 !important;}
    section#choice #choice-for-shop .button-wrap{width:auto;}
    section#choice #choice-for-shop a.button{width:100%;}
    section#choice .to-next-section{display:none;}
    section#for-me .bottom-part{position:relative !important;height:auto !important;bottom:0 !important;}
    section#for-me .bottom-part .slider-constructor{height:auto;}
    section#for-me .bottom-part .slider-constructor.side p{padding:0 !important;}
    section#for-me .bottom-part #slider-pad{width:80% !important;}
    section#for-me .bottom-part #slider-pad.animated.fadeOutDown{display:block;}
    section#for-me .bottom-part #slider-pad .switcher{display:none;}
    section#for-me p.lead img{min-width:0;min-height:0;width:300px;height:auto;}
    section#for-me p.info{padding:0px 22%;}
    section#for-business .side-right{padding-top:0;}
    section#for-business .side-right #business-info{padding-top:0;padding-bottom:30px;padding-left:10%;padding-right:10%;}
    section#for-business .side-right #business-info h2{margin-top:0;}
    section#for-business .side-info{width:auto;}
    section#web-shops .side-left #info-web-shops{padding-top:30px;padding-left:10%;padding-right:10%;margin-bottom:30px;}
    section#web-shops .side-left #info-web-shops a.button{margin-bottom:20px;}
/*
    section#web-shops .side-right{height:auto !important;position:static !important;}
    section#web-shops .side-right #slider-web-shops-box{position:static;z-index:1;}
    section#web-shops .side-right #slider-web-shops-box{position:relative;height:auto;}
    section#web-shops .side-right #slider-web-shops-box .viewport{position:absolute;transform:inherit;top:0;}
    section#web-shops .side-right #slider-web-shops-box .cover{position:static;transform:inherit;}
*/
    section#my-sites .side-left #info-my-sites{padding:30px;padding-left:10%;padding-right:10%;}
    section#my-sites #image-my-sites img{position:static;margin:0 auto;display:block;width:60%;margin-bottom:60px;}
    section#my-sites .side-right{height:auto !important;}
    section#personal-page .side-left{height:auto;}
    section#personal-page .side-left #carousel-personal-page{position:static;padding-left:0;width:90%;margin:0 auto;height:auto;}
    section#personal-page .side-right #info-personal-page{padding-bottom:30px;padding-top:30px;padding-right:10%;padding-left:10%;}
    section#prof-templates #info-prof-templates{padding-top:60px;padding-left:10%;padding-right:10%;position:relative;height:auto;}
    section#prof-templates #info-prof-templates #image-cards{margin-top:30px;width:100%;clear:both;position:relative;height:auto;}
    section#prof-templates #info-prof-templates #image-cards img{top:0;z-index:10;}
    section#prof-templates #info-prof-templates #image-cards img.pic1{top:150px !important;right:50% !important;}
    section#prof-templates #info-prof-templates #image-cards img.pic2{top:100px !important;right:25% !important;}
    section#prof-templates #info-prof-templates #image-cards img.pic3{top:50px !important;right:0% !important;}
    section#prof-templates #info-prof-templates #image-cards img.pic4{top:0px !important;right:-25% !important;}
    section#prof-templates #info-prof-templates #image-cards img:hover{z-index:10;}
    section#uran-browser .side-left{padding-top:80px;}
    section#uran-browser .side-left #image-uran-browser{margin-top:0;width:90%;margin-left:10px;margin:0 auto;position:static;}
    section#uran-browser .side-left #image-uran-browser .viewport{height:auto;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;}
    section#uran-browser .side-right #info-uran-browser{padding-top:30px;padding-left:10%;padding-right:10%;margin-bottom:60px;}
    .footer-section .column-logo{margin-bottom:30px;}
    .footer-section .column-logo img{margin-bottom:15px;}

}
@media (max-width:991px){
    .footer-section{padding-top:60px;padding-left:10%;padding-right:10%;padding-bottom:30px;}
    .footer-section .column-menu ul{display:block;margin:0 auto;width:200px;margin-bottom:30px;}
    .footer-section .column-menu ul li{white-space:nowrap;}
    .footer-section .social-links{margin:30px 0;text-align:center;}
    .footer-section .social-links a{float:none;display:inline-block;}
    .footer-section .payment-links { left:0!important; text-align:center; position:inherit; padding-top:0;margin:0;}
}
@media (max-width:768px){section#choice #choice-for-business{margin-bottom:30px !important;}
    section#choice .or{font-size:25px !important;}
    section#choice .to-next-section a{display:none;}
    section#choice #choice-for-shop{position:static !important;border-bottom:0 !important;}
    section#choice #choice-for-shop .box{position:static !important;}
    section#for-me #slider-pad{padding:30px;min-height:0;}
    section#for-me #slider-pad .owl-carousel#slider-for-me .item .image{min-height:400px !important;}
    section#for-me #slider-pad .owl-controls .owl-buttons .owl-prev{left:-65px;}
    section#for-me #slider-pad .owl-controls .owl-buttons .owl-next{right:-65px;}
    section#for-me p.info{padding:0px 14%;}
    #for-business #business-slider .owl-controls{display:none !important;}
    #web-shops #slider-web-shops-box .owl-controls{display:none !important;}
    section#prof-templates #info-prof-templates #image-cards img{width:100%;height:auto !important;}
}
@media (max-width:468px){section#personal-page #carousel-personal-page,
    section#uran-browser .side-left{margin-top:50px !important;padding-top:0 !important;}
    section#prof-templates #info-prof-templates,
    section#for-business .side-left{margin-top:30px !important;padding-top:0 !important;}
    #fp-nav{display:none !important;}
    section#choice h2,
    section#choice .or,
    section#choice #choice-for-shop h2{font-size:25px !important;}
    section#choice #choice-for-shop h2{white-space:normal;}
    section#for-me .box{padding:0;}
    section#for-me #slider-pad{padding:25px;min-height:0;}
    section#for-me #slider-pad .owl-carousel#slider-for-me .item .image{min-height:250px !important;}
    section#for-me #slider-pad .owl-controls{display:none !important;}
    section#personal-page #slider-personal-page .owl-buttons{display:none !important;}
    section#my-sites,
    section#for-business,
    section#personal-page{height:auto !important;}
    section#prof-templates p.lead{font-size:35px !important;}

}
@media (min-width:1600px){.owl-carousel .owl-controls .owl-buttons .owl-prev span{border-top-width:27px !important;border-bottom-width:27px !important;border-right-width:27px !important;}
    .owl-carousel .owl-controls .owl-buttons .owl-next span{border-top-width:27px !important;border-bottom-width:27px !important;border-left-width:27px !important;}
    section#choice h2{font-size:66px !important;}
    section#choice a.button{font-size:27px !important;}
    section#choice #choice-for-shop h2{font-size:45px !important;}
    section#choice #choice-for-shop .button{max-width:285px;font-size:22px !important;}
    section#for-me p.lead{letter-spacing:10px;}
    section#for-me .top-part{padding-top:10px;}
    section#for-me #slider-pad{width:87%;max-width:1135px;}
    section#for-me .slider-constructor.side p{padding-top:40%;}
    section#for-me .slider-constructor.side p strong{font-size:85px !important;}
    section#for-me .slider-constructor.side.leftside p{padding-left:50%;}
    section#for-me .slider-constructor.side.rightside p{padding-right:50%;}
}
@media (min-width:1790px){section#for-business .side-info{width:600px;}
}
@media (max-height:750px){section#for-me .bottom-part{bottom:-70px !important;}
    section#for-business .owl-item img{height:87vh;width:auto;margin:0 auto;}
    section#for-business .owl-controls .owl-buttons div.owl-prev{left:50px !important;}
    section#for-business .owl-controls .owl-buttons div.owl-next{right:50px !important;}
}
@media (max-height:700px) and (max-width:1180px){section#for-business .owl-item img{height:auto;width:100%;}
}
@media (max-height:820px){section#for-me{}
}
@media (max-height:820px) and (max-height:650px){section#for-me .box p,
    section#for-me .box-view-content{font-size:24px !important;}
    section#for-me .box{margin-bottom:20px;}
}
@media (max-height:820px) and (max-height:610px){section#for-me .box-view-content{display:none;}
}
@media (max-height:820px) and (max-height:480px){section#for-me .box p.info{display:none;}
    section#for-me .bottom-part{bottom:0;}
}
@media (max-height:860px){section#for-me .top-part{padding-top:0 !important;}
    section#for-me .bottom-part{bottom:-50px;}
}
@media (max-height:780px){section#choice header.main-header{margin-bottom:70px;}
    section#choice #choice-for-shop{top:0;}
    section#choice .to-next-section a{top:10px;}
}
@media (max-height:780px) and (min-width:1170px){section#choice header.main-header{margin-bottom:20px;}
}
@media (max-height:780px) and (min-width:1366px){section#choice h2{font-size:43px !important;}
}
@media (max-height:780px) and (min-width:1600px){section#choice h2,
    section#choice #choice-for-shop h2{font-size:40px !important;}
}
@media (max-height:768px){section#my-sites #image-my-sites img{bottom:-14vh;}
}
@media (max-height:568px){.user-side{padding:4% 5%;padding-top:6%;width:450px;overflow:auto;}
    .user-side .login-form input,
    .user-side .login-form button,
    .user-side .uid-login .uid-btn{font-size:18px !important;}
    .user-side .fast-reg p.title,
    .user-side .fast-reg .reg-list .icon i{font-size:16px !important;}
    .user-side .uid-login p{font-size:16px !important;}
    .user-side .login-form{margin-bottom:30px;}
    .user-side .login-form .form-group{margin-bottom:20px;}
    .user-side .login-form input{height:48px;line-height:48px;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px;}
    .user-side .login-form button{height:48px;width:100%;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px;}
    .user-side .fast-reg{margin-bottom:20px;}
    .user-side .fast-reg p.title{margin-bottom:20px;}
    .user-side .uid-login p{margin-bottom:20px;}
}
@media (min-height:568px){.user-side{padding:4% 5%;padding-top:6%;width:450px;}
    .user-side .login-form input,
    .user-side .login-form button,
    .user-side .uid-login .uid-btn{font-size:18px !important;}
    .user-side .fast-reg p.title,
    .user-side .fast-reg .reg-list .icon i{font-size:16px !important;}
    .user-side .uid-login p{font-size:16px !important;}
    .user-side .login-form{margin-bottom:30px;}
    .user-side .login-form .form-group{margin-bottom:20px;}
    .user-side .login-form input{height:48px;line-height:48px;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px;}
    .user-side .login-form button{height:48px;width:100%;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px;}
    .user-side .fast-reg{margin-bottom:20px;}
    .user-side .fast-reg p.title{margin-bottom:20px;}
    .user-side .uid-login p{margin-bottom:20px;}
}
@media (min-height:640px){.user-side{width:450px;padding:4% 5%;padding-top:6%;}
    .user-side .fast-reg{margin-bottom:100px;margin-bottom:10vh;}
}
@media (min-height:740px){.user-side{width:540px;max-width:94%;padding:5%;padding-top:6%;}
    .user-side .login-form input,
    .user-side .login-form button,
    .user-side .uid-login .uid-btn{font-size:20px !important;}
    .user-side .fast-reg p.title,
    .user-side .fast-reg .reg-list .icon i{font-size:25px;}
    .user-side .uid-login p{font-size:25px !important;}
    .user-side .login-form{margin-bottom:45px;}
    .user-side .login-form .form-group{margin-bottom:30px;}
    .user-side .login-form input{height:72px;padding-left:35px;line-height:72px;-webkit-border-radius:30px;-moz-border-radius:30px;border-radius:30px;}
    .user-side .login-form button{height:75px;width:100%;-webkit-border-radius:30px;-moz-border-radius:30px;border-radius:30px;}
    .user-side .fast-reg{margin-bottom:10vh;}
    .user-side .fast-reg p.title{margin-bottom:30px;}
    .user-side .fast-reg .reg-list a{width:36px;height:36px;margin-right:20px;margin-bottom:20px;-webkit-border-radius:36px;-moz-border-radius:36px;border-radius:36px;}
    .user-side .fast-reg .reg-list a i:before{line-height:36px;}
    .user-side .fast-reg .reg-list a.yandex i{line-height:40px;}
    .user-side .fast-reg .reg-list .icon i{height:36px;line-height:36px;width:36px;}
    .user-side .uid-login p{margin-bottom:35px;}
    .user-side .uid-login .uid-btn{-webkit-transition:0.2s all ease;-moz-transition:0.2s all ease;-ms-transition:0.2s all ease;-o-transition:0.2s all ease;transition:0.2s all ease;width:100%;-webkit-border-radius:72px;-moz-border-radius:72px;border-radius:72px;height:72px;padding-left:60px;line-height:72px;}
    .user-side .uid-login .uid-btn:before{height:72px;width:72px;background-size:35px 35px;top:0;left:-1px;}
}
@media (max-height:800px){.user-side .fast-reg{margin-bottom:20px;}
    .user-side .uid-login .uid-btn{height:55px;padding-left:55px;line-height:55px;max-width:300px;}
    .user-side .uid-login .uid-btn:before{height:55px;width:55px;content:'';background-size:25px 25px;}
}
@media (max-width:550px){.user-side{width:94%;padding:30px;}
    .user-side .login-form button,
    .user-side .uid-login .uid-btn{font-size:20px !important;}
    .user-side .fast-reg p.title,
    .user-side .fast-reg .reg-list .icon i{font-size:18px !important;}
    .user-side .uid-login p{font-size:18px !important;}
    .user-side .uid-login .uid-btn{font-size:16px !important;white-space:nowrap;}
    .user-side .reg-list a{margin-right:8px !important;margin-bottom:8px !important;}
    #regform .info-page-wrap,#regform .popup-regform{padding: 10px 15px 20px}
    #regform #subj-fld, #regform #text-fld, #regform #subj-group .SumoSelect > .CaptionCont {width: 100%!important}
    #reCaptcha {transform: scale(0.9);float: none!important}
    #regform .popup-regform.create-site .check-agree{margin: 0;}
}
@media (max-width:825px){
    .user-side{padding:12px !important;}
    #regform #text-fld, #regform #subj-fld,#regform #name-fld, #regform #email-fld{width: 100%!important}
    #addr{width:calc(100% - 130px)}
    .form-group #fTerms-label{width:100%;}
}
@media (max-width:1200px){.user-side{padding-top:72px !important;}
}

section#choice{background:#fafafc !important;text-align:center;}
header.main-header{margin-bottom:0;}
header.main-header .login-logout a{display:block;position:absolute;height:32px;top:27px;right:36px;font-size:15pt;line-height:1em;color:#478af9;}
header.main-header .login-logout a:hover{color:#003997;}
.ucoz-logo{display:block;position:absolute;top:12px;left:18px;text-indent:-9999px;overflow:hidden;width:48px;height:48px;background:url('../img/logo-ucoz.svg') no-repeat;background-size:contain;text-align:left;z-index:9999;}
/*.top-links{margin:25px 100px 0 100px;text-align:center;}*/
.top-links li{display:inline-block;padding:0 22px;position:relative;    padding-bottom: 30px;}
.top-links li a{color:#999999;font-size:13pt;line-height: 13pt;}
.top-links li a:hover{color:#333;}
h2.slogan{color:#000;margin-top:15vh;margin-bottom:7vh;font-family:'Avenir Next', sans-serif;}
.content-section{width:100%;max-width:1200px;margin:0 auto;}
#block-for-me,
#block-for-business,
#block-for-shop{width:27%;display:inline-block;margin:0 3%;height:230px;position:relative;padding-top:72px;}
#block-for-me h3,
#block-for-business h3,
#block-for-shop h3{margin:0 0 18px 0;padding:0;color:#2c2e32;font-size:20pt;}
#block-for-me h3:before{content:'';display:block;width:50px;height:50px;position:absolute;top:0;left:50%;margin-left:-24px;background:url('../img/i_forme.svg') no-repeat;}
#block-for-me p,
#block-for-business p,
#block-for-shop p{color:#bbbbbb;font-size:13pt !important;}
#block-for-business h3:before{content:'';display:block;width:48px;height:48px;position:absolute;top:0;left:50%;margin-left:-24px;background:url('../img/i_forbiss.svg') no-repeat;}
#block-for-shop h3:before{content:'';display:block;width:60px;height:48px;position:absolute;top:0;left:50%;margin-left:-30px;margin-top:4px; background:url('../img/shop_ico_v1.svg') no-repeat;}
#block-for-me a{font-size:17px;display:inline-block;background:#5190f9;color:#fff;border-radius:5px;line-height:44px;padding:0 21px;margin-bottom:17px;}
#block-for-me a:hover{background:#0060ff;}
#block-for-business a{font-size:17px;display:inline-block;background:#04c67d;color:#fff;border-radius:5px;line-height:44px;padding:0 21px;margin-bottom:17px;}
#block-for-business a:hover{background:#009f63;}
#block-for-shop a{font-size:17px;display:inline-block;background:#9F4974;color:#fff;border-radius:5px;line-height:44px;padding:0 21px;margin-bottom:17px;}
#block-for-shop a:hover{background:#862354;}
section#choice .to-next-section{bottom:13px;left:50%;margin-left:-150px;width:300px;}
section#choice .to-next-section a{display:block;margin:0 auto;position:relative;width:36px;height:36px;right:0;top:0;text-align:left;text-indent:-9999px;overflow:hidden;border:2px solid #a4a6aa;border-radius:18px;background:url('../img/i_downarrow.png') center center no-repeat;}
section#choice .to-next-section a:hover{border:2px solid #333;}
section#choice .to-next-section a:after{display:none;}
.nav-button a{top:27px!important;left:91px!important;}
.nav-button a.light span{background-color:#000;}
.user-side{padding:5% 50px;}
.log-form p a{color:#4584eb;text-decoration:underline;}
.log-form p a:hover{text-decoration:none;}
.log-form .fast-reg{margin-bottom:5vh;}
.user-side .fast-reg .reg-list{width:168px;}
.fast-reg .reg-list a{margin:0 8px 20px!important;}
.log-form h3{color:#f6f6f6;font-size:19pt;margin-bottom:50px;}
.log-form p{color:#fff;font-size:12pt !important;}
.log-form .fast-reg p.title{font-size:13pt !important;}
.log-form span.reg-comment{color:#adaeaf;font-size:10pt;text-align:left;display:block;}
.log-form span.reg-comment:before{content:'*';color:#488bfa;margin-right:4px;}
.fast-reg .reg-list a.ok{background:#f48420;}
.fast-reg .reg-list a.ok:hover{background:#fa943a;}
.fast-reg .reg-list .icon .ok i:before{content:'\e609';}
.log-form .uid-login .uid-btn:before{display:none;}
.log-form .uid-login .uid-btn{margin:5vh auto;border:3px solid #4072c5;background:transparent;padding-left:0px;color:#fff;height:61px;line-height:55px;width:255px;font-weight:500;border-radius:72px;display:block;font-size:16pt;}
.anchorLink + span{visibility:hidden;display:block;text-align:center;margin:7px 0 0 0;color:#b9b9bb;font-size:11pt;width:300px;position:absolute;top:20px;left:50%;opacity:0;margin-left:-150px;-webkit-transition:opacity 0.6s ease;-moz-transition:opacity 0.6s ease;-o-transition:opacity 0.6s ease;transition:opacity 0.6s ease;}
.anchorLink:hover + span{visibility:visible;opacity:1;}
#fp-nav ul li a, .fp-slidesNav ul li a{overflow:visible;}
#fp-nav ul li .fp-tooltip{position:absolute;top:-2px;color:#fff;font-size:14px;font-family:arial, helvetica, sans-serif;white-space:nowrap;max-width:220px;overflow:visible;display:none;opacity:1;width:auto;}
#fp-nav ul li a:hover .fp-tooltip,
#fp-nav.fp-show-active a.active + .fp-tooltip{-webkit-transition:opacity 0.2s ease-in;transition:opacity 0.2s ease-in;width:auto;opacity:1;display:block;}


@media print {
    html, body{
        background-color:#FFFFFF!important;
        font-family:sans-serif;
        color:#000000!important;
        height:auto!important;
        overflow:none!important;
    }
    section#regform,
    section#regform > .popup-regform.info-page-wrap{
        background-color:#FFFFFF!important;
        padding:0!important;
        font-size:14px;
        color:#000000!important;
        width:98%!important;
        height:auto!important;
        overflow:none!important;
        margin:0 auto!important;
    }
    section#regform > .navigation{display:none!important; }
    section#regform > .main-header{display:none!important; }
    section#regform > .user-side{display:none!important; }
    section#regform > .popup-regform.info-page-wrap > table{display:inline-block!important; }
    h1{font-size:29px!important; text-align:center; }
    h2{font-size:26px!important; }
    h3{font-size:23px!important; }
    h4{font-size:20px!important; }
    h5{font-size:17px!important; }
    h6{font-size:14px!important; }
    h1, h2, h3, h4, h5, h6{
        padding:0!important;
        margin:0!important;
        font-weight:bold!important;
        line-height:1.4!important;
        color:#000000!important;
    }
    p, li{font:14px/1.2 sans-serif!important; }
    ul > li{list-style-type:disc!important; }
    body > a[onclick*="new _uWnd"],
    body > a[href*="liveinternet"]{display:none!important; }
}


2 Вариант (В верхнюю часть сайта) :

<link href="/menulog/css/style.css" type="text/css" rel="stylesheet">


5. Устанавливаем кнопку вызова :

<?if($USER_LOGGED_IN$)?><a href="$LOGOUT_LINK$">Выход</a><?else?><a class="menu-btn2" href="javascript://">Вход</a><?endif?>

 

Можете использовать другую кнопку, просто добавьте в CLASS : menu-btn2

На этом установка закончена!

Оставленные комментарии :

Анастасия ЧекановаДобавлено 07 Октября 17 в 18:55
спасибо за менюшку! у меня не получалось долго найти что-то подобное, ты же знаешь какой я в этом мозг ахах) слава богу тут все просто

andruha061Добавлено 07 Октября 17 в 19:04
Не за что)


Оставить комментарий :


Требуется войти в свой аккаунт.

Для того чтобы оставить комментарий вам не обходимо войти в свой аккаунт или зарегистрироваться.

Вход Регистрация

Смотрите также :

Libra - HTML шаблон для блога

Libra - это HTML-шаблон личного блога, использует наиболее популярные тенденции в дизайне как HTML5, CSS3 и jQuery. Шаблон имеет три стиля и макета...


Материал
По возможности мы всех призываем указывать источник материала если вы нашли у нас что-то дейстительно интересное и новое для себя.

Понравился материал? Поделись с ним в социальных сетях !


Загрузить материал (23.9 Kb)
Материал пренадлежит данному сайту и ссылка на источник обязательна.
Ссылки

Используйте быстрые ссылки для вставки в сообщениях форума.

Ccылка
BB-Code
HTML-код