From e31f62a818ae32f7099c40586017a8b4bf7d8f3f Mon Sep 17 00:00:00 2001 From: Corey Gray Date: Fri, 4 May 2018 13:06:58 -0800 Subject: [PATCH] Add responsive margins to pets and mounts. (#10311) * Add responsive margins to pets and mounts. * Move all margins to margin-right to make left edges flush. --- website/client/assets/scss/item.scss | 20 +++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/website/client/assets/scss/item.scss b/website/client/assets/scss/item.scss index 9b8bd68e79..20dd7d0e16 100644 --- a/website/client/assets/scss/item.scss +++ b/website/client/assets/scss/item.scss @@ -20,7 +20,25 @@ } .item.pet-slot { - margin: 0 2px; + // Desktop XL (1440) + @media only screen and (min-width: 1440px){ + margin-right: 1.71em; + } + + // Desktop L (1280) + @media only screen and (min-width: 1280px) and (max-width: 1439px) { + margin-right: 0.43em; + } + + // Desktop M (1024) + @media only screen and (min-width: 1024px) and (max-width: 1279px) { + margin-right: 0.86em; + } + + // Tablets and mobile + @media only screen and (max-width: 1023px) { + margin-right: 1.71em; + } } .item {