From f8103171aca791f4aacab8311bad26d6b4773ac2 Mon Sep 17 00:00:00 2001 From: Vitaly Takmazov Date: Tue, 30 Mar 2021 16:18:29 +0300 Subject: Use mobile view where sticky is not supported (ie11) --- src/main/assets/style.css | 112 +++++++++++++++++++++++----------------------- 1 file changed, 57 insertions(+), 55 deletions(-) (limited to 'src/main/assets') diff --git a/src/main/assets/style.css b/src/main/assets/style.css index a1491ed4..43ce7cfa 100644 --- a/src/main/assets/style.css +++ b/src/main/assets/style.css @@ -999,60 +999,62 @@ article p { } @media (--viewport-desktop) { - #column { - position: sticky; - padding: 12px; - height: 100%; - z-index: auto; - overflow-y: auto; - } - article, - .page, - .msg-cont { - width: 640px; - } - #sidebar_wrapper { - position: fixed; - width: 300px; - overflow-y: auto; - height: 100%; - display: flex; - flex-direction: column; - } - #header_wrapper, - #content_wrapper { - width: 1000px; - margin: 0 auto; - } - #content_wrapper { - display: flex; - margin: 66px auto 0; - } - #footer { - padding: 10px; - } - .desktop { - display: block; - } - .mobile { - display: none; - } - #content { - padding-bottom: 12px; - width: 100%; - } - .toolbar { - flex-direction: column; - justify-content: initial; - border-top: initial; - } - .toolbar a, - .l a { - border-top: initial; - border-right: 2px solid transparent; - } - .toolbar a:hover { - border-top: initial; - border-right: 2px solid #ff339a; + @supports (position: sticky) { + #column { + position: sticky; + padding: 12px; + height: 100%; + z-index: auto; + overflow-y: auto; + } + article, + .page, + .msg-cont { + width: 640px; + } + #sidebar_wrapper { + position: fixed; + width: 300px; + overflow-y: auto; + height: 100%; + display: flex; + flex-direction: column; + } + #header_wrapper, + #content_wrapper { + width: 1000px; + margin: 0 auto; + } + #content_wrapper { + display: flex; + margin: 66px auto 0; + } + #footer { + padding: 10px; + } + .desktop { + display: block; + } + .mobile { + display: none; + } + #content { + padding-bottom: 12px; + width: 100%; + } + .toolbar { + flex-direction: column; + justify-content: initial; + border-top: initial; + } + .toolbar a, + .l a { + border-top: initial; + border-right: 2px solid transparent; + } + .toolbar a:hover { + border-top: initial; + border-right: 2px solid #ff339a; + } } } -- cgit v1.2.3