Наверх
 

Навигация
Опрос
Есть ли на этом сайте что-нибудь полезное для Вас?
Да, конечно есть
Нет
Пока еще не нашел

База уроков » Адаптирование шаблона dle 10.1 на 10.2

Адаптирование шаблона dle 10.1 на 10.2

22 мая 2014 | Комментариев: 0 | Просмотров: 1157
Предлагаемый список изменений в шаблонах между версиями 10.0 и 10.2
 
1. Откройте файл frame.css и найдите:

.progressbar {
	  overflow: hidden;
	  height: 15px;
	  margin-top: 5px;
	  background-color: #f7f7f7;
	  background-image: -moz-linear-gradient(top, #f5f5f5, #f9f9f9);
	  background-image: -ms-linear-gradient(top, #f5f5f5, #f9f9f9);
	  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f5f5f5), to(#f9f9f9));
	  background-image: -webkit-linear-gradient(top, #f5f5f5, #f9f9f9);
	  background-image: -o-linear-gradient(top, #f5f5f5, #f9f9f9);
	  background-image: linear-gradient(top, #f5f5f5, #f9f9f9);
	  background-repeat: repeat-x;
	  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f5f5', endColorstr='#f9f9f9', GradientType=0);
	  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
	  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
	  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
	  -webkit-border-radius: 4px;
	  -moz-border-radius: 4px;
	  border-radius: 4px;
	}
	
	.progressbar span {
	  color: #ffffff;
	  text-align: center;
	  text-indent: -2000em;
	  height: 15px;
	  display: block;
	  overflow: hidden;
	  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	  background-color: #dd514c;
	  background-image: -moz-linear-gradient(top, #ee5f5b, #c43c35);
	  background-image: -ms-linear-gradient(top, #ee5f5b, #c43c35);
	  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#c43c35));
	  background-image: -webkit-linear-gradient(top, #ee5f5b, #c43c35);
	  background-image: -o-linear-gradient(top, #ee5f5b, #c43c35);
	  background-image: linear-gradient(top, #ee5f5b, #c43c35);
	  background-repeat: repeat-x;
	  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ee5f5b', endColorstr='#c43c35', GradientType=0);
	}


Замените на:

.progress {
	    overflow:hidden;
	    margin-top:10px;
	    margin-bottom:10px;
	    background-color:whitesmoke;
	    height:10px;
	    -webkit-border-radius:8px;
	    -moz-border-radius:8px;
	    -ms-border-radius:8px;
	    -o-border-radius:8px;
	    border-radius:8px;
	    background:#eee;
	    -webkit-box-shadow:0 1px 0 white, 0 0px 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px 4px rgba(0, 0, 0, 0.2) inset;
	    box-shadow:0 1px 0 white, 0 0px 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px 4px rgba(0, 0, 0, 0.2) inset;
	}
	 .progress .progress-bar {
	    float:left;
	    width:0%;
	    font-size:12px;
	    line-height:20px;
	    color:white;
	    text-align:center;
	    background-color:#428bca;
	    -webkit-box-shadow:inset 0 -1px 0 rgba(0, 0, 0, 0.15);
	    box-shadow:inset 0 -1px 0 rgba(0, 0, 0, 0.15);
	    -webkit-transition:width 0.6s ease;
	    transition:width 0.6s ease;
	    -webkit-border-radius:8px;
	    -moz-border-radius:8px;
	    -ms-border-radius:8px;
	    -o-border-radius:8px;
	    border-radius:8px;
	    -webkit-box-shadow:none;
	    box-shadow:none;
	    height:8px;
	}
	.progress-bar span{
	    position:absolute;
	    width:1px;
	    height:1px;
	    margin:-1px;
	    padding:0;
	    overflow:hidden;
	    clip:rect(0 0 0 0);
	    border:0;
	}
	.progress-blue {
	    background-image:-webkit-gradient(linear, left 0%, left 100%, from(#9bcff5), to(#6db9f0));
	    background-image:-webkit-linear-gradient(top, #9bcff5, 0%, #6db9f0, 100%);
	    background-image:-moz-linear-gradient(top, #9bcff5 0%, #6db9f0 100%);
	    background-image:linear-gradient(to bottom, #9bcff5 0%, #6db9f0 100%);
	    background-repeat:repeat-x;
	    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF9BCFF5', endColorstr='#FF6DB9F0', GradientType=0);
	    border:1px solid #55aeee;
	}
 
Вот и все. Удачки


Ссылка на новость:

    html-cсылка на публикацию
    BB-cсылка на публикацию
    Прямая ссылка на публикацию

ЕЩЕ НА ЭТУ ТЕМУ:

Адаптирование шаблона dle 9.7 на 9.8

Адаптирование шаблона dle 9.7 на 9.8

Представляем список изменений в шаблонах между версиями DLE 9.7 и 9.8 которые нужно выполнить для обновления сайта под актуальную версию движка.
Адаптирование шаблона dle 9.5 на 9.6

Адаптирование шаблона dle 9.5 на 9.6

Произведем адаптирование шаблона dle с версии 9.5 на 9.6
Кулинарный шаблон Foody для DLE 10.1

Кулинарный шаблон Foody для DLE 10.1

Великолепный кулинарный шаблон для DLE и подходящие темы такие как - кулинария, рецепты, еда, здоровье, диеты.
Список изменений в шаблонах между версиями 10.0 и 10.1

Список изменений в шаблонах между версиями 10.0 и 10.1

Предлагаемый список изменений в шаблонах между версиями 10.0 и 10.1
Список изменений в шаблонах между версиями 9.7 и 9.8 для DLE

Список изменений в шаблонах между версиями 9.7 и 9.8 для DLE

Список изменений в шаблонах между версиями 9.7 и 9.8 для DLE
Адаптирование шаблона dle 9.6 на 9.7

Адаптирование шаблона dle 9.6 на 9.7

Представляем список изменений в шаблонах между версиями DLE 9.6 и 9.7 которые нужно выполнить для обновления сайта под актуальную версию движка.
Кнопки с анимацией на CSS3

Кнопки с анимацией на CSS3

Красивые кнопки с анимацией на CSS3. Всегда подойдет любому сайту
Обычное меню на CSS3 с закругленными краями

Обычное меню на CSS3 с закругленными краями

Простое CSS3 меню с закругленными краями использующее свойство ...border-radius, поэтому в IE может не отображаться.
Навигационное меню темными кнопками

Навигационное меню темными кнопками

Простое меню на CSS3/HTML с эффектом выдавливания в темных тонах.
Красивая анимация заголовка изображения

Красивая анимация заголовка изображения

Красивый эффект анимации при наведении на картинку, у которой по верх отображается ее название.
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.