Skip to content
This repository has been archived by the owner on Mar 16, 2024. It is now read-only.

Commit

Permalink
feat: improve typography
Browse files Browse the repository at this point in the history
  • Loading branch information
@luangjokaj
luangjokaj committed Jan 5, 2021
1 parent 5f8032b commit 5f542a8
Show file tree
Hide file tree
Showing 6 changed files with 32 additions and 5 deletions.
2 changes: 1 addition & 1 deletion dist/cherry.css
View file

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "cherry-postcss",
"version": "0.0.1-0",
"version": "0.0.1-1",
"description": "Cherry for PostCSS",
"author": "Luan Gjokaj <luan@riangle.com>",
"homepage": "https://cherry.design",
Expand Down
2 changes: 1 addition & 1 deletion src/cherry.css
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
@import "./theme";
@import "./globals";
@import "./helpers";
@import "./globals";
@import "./typography";
@import "./buttons";
@import "./inputs";
Expand Down
7 changes: 7 additions & 0 deletions src/helpers.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@
@define-mixin font-eyebrow {
font-size: var(--size-eyebrow-mobile);
line-height: var(--lineheight-eyebrow-mobile);
font-weight: 600;

@media (min-width: var(--screen-lg) ){
font-size: var(--size-eyebrow-desktop);
Expand All @@ -32,6 +33,7 @@
@define-mixin font-subtitle {
font-size: var(--size-subtitle-mobile);
line-height: var(--lineheight-subtitle-mobile);
font-weight: 600;

@media (min-width: var(--screen-lg) ){
font-size: var(--size-subtitle-desktop);
Expand All @@ -42,6 +44,7 @@
@define-mixin font-button {
font-size: var(--size-button-mobile);
line-height: var(--lineheight-button-mobile);
font-weight: 600;

@media (--screen-lg) {
font-size: var(--size-button-desktop);
Expand All @@ -52,6 +55,7 @@
@define-mixin font-button-big {
font-size: var(--size-button-big-mobile);
line-height: var(--lineheight-button-big-mobile);
font-weight: 600;

@media (--screen-lg) {
font-size: var(--size-button-big-desktop);
Expand All @@ -62,6 +66,7 @@
@define-mixin font-lead {
font-size: var(--size-lead-mobile);
line-height: var(--lineheight-lead-mobile);
font-weight: 400;

@media (--screen-lg) {
font-size: var(--size-lead-desktop);
Expand All @@ -72,6 +77,7 @@
@define-mixin font-input {
font-size: var(--size-input-mobile);
line-height: var(--lineheight-input-mobile);
font-weight: 400;

@media (--screen-lg) {
font-size: var(--size-input-desktop);
Expand All @@ -82,6 +88,7 @@
@define-mixin font-input-big {
font-size: var(--size-input-big-mobile);
line-height: var(--lineheight-input-big-mobile);
font-weight: 400;

@media (--screen-lg) {
font-size: var(--size-input-big-desktop);
Expand Down
20 changes: 20 additions & 0 deletions src/inputs.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -152,3 +152,23 @@ select {
min-height: 55px;
}
}

label {
color: var(--color-gray);
display: inline-block;
vertical-align: middle;
padding: 0;
margin: 0;

&[for] {
padding: 0 0 0 7px;
}

&.error {
color: var(--color-error);
}

&.success {
color: var(--color-success);
}
}

0 comments on commit 5f542a8

Please sign in to comment.