buoy-text - npm Package Compare versions

Comparing version 4.0.4 to 4.0.5

dist/components/HeadingThree.js

@@ -8,3 +8,3 @@ "use strict";
 
-var _templateObject = _taggedTemplateLiteral(["\n  ", ";\n  font-weight: ", ";\n  ", ";\n  ", "\n"], ["\n  ", ";\n  font-weight: ", ";\n  ", ";\n  ", "\n"]);
+var _templateObject = _taggedTemplateLiteral(["\n  ", "\n  font-weight: ", ";\n  ", ";\n"], ["\n  ", "\n  font-weight: ", ";\n  ", ";\n"]);
 
@@ -26,14 +26,13 @@ var _styledComponents = require("styled-components");
 var HeadingThree = _styledComponents2.default.h3(_templateObject, function (props) {
-  return props.longContent ? (0, _buoyTheme.fontSize)("h3") : (0, _buoyTheme.fontSize)("bodyMain");
+  return (0, _buoyTheme.fontSize)(props.fontSize)(props);
 }, function (props) {
-  return props.longContent ? _buoyTheme.fontWeight.light : _buoyTheme.fontWeight.medium;
-}, _Heading2.default, function (props) {
-  return props.longContent && "margin-bottom: 8px;";
-});
+  return props.theme.fonts.weight[props.weight];
+}, _Heading2.default);
 
 HeadingThree.defaultProps = {
   color: "neutralDarkest",
-  longContent: false
+  fontSize: "bodyMain",
+  weight: "medium"
 };
 
 exports.default = HeadingThree;

dist/components/HeadingTwo.js

@@ -8,3 +8,3 @@ "use strict";
 
-var _templateObject = _taggedTemplateLiteral(["\n  ", ";\n  font-weight: ", ";\n  letter-spacing: 0;\n  ", ";\n  ", ";\n  ", "\n"], ["\n  ", ";\n  font-weight: ", ";\n  letter-spacing: 0;\n  ", ";\n  ", ";\n  ", "\n"]);
+var _templateObject = _taggedTemplateLiteral(["\n  ", ";\n  font-weight: ", ";\n  letter-spacing: 0;\n  ", ";\n  ", ";\n"], ["\n  ", ";\n  font-weight: ", ";\n  letter-spacing: 0;\n  ", ";\n  ", ";\n"]);
 
@@ -25,5 +25,3 @@ var _styledComponents = require("styled-components");
 
-var HeadingTwo = _styledComponents2.default.h2(_templateObject, (0, _buoyTheme.fontSize)("h2"), _buoyTheme.fontWeight.light, (0, _buoyTheme.responsive)("max-width", "600px", "600px", "600px", "340px"), _Heading2.default, function (props) {
-  return props.longContent && "" + (0, _buoyTheme.responsive)("margin-bottom", "40px", "40px", "32px", "32px");
-});
+var HeadingTwo = _styledComponents2.default.h2(_templateObject, (0, _buoyTheme.fontSize)("h2"), _buoyTheme.fontWeight.light, (0, _buoyTheme.responsive)("max-width", "600px", "600px", "600px", "340px"), _Heading2.default);
 
@@ -30,0 +28,0 @@ HeadingTwo.defaultProps = {

dist/components/Paragraph.js

@@ -8,3 +8,3 @@ "use strict";
 
-var _templateObject = _taggedTemplateLiteral(["\n  font-family: ", ";\n  ", "\n  font-weight: ", ";\n  line-height: 1.44;\n  letter-spacing: 0.2px;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  color: ", ";\n  ", "\n  ", "\n  ", "\n  ", "\n"], ["\n  font-family: ", ";\n  ", "\n  font-weight: ", ";\n  line-height: 1.44;\n  letter-spacing: 0.2px;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  color: ", ";\n  ", "\n  ", "\n  ", "\n  ", "\n"]);
+var _templateObject = _taggedTemplateLiteral(["\n  font-family: ", ";\n  ", "\n  font-weight: ", ";\n  line-height: 1.44;\n  letter-spacing: 0.2px;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  color: ", ";\n  ", "\n  ", "\n  ", "\n"], ["\n  font-family: ", ";\n  ", "\n  font-weight: ", ";\n  line-height: 1.44;\n  letter-spacing: 0.2px;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  color: ", ";\n  ", "\n  ", "\n  ", "\n"]);
 
@@ -32,4 +32,2 @@ var _styledComponents = require("styled-components");
 }, function (props) {
-  return props.longContent && "margin-bottom: 32px; margin-top:0;}";
-}, function (props) {
   return (0, _buoyTheme.responsive)("max-width", props.maxWidth, props.maxWidth, props.maxWidth, _buoyTheme.breakpoints["sm"] + "px");
@@ -36,0 +34,0 @@ });

package.json

 {
   "name": "buoy-text",
-  "version": "4.0.4",
+  "version": "4.0.5",
   "description": "Basic Buoy text styles",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

src/components/HeadingThree.js

@@ -6,6 +6,5 @@ import styled from "styled-components"
 const HeadingThree = styled.h3`
-  ${props => props.longContent ? fontSize("h3") : fontSize("bodyMain")};
-  font-weight: ${props => props.longContent ? fontWeight.light : fontWeight.medium};
+  ${props => fontSize(props.fontSize)(props)}
+  font-weight: ${props => props.theme.fonts.weight[props.weight]};
   ${Heading};
-  ${props => props.longContent && `margin-bottom: 8px;`}
 `
@@ -15,5 +14,6 @@
   color: "neutralDarkest",
-  longContent: false
+  fontSize: "bodyMain",
+  weight: "medium"
 }
 
 export { HeadingThree as default }

src/components/HeadingTwo.js

@@ -11,3 +11,2 @@ import styled from "styled-components"
   ${Heading};
-  ${props => props.longContent && `${responsive("margin-bottom", "40px", "40px", "32px", "32px")}`}
 `
@@ -14,0 +13,0 @@

src/components/Paragraph.js

@@ -15,3 +15,2 @@ import styled from "styled-components"
   ${props => props.center && `text-align: center;`}
-  ${props => props.longContent && `margin-bottom: 32px; margin-top:0;}`}
   ${props =>
@@ -18,0 +17,0 @@ responsive(

stories.js

@@ -26,4 +26,4 @@ import React from "react"
       <HeadingThree alignLeft>Left Aligned Heading</HeadingThree>
-      <HeadingThree longContent alignLeft>Content subheader</HeadingThree>
-      <Paragraph longContent>Body content. Both nymphs and adult deer ticks can bite and attach themselves to people and transmit Lyme disease. 
+      <HeadingThree alignLeft fontSize="h3" weight="light">Content subheader</HeadingThree>
+      <Paragraph >Body content. Both nymphs and adult deer ticks can bite and attach themselves to people and transmit Lyme disease. 
       Most bites are reported in summer when ticks are most active and more people are spending increased time outdoors. 
@@ -38,11 +38,11 @@ But they also can occur in early autumn, when the weather is still warm, as well as in late winter if the weather is unusually warm. A mild winter helps ticks to thrive and emerge in early spring to find their victims.
       <Paragraph small>Small paragraph example. Lorem ipsum wait I don't know Latin and I'm really not sure what comes next here.</Paragraph>
-      <Paragraph longContent>Example of paragraph in a long content page. Both nymphs and adult deer ticks can bite and attach themselves to people and transmit Lyme disease. 
+      <Paragraph>Example of paragraph in a long content page. Both nymphs and adult deer ticks can bite and attach themselves to people and transmit Lyme disease. 
       Most bites are reported in summer when ticks are most active and more people are spending increased time outdoors. 
       But they also can occur in early autumn, when the weather is still warm, as well as in late winter if the weather is unusually warm. A mild winter helps ticks to thrive and emerge in early spring to find their victims. 
       Most people acquire Lyme disease through the bites of nymphs during the spring and summer months.</Paragraph>
-      <Paragraph longContent>Both nymphs and adult deer ticks can bite and attach themselves to people and transmit Lyme disease. 
+      <Paragraph>Both nymphs and adult deer ticks can bite and attach themselves to people and transmit Lyme disease. 
       Most bites are reported in summer when ticks are most active and more people are spending increased time outdoors. 
       But they also can occur in early autumn, when the weather is still warm, as well as in late winter if the weather is unusually warm. A mild winter helps ticks to thrive and emerge in early spring to find their victims. 
       Most people acquire Lyme disease through the bites of nymphs during the spring and summer months.</Paragraph>
-      <Paragraph large>Example of a large copy. can bite and attach themselves to people and transmit Lyme disease. 
+      <Paragraph>Example of a large copy. can bite and attach themselves to people and transmit Lyme disease. 
       Most bites are reported in summer when ticks are most active and more people are spending increased time outdoors. 
@@ -49,0 +49,0 @@ But they also can occur in early autumn, when the weather is still warm, as well as in late winter if the weather is unusually warm. A mild winter helps ticks to thrive and emerge in early spring to find their victims.

No alert changes

Worsened metrics

Total package byte prevSize

25882

decreased by-2.59%

Lines of code

473

decreased by-1.46%

No dependency changes