Полезная информация

Общайтесь со знакомыми и друзьями в нашем сообществе в Facebook.

№120-03-2014 12:21:00

Пандёнок
Участник
 
Группа: Extensions
Зарегистрирован: 04-11-2008
Сообщений: 5543
UA: Chrome 33.0

Night — стиль для ночи

Изначальная идея стиля — «Night.css выключает в браузере свет». Я немного изменил стиль, чтобы использовать его ночью, когда свет выключен в комнате. В моём варианте чуть меньше прозрачность картинок, на которые не наведена мышь (строка html input[type=image] {opacity:.6} , цифру можно менять от 0 (полная прозрачность), до 1 (полная непрозрачность), здесь .6 - 0.6),  темнее фон (что удобно для ночи, строка     background:#222 !important; ) и изменён цвет посещённых ссылок с серого на более красный (чтобы были виднее, строка     color:#625f66 !important )

Оригинальный стиль от Никиты Васильева находится на сайтах
http://usercss.ru/styles/night/
http://usercss.com/styles/night/

Выделить код

Код:

@namespace url(http://www.w3.org/1999/xhtml);

/*
Name: Night style
Author: Nikita Vasilyev
Version of the Jcuken (20.03.2013)
Description: http://forum.mozilla-russia.org/viewtopic.php?id=62345
Original: http://usercss.ru/styles/night/
          http://usercss.com/styles/night/
*/

html {
    background:#222 !important;
    }
html * {
    background: none !important;
    color:#bbb !important;
    border-color:#333 !important;
    border-width:0 !important;
    }

html a, 
html a * {
    color:#5c8599 !important; 
    text-decoration:underline !important
    }
html a:visited, 
html a:visited *, 
html a:active,
html a:active * {
    color:#625f66 !important
    }
html a:hover,
html a:hover * {
    color:#cef !important; 
    background:#023 !important; 
    }    

html input, 
html select, 
html button,
html textarea {
    background:#4d4c40 !important;
    border: 1px solid #5c5a46 !important;
    border-top-color: #474531 !important;
    border-bottom-color: #7a7967 !important;
    }
html input[type=button], 
html input[type=submit], 
html input[type=reset], 
html input[type=image], 
html button {
    border-top-color: #7a7967 !important;
    border-bottom-color: #474531 !important;    
    }

html input:focus, 
html select:focus,
html option:focus,
html button:focus,
html textarea:focus {
    background:#5c5b3e !important;
    color:#fff !important;
    border-color: #474100 #665d00 #7a7849 !important;
    /*border-top-color: #5c5400 !important;*/
    outline: 2px solid #041d29 !important;
    }

html input[type=button]:focus, 
html input[type=submit]:focus, 
html input[type=reset]:focus, 
html input[type=image]:focus, 
html button:focus {
    border-color: #7a7849 #665d00 #474100 !important;
    }    

html input[type=radio] {
    background:none !important;
    border-color:#333 !important;
    border-width:0 !important;
    }

html img[src],
html input[type=image] {opacity:.6}
html img[src]:hover,
html input[type=image]:hover {opacity:1}

html, 
html body {
    scrollbar-base-color: #4d4c40 !important;
    scrollbar-face-color: #5c5b3e !important;
    scrollbar-shadow-color: #5c5b3e !important;
    scrollbar-highlight-color: #5c5b3e !important;
    scrollbar-dlight-color: #5c5b3e !important;
    scrollbar-darkshadow-color: #474531 !important;
    scrollbar-track-color: #4d4c40 !important;
    scrollbar-arrow-color: #000 !important;
    scrollbar-3dlight-color: #7a7967 !important;
    }

/* Link shadows */
/*
@media screen and (min-width: 128px) {
    html a:hover,
    html a:hover * {
        background-color: #333 !important; 
        text-shadow: 0 0 1em #023 !important; 
        }
}
*/

/* Webkit */
@media all and (-webkit-min-device-pixel-ratio:0) {    
    html body * {
        -webkit-transition: color 1s ease-in, background-color 2s ease-out !important;
        }
    html a,
    html textarea,
    html input,
    html select {
        -webkit-transition: color .4s ease-in, background-color .4s ease-out !important;
        }
    html img[src],
    html input[type=image] {    
        -webkit-transition: opacity .4s ease-in !important;
        }
    html input:focus, 
    html select:focus,
    html option:focus,
    html button:focus,
    html textarea:focus {
        outline-style: outset !important;
    }
}

/* Something ugly */
/*
html textarea, 
html select, 
html input {
    scrollbar-base-color: #4d4c40 !important;
    scrollbar-face-color: #4d4c40 !important;
    scrollbar-shadow-color: #4d4c40 !important;
    scrollbar-highlight-color: #474531 !important;
    scrollbar-dlight-color: #7a7967 !important;
    scrollbar-darkshadow-color: #7a7967 !important;
    scrollbar-track-color: #4d4c40 !important;
    scrollbar-arrow-color: #000 !important;
    scrollbar-3dlight-color: #5c5a46 !important;
    }
*/

Отредактировано Пандёнок (20-03-2014 12:31:15)

Отсутствует

 

№215-06-2014 08:04:54

Ultima2m
Участник
 
Группа: Members
Откуда: Россия
Зарегистрирован: 28-11-2013
Сообщений: 592
UA: Firefox 29.0

Re: Night — стиль для ночи

Стиль ломает разметку страницы. Починить можно?

Отсутствует

 

№322-06-2014 16:10:26

Ultima2m
Участник
 
Группа: Members
Откуда: Россия
Зарегистрирован: 28-11-2013
Сообщений: 592
UA: Firefox 29.0

Re: Night — стиль для ночи

okkamas_knife пишет

вот тут исправленная версия.

Ссылки нет :(

Отсутствует

 

№422-06-2014 20:56:50

Пандёнок
Участник
 
Группа: Extensions
Зарегистрирован: 04-11-2008
Сообщений: 5543
UA: Chrome 35.0

Re: Night — стиль для ночи

Ultima2m

Ссылки нет

Каков вопрос, таков ответ. Где и что ломает?

Отредактировано Пандёнок (22-06-2014 20:57:16)

Отсутствует

 

№525-06-2014 23:17:54

Бумбик
Участник
 
Группа: Members
Зарегистрирован: 04-02-2012
Сообщений: 176
UA: Firefox 30.0

Re: Night — стиль для ночи

Если кому нужна выключалка (ну по крайней мере я так ее называю день/ночь) можете установить расширение Black Your Monitor + Easy Reading. там можно цвет фона и шрифтов менять на свой вкус и вкл. выкл. в один клик если повесить значок на видное место

Отсутствует

 

Board footer

Powered by PunBB
Modified by Mozilla Russia
Copyright © 2004–2020 Mozilla Russia GitHub mark
Язык отображения форума: [Русский] [English]