Search Improved: dropdown (#4994)

* first draft

* fix

* RTL CSS

* add link to documentation

* hide search button in desktop view

* rename .no-desktop to .only-mobile

* i18n

* add ID

* Theme: Swage

* Theme Scewdriver

* Theme Pafat

* Theme flat

* Theme: Adark

* Theme: Dark

* i18n: German

* i18n en-us

* fix i18n

* Update app/i18n/fr/gen.php

Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr>

* Update app/layout/nav_menu.phtml

Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr>

* Update app/layout/nav_menu.phtml

Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr>

* Update app/layout/nav_menu.phtml

Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr>

* wip

* mapco theme

* RTL for Ansum and Mapco

* fix

* fix

---------

Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr>
This commit is contained in:
maTh
2023-01-30 20:32:55 +01:00
committed by GitHub
parent 4ad66c24bf
commit e53ba88bb9
51 changed files with 350 additions and 358 deletions

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'Uživatelské dotazy',
'reading' => 'Čtení',
'search' => 'Hledat slova nebo #štítky',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'Sdílení',
'shortcuts' => 'Zkratky',
'stats' => 'Statistika',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'Benutzerabfragen',
'reading' => 'Lesen',
'search' => 'Suche Worte oder #Tags',
'search_help' => 'Siehe Dokumentation zu den <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">Suchparametern</a>',
'sharing' => 'Teilen',
'shortcuts' => 'Tastaturkürzel',
'stats' => 'Statistiken',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'User queries', // TODO
'reading' => 'Reading', // TODO
'search' => 'Search words or #tags', // TODO
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'Sharing', // TODO
'shortcuts' => 'Shortcuts', // TODO
'stats' => 'Statistics', // TODO

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'User queries', // IGNORE
'reading' => 'Reading', // IGNORE
'search' => 'Search words or #tags', // IGNORE
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // IGNORE
'sharing' => 'Sharing', // IGNORE
'shortcuts' => 'Shortcuts', // IGNORE
'stats' => 'Statistics', // IGNORE

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'User queries',
'reading' => 'Reading',
'search' => 'Search words or #tags',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'Sharing',
'shortcuts' => 'Shortcuts',
'stats' => 'Statistics',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'Peticiones de usuario',
'reading' => 'Lectura',
'search' => 'Buscar palabras o #etiquetas',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'Compartir',
'shortcuts' => 'Atajos',
'stats' => 'Estadísticas',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'Filtres utilisateurs',
'reading' => 'Lecture',
'search' => 'Rechercher des mots ou des #tags',
'search_help' => 'Voir <a href="https://freshrss.github.io/FreshRSS/fr/users/03_Main_view.html#gr%C3%A2ce-au-champ-de-recherche" target="_blank">la documentation pour la syntaxe des recherches avancées</a>',
'sharing' => 'Partage',
'shortcuts' => 'Raccourcis',
'stats' => 'Statistiques',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'שאילתות',
'reading' => 'קריאה',
'search' => 'חיפוש מילים או #תגים',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'שיתוף',
'shortcuts' => 'קיצורי דרך',
'stats' => 'סטטיסטיקות',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'User queries', // TODO
'reading' => 'Reading', // TODO
'search' => 'Search words or #tags', // TODO
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'Sharing', // TODO
'shortcuts' => 'Shortcuts', // TODO
'stats' => 'Statistics', // TODO

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'Ricerche personali',
'reading' => 'Lettura',
'search' => 'Ricerca parole o #tags',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'Condivisione',
'shortcuts' => 'Comandi tastiera',
'stats' => 'Statistiche',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'ユーザークエリ',
'reading' => 'リーディング',
'search' => '単語で検索するかハッシュタグで検索する',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => '共有',
'shortcuts' => 'ショートカット',
'stats' => '統計',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => '사용자 쿼리',
'reading' => '읽기',
'search' => '단어 또는 #태그 검색',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => '공유',
'shortcuts' => '단축키',
'stats' => '통계',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'Gebruikers informatie',
'reading' => 'Lezen',
'search' => 'Zoek woorden of #labels',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'Delen',
'shortcuts' => 'Snelle toegang',
'stats' => 'Statistieken',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'Filtres utilizaire',
'reading' => 'Lectura',
'search' => 'Recercar de mots o d#etiquetas',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'Partatge',
'shortcuts' => 'Acorchis',
'stats' => 'Estatisticas',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'Zapisane zapytania',
'reading' => 'Czytanie',
'search' => 'Wyszukaj wyrazy lub #tagi',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'Podawanie dalej',
'shortcuts' => 'Skróty klawiszowe',
'stats' => 'Statystyki',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'Queries de usuário',
'reading' => 'Leitura',
'search' => 'Procurar por palavras ou #tags',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'Compartilhamento',
'shortcuts' => 'Atalhos',
'stats' => 'Estatísticas',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'Пользовательские запросы',
'reading' => 'Чтение',
'search' => 'Искать слова или #теги',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'Обмен',
'shortcuts' => 'Горячие клавиши',
'stats' => 'Статистика',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'Používateľské dopyty',
'reading' => 'Čítanie',
'search' => 'Hľadajte slová alebo #značky',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'Zdieľanie',
'shortcuts' => 'Skratky',
'stats' => 'Štatistiky',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => 'Kullanıcı sorguları',
'reading' => 'Okuma',
'search' => 'Kelime veya #etiket ara',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => 'Paylaşım',
'shortcuts' => 'Kısayollar',
'stats' => 'İstatistikler',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => '自定义查询',
'reading' => '阅读',
'search' => '搜索内容或#标签',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => '分享',
'shortcuts' => '快捷键',
'stats' => '统计',

View File

@@ -174,6 +174,7 @@ return array(
'queries' => '自定義查詢',
'reading' => '閱讀',
'search' => '搜尋內容或#標簽',
'search_help' => 'See documentation for advanced <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field" target="_blank">search parameters</a>', // TODO
'sharing' => '分享',
'shortcuts' => '快捷鍵',
'stats' => '統計',

View File

@@ -29,10 +29,53 @@
href="<?= Minz_Url::display($url_state) ?>"><?= _i($state_str) ?></a>
<?php } ?>
<div class="dropdown only-mobile" id="dropdown-search-wrapper">
<input type="hidden" name="_csrf" value="<?= FreshRSS_Auth::csrfToken() ?>" />
<div id="dropdown-search" class="dropdown-target"></div>
<a id="toggle-search" class="dropdown-toggle btn<?= (strlen(FreshRSS_Context::$search) > 0) ? ' active' : ''; ?>" title="<?= _t('gen.menu.search') ?>"
href="#dropdown-search"><?= _i('search') ?></a>
<ul class="dropdown-menu">
<li class="item">
<span>
<form action="<?= _url('index', 'index') ?>" method="get">
<?php $param_a = Minz_Request::actionName(); ?>
<?php if (in_array($param_a, ['normal', 'global', 'reader'])) { ?>
<input type="hidden" name="a" value="<?= $param_a ?>" />
<?php } ?>
<?php $get = Minz_Request::param('get', ''); ?>
<?php if ($get != '') { ?>
<input type="hidden" name="get" value="<?= $get ?>" />
<?php } ?>
<?php $order = Minz_Request::param('order', ''); ?>
<?php if ($order != '') { ?>
<input type="hidden" name="order" value="<?= $order ?>" />
<?php } ?>
<?php $state = Minz_Request::param('state', ''); ?>
<?php if ($state != '') { ?>
<input type="hidden" name="state" value="<?= $state ?>" />
<?php } ?>
<div class="stick search">
<input type="search" name="search"
value="<?= htmlspecialchars(htmlspecialchars_decode(FreshRSS_Context::$search, ENT_QUOTES), ENT_COMPAT, 'UTF-8'); ?>"
placeholder="<?= _t('gen.menu.search') ?>" title="<?= _t('gen.menu.search') ?>" /><button class="btn" type="submit" title="<?= _t('index.menu.search_short') ?>"><?= _i('search') ?></button>
</div>
<p class="help"><?= _i('help') ?> <?= _t('gen.menu.search_help') ?></a></p>
</form>
</span>
</li>
</ul>
<a class="dropdown-close" href="#close"></a>
</div>
<div class="dropdown">
<div id="dropdown-query" class="dropdown-target"></div>
<a class="dropdown-toggle btn" href="#dropdown-query" title="<?= _t('index.menu.queries') ?>"><?= _i('bookmark-tag') ?></a>
<a id="toggle-userqueries" class="dropdown-toggle btn" href="#dropdown-query" title="<?= _t('index.menu.queries') ?>"><?= _i('bookmark-tag') ?></a>
<ul class="dropdown-menu">
<li class="dropdown-header">
<?= _t('index.menu.queries') ?>
@@ -185,33 +228,6 @@
</div>
<?php } ?>
<div class="item search">
<form action="<?= _url('index', 'index') ?>" method="get">
<input type="search" name="search" class="extend" value="<?php
echo htmlspecialchars(htmlspecialchars_decode(FreshRSS_Context::$search, ENT_QUOTES), ENT_COMPAT, 'UTF-8'); ?>" placeholder="<?= _t('index.menu.search_short') ?>" />
<?php $param_a = Minz_Request::actionName(); ?>
<?php if (in_array($param_a, ['normal', 'global', 'reader'])) { ?>
<input type="hidden" name="a" value="<?= $param_a ?>" />
<?php } ?>
<?php $get = Minz_Request::param('get', ''); ?>
<?php if($get != '') { ?>
<input type="hidden" name="get" value="<?= $get ?>" />
<?php } ?>
<?php $order = Minz_Request::param('order', ''); ?>
<?php if($order != '') { ?>
<input type="hidden" name="order" value="<?= $order ?>" />
<?php } ?>
<?php $state = Minz_Request::param('state', ''); ?>
<?php if($state != '') { ?>
<input type="hidden" name="state" value="<?= $state ?>" />
<?php } ?>
</form>
</div>
<?php
if (FreshRSS_Context::$order === 'DESC') {
$order = 'ASC';

View File

@@ -1105,21 +1105,6 @@ kbd {
margin: 5px 0;
}
.nav_menu .search {
display: inline-block;
max-width: 97%;
}
.nav_menu .search input {
padding: 3px 5px;
max-width: 97%;
width: 90px;
}
.nav_menu .search input:focus {
width: 400px;
}
.dropdown-target:target ~ .dropdown-toggle::after {
background-color: var(--background-color-active);
border-top: 2px solid var(--background-color-light);

View File

@@ -1105,21 +1105,6 @@ kbd {
margin: 5px 0;
}
.nav_menu .search {
display: inline-block;
max-width: 97%;
}
.nav_menu .search input {
padding: 3px 5px;
max-width: 97%;
width: 90px;
}
.nav_menu .search input:focus {
width: 400px;
}
.dropdown-target:target ~ .dropdown-toggle::after {
background-color: var(--background-color-active);
border-top: 2px solid var(--background-color-light);

View File

@@ -22,6 +22,12 @@
}
/*=== Dropdown */
.dropdown {
.dropdown-target:target + .btn {
background-color: variables.$grey-medium-light;
}
}
.dropdown-menu {
margin: 9px 0 0 0;
padding: 0.5rem 0 1rem 0;
@@ -51,7 +57,9 @@
@include mixins.transition(all, 0.075s, ease-in-out);
a, .as-link {
> a,
> span,
> .as-link {
padding: 0 2rem;
color: variables.$main-font-color;
font-size: inherit;
@@ -60,7 +68,10 @@
span.icon {
padding: 0 0.25rem !important;
}
}
> a,
> .as-link {
&:not(.addItem):hover {
background: variables.$main-first;
color: variables.$white;
@@ -86,7 +97,7 @@
}
&:not(.addItem) {
a:hover,
> a:hover,
button:hover {
background: variables.$main-first;
color: variables.$white;

View File

@@ -207,7 +207,7 @@ main.prompt {
}
}
.dropdown {
.dropdown:not(#dropdown-search-wrapper) {
a.dropdown-toggle {
border-left-width: 0;
background-image: url(icons/more.svg);
@@ -217,6 +217,12 @@ main.prompt {
}
}
}
#dropdown-search-wrapper.dropdown {
a.dropdown-toggle {
border-left-width: 0;
}
}
}
}

View File

@@ -35,35 +35,9 @@
}
.header {
display: block;
height: 8rem;
.item {
&.search {
display: block;
form {
display: inherit;
}
.stick {
display: flex;
}
input {
width: 90%;
height: 3.5rem;
&:focus {
width: 100%;
}
}
.btn {
min-height: 49px;
padding: 0.5rem 2rem;
}
display: none;
}
&.configure {
@@ -103,11 +77,7 @@
}
.search {
display: none;
max-width: 97%;
.input {
max-width: 97%;
width: 90px;

View File

@@ -93,7 +93,7 @@
border-radius: 5px 0 0 5px;
}
.btn:last-child, input:last-child, .btn + .dropdown > .btn {
.btn:last-child, input:last-child, .dropdown:last-child > .btn {
border-radius: 0 5px 5px 0;
}

View File

@@ -221,6 +221,10 @@ form th {
}
/*=== Dropdown */
.dropdown .dropdown-target:target + .btn {
background-color: #e4d8cc;
}
.dropdown-menu {
margin: 9px 0 0 0;
padding: 0.5rem 0 1rem 0;
@@ -247,20 +251,26 @@ form th {
.dropdown-menu .item {
transition: all 0.075s ease-in-out;
}
.dropdown-menu .item a, .dropdown-menu .item .as-link {
.dropdown-menu .item > a,
.dropdown-menu .item > span,
.dropdown-menu .item > .as-link {
padding: 0 2rem;
color: #363330;
font-size: inherit;
line-height: 2.5em;
}
.dropdown-menu .item a span.icon, .dropdown-menu .item .as-link span.icon {
.dropdown-menu .item > a span.icon,
.dropdown-menu .item > span span.icon,
.dropdown-menu .item > .as-link span.icon {
padding: 0 0.25rem !important;
}
.dropdown-menu .item a:not(.addItem):hover, .dropdown-menu .item .as-link:not(.addItem):hover {
.dropdown-menu .item > a:not(.addItem):hover,
.dropdown-menu .item > .as-link:not(.addItem):hover {
background: #ca7227;
color: #fff;
}
.dropdown-menu .item a:not(.addItem):hover .icon, .dropdown-menu .item .as-link:not(.addItem):hover .icon {
.dropdown-menu .item > a:not(.addItem):hover .icon,
.dropdown-menu .item > .as-link:not(.addItem):hover .icon {
filter: grayscale(100%) brightness(2.5);
}
.dropdown-menu .item.dropdown-section {
@@ -272,12 +282,12 @@ form th {
.dropdown-menu .item.dropdown-section .item a, .dropdown-menu .item.dropdown-section .item .as-link {
padding-left: 2rem;
}
.dropdown-menu .item:not(.addItem) a:hover,
.dropdown-menu .item:not(.addItem) > a:hover,
.dropdown-menu .item:not(.addItem) button:hover {
background: #ca7227;
color: #fff;
}
.dropdown-menu .item:not(.addItem) a:hover .icon,
.dropdown-menu .item:not(.addItem) > a:hover .icon,
.dropdown-menu .item:not(.addItem) button:hover .icon {
filter: brightness(3);
}
@@ -518,7 +528,7 @@ form th {
.stick .btn:first-child {
border-radius: 5px 0 0 5px;
}
.stick .btn:last-child, .stick input:last-child, .stick .btn + .dropdown > .btn {
.stick .btn:last-child, .stick input:last-child, .stick .dropdown:last-child > .btn {
border-radius: 0 5px 5px 0;
}
.stick .btn + .btn,
@@ -819,13 +829,16 @@ main.prompt {
.nav_menu .stick .btn.read_all:hover {
background-color: #e4d8cc;
}
.nav_menu .stick .dropdown a.dropdown-toggle {
.nav_menu .stick .dropdown:not(#dropdown-search-wrapper) a.dropdown-toggle {
border-left-width: 0;
background-image: url(icons/more.svg);
}
.nav_menu .stick .dropdown a.dropdown-toggle .icon {
.nav_menu .stick .dropdown:not(#dropdown-search-wrapper) a.dropdown-toggle .icon {
display: none;
}
.nav_menu .stick #dropdown-search-wrapper.dropdown a.dropdown-toggle {
border-left-width: 0;
}
#dropdown-query ~ .dropdown-menu .dropdown-header .icon {
vertical-align: middle;
@@ -1196,29 +1209,8 @@ main.prompt {
#slider .toggle_aside .icon {
filter: grayscale(100%) brightness(2.5);
}
.header {
display: block;
height: 8rem;
}
.header .item.search {
display: block;
}
.header .item.search form {
display: inherit;
}
.header .item.search .stick {
display: flex;
}
.header .item.search input {
width: 90%;
height: 3.5rem;
}
.header .item.search input:focus {
width: 100%;
}
.header .item.search .btn {
min-height: 49px;
padding: 0.5rem 2rem;
display: none;
}
.header .item.configure {
position: absolute;
@@ -1246,10 +1238,6 @@ main.prompt {
.nav_menu .stick .btn.read_all {
padding: 0.85rem 1.25rem;
}
.nav_menu .search {
display: none;
max-width: 97%;
}
.nav_menu .search .input {
max-width: 97%;
width: 90px;

View File

@@ -221,6 +221,10 @@ form th {
}
/*=== Dropdown */
.dropdown .dropdown-target:target + .btn {
background-color: #e4d8cc;
}
.dropdown-menu {
margin: 9px 0 0 0;
padding: 0.5rem 0 1rem 0;
@@ -247,20 +251,26 @@ form th {
.dropdown-menu .item {
transition: all 0.075s ease-in-out;
}
.dropdown-menu .item a, .dropdown-menu .item .as-link {
.dropdown-menu .item > a,
.dropdown-menu .item > span,
.dropdown-menu .item > .as-link {
padding: 0 2rem;
color: #363330;
font-size: inherit;
line-height: 2.5em;
}
.dropdown-menu .item a span.icon, .dropdown-menu .item .as-link span.icon {
.dropdown-menu .item > a span.icon,
.dropdown-menu .item > span span.icon,
.dropdown-menu .item > .as-link span.icon {
padding: 0 0.25rem !important;
}
.dropdown-menu .item a:not(.addItem):hover, .dropdown-menu .item .as-link:not(.addItem):hover {
.dropdown-menu .item > a:not(.addItem):hover,
.dropdown-menu .item > .as-link:not(.addItem):hover {
background: #ca7227;
color: #fff;
}
.dropdown-menu .item a:not(.addItem):hover .icon, .dropdown-menu .item .as-link:not(.addItem):hover .icon {
.dropdown-menu .item > a:not(.addItem):hover .icon,
.dropdown-menu .item > .as-link:not(.addItem):hover .icon {
filter: grayscale(100%) brightness(2.5);
}
.dropdown-menu .item.dropdown-section {
@@ -272,12 +282,12 @@ form th {
.dropdown-menu .item.dropdown-section .item a, .dropdown-menu .item.dropdown-section .item .as-link {
padding-right: 2rem;
}
.dropdown-menu .item:not(.addItem) a:hover,
.dropdown-menu .item:not(.addItem) > a:hover,
.dropdown-menu .item:not(.addItem) button:hover {
background: #ca7227;
color: #fff;
}
.dropdown-menu .item:not(.addItem) a:hover .icon,
.dropdown-menu .item:not(.addItem) > a:hover .icon,
.dropdown-menu .item:not(.addItem) button:hover .icon {
filter: brightness(3);
}
@@ -518,7 +528,7 @@ form th {
.stick .btn:first-child {
border-radius: 0 5px 5px 0;
}
.stick .btn:last-child, .stick input:last-child, .stick .btn + .dropdown > .btn {
.stick .btn:last-child, .stick input:last-child, .stick .dropdown:last-child > .btn {
border-radius: 5px 0 0 5px;
}
.stick .btn + .btn,
@@ -819,13 +829,16 @@ main.prompt {
.nav_menu .stick .btn.read_all:hover {
background-color: #e4d8cc;
}
.nav_menu .stick .dropdown a.dropdown-toggle {
.nav_menu .stick .dropdown:not(#dropdown-search-wrapper) a.dropdown-toggle {
border-right-width: 0;
background-image: url(icons/more.svg);
}
.nav_menu .stick .dropdown a.dropdown-toggle .icon {
.nav_menu .stick .dropdown:not(#dropdown-search-wrapper) a.dropdown-toggle .icon {
display: none;
}
.nav_menu .stick #dropdown-search-wrapper.dropdown a.dropdown-toggle {
border-right-width: 0;
}
#dropdown-query ~ .dropdown-menu .dropdown-header .icon {
vertical-align: middle;
@@ -1196,29 +1209,8 @@ main.prompt {
#slider .toggle_aside .icon {
filter: grayscale(100%) brightness(2.5);
}
.header {
display: block;
height: 8rem;
}
.header .item.search {
display: block;
}
.header .item.search form {
display: inherit;
}
.header .item.search .stick {
display: flex;
}
.header .item.search input {
width: 90%;
height: 3.5rem;
}
.header .item.search input:focus {
width: 100%;
}
.header .item.search .btn {
min-height: 49px;
padding: 0.5rem 2rem;
display: none;
}
.header .item.configure {
position: absolute;
@@ -1246,10 +1238,6 @@ main.prompt {
.nav_menu .stick .btn.read_all {
padding: 0.85rem 1.25rem;
}
.nav_menu .search {
display: none;
max-width: 97%;
}
.nav_menu .search .input {
max-width: 97%;
width: 90px;

View File

@@ -995,20 +995,6 @@ a.btn {
margin: 5px 0;
}
.nav_menu .search {
display: inline-block;
max-width: 97%;
}
.nav_menu .search input {
max-width: 97%;
width: 90px;
}
.nav_menu .search input:focus {
width: 400px;
}
.dropdown-target:target ~ .dropdown-toggle::after {
background-color: #1a1a1a;
border-top: 1px solid #888;

View File

@@ -995,20 +995,6 @@ a.btn {
margin: 5px 0;
}
.nav_menu .search {
display: inline-block;
max-width: 97%;
}
.nav_menu .search input {
max-width: 97%;
width: 90px;
}
.nav_menu .search input:focus {
width: 400px;
}
.dropdown-target:target ~ .dropdown-toggle::after {
background-color: #1a1a1a;
border-top: 1px solid #888;

View File

@@ -147,7 +147,7 @@ form th {
.stick .btn:last-child,
.stick input:last-child,
.stick .btn + .dropdown > .btn {
.stick .dropdown:last-child > .btn {
border-radius: 0 5px 5px 0;
}

View File

@@ -147,7 +147,7 @@ form th {
.stick .btn:last-child,
.stick input:last-child,
.stick .btn + .dropdown > .btn {
.stick .dropdown:last-child > .btn {
border-radius: 5px 0 0 5px;
}

View File

@@ -22,6 +22,12 @@
}
/*=== Dropdown */
.dropdown {
.dropdown-target:target + .btn {
background-color: variables.$grey-medium-light;
}
}
.dropdown-menu {
margin: 9px 0 0 0;
padding: 0.5rem 0 1rem 0;
@@ -51,7 +57,9 @@
@include mixins.transition(all, 0.075s, ease-in-out);
a, .as-link {
> a,
> span,
> .as-link {
padding: 0 2rem;
color: variables.$main-font-color;
font-size: inherit;
@@ -60,7 +68,10 @@
span.icon {
padding: 0 0.25rem !important;
}
}
> a,
> .as-link {
&:not(.addItem):hover {
background: variables.$main-first;
color: variables.$white;

View File

@@ -226,7 +226,7 @@ main.prompt {
}
}
.dropdown {
.dropdown:not(#dropdown-search-wrapper) {
a.dropdown-toggle {
border-left-width: 0;
background-image: url(icons/more.svg);
@@ -236,6 +236,12 @@ main.prompt {
}
}
}
#dropdown-search-wrapper.dropdown {
a.dropdown-toggle {
border-left-width: 0;
}
}
}
}

View File

@@ -35,30 +35,9 @@
}
.header {
display: block;
height: 8rem;
.item {
&.search {
display: block;
form {
display: inherit;
}
.stick {
display: flex;
}
input {
width: 90%;
height: 3.5rem;
&:focus {
width: 100%;
}
}
display: none;
}
&.configure {
@@ -105,11 +84,7 @@
}
.search {
display: none;
max-width: 97%;
.input {
max-width: 97%;
width: 90px;

View File

@@ -93,7 +93,7 @@
border-radius: 5px 0 0 5px;
}
.btn:last-child, input:last-child, .btn + .dropdown > .btn {
.btn:last-child, input:last-child, .dropdown:last-child > .btn {
border-radius: 0 5px 5px 0;
}

View File

@@ -220,6 +220,10 @@ form th {
}
/*=== Dropdown */
.dropdown .dropdown-target:target + .btn {
background-color: #d5d8db;
}
.dropdown-menu {
margin: 9px 0 0 0;
padding: 0.5rem 0 1rem 0;
@@ -246,20 +250,26 @@ form th {
.dropdown-menu .item {
transition: all 0.075s ease-in-out;
}
.dropdown-menu .item a, .dropdown-menu .item .as-link {
.dropdown-menu .item > a,
.dropdown-menu .item > span,
.dropdown-menu .item > .as-link {
padding: 0 2rem;
color: #303136;
font-size: inherit;
line-height: 2.5em;
}
.dropdown-menu .item a span.icon, .dropdown-menu .item .as-link span.icon {
.dropdown-menu .item > a span.icon,
.dropdown-menu .item > span span.icon,
.dropdown-menu .item > .as-link span.icon {
padding: 0 0.25rem !important;
}
.dropdown-menu .item a:not(.addItem):hover, .dropdown-menu .item .as-link:not(.addItem):hover {
.dropdown-menu .item > a:not(.addItem):hover,
.dropdown-menu .item > .as-link:not(.addItem):hover {
background: #36c;
color: #fff;
}
.dropdown-menu .item a:not(.addItem):hover .icon, .dropdown-menu .item .as-link:not(.addItem):hover .icon {
.dropdown-menu .item > a:not(.addItem):hover .icon,
.dropdown-menu .item > .as-link:not(.addItem):hover .icon {
filter: brightness(3);
}
.dropdown-menu .item.dropdown-section {
@@ -532,7 +542,7 @@ form th {
.stick .btn:first-child {
border-radius: 5px 0 0 5px;
}
.stick .btn:last-child, .stick input:last-child, .stick .btn + .dropdown > .btn {
.stick .btn:last-child, .stick input:last-child, .stick .dropdown:last-child > .btn {
border-radius: 0 5px 5px 0;
}
.stick .btn + .btn,
@@ -843,13 +853,16 @@ main.prompt {
.nav_menu .stick .btn.read_all:hover {
background-color: #d5d8db;
}
.nav_menu .stick .dropdown a.dropdown-toggle {
.nav_menu .stick .dropdown:not(#dropdown-search-wrapper) a.dropdown-toggle {
border-left-width: 0;
background-image: url(icons/more.svg);
}
.nav_menu .stick .dropdown a.dropdown-toggle .icon {
.nav_menu .stick .dropdown:not(#dropdown-search-wrapper) a.dropdown-toggle .icon {
display: none;
}
.nav_menu .stick #dropdown-search-wrapper.dropdown a.dropdown-toggle {
border-left-width: 0;
}
/*=== Content of feed articles */
.content, .content.thin {
@@ -1213,25 +1226,8 @@ main.prompt {
#slider .toggle_aside .icon {
filter: grayscale(100%) brightness(2.5);
}
.header {
display: block;
height: 8rem;
}
.header .item.search {
display: block;
}
.header .item.search form {
display: inherit;
}
.header .item.search .stick {
display: flex;
}
.header .item.search input {
width: 90%;
height: 3.5rem;
}
.header .item.search input:focus {
width: 100%;
display: none;
}
.header .item.configure {
position: absolute;
@@ -1264,10 +1260,6 @@ main.prompt {
.nav_menu .stick .btn.read_all {
padding: 0.85rem 1.25rem;
}
.nav_menu .search {
display: none;
max-width: 97%;
}
.nav_menu .search .input {
max-width: 97%;
width: 90px;
@@ -1338,4 +1330,6 @@ body.register {
a, button.as-link {
outline: none;
color: #36c;
}
}
/*# sourceMappingURL=mapco.css.map */

View File

@@ -220,6 +220,10 @@ form th {
}
/*=== Dropdown */
.dropdown .dropdown-target:target + .btn {
background-color: #d5d8db;
}
.dropdown-menu {
margin: 9px 0 0 0;
padding: 0.5rem 0 1rem 0;
@@ -246,20 +250,26 @@ form th {
.dropdown-menu .item {
transition: all 0.075s ease-in-out;
}
.dropdown-menu .item a, .dropdown-menu .item .as-link {
.dropdown-menu .item > a,
.dropdown-menu .item > span,
.dropdown-menu .item > .as-link {
padding: 0 2rem;
color: #303136;
font-size: inherit;
line-height: 2.5em;
}
.dropdown-menu .item a span.icon, .dropdown-menu .item .as-link span.icon {
.dropdown-menu .item > a span.icon,
.dropdown-menu .item > span span.icon,
.dropdown-menu .item > .as-link span.icon {
padding: 0 0.25rem !important;
}
.dropdown-menu .item a:not(.addItem):hover, .dropdown-menu .item .as-link:not(.addItem):hover {
.dropdown-menu .item > a:not(.addItem):hover,
.dropdown-menu .item > .as-link:not(.addItem):hover {
background: #36c;
color: #fff;
}
.dropdown-menu .item a:not(.addItem):hover .icon, .dropdown-menu .item .as-link:not(.addItem):hover .icon {
.dropdown-menu .item > a:not(.addItem):hover .icon,
.dropdown-menu .item > .as-link:not(.addItem):hover .icon {
filter: brightness(3);
}
.dropdown-menu .item.dropdown-section {
@@ -532,7 +542,7 @@ form th {
.stick .btn:first-child {
border-radius: 0 5px 5px 0;
}
.stick .btn:last-child, .stick input:last-child, .stick .btn + .dropdown > .btn {
.stick .btn:last-child, .stick input:last-child, .stick .dropdown:last-child > .btn {
border-radius: 5px 0 0 5px;
}
.stick .btn + .btn,
@@ -843,13 +853,16 @@ main.prompt {
.nav_menu .stick .btn.read_all:hover {
background-color: #d5d8db;
}
.nav_menu .stick .dropdown a.dropdown-toggle {
.nav_menu .stick .dropdown:not(#dropdown-search-wrapper) a.dropdown-toggle {
border-right-width: 0;
background-image: url(icons/more.svg);
}
.nav_menu .stick .dropdown a.dropdown-toggle .icon {
.nav_menu .stick .dropdown:not(#dropdown-search-wrapper) a.dropdown-toggle .icon {
display: none;
}
.nav_menu .stick #dropdown-search-wrapper.dropdown a.dropdown-toggle {
border-right-width: 0;
}
/*=== Content of feed articles */
.content, .content.thin {
@@ -1213,25 +1226,8 @@ main.prompt {
#slider .toggle_aside .icon {
filter: grayscale(100%) brightness(2.5);
}
.header {
display: block;
height: 8rem;
}
.header .item.search {
display: block;
}
.header .item.search form {
display: inherit;
}
.header .item.search .stick {
display: flex;
}
.header .item.search input {
width: 90%;
height: 3.5rem;
}
.header .item.search input:focus {
width: 100%;
display: none;
}
.header .item.configure {
position: absolute;
@@ -1264,10 +1260,6 @@ main.prompt {
.nav_menu .stick .btn.read_all {
padding: 0.85rem 1.25rem;
}
.nav_menu .search {
display: none;
max-width: 97%;
}
.nav_menu .search .input {
max-width: 97%;
width: 90px;
@@ -1338,4 +1330,4 @@ body.register {
a, button.as-link {
outline: none;
color: #36c;
}
}

View File

@@ -291,6 +291,10 @@ a:hover .icon {
filter: brightness(1.1);
}
#toggle-search.active > .icon {
filter: invert(8%) sepia(99%) saturate(7064%) hue-rotate(248deg) brightness(99%) contrast(142%);
}
.btn.active,
.btn:active,
.dropdown-target:target ~ .btn.dropdown-toggle {
@@ -1138,22 +1142,6 @@ a:hover .icon {
margin: 5px 0;
}
.nav_menu .search {
display: inline-block;
max-width: 97%;
}
.nav_menu .search input {
padding: 3px 5px;
max-width: 97%;
width: 90px;
line-height: 2;
}
.nav_menu .search input:focus {
width: 400px;
}
.dropdown-target:target ~ .dropdown-toggle::after {
background-color: var(--background-color-light);
border-top: 1px solid var(--border-color);

View File

@@ -291,6 +291,10 @@ a:hover .icon {
filter: brightness(1.1);
}
#toggle-search.active > .icon {
filter: invert(8%) sepia(99%) saturate(7064%) hue-rotate(248deg) brightness(99%) contrast(142%);
}
.btn.active,
.btn:active,
.dropdown-target:target ~ .btn.dropdown-toggle {
@@ -1138,22 +1142,6 @@ a:hover .icon {
margin: 5px 0;
}
.nav_menu .search {
display: inline-block;
max-width: 97%;
}
.nav_menu .search input {
padding: 3px 5px;
max-width: 97%;
width: 90px;
line-height: 2;
}
.nav_menu .search input:focus {
width: 400px;
}
.dropdown-target:target ~ .dropdown-toggle::after {
background-color: var(--background-color-light);
border-top: 1px solid var(--border-color);

View File

@@ -1093,21 +1093,6 @@ a.signin {
margin: 5px 0;
}
.nav_menu .search {
display: inline-block;
max-width: 97%;
}
.nav_menu .search input {
max-width: 97%;
width: 90px;
line-height: 2;
}
.nav_menu .search input:focus {
width: 400px;
}
.dropdown-target:target ~ .dropdown-toggle::after {
border-top: 1px solid var(--border-color-grey-dark);
border-left: 1px solid var(--border-color-grey-dark);

View File

@@ -1093,21 +1093,6 @@ a.signin {
margin: 5px 0;
}
.nav_menu .search {
display: inline-block;
max-width: 97%;
}
.nav_menu .search input {
max-width: 97%;
width: 90px;
line-height: 2;
}
.nav_menu .search input:focus {
width: 400px;
}
.dropdown-target:target ~ .dropdown-toggle::after {
border-top: 1px solid var(--border-color-grey-dark);
border-right: 1px solid var(--border-color-grey-dark);

View File

@@ -1117,10 +1117,6 @@ a.btn {
margin: 5px 0;
}
.nav_menu .search {
display: none;
}
.nav_menu .search input {
padding: 3px 5px;
max-width: 97%;

View File

@@ -1117,10 +1117,6 @@ a.btn {
margin: 5px 0;
}
.nav_menu .search {
display: none;
}
.nav_menu .search input {
padding: 3px 5px;
max-width: 97%;

View File

@@ -342,12 +342,32 @@ form th {
font-weight: bold;
margin: 0 0 0 -14px;
}
.dropdown-menu .help a {
color: var(--color-text-light);
text-decoration: underline;
text-decoration-style: dotted;
}
.dropdown-menu .help a:hover {
text-decoration-style: solid;
}
.dropdown-menu .input select,
.dropdown-menu .input input {
margin: 0 auto 5px;
padding: 2px 5px;
}
#dropdown-search-wrapper .dropdown-menu {
padding-top: 1rem;
padding-bottom: 0.25rem;
}
#dropdown-search-wrapper .dropdown-menu .stick.search {
width: 100%;
}
#dropdown-search-wrapper .dropdown-menu .stick.search input[type=search] {
width: 100%;
border: 0;
}
.labels .dropdown-menu,
.tags .dropdown-menu,
.share .dropdown-menu {
@@ -912,6 +932,9 @@ a.signin {
.dropdown {
position: relative;
}
.dropdown .dropdown-menu {
width: auto;
}
#new-article {
margin-top: 2rem;
width: 100%;
@@ -1151,10 +1174,15 @@ button.as-link {
left: 0;
right: auto;
}
#nav_menu_actions ul.dropdown-menu::after {
display: none;
}
#nav_menu_actions .dropdown.only-mobile {
display: initial !important;
}
#nav_menu_read_all ul.dropdown-menu {
right: 0;
left: auto;

View File

@@ -342,12 +342,32 @@ form th {
font-weight: bold;
margin: 0 -14px 0 0;
}
.dropdown-menu .help a {
color: var(--color-text-light);
text-decoration: underline;
text-decoration-style: dotted;
}
.dropdown-menu .help a:hover {
text-decoration-style: solid;
}
.dropdown-menu .input select,
.dropdown-menu .input input {
margin: 0 auto 5px;
padding: 2px 5px;
}
#dropdown-search-wrapper .dropdown-menu {
padding-top: 1rem;
padding-bottom: 0.25rem;
}
#dropdown-search-wrapper .dropdown-menu .stick.search {
width: 100%;
}
#dropdown-search-wrapper .dropdown-menu .stick.search input[type=search] {
width: 100%;
border: 0;
}
.labels .dropdown-menu,
.tags .dropdown-menu,
.share .dropdown-menu {
@@ -912,6 +932,9 @@ a.signin {
.dropdown {
position: relative;
}
.dropdown .dropdown-menu {
width: auto;
}
#new-article {
margin-top: 2rem;
width: 100%;
@@ -1151,10 +1174,15 @@ button.as-link {
right: 0;
left: auto;
}
#nav_menu_actions ul.dropdown-menu::after {
display: none;
}
#nav_menu_actions .dropdown.only-mobile {
display: initial !important;
}
#nav_menu_read_all ul.dropdown-menu {
left: 0;
right: auto;

View File

@@ -455,6 +455,16 @@ form {
}
}
.help a {
color: var(--color-text-light);
text-decoration: underline;
text-decoration-style: dotted;
&:hover {
text-decoration-style: solid;
}
}
.input {
select,
input {
@@ -464,6 +474,20 @@ form {
}
}
#dropdown-search-wrapper .dropdown-menu {
padding-top: 1rem;
padding-bottom: 0.25rem;
.stick.search {
width: 100%;
input[type="search"] {
width: 100%;
border: 0;
}
}
}
.labels,
.tags,
.share {
@@ -1171,6 +1195,10 @@ a.signin {
.dropdown {
position: relative;
.dropdown-menu {
width: auto;
}
}
#new-article {
@@ -1476,6 +1504,10 @@ button.as-link {
display: none;
}
}
.dropdown.only-mobile {
display: initial !important;
}
}
#nav_menu_read_all {

View File

@@ -115,6 +115,10 @@ h3 {
display: none;
}
.only-mobile {
display: none !important;
}
/*=== Paragraphs */
p {
margin: 1rem 0 0.5rem;
@@ -443,7 +447,7 @@ td.numeric {
flex-shrink: 0;
}
.stick form {
#nav_menu_read_all form {
display: inline-flex;
}
@@ -1933,7 +1937,6 @@ input:checked + .slide-container .properties {
}
.nav-login,
.nav_menu .search,
.aside .toggle_aside,
#slider .toggle_aside,
.nav_menu .toggle_aside,
@@ -2008,6 +2011,10 @@ input:checked + .slide-container .properties {
display: none;
}
.only-mobile {
display: unset !important;
}
.header > .item {
padding: 5px;
}
@@ -2076,6 +2083,23 @@ input:checked + .slide-container .properties {
margin: 2px 0;
}
.dropdown .dropdown-menu .item .stick .btn {
margin: 0;
}
.dropdown .dropdown-menu .item form {
display: block;
text-align: center;
}
.dropdown .dropdown-menu .item .stick.search {
width: calc(100% - 20px);
}
.dropdown .dropdown-menu .item .stick.search input {
width: 95%;
}
.dropdown .dropdown-menu .item button.as-link,
.dropdown .dropdown-menu .item button.as-link:hover, button.as-link:active {
width: 100%;
@@ -2138,7 +2162,6 @@ input:checked + .slide-container .properties {
}
.nav_menu .toggle_aside,
.nav_menu .search,
#panel .close img {
display: inline-block;
}

View File

@@ -115,6 +115,10 @@ h3 {
display: none;
}
.only-mobile {
display: none !important;
}
/*=== Paragraphs */
p {
margin: 1rem 0 0.5rem;
@@ -443,7 +447,7 @@ td.numeric {
flex-shrink: 0;
}
.stick form {
#nav_menu_read_all form {
display: inline-flex;
}
@@ -1933,7 +1937,6 @@ input:checked + .slide-container .properties {
}
.nav-login,
.nav_menu .search,
.aside .toggle_aside,
#slider .toggle_aside,
.nav_menu .toggle_aside,
@@ -2008,6 +2011,10 @@ input:checked + .slide-container .properties {
display: none;
}
.only-mobile {
display: unset !important;
}
.header > .item {
padding: 5px;
}
@@ -2076,6 +2083,23 @@ input:checked + .slide-container .properties {
margin: 2px 0;
}
.dropdown .dropdown-menu .item .stick .btn {
margin: 0;
}
.dropdown .dropdown-menu .item form {
display: block;
text-align: center;
}
.dropdown .dropdown-menu .item .stick.search {
width: calc(100% - 20px);
}
.dropdown .dropdown-menu .item .stick.search input {
width: 95%;
}
.dropdown .dropdown-menu .item button.as-link,
.dropdown .dropdown-menu .item button.as-link:hover, button.as-link:active {
width: 100%;
@@ -2138,7 +2162,6 @@ input:checked + .slide-container .properties {
}
.nav_menu .toggle_aside,
.nav_menu .search,
#panel .close img {
display: inline-block;
}