Стиль страницы option_ui и browser_action для Firefox Mobile

Question

Я разработал расширение для Firefox с опцией для всплывающих окон для настроек.

Для мобильных устройств, поскольку оно открывается не как всплывающее окно, а как новая вкладка moz-extension://(...)/popup.html, япришлось применить некоторые конкретные медиа-запросы CSS.

Но, как вы можете видеть ниже, это определенно не работает.

Что мне делать?

Страница CSS здесь https://github.com/ANN-MB/LEIA/blob/master/extension%20firefox/leia.css

Answer 1

Я решил проблему.

Это было не о медиазапросах , а потому, что мой manifest.json выглядел так:

"options_ui": {
    "page": "config.html",
    "browser_style": false,
    "open_in_tab": true
  }

Кажется, что когда open_in_tab установлено на true , браузер Firefox Mobile открывает страницу параметров с дисплеем на рабочем столе (не спрашивайте меня, почему).

Так что поворот «open_in_tab» в false дал мне хороший рендер.

Answer 2

Но вам нужны @media Querys для поиска решений! Ваш Medium предоставляет максимальный диапазон размеров, вам нужно только объявить свой стиль на разных диапазонах:

@media(min-width:XXXpx) {
    // your style here
}

для получения дополнительной информации посмотрите на это: https://gist.github.com/gokulkrishh/242e68d1ee94ad05f488