diff options
author | Andrew Dolgov <[email protected]> | 2021-03-11 19:26:19 +0300 |
---|---|---|
committer | Andrew Dolgov <[email protected]> | 2021-03-11 19:26:19 +0300 |
commit | f67d2623b7a50849893cfa774d85e4e2278308e2 (patch) | |
tree | 758b966706d65c25bc1d0d254dc5ff65ea9da28a /themes/light | |
parent | a4da2f1e621d4de73e589d81dd3f06cd0711204f (diff) |
add some media queries to improve main UI on small-width devices
Diffstat (limited to 'themes/light')
-rw-r--r-- | themes/light/defines.less | 5 | ||||
-rw-r--r-- | themes/light/prefs.less | 10 | ||||
-rw-r--r-- | themes/light/tt-rss.less | 16 |
3 files changed, 30 insertions, 1 deletions
diff --git a/themes/light/defines.less b/themes/light/defines.less index 338c71d79..db86ee0c0 100644 --- a/themes/light/defines.less +++ b/themes/light/defines.less @@ -24,6 +24,11 @@ @font-size-toolbar: 13px; @font-size-content: 14px; +@breakpoint-sm: 576px; +@breakpoint-md: 768px; +@breakpoint-lg: 992px; +@breakpoint-xl: 1200px; + @embed-responsive-padding: 56.25%; // Use 56.25% for 16:9 aspect ratio, 75% for 4:3. body.ttrss_main, diff --git a/themes/light/prefs.less b/themes/light/prefs.less index 0ac0bed52..a7b964fc0 100644 --- a/themes/light/prefs.less +++ b/themes/light/prefs.less @@ -155,6 +155,16 @@ body.ttrss_prefs { } } + @media (max-width: @breakpoint-lg) { + label.checkbox { + min-width : 200px ! important; + } + + .version { + display : none; + } + } + .actions { flex-grow : 2; text-align: right; diff --git a/themes/light/tt-rss.less b/themes/light/tt-rss.less index 7fc9ebe01..1f9ad7c4b 100644 --- a/themes/light/tt-rss.less +++ b/themes/light/tt-rss.less @@ -887,6 +887,12 @@ body.ttrss_main { .feed_title, .cancel_search { margin-left : 4px; } + + @media (max-width: @breakpoint-md) { + .feed_title, i.icon-syndicate { + display : none; + } + } } .right { @@ -907,11 +913,19 @@ body.ttrss_main { color : @color-accent; } - @media (max-width: 992px) { + @media (max-width: @breakpoint-md) { #selected_prompt { display : none; } } + + @media (max-width: @breakpoint-sm) { + .select-articles-dropdown, + .catchup-button { + display : none; + } + } + } } |