Nullnyan! — Art, games, linux and anime

#19424 Nov 2017 at 19:00:55

Как писать юзерстили наиболее удобно?

Допустим, редактор у меня есть и я хочу писать их в нём, а не в том, который предлагает Stylish. При этом видеть изменения в браузере «на лету», после каждого сохранения файла.

#19435 Nov 2017 at 14:29:08

Изменения не лету означают, что что-то где-то ежесекундно проверяет состояние файла и если он обновлён, то оно обновляет версию файла в браузере, например.
Такую программу-проверятора можно написать на сишке или чём-то ещё, это несложно. Но интегрировать её в браузер будет очень непросто (чтобы программа могла дёргать его на обновления, менять код и так далее). Так что в этом случае придётся ещё и писать собственный браузер.
Ещё можно написать скрипт на жс, который будет ежесекундно стучаться на сервак на локалхосте, на котором и будет лежать ксс-файл. В случае, если сервак ответит не "IDLE", а "CHANGED", обновлять версию файла в хеде. Это проще, но тебе понадобится копия страницы на локалхосте и сервак.

#19445 Nov 2017 at 21:31:33

> Изменения не лету означают, что что-то где-то ежесекундно проверяет состояние файла

Или сам стайлиш проверяет нажатие на кнопку «Save» в окне редактирования.
Ещё одна загвоздка в том, что он хранит стили не в текстовых файлах, а в sqlite.
Можно и без стайлиша, в userContent.css — но когда все стили в одном файле, ими управлять неудобно. Требует перезапуска, чтобы увидеть изменения, к тому же.

> Такую программу-проверятора можно написать на сишке или чём-то ещё, это несложно. Но интегрировать её в браузер будет очень непросто (чтобы программа могла дёргать его на обновления, менять код и так далее). Так что в этом случае придётся ещё и писать собственный браузер.

А как же Livereload?
Хотя написание ещё одного браузера, и чтобы с новым движком, было бы очень полезно и для всех пользователей веба и для автора — это серьёзный вызов и интересный опыт. Но тру-у-удно же. И долго. И не понятно, с чего начать.

Похоже, придётся пользоваться встроенным Style Editor. В нём хотя бы подсветка есть.

#19456 Nov 2017 at 21:19:30

>>1944
Не знаю, что такое livereload. Если оно занимается проверкой состояния файлов, то может быть.
Говорю же, наиболее простой вариант - сервак на локалхосте и скрипт. Это если нужна серьёзная работа, а если просто поменять пару мест - так и инспектора достаточно же.

#196512 Dec 2017 at 18:51:35

>>1943

>Изменения не лету означают, что что-то где-то ежесекундно проверяет состояние файла и если он обновлён, то оно обновляет версию файла в браузере, например.

AutoReload так и работает. И, в отличие от LiveReload, он работает – сколько бы я ни пробовал второй на разных версиях лисы под разными ОСями, временами даже значок в аддон-баре не появлялся.

https://addons.mozilla.org/en-US/firefox/addon/auto-reload/

#20358 Feb 2018 at 07:47:33

>>1943

> программу-проверятора можно написать на сишке

> интегрировать её в браузер

> придётся ещё и писать собственный браузер

> Ещё можно написать скрипт на жс

> который будет ежесекундно стучаться на сервак на локалхосте

Офигеть.

<meta http-equiv="refresh" content="1" />

#20368 Feb 2018 at 22:21:53

>>2035
Это неэтично по отношению к браузеру.

#20388 Feb 2018 at 22:51:22



<! —  would you be so kind as to F5 this page for me, sir Browser?  — >

<meta http-equiv="refresh" content="2" />

#20398 Feb 2018 at 23:01:59

#204421 Mar 2018 at 19:49:05

В позе орла

#225916 Apr 2018 at 02:26:26

>>1943

> Изменения не лету означают, что что-то где-то ежесекундно проверяет состояние файла и если он обновлён, то оно обновляет версию файла в браузере, например.

Только если операционная система не имеет средств нотификации об изменении файлов. Все современные десктопные ОС вроде бы их имеют.
В qutebrowser оно используется при вызове редактора из textarea: юзверь сохраняет файл → браузер ловит нотификацию от ОС → содержимое поля ввода обновляется. Никакой ёбли проца и файловой системы.

Собственно, вот минимальная реализация команды :edit-css, выполняющей желаемое опом: https://spit.mixtape.moe/view/4868e806. Есть пара идей по её допиливанию, но это потом.

#22928 May 2018 at 00:21:45

saucenao.com
Раскрытие скрытого блока под ~advanced options~
Он ещё и джаваскриптом открывается, не знаю, зачем сделали такое излишество.



@-moz-document domain("saucenao.com") {

  #advanced {

    display: block !important;

  }

}

#229714 May 2018 at 09:03:07

>>2292
Потому что джаваскриптом сделать удобнее, чем без джаваскрипта?

#229814 May 2018 at 12:13:50

>>2297
Зачем что-то вообще скрывать на странице с таким небольшим количеством элементов? Лишнее нажатие кнопок. При навигации с клаватуры – особенно.

#229914 May 2018 at 20:01:53

>>2298

> Зачем что-то вообще скрывать на странице с таким небольшим количеством элементов?

Чтобы не пугать пользователей сложным интерфейсом, очевидно же. Вон, третьегном, например, верстался вокруг этой идеи. Не скажу, что я её полностью поддерживаю в таком виде, но смысл в ней есть определённо.

#230014 May 2018 at 23:58:14

>>2298

> При навигации с клаватуры

А это уже твои проблемы, пердоль. Сайты делаются в первую очередь для людей, проблемы пердоликов с самописными вим браузерами нормальных разработчиков не волнуют и волновать не должны. Либо пользуйся людским инструментарием, либо иди до конца и напердоль себе интерфейс сам. Хтмл, ксс, яваскрип – совсем не трудно.

#230115 May 2018 at 06:20:06

>>2300
Но там и вправду дизайн не очень.
У ссылок и кнопки маленький неконтрастный текст на тёмном фоне, который с трудом читается.

#23568 Dec 2018 at 08:10:01

Тащемта, можно же сделать вот так, например:

@import url(file:///home/foxfucker/.mozilla/style.css);
И в самом файле:



@-moz-document domain("0nyan.space") {

/* и здесь твоя охуенная стилизация, пиршество хорошего вкуса */

}

Неймспейс можно не указывать — главное, чтобы перед импортом не стоял.
Только стайлиш не применяет изменения, пока не нажмёшь «Save», так что это бестолково. Вообще стили у него хранятся в ~/.mozilla/firefox/<profile>/stylish.sqlite.

#238610 Mar 2019 at 21:12:01

Убрал лишнее, чтобы ничего не мешало созерцать кошкодевочек.
Инпут для ввода тэгов зафиксирован и всегда на виду.



@-moz-document regexp(\'https://gelbooru.com/.+\') {

  #submenu,

  #motd,

  center > .hidden-xs {

    display: none !important;

  }

  a[onclick="saveTagSearch() ;return false;"] {

    display: none;

  }



  body > .container-fluid {

    margin-top: 3em !important;

  }

  #tags-search {

    margin-bottom: 0;

    position: fixed;

    top: 0;

    right: 0;

    left: 0;

    width: 100%;

    height: 3em;

  }

  input[value="Search"] {

    display: none;  /* удобнее нажать Enter */

  }

  .contain-push {

    margin-top: 30px;

  }

}

#238710 Mar 2019 at 21:15:50

>>2386
Отступы РАСПИДОРАСИЛО, очень жаль.

#238813 Mar 2019 at 14:07:10

>>2386
У тебя над списком тэгов отступ от формы остался.
Лучше хотя бы вот так:



  form[action="index.php?page=search"] {

    height: 0;

  }