Merge pull request #76 from PMET-public/develop

Develop
PMET-public · Feb 11, 2021 · bed8bd1 · bed8bd1
2 parents 343d65e + c50b347
commit bed8bd1
Show file tree

Hide file tree

Showing 7 changed files with 31 additions and 20 deletions.
diff --git a/components/PageBuilder/ContentTypes/ButtonItem/ButtonItem.styled.tsx b/components/PageBuilder/ContentTypes/ButtonItem/ButtonItem.styled.tsx
@@ -3,18 +3,6 @@ import styled from 'styled-components'
 import { Root as ButtonRoot } from '@storystore/ui/dist/components/Button/Button.styled'
 
 export const Root = styled.div<{ $appearance?: string; $secondary?: boolean; $link?: boolean; $maxWidth?: number }>`
-    &:not(:last-child) {
-        ${props =>
-            props.$appearance === 'inline'
-                ? `
-                    margin-inline-end: 1rem;
-                    margin-bottom: 1rem;
-                `
-                : `
-                    margin-bottom: 1rem;
-                `}
-    }
-
     ${ButtonRoot} {
         background-color: ${props => (props.$secondary ? props.theme.colors.secondary : props.theme.colors.primary)};
         color: ${props => (props.$secondary ? props.theme.colors.onSecondary : props.theme.colors.onPrimary)};

diff --git a/components/PageBuilder/ContentTypes/Buttons/Buttons.styled.tsx b/components/PageBuilder/ContentTypes/Buttons/Buttons.styled.tsx
@@ -1,6 +1,10 @@
 import styled from 'styled-components'
 
 export const Root = styled.div<{ $appearance: 'inline' | 'stacked'; $sameWidth: boolean; $alignment?: string }>`
+    gap: 1rem;
+    display: inline-flex;
+    flex-wrap: wrap;
+
     ${props =>
         props.$appearance === 'stacked' &&
         `

diff --git a/components/PageBuilder/ContentTypes/Image/Image.styled.tsx b/components/PageBuilder/ContentTypes/Image/Image.styled.tsx
@@ -1,12 +1,18 @@
 import styled from 'styled-components'
 import Image from '@storystore/ui/dist/components/Image'
+import ImageRoot from '@storystore/ui/dist/components/Image/Image.styled'
 
 export const Root = styled.div`
     & img,
     & object,
     & video {
         max-height: 100%;
         max-width: 100%;
+        height: auto;
+    }
+
+    & ${ImageRoot} > div {
+        display: inline-block;
     }
 `
 

diff --git a/components/PageBuilder/ContentTypes/Image/Image.tsx b/components/PageBuilder/ContentTypes/Image/Image.tsx
@@ -14,7 +14,7 @@ export type ImageProps = {
 export const Image: Component<ImageProps> = ({ caption, link, image, ...props }) => {
     return (
         <Root as={link ? (p: any) => <Link {...link} {...p} /> : 'div'} {...props}>
-            <Img {...image} />
+            <Img originalWidthAndHeight {...image} />
             {caption && <Caption as="figcaption">{caption}</Caption>}
         </Root>
     )

diff --git a/components/PageBuilder/PageBuilder.styled.tsx b/components/PageBuilder/PageBuilder.styled.tsx
@@ -31,33 +31,45 @@ export const Root = styled.div`
     }
 
     & h1 {
-        font-size: 4rem;
         font-weight: ${props => props.theme.typography.heading.weight.bolder};
+        font-size: 2.6rem;
+        margin-top: 0rem;
+        margin-bottom: 2rem;
     }
 
     & h2 {
-        font-size: 3rem;
         font-weight: ${props => props.theme.typography.heading.weight.bolder};
+        font-size: 2.6rem;
+        margin-top: 2.5rem;
+        margin-bottom: 2rem;
     }
 
     & h3 {
-        font-size: 2.6rem;
         font-weight: ${props => props.theme.typography.heading.weight.bold};
+        font-size: 1.8rem;
+        margin-top: 2rem;
+        margin-bottom: 1rem;
     }
 
     & h4 {
-        font-size: 2.4rem;
         font-weight: ${props => props.theme.typography.heading.weight.bold};
+        font-size: 1.4rem;
+        margin-top: 2rem;
+        margin-bottom: 2rem;
     }
 
     & h5 {
-        font-size: 2rem;
         font-weight: ${props => props.theme.typography.heading.weight.bold};
+        font-size: 1.2rem;
+        margin-top: 2rem;
+        margin-bottom: 2rem;
     }
 
     & h6 {
-        font-size: 1.8rem;
         font-weight: ${props => props.theme.typography.heading.weight.bold};
+        font-size: 1rem;
+        margin-top: 2rem;
+        margin-bottom: 2rem;
     }
 `
 

diff --git a/lib/apollo/possibleTypes.json b/lib/apollo/possibleTypes.json
@@ -0,0 +1 @@
+{"CartAddressInterface":["BillingCartAddress","ShippingCartAddress"],"CartItemInterface":["SimpleCartItem","VirtualCartItem","DownloadableCartItem","BundleCartItem","ConfigurableCartItem"],"ProductInterface":["VirtualProduct","SimpleProduct","DownloadableProduct","GiftCardProduct","BundleProduct","GroupedProduct","ConfigurableProduct"],"CategoryInterface":["CategoryTree"],"MediaGalleryInterface":["ProductImage","ProductVideo"],"ProductLinksInterface":["ProductLinks"],"AggregationOptionInterface":["AggregationOption"],"LayerFilterItemInterface":["LayerFilterItem","SwatchLayerFilterItem"],"PhysicalProductInterface":["SimpleProduct","GiftCardProduct","BundleProduct","GroupedProduct","ConfigurableProduct"],"CustomizableOptionInterface":["CustomizableAreaOption","CustomizableDateOption","CustomizableDropDownOption","CustomizableMultipleOption","CustomizableFieldOption","CustomizableFileOption","CustomizableRadioOption","CustomizableCheckboxOption"],"CustomizableProductInterface":["VirtualProduct","SimpleProduct","DownloadableProduct","GiftCardProduct","BundleProduct","ConfigurableProduct"],"SwatchDataInterface":["ImageSwatchData","TextSwatchData","ColorSwatchData"],"SwatchLayerFilterItemInterface":["SwatchLayerFilterItem"]}
diff --git a/package.json b/package.json
@@ -24,7 +24,7 @@
   },
   "dependencies": {
     "@apollo/client": "^3.0.2",
-    "@storystore/ui": "1.3.0-beta25",
+    "@storystore/ui": "1.3.0-beta26",
     "@types/semver": "^7.2.0",
     "@types/sharp": "^0.25.1",
     "apollo-link-queue": "^2.2.0",
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		{"CartAddressInterface":["BillingCartAddress","ShippingCartAddress"],"CartItemInterface":["SimpleCartItem","VirtualCartItem","DownloadableCartItem","BundleCartItem","ConfigurableCartItem"],"ProductInterface":["VirtualProduct","SimpleProduct","DownloadableProduct","GiftCardProduct","BundleProduct","GroupedProduct","ConfigurableProduct"],"CategoryInterface":["CategoryTree"],"MediaGalleryInterface":["ProductImage","ProductVideo"],"ProductLinksInterface":["ProductLinks"],"AggregationOptionInterface":["AggregationOption"],"LayerFilterItemInterface":["LayerFilterItem","SwatchLayerFilterItem"],"PhysicalProductInterface":["SimpleProduct","GiftCardProduct","BundleProduct","GroupedProduct","ConfigurableProduct"],"CustomizableOptionInterface":["CustomizableAreaOption","CustomizableDateOption","CustomizableDropDownOption","CustomizableMultipleOption","CustomizableFieldOption","CustomizableFileOption","CustomizableRadioOption","CustomizableCheckboxOption"],"CustomizableProductInterface":["VirtualProduct","SimpleProduct","DownloadableProduct","GiftCardProduct","BundleProduct","ConfigurableProduct"],"SwatchDataInterface":["ImageSwatchData","TextSwatchData","ColorSwatchData"],"SwatchLayerFilterItemInterface":["SwatchLayerFilterItem"]}