New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
@eaze/typography
Advanced tools
@eaze/typography - npm Package Compare versions
Comparing version 0.2.2 to 0.2.3
| { | ||
| "name": "@eaze/typography", | ||
| "version": "0.2.2", | ||
| "version": "0.2.3", | ||
| "description": "Styled text components", | ||
@@ -5,0 +5,0 @@ "main": "dist/index.js", |
@@ -1,89 +0,13 @@ | ||
| import React from 'react' | ||
| import styled from 'styled-components' | ||
| import SectionTitle from './section-title' | ||
| import Subtext from './subtext' | ||
| import Title from './title' | ||
| import Label from './label' | ||
| import Text from './text' | ||
| export function Title ({ children, componentStyle, className, color }) { | ||
| const StyledTitle = styled.h1` | ||
| color: ${p => p.color || '#373838'}; | ||
| font-size: 3.2rem; | ||
| line-height: 3.4rem; | ||
| margin: 0; | ||
| font-weight: 800; | ||
| font-family: 'Open Sans', Helvetica; | ||
| ` | ||
| return ( | ||
| <StyledTitle className={className} style={{...componentStyle}} color={color}> | ||
| {children} | ||
| </StyledTitle> | ||
| ) | ||
| } | ||
| export function SectionTitle ({ children, componentStyle, className, color }) { | ||
| const StyledSectionTitle = styled.h2` | ||
| color: ${p => p.color || '#373838'}; | ||
| font-size: 2rem; | ||
| margin: 0; | ||
| font-weight: 800; | ||
| font-family: 'Open Sans', Helvetica; | ||
| ` | ||
| return ( | ||
| <StyledSectionTitle className={className} style={{...componentStyle}} color={color}> | ||
| {children} | ||
| </StyledSectionTitle> | ||
| ) | ||
| } | ||
| export function Text ({ children, componentStyle, className, color }) { | ||
| const StyledText = styled.p` | ||
| color: ${p => p.color || '#373838'}; | ||
| font-size: 1.4rem; | ||
| font-family: 'Open Sans', Helvetica; | ||
| margin: 0; | ||
| ` | ||
| return ( | ||
| <StyledText className={className} style={{...componentStyle}} color={color}> | ||
| {children} | ||
| </StyledText> | ||
| ) | ||
| } | ||
| export function Subtext ({ children, componentStyle, className }) { | ||
| const StyledSubtext = styled.p` | ||
| font-size: 1.2rem; | ||
| font-family: 'Open Sans', Helvetica; | ||
| margin: 0; | ||
| ` | ||
| return ( | ||
| <StyledSubtext className={className} style={{...componentStyle}}> | ||
| {children} | ||
| </StyledSubtext> | ||
| ) | ||
| } | ||
| export function Label ({ content, children, className, ...otherProps}) { | ||
| const StyledLabel = styled.label` | ||
| font-size: 1.2rem; | ||
| font-weight: 400; | ||
| text-transform: uppercase; | ||
| letter-spacing: 0.04rem; | ||
| font-family: 'Open Sans', Helvetica; | ||
| ` | ||
| return ( | ||
| <StyledLabel className={className} {...otherProps}> | ||
| {children} | ||
| {content} | ||
| </StyledLabel> | ||
| ) | ||
| } | ||
| export default { | ||
| export { | ||
| SectionTitle, | ||
| Subtext, | ||
| Title, | ||
| SectionTitle, | ||
| Text, | ||
| Label | ||
| Label, | ||
| Text | ||
| } |
Sorry, the diff of this file is too big to display
New alerts
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by13.19%
96653
- Number of package files
- increased by100%
10
- Lines of code
- increased by92.52%
206
Worsened metrics
- Number of medium supply chain risk alerts
- increased byInfinity%
1
No dependency changes