polaris_view_components 0.13.5 → 1.0.0

data/app/assets/stylesheets/polaris_view_components/{custom.css → custom.pcss}

@@ -5,7 +5,7 @@
 /* Add missing 1/4 section for layout */
 @media (min-width: 30.625em) {
   .Polaris-Layout__Section--oneFourth {
-    flex: 1 1 20rem;
+    flex: 1 1 13rem;
     min-width: 0;
   }
 }
@@ -22,10 +22,10 @@ a.Polaris-Tag__Button {
 }
 
 /* CardSection borders */
-.Polaris-Card__Section--borderTop {
+.Polaris-LegacyCard__Section--borderTop {
   border-top: 0.1rem solid var(--p-divider);
 }
-.Polaris-Card__Section--borderBottom {
+.Polaris-LegacyCard__Section--borderBottom {
   border-bottom: 0.1rem solid var(--p-divider);
 }
 
@@ -42,17 +42,12 @@ a.Polaris-Tag__Button {
     box-shadow: none !important;
   }
 }
-.Polaris-Tabs__Tab {
-  &:focus:not(:focus-visible) > .Polaris-Tabs__Title::after {
+.Polaris-LegacyTabs__Tab {
+  &:focus:not(:focus-visible) > .Polaris-LegacyTabs__Title::after {
     box-shadow: none !important;
   }
 }
 
-/* ResourceItem */
-.Polaris-ResourceItem__Owned--offset {
-  padding-left: 2rem;
-}
-
 /* Popover */
 .Polaris-Popover {
   margin: 0;
@@ -121,7 +116,7 @@ a.Polaris-Tag__Button {
       justify-content: center;
       text-align: center;
 
-      .Polaris-Stack.Polaris-Stack--alignmentCenter {
+      .Polaris-LegacyStack.Polaris-LegacyStack--alignmentCenter {
         justify-content: center;
       }
     }
@@ -195,3 +190,64 @@ a.Polaris-Tag__Button {
 .Polaris-ActionList__Item {
   border: none !important;
 }
+
+/* ResourceItem Actions + Disclosure */
+
+.Polaris-ResourceItem__Actions {
+  display: none;
+}
+.Polaris-ResourceItem:hover .Polaris-ResourceItem__Actions {
+  display: flex;
+}
+@media (max-width: 45em), (min-width: 48.0625em) and (max-width: 61.5em) {
+  [data-has-navigation] .Polaris-ResourceItem__Actions {
+    display: none !important;
+  }
+}
+@media (max-width: 46.5em) {
+  .Polaris-ResourceItem__Actions {
+    display: none !important;
+  }
+}
+
+.Polaris-ResourceItem--persistActions .Polaris-ResourceItem__Actions {
+  display: flex;
+}
+@media (max-width: 45em), (min-width: 48.0625em) and (max-width: 61.5em) {
+  [data-has-navigation] .Polaris-ResourceItem--persistActions .Polaris-ResourceItem__Actions {
+    display: none !important;
+  }
+}
+@media (max-width: 46.5em) {
+  .Polaris-ResourceItem--persistActions .Polaris-ResourceItem__Actions {
+    display: none !important;
+  }
+}
+
+.Polaris-ResourceItem__Disclosure {
+  position: relative;
+  top: -0.7rem;
+  right: -1.65rem;
+  display: none;
+  width: 4.8rem;
+  pointer-events: initial;
+}
+.Polaris-ResourceItem--selectMode .Polaris-ResourceItem__Disclosure {
+  display: none;
+}
+@media (max-width: 45em), (min-width: 48.0625em) and (max-width: 61.5em) {
+  [data-has-navigation] .Polaris-ResourceItem__Disclosure {
+    display: flex;
+    flex: 0 0 4.8rem;
+    justify-content: center;
+    align-items: center;
+  }
+}
+@media (max-width: 46.5em) {
+  .Polaris-ResourceItem__Disclosure {
+    display: flex;
+    flex: 0 0 4.8rem;
+    justify-content: center;
+    align-items: center;
+  }
+}

data/app/assets/stylesheets/polaris_view_components/{shopify_navigation.css → shopify_navigation.pcss}

@@ -1,45 +1,43 @@
 .shp-Navigation {
   margin: 0 auto;
-  padding: 0 2rem;
-  max-width: 99.8rem;
-  max-width: none;
-  border-bottom: .1rem solid var(--p-border-subdued)
+  padding: 0 20px;
+  border-bottom: 1px solid var(--p-border-subdued);
 }
 
 @media (max-width: 48.0625em) and (min-width: 30.625em),(min-width: 45.625em) {
   .shp-Navigation {
-    padding: 0 2rem
+    padding: 0 20px;
   }
 }
 
 @media (min-width: 30.625em) {
   .shp-Navigation {
-    padding: 0 2rem
+    padding: 0 20px;
   }
 }
 
 @media (max-width: 48.0625em) and (min-width: 46.5em),(min-width: 61.5em) {
   .shp-Navigation {
-    padding: 0 3.2rem
+    padding: 0 32px;
   }
 }
 
 @media (min-width: 46.5em) {
   .shp-Navigation {
-    padding: 0 3.2rem
+    padding: 0 32px;
   }
 }
 
 @media (max-width: 30.5625em) {
   .shp-Navigation {
-    padding: 0 1.6rem
+    padding: 0 16px;
   }
 }
 
 .shp-Navigation_Items {
   display: flex;
   margin: 0;
-  padding: 0 .2rem;
+  padding: 0 2px;
   list-style: none
 }
 
@@ -58,11 +56,9 @@
   padding: 0;
   background: none;
   border: none;
-  font-size: inherit;
-  line-height: inherit;
-  font-size: 1.5rem;
+  font-size: 15px;
   font-weight: 400;
-  line-height: 2rem;
+  line-height: 20px;
   text-transform: none;
   letter-spacing: normal;
   color: var(--p-text-subdued);
@@ -73,47 +69,47 @@
   min-width: 100%;
   margin-top: 1px;
   margin-bottom: -1px;
-  padding: 0 1.6rem;
+  padding: 0 16px;
   outline: none;
   text-align: center;
   white-space: nowrap;
   text-decoration: none;
-  cursor: pointer
+  cursor: pointer;
 }
 
 .shp-Navigation_Link:visited {
-  color: inherit
+  color: inherit;
 }
 
 .shp-Navigation_Link:focus {
-  outline: none
+  outline: none;
 }
 
 @media (min-width: 40em) {
   .shp-Navigation_Link {
-    font-size: 1.4rem
+    font-size: 14px;
   }
 }
 
 .shp-Navigation_Link:hover {
-  text-decoration: none
+  text-decoration: none;
 }
 
 .shp-Navigation_Link:hover .shp-Navigation_LinkText {
   font-weight: 400;
   color: var(--p-text);
   text-decoration: none;
-  border-bottom: .3rem solid var(--p-action-primary)
+  border-bottom: 3px solid var(--p-action-primary);
 }
 
 .shp-Navigation_Link:focus .shp-Navigation_LinkText {
   font-weight: 400;
-  color: var(--p-text)
+  color: var(--p-text);
 }
 
 .shp-Navigation_LinkText {
-  padding: 1.6rem 0 1.3rem 0;
-  border-bottom: .3rem solid transparent
+  padding: 16px 0 13px 0;
+  border-bottom: 3px solid transparent;
 }
 
 .shp-Navigation_LinkText {
@@ -123,10 +119,10 @@
 [aria-selected='true'],
 .shp-Navigation_Link:focus .shp-Navigation_LinkText {
   font-weight: 400;
-  color: var(--p-text)
+  color: var(--p-text);
 }
 
 [aria-selected='true'] .shp-Navigation_LinkText {
   color: var(--p-action-primary);
-  border-bottom: .3rem solid var(--p-action-primary)
+  border-bottom: 3px solid var(--p-action-primary);
 }