diff --git a/skins/elastic/README.md b/skins/elastic/README.md index 33fcf50d2..1150e30c7 100644 --- a/skins/elastic/README.md +++ b/skins/elastic/README.md @@ -93,7 +93,7 @@ FOR DEVELOPERS Can be used for example for functionality not implemented or that has no sense on phones or touch devices. Contains a comma-separated list following values: `large` (width > 1200px), `big` (width > 768px), `small` (width =< 768px), - `phone` (width =< 480px). + `phone` (width =< 480px), `lbs` (width > 480px). - `data-content-button`: Makes the action button with this attribute to be copied to the content frame header on small/phone screens. diff --git a/skins/elastic/styles/layout.less b/skins/elastic/styles/layout.less index 469011454..996a4ca26 100644 --- a/skins/elastic/styles/layout.less +++ b/skins/elastic/styles/layout.less @@ -292,8 +292,15 @@ html.layout-small { } } +html.layout-small { + .hidden-lbs { + display: none !important; + } +} + html.layout-large, html.layout-normal { + .hidden-lbs, .hidden-big { display: none !important; } diff --git a/skins/elastic/ui.js b/skins/elastic/ui.js index a73b3f0a5..c183f4138 100644 --- a/skins/elastic/ui.js +++ b/skins/elastic/ui.js @@ -283,7 +283,7 @@ function rcube_elastic_ui() $('[data-hidden]').each(function() { var m, v = $(this).data('hidden'), parent = $(this).parent('li'), - re = /(large|big|small|phone)/g; + re = /(large|big|small|phone|lbs)/g; while (m = re.exec(v)) { $(parent.length ? parent : this).addClass('hidden-' + m[1]);