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

На IRC-канале #mozilla-ru можно получить техническую консультацию онлайн и, конечно же, порцию общения.

№280130-08-2016 21:09:52

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 1370
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

Duche пишет:

А я поменял :after  на :before и картинка оказалась под панелью.

Каким образом, она должна слева вверху на кнопке оказаться, если без отступов у меня так.

Отсутствует

 

№280230-08-2016 21:33:49

Duche
Участник
 
Группа: Members
Зарегистрирован: 07-02-2016
Сообщений: 147
UA: Firefox 38.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V. пишет:

Вообще сначала делаю

Попробовал свой файл перегнать в SVG, Corel + Notepad++ , надо взять SVG в FF на вооружение.

Добавлено 30-08-2016 21:40:08

Duche пишет:

Каким образом, она должна слева вверху

Почему "слева вверх" , когда право середина. Позиционированее я подогнал под себя.

Отредактировано Duche (30-08-2016 21:40:08)

Отсутствует

 

№280331-08-2016 10:05:27

Duche
Участник
 
Группа: Members
Зарегистрирован: 07-02-2016
Сообщений: 147
UA: Firefox 38.0

Re: Настройка внешнего вида Firefox в userChrome.css

Duche пишет:

Позиционированее я подогнал под себя.

Vitaliy V.   Вобщем закопался я . Позиционировал, подгонял и всё мимо. Вроде нормально , но такое ощущение что я подгоняю не фон под страницу сайта, а страницу сайта двигаю по фону. Появляются полосы прокрутки, вертикальные и горизонтальные , хотя страница пустая и имеет одну панель запроса. Прокручиваешь как будто страница заполнена и не помещается в окно. Поправьте пожалуйста  код , так чтобы картинка фона была под панелью запроса Яндекс.
Выкладываю скрин что получилось, картинка фона имеет такой же размер что и оригинал 1 к 1. Vitaliy V прошу помощи , по возможности используйте не SVG, а путь к файлу как в коде.
Заранее спасибо.

Картинка:


Код что я наваял:
скрытый текст

Выделить код

Код:

@-moz-document url("https://www.yandex.ru/") {
    form .search2__input:before {
        content: "" !important;
        position: absolute !important;
        width: 450px !important;
        height: 680px !important;
        background-image: url("resource://chrome/art-160021.png") !important;
        background-repeat: no-repeat !important; background-size: 100% !important;
        margin-top: -85px !important;
        margin-left: -125px !important;
        
    }
}
}


Пример, что получилось:
скрытый текст
http://savepic.ru/11166789m.png

Отредактировано Duche (31-08-2016 10:23:19)

Отсутствует

 

№280431-08-2016 11:15:46

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 1370
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

Duche пишет:

Код что я наваял:

Зачем же отрицательный margin-top делать, тут наоборот надо. И одна скобка закрывающая лишняя

Вот как у меня с вашим фоном
http://i6.imageban.ru/thumbs/2016.08.31/b974bc0dbf735422c36ba42ce5718592.png

Отредактировано Vitaliy V. (31-08-2016 11:31:30)

Отсутствует

 

№280531-08-2016 12:17:52

Duche
Участник
 
Группа: Members
Зарегистрирован: 07-02-2016
Сообщений: 147
UA: Firefox 38.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V. пишет:

Зачем же отрицательный margin-top делать

Если поправить по Вашим рекомендациям , то всё так и получается, как на Вашем скрине. Вот я , не могу поправить код чтобы получилось как у меня на скрине, но без большой (длинной) полосы прокрутки по вертикали . Как я писал выше страница пустая, имеет одну панель запроса Яндекса без новостных ,погодных и т.д. блоков . Полоса прокрутки такая, как будто внизу по центру  что то есть и много, но там пустое белое поле. Весь сайт (окно) находится как бы вверху . Выглядит очень коряво . Я в тупике.

Отредактировано Duche (31-08-2016 12:33:58)

Отсутствует

 

№280631-08-2016 12:53:35

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 1370
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

Duche
У меня нет такого, подчистил страницу вот так выглядит, прокрутки нет
http://i2.imageban.ru/thumbs/2016.08.31/8e70b77dbcc1a5e5652b2cd96cc35c05.png
Попробуйте тогда ещё отрицательный  margin-bottom: добавить

Отсутствует

 

№280731-08-2016 13:20:50

Duche
Участник
 
Группа: Members
Зарегистрирован: 07-02-2016
Сообщений: 147
UA: Firefox 38.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V. пишет:

Попробуйте

На  margin-bottom: не реагирует ни как . Паласа прокрутки пропадает если для фона задать - margin-top: -288, тогда фон находится справа вверху. Запарился.:whiteflag:


Развернул новый  FF , результат ноль.

Отредактировано Duche (31-08-2016 13:36:30)

Отсутствует

 

№280831-08-2016 14:05:38

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 1370
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

Duche пишет:

height: 680px !important;

По моему просто слишком большая высота, у вас изображение почти в три раза меньше, сделайте height: 252px !important; и должно быть нормально

Отредактировано Vitaliy V. (31-08-2016 14:08:17)

Отсутствует

 

№280931-08-2016 14:20:37

Duche
Участник
 
Группа: Members
Зарегистрирован: 07-02-2016
Сообщений: 147
UA: Firefox 38.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V. пишет:

должно быть нормально

Фу-уууууу , отлегнуло. Подскажите , все остальные значения (отрицательный margin-top и т.д.) допустимы в коде, с точки зрения написания CSS.

Примите искреннюю благодарность  за Вашу работу и терпение.

Отредактировано Duche (31-08-2016 14:21:27)

Отсутствует

 

№281031-08-2016 14:26:18

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 1370
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

Duche пишет:

Подскажите , все остальные значения (отрицательный margin-top и т.д.) допустимы в коде, с точки зрения написания CSS.

Да конечно, маргины могут иметь отрицательные значения.

Отсутствует

 

№281131-08-2016 17:33:03

turbot
Участник
 
Группа: Members
Зарегистрирован: 09-10-2011
Сообщений: 2529
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V.

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

Выделить код

Код:

<svg xmlns='http://www.w3.org/2000/svg' height='16px' width='16px'> <g style='shape-rendering:crispEdges'><path d='M0,153v153h102l127.5,127.5v-408L102,153H0z M344.25,229.5c0-45.9-25.5-84.15-63.75-102v204    C318.75,313.65,344.25,275.4,344.25,229.5z M280.5,5.1v53.55C354.45,81.6,408,147.899,408,229.5S354.45,377.4,280.5,400.35V453.9    C382.5,430.949,459,339.15,459,229.5C459,119.85,382.5,28.049,280.5,5.1z' style='fill:rgb(121,124,128)'/></g></svg>

Оригинал:

Выделить код

Код:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->

<svg
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   version="1.1"
   id="Capa_1"
   x="0px"
   y="0px"
   width="459px"
   height="459px"
   viewBox="0 0 459 459"
   style="enable-background:new 0 0 459 459;"
   xml:space="preserve"
   inkscape:version="0.91 r13725"
   sodipodi:docname="61051.svg"><metadata
     id="metadata42"><rdf:RDF><cc:Work
         rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
           rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
     id="defs40" /><sodipodi:namedview
     pagecolor="#ffffff"
     bordercolor="#666666"
     borderopacity="1"
     objecttolerance="10"
     gridtolerance="10"
     guidetolerance="10"
     inkscape:pageopacity="0"
     inkscape:pageshadow="2"
     inkscape:window-width="1366"
     inkscape:window-height="715"
     id="namedview38"
     showgrid="false"
     inkscape:zoom="0.51416122"
     inkscape:cx="229.5"
     inkscape:cy="229.5"
     inkscape:window-x="-5"
     inkscape:window-y="-5"
     inkscape:window-maximized="1"
     inkscape:current-layer="Capa_1" /><g
     id="g3"
     style="fill:#797c80;fill-opacity:1"><g
       id="volume-up"
       style="fill:#797c80;fill-opacity:1"><path
         d="M0,153v153h102l127.5,127.5v-408L102,153H0z M344.25,229.5c0-45.9-25.5-84.15-63.75-102v204    C318.75,313.65,344.25,275.4,344.25,229.5z M280.5,5.1v53.55C354.45,81.6,408,147.899,408,229.5S354.45,377.4,280.5,400.35V453.9    C382.5,430.949,459,339.15,459,229.5C459,119.85,382.5,28.049,280.5,5.1z"
         id="path6"
         style="fill:#797c80;fill-opacity:1" /></g></g></svg>

Отсутствует

 

№281231-08-2016 19:30:43

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 1370
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

turbot
Просто уменьшить размер холста не достаточно получится вот что

скрытый текст
http://i1.imageban.ru/thumbs/2016.08.31/471c1238de243cb4141c3ef96f57fc7d.png

Координаты соответственно тоже должны быть пересчитаны под размер холста. Либо масштабированы с transform=

Вот как то так, размер 16x16
скрытый текст

Выделить код

Код:

<svg xmlns='http://www.w3.org/2000/svg' height='16px' width='16px'><g><path d='M 9.8,14 C 15.4,12.6 15.4,3.4 9.8,2 L 9.8,0 C 18,2 18,14 9.8,16 Z M 3.6,10.8 0,10.8 0,5.2 3.6,5.2 8,0.8 8,15.2 Z M 9.8,4.4 C 12.2,5.6 12.2,10.4 9.8,11.6 Z' style='fill:rgb(121,124,128)'/></g></svg>


Да и shape-rendering:crispEdges здесь не нужно

Отредактировано Vitaliy V. (31-08-2016 19:36:19)

Отсутствует

 

№281331-08-2016 19:34:25

turbot
Участник
 
Группа: Members
Зарегистрирован: 09-10-2011
Сообщений: 2529
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V. пишет:

Координаты соответственно тоже должны быть пересчитаны под размер холста.

А, вот оно что. Спасибо. Черт, придется, значит, inkscape'ом всерьез заняться. Раз на тяп-ляп тут не обойдешься. :(

Отредактировано turbot (31-08-2016 19:35:19)

Отсутствует

 

№281431-08-2016 22:16:58

Dumby
Участник
 
Группа: Members
Зарегистрирован: 12-08-2012
Сообщений: 1075
UA: Firefox 45.0

Re: Настройка внешнего вида Firefox в userChrome.css

turbot пишет:

придется, значит, inkscape'ом всерьез заняться

«почистить свгшку, от мусора» или «Вот как то так, размер 16x16»?
Не совсем одно и то же. Вот, глянь, например, как кругляши неодинаковы.

скрытый текст

Выделить код

Код:

var orig = `
    <svg
        xmlns="http://www.w3.org/2000/svg"
        width="16"
        height="16"
        viewBox="0 0 459 459"
    >
        <g style="fill:#797c80;">
            <path d="M0,153v153h102l127.5,127.5v-408L102,153H0z M344.25,229.5c0-45.9-25.5-84.15-63.75-102v204    C318.75,313.65,344.25,275.4,344.25,229.5z M280.5,5.1v53.55C354.45,81.6,408,147.899,408,229.5S354.45,377.4,280.5,400.35V453.9    C382.5,430.949,459,339.15,459,229.5C459,119.85,382.5,28.049,280.5,5.1z"/>
         </g>
    </svg>
`;
var conv = `
    <svg
        xmlns='http://www.w3.org/2000/svg'
        height='16px'
        width='16px'
    >
        <g>
            <path d='M 9.8,14 C 15.4,12.6 15.4,3.4 9.8,2 L 9.8,0 C 18,2 18,14 9.8,16 Z M 3.6,10.8 0,10.8 0,5.2 3.6,5.2 8,0.8 8,15.2 Z M 9.8,4.4 C 12.2,5.6 12.2,10.4 9.8,11.6 Z' style='fill:rgb(121,124,128)'/>
        </g>
    </svg>
`;
var origURL = "data:image/svg+xml," + encodeURIComponent(orig);
var convURL = "data:image/svg+xml," + encodeURIComponent(conv);

var k = 22;
setTimeout(br => {
    var {body} = br.contentDocument, img;

    (body.appendChild(new Image())).src = origURL;
    img = body.appendChild(new Image());
    img.width = 16*k; img.src = origURL;

    (body.appendChild(new Image())).src = convURL;
    img = body.appendChild(new Image());
    img.width = 16*k; img.src = convURL;

}, 500, (gBrowser.selectedTab = gBrowser.addTab()).linkedBrowser);

Отсутствует

 

№281531-08-2016 22:53:40

turbot
Участник
 
Группа: Members
Зарегистрирован: 09-10-2011
Сообщений: 2529
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

Dumby пишет:

Не совсем одно и то же.

Ну, в общем, и то и то надо. "Как-то так" - в первую очередь. У меня-то стиль не дает большим иконкам CB-кнопок расползаться, а если выкладывать, так надо править, чтоб не втюхивать еще и стиль в нагрузку. :)

кругляши неодинаковы

У. Но хоть что-то.

Отсутствует

 

№281601-09-2016 00:03:01

Dumby
Участник
 
Группа: Members
Зарегистрирован: 12-08-2012
Сообщений: 1075
UA: Firefox 45.0

Re: Настройка внешнего вида Firefox в userChrome.css

turbot пишет:

стиль не дает большим иконкам CB-кнопок расползаться

OK. Что мне нужно сделать, чтобы иконка этой кнопки расползлась?

скрытый текст

Выделить код

Код:

custombutton://%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0D%0A%3Ccustombutton%20xmlns%3Acb%3D%22http%3A//xsms.nm.ru/custombuttons/%22%3E%0A%20%20%3Cname/%3E%0A%20%20%3Cimage%3E%3C%21%5BCDATA%5Bdata%3Aimage/svg+xml%2C%250A%2509%253Csvg%250A%2509%2509xmlns%253D%2522http%253A%252F%252Fwww.w3.org%252F2000%252Fsvg%2522%250A%2509%2509width%253D%252216%2522%250A%2509%2509height%253D%252216%2522%250A%2509%2509viewBox%253D%25220%25200%2520459%2520459%2522%250A%2509%253E%250A%2509%2509%253Cg%2520style%253D%2522fill%253A%2523797c80%253B%2522%253E%250A%2509%2509%2509%253Cpath%2520d%253D%2522M0%252C153v153h102l127.5%252C127.5v-408L102%252C153H0z%2520M344.25%252C229.5c0-45.9-25.5-84.15-63.75-102v204%2520%2520%2520%2520C318.75%252C313.65%252C344.25%252C275.4%252C344.25%252C229.5z%2520M280.5%252C5.1v53.55C354.45%252C81.6%252C408%252C147.899%252C408%252C229.5S354.45%252C377.4%252C280.5%252C400.35V453.9%2520%2520%2520%2520C382.5%252C430.949%252C459%252C339.15%252C459%252C229.5C459%252C119.85%252C382.5%252C28.049%252C280.5%252C5.1z%2522%252F%253E%250A%2509%2509%253C%252Fg%253E%250A%2509%253C%252Fsvg%253E%250A%5D%5D%3E%3C/image%3E%0A%20%20%3Cmode%3E0%3C/mode%3E%0A%20%20%3Cinitcode%3E%3C%21%5BCDATA%5B/*Initialization%20Code*/%5D%5D%3E%3C/initcode%3E%0A%20%20%3Ccode%3E%3C%21%5BCDATA%5BgBrowser.selectedTab%20%3D%20gBrowser.addTab%28%22view-source%3A%22%20+%20self.image%29%3B%5D%5D%3E%3C/code%3E%0A%20%20%3Caccelkey%3E%3C%21%5BCDATA%5B%5D%5D%3E%3C/accelkey%3E%0A%20%20%3Chelp%3E%3C%21%5BCDATA%5B%5D%5D%3E%3C/help%3E%0A%20%20%3Cattributes/%3E%0A%3C/custombutton%3E

Отсутствует

 

№281701-09-2016 00:35:59

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 1370
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

Не совсем одно и то же

Да уменьшить размер и почистить от мусора не одно и тоже.
Подправил поточнее

скрытый текст

Выделить код

Код:

<svg xmlns='http://www.w3.org/2000/svg' height='16px' width='16px'><g><path d='M 9.79,14 C 15.6,12.1 15.6,3.97 9.79,2.02 L 9.79,0.128 C 18,2.11 18,13.9 9.79,15.9 Z M 3.58,10.8 0,10.8 0,5.25 3.58,5.25 7.94,0.896 7.94,15.1 Z M 9.79,4.42 C 12.7,5.82 12.7,10.2 9.79,11.6 Z' style='fill:rgb(121,124,128)'/></g></svg>


Про viewBox= в курсе но предпочитаю без него обходится, зачем масштабировать...

Отредактировано Vitaliy V. (01-09-2016 00:52:39)

Отсутствует

 

№281801-09-2016 01:01:57

turbot
Участник
 
Группа: Members
Зарегистрирован: 09-10-2011
Сообщений: 2529
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

Dumby
Расползались. Раньше. Из-за стилей CTR. Был неправ, подзабыл. Сейчас уже не расползаются и без стиля, видимо Aris поправил.

Vitaliy V.
Спасибо.

Отсутствует

 

№281903-09-2016 19:05:38

Duche
Участник
 
Группа: Members
Зарегистрирован: 07-02-2016
Сообщений: 147
UA: Firefox 38.0

Re: Настройка внешнего вида Firefox в userChrome.css

Добрый день. Прошу помощи по правке кода. Как видно код используется для замены фона . Работает вроде нормально , но есть не большой огрех . При масштабировании окна FF ("свернуть в маленькое окно, меньше четверти экрана 19") у фона появляются незаполненные фоном  (белые) зоны ( низ , правая сторона ). В остальных режимах, нормальное окно, полноэкранный режим фон масштабируется нормально. Прошу поправить код в плане заполнения окна во всех режимах окна.

скрытый текст

Выделить код

Код:

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

@-moz-document url(https://www.nnm.ru/) {
  body, html {background: url(WWW.jpg) !important; background-attachment: inherit !important;    background-clip: border-box !important;    background-origin: padding-box !important; background-position: center !important; background-repeat: no-repeat !important; background-size: 100% 100% !important} 
}

Отредактировано Duche (03-09-2016 19:23:30)

Отсутствует

 

№282003-09-2016 19:54:55

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 1370
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

Duche

Выделить код

Код:

body {
    background-image: url("изображение") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-attachment: fixed !important;
}

Отсутствует

 

№282103-09-2016 20:35:30

Duche
Участник
 
Группа: Members
Зарегистрирован: 07-02-2016
Сообщений: 147
UA: Firefox 38.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V. Результат такой же что и в старом коде. Изображение в маленьком окне, как бы начинается от левого верхнего угла. Если по скролить в маленьком окне появляются белые поля.

Отредактировано Duche (03-09-2016 20:36:06)

Отсутствует

 

№282203-09-2016 21:07:44

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 1370
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

Duche
Что за сайт? Попробуйте добавить к body и/или html
    height: 100% !important;   
    width: 100% !important;

Отсутствует

 

№282303-09-2016 21:10:24

Duche
Участник
 
Группа: Members
Зарегистрирован: 07-02-2016
Сообщений: 147
UA: Firefox 38.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V. пишет:

Что за сайт

Яндекс

Отсутствует

 

№282403-09-2016 21:46:01

Duche
Участник
 
Группа: Members
Зарегистрирован: 07-02-2016
Сообщений: 147
UA: Firefox 38.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V. пишет:

Попробуйте добавить к body и/или html

Добавил к body- html , всё получилось.
Спасибо

Отсутствует

 

№282503-09-2016 22:12:36

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 1370
UA: Firefox 51.0

Re: Настройка внешнего вида Firefox в userChrome.css

Duche пишет:

Яндекс

Только нужно auto добавить к html

Выделить код

Код:

html {
    height: auto !important;
}

Отсутствует

 

Board footer

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