From 8de6e10f0b7e2694942e0ccb4435358b32098eac Mon Sep 17 00:00:00 2001 From: "Luke Audie (y7883)" Date: Wed, 18 Jan 2017 19:45:05 +0700 Subject: [PATCH 1/4] #1695 --- .../plugins/included/default-theme/client/styles/items.less | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/imports/plugins/included/default-theme/client/styles/items.less b/imports/plugins/included/default-theme/client/styles/items.less index b24199e1122..dff50a3a783 100644 --- a/imports/plugins/included/default-theme/client/styles/items.less +++ b/imports/plugins/included/default-theme/client/styles/items.less @@ -70,6 +70,10 @@ .rui.items.flex .item.half { flex: 1 1 50%; + + @media @mobile { + -webkit-flex-basis: 100%; + } } .rui.items.flex .item.three-quarters { From 6a1aaa105b395f2b0861b54e699f601f106c6b51 Mon Sep 17 00:00:00 2001 From: "Luke Audie (y7883)" Date: Wed, 18 Jan 2017 19:45:22 +0700 Subject: [PATCH 2/4] #1695 --- .../default-theme/client/styles/products/productGrid.less | 1 + 1 file changed, 1 insertion(+) diff --git a/imports/plugins/included/default-theme/client/styles/products/productGrid.less b/imports/plugins/included/default-theme/client/styles/products/productGrid.less index aa47d9406d6..b73ee463502 100644 --- a/imports/plugins/included/default-theme/client/styles/products/productGrid.less +++ b/imports/plugins/included/default-theme/client/styles/products/productGrid.less @@ -158,6 +158,7 @@ @media screen and (max-width: @screen-xs-max) { max-width: 100%; + -webkit-flex-basis: 100%; .product-grid-item-images { height: 225px; From 52b4ca7da89e4d47e2ba85f62a8b230e4c546d21 Mon Sep 17 00:00:00 2001 From: "Luke Audie (y7883)" Date: Wed, 18 Jan 2017 19:45:34 +0700 Subject: [PATCH 3/4] #1695 --- .../included/default-theme/client/styles/search/results.less | 1 + 1 file changed, 1 insertion(+) diff --git a/imports/plugins/included/default-theme/client/styles/search/results.less b/imports/plugins/included/default-theme/client/styles/search/results.less index 4a077d7026c..89feb1008b4 100644 --- a/imports/plugins/included/default-theme/client/styles/search/results.less +++ b/imports/plugins/included/default-theme/client/styles/search/results.less @@ -383,6 +383,7 @@ @media screen and (max-width: @screen-xs-max) { max-width: 100%; + -webkit-flex-basis: 100%; .product-grid-item-images { height: 225px; From ba49e97b5c1fe31644b7fd933ff57a508afae03c Mon Sep 17 00:00:00 2001 From: "Luke Audie (y7883)" Date: Thu, 19 Jan 2017 17:52:23 +0700 Subject: [PATCH 4/4] #1710 - Cart Icon styling Cart icon padding reduced to fit on media @screen-xs-max Cart icon margin removed so it now sits flush to right edge of screen and signin button #1710 - Menu icons styling (Safari) search and notification icons centered in buttons #1710 - Menu drop-downs ltr screen - menus go left rtf screen - menus go right Menus (i.e. notification) can now be displayed on 480px screens --- .../client/styles/cart/cartIcon.less | 6 ++-- .../default-theme/client/styles/navbar.less | 23 +++++++++++++- .../notifications/client/styles/dropdown.css | 30 ++++++++++++++++--- 3 files changed, 52 insertions(+), 7 deletions(-) diff --git a/imports/plugins/included/default-theme/client/styles/cart/cartIcon.less b/imports/plugins/included/default-theme/client/styles/cart/cartIcon.less index ff1b18fd015..6ccd7f4255b 100644 --- a/imports/plugins/included/default-theme/client/styles/cart/cartIcon.less +++ b/imports/plugins/included/default-theme/client/styles/cart/cartIcon.less @@ -1,5 +1,4 @@ .cart-icon { - .margin-left(2px); color: @cart-icon-text; border: @cart-icon-border; padding: @cart-icon-padding; @@ -17,7 +16,6 @@ background-color: lighten(@cart-icon-bg, 2%); } - .badge { position: absolute; bottom: 4px; @@ -32,6 +30,10 @@ padding:2px 8px 2px 8px; background-color: @cart-icon-badge-warning; } + + @media screen and (max-width: @screen-xs-max) { + padding: 10px; + } } .cart-alert{ .float(right); diff --git a/imports/plugins/included/default-theme/client/styles/navbar.less b/imports/plugins/included/default-theme/client/styles/navbar.less index 927527fb456..206f7bb2c29 100644 --- a/imports/plugins/included/default-theme/client/styles/navbar.less +++ b/imports/plugins/included/default-theme/client/styles/navbar.less @@ -17,6 +17,10 @@ text-decoration: none; } +.rui.navbar .button { + display: inline-block; +} + .rui.navbar .showmenu { display: none; .flex(0 0 auto); @@ -60,6 +64,12 @@ .flex(0 0 auto); position: relative; cursor: pointer; + right: -1px; +} + +.rtl .rui.navbar .cart { + right: auto !important; + left: -1px; } .rui.navbar .dropdown a { @@ -96,7 +106,18 @@ } .rui.navbar .languages .dropdown-menu { - margin-top: 0; + margin-top: 0px; + min-width: 250px !important; +} + +html:not(.rtl) .rui.navbar .languages .dropdown-menu { + left: auto !important; + right: 0px; +} + +.rtl .rui.navbar .languages .dropdown-menu { + left: 0px; + right: auto !important; } .rui.navbar .languages li, diff --git a/imports/plugins/included/notifications/client/styles/dropdown.css b/imports/plugins/included/notifications/client/styles/dropdown.css index a8fd1ce6f8d..d1568fc88ae 100644 --- a/imports/plugins/included/notifications/client/styles/dropdown.css +++ b/imports/plugins/included/notifications/client/styles/dropdown.css @@ -31,12 +31,35 @@ left: 10px; position: relative; } -.dropdown .notify-drop.dropdown-menu { - padding:0px; + +.dropdown .notify-drop.dropdown-menu { + padding: 0px; + margin-top: 0px; + min-width: 250px !important; +} + +html:not(.rtl) .dropdown .notify-drop.dropdown-menu { + left: auto !important; + right: 0px; +} + +.rtl .dropdown .notify-drop.dropdown-menu { + right: auto !important; + left: 0px; +} + +@media (max-width: 480px) { + html:not(.rtl) .dropdown .notify-drop.dropdown-menu { + right: -75px !important; + } + + .rtl .dropdown .notify-drop.dropdown-menu { + left: -75px !important; + } } @media (max-width: 767px ) { - .dropdown .notify-drop.dropdown-menu { + .dropdown .notify-drop.dropdown-menu { padding:0px; left: -20px !important; } @@ -291,7 +314,6 @@ a.notification:hover { background: #eeeeee; } .notification-icon { - margin-right: 6.8775px; } .notification-icon:after { position: absolute;