@t2ca/gatsby-theme-showcase 1.0.16 → 1.0.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@t2ca/gatsby-theme-showcase",
-  "version": "1.0.16",
+  "version": "1.0.18",
   "main": "index.js",
   "license": "MIT",
   "devDependencies": {

package/src/components/alert.js

@@ -1,23 +1,41 @@
 /** @jsx jsx */
 import React from "react"
 import { jsx } from "theme-ui"
-import { FaExclamationTriangle } from "react-icons/fa"
+import { FaExclamationTriangle, FaCheckCircle } from "react-icons/fa"
 
-export default props => (
-  <div sx={{ variant: `alerts.error` }}>
-    <FaExclamationTriangle
-      size={40}
-      sx={{
-        flex: `0 0 auto`,
-        width: `auto`,
-        lineHeight: 1,
-        verticalAlign: `middle`,
-        fontSize: `3rem`,
-      }}
-    />
-    <div sx={{ pl: `1rem`, margin: `.5rem` }}>
-      <span sx={{ fontWeight: `extrabold` }}>Sorry, there was a problem.</span>
-      {props.children}
+export default ({ type, message, children }) =>
+  type === "error" ? (
+    <div sx={{ variant: `alerts.${type}` }}>
+      <FaExclamationTriangle
+        size={40}
+        sx={{
+          flex: `0 0 auto`,
+          width: `auto`,
+          lineHeight: 1,
+          verticalAlign: `middle`,
+          fontSize: `3rem`,
+        }}
+      />
+      <div sx={{ pl: `1rem`, margin: `.5rem` }}>
+        <span sx={{ fontWeight: `extrabold` }}>{message}</span>
+        {children}
+      </div>
     </div>
-  </div>
-)
+  ) : (
+    <div sx={{ variant: `alerts.${type}` }}>
+      <FaCheckCircle
+        size={40}
+        sx={{
+          flex: `0 0 auto`,
+          width: `auto`,
+          lineHeight: 1,
+          verticalAlign: `middle`,
+          fontSize: `3rem`,
+        }}
+      />
+      <div sx={{ pl: `1rem`, margin: `.5rem` }}>
+        <span sx={{ fontWeight: `extrabold` }}>{message}</span>
+        {children}
+      </div>
+    </div>
+  )

package/src/components/card.js

@@ -18,6 +18,8 @@ export default props => (
       {props.title}
     </Styled.h4>
     <p>{props.desc}</p>
-    <Button type={props.buttonType}>{props.button}</Button>
+    {props.button ? (
+      <Button type={props.buttonType}>{props.button}</Button>
+    ) : null}
   </Styled.li>
 )

package/src/components/layout.js

@@ -92,12 +92,14 @@ const Layout = ({ header, main, location, children }) => {
         sx={{
           ...main,
           pt: `4.75rem`,
+          pb: [`3.75rem`, `initial`],
         }}
       >
         {children}
+        <Footer />
       </div>
 
-      {location && location.pathname === "/contact/" ? (
+      {/*      {location && location.pathname === "/contact/" ? (
         <div sx={{ display: ["none", "initial"] }}>
           <WrapperMap
             googleMapURL={`https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=geometry,drawing,places&key=AIzaSyBOY0sT1quks122bprrLM_0wrWLDWyVnMQ`}
@@ -120,9 +122,8 @@ const Layout = ({ header, main, location, children }) => {
             }
           />
         </div>
-      ) : null}
+      ) : null}*/}
 
-      <Footer />
       <MobileNavigation />
     </Styled.root>
   )

package/src/gatsby-plugin-theme-ui/index.js

@@ -145,7 +145,23 @@ export default merge(
         }, 0 0 0 0 transparent`,
         opacity: 0.7,
         color: `red.8`,
-        px: `1rem`,
+        p: 3,
+        my: 3,
+        fontWeight: `medium`,
+        display: `flex`,
+        width: `100%`,
+        alignItems: `center`,
+      },
+      success: {
+        borderRadius: `sm`,
+        bg: `green.1`,
+        // border: `1px solid ${tailwind.colors.green[8]}`,
+        boxShadow: t =>
+          `inset 0 0 0 1px ${t.colors.green[8]}, 0 0 0 0 transparent`,
+        opacity: 0.7,
+        color: `green.8`,
+        p: 3,
+        my: 3,
         fontWeight: `medium`,
         display: `flex`,
         width: `100%`,