Skip to content

Commit

Permalink
Quadrat: Add new heading sizes and other small misc changes (#3649)
Browse files Browse the repository at this point in the history 
* Quadrat: Add new heading sizes

* Quadrat: Further work on Lists and Quotes

* Quadrat: Remove whitespace

* Quadrat: Add responsive Heading font-sizes
  • Loading branch information
@danieldudzic @scruffian
danieldudzic authored and scruffian committed Apr 26, 2021
1 parent 9431318 commit be40736
Show file tree
Hide file tree
Showing 7 changed files with 245 additions and 65 deletions.
134 changes: 133 additions & 1 deletion quadrat/child-experimental-theme.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,18 +74,150 @@
},
"custom": {
"fontsToLoadFromGoogle": [
"family=Poppins:ital,wght@0,400;0,600;1,400"
"family=Poppins:ital,wght@0,300;0,400;0,500;0,600;1,400"
],
"color": {
"primary": "var(--wp--preset--color--pink)",
"secondary": "var(--wp--preset--color--darker-blue)",
"foreground": "var(--wp--preset--color--pink)",
"background": "var(--wp--preset--color--blue)",
"selection": "var(--wp--preset--color--darker-blue)"
},
"margin": {
"horizontal": "20px"
},
"line-height": {
"body": 1.6,
"headings": {
"h1": 1.2,
"h2": 1.2,
"h3": 1.2,
"h4": 1.4,
"h5": 1.4,
"h6": 1.4
}
},
"button": {
"typography": {
"fontWeight": "600",
"fontSize": "20px"
},
"border": {
"radius": "0"
},
"color": {
"text": "var(--wp--preset--color--blue)",
"background": "var(--wp--preset--color--pink)",
"hoverText": "var(--wp--custom--color--pink)",
"hoverBackground": "transparent"
}
},
"paragraph": {
"dropcap": {
"margin": "0 .2em .2em 0",
"typography": {
"fontSize": "var(--wp--preset--font-size--huge)",
"fontWeight": "300"
}
}
},
"list": {
"padding": {
"left": "calc( 2 * var(--wp--custom--margin--horizontal) )"
}
},
"quote": {
"citation": {
"typography": {
"fontWeight": "300",
"fontSize": "var(--wp--preset--font-size--tiny)",
"fontStyle": "normal"
}
}
}
}
}
},
"styles": {
"root": {
"color": {
"link": "var(--wp--custom--color--foreground)"
},
"typography": {
"fontWeight": "300",
"fontSize": "20px",
"lineHeight": "var(--wp--custom--line-height--body)"
}
},
"core/button": {
"color": {
"text": "var(--wp--custom--button--color--text)",
"background": "var(--wp--custom--button--color--background)"
},
"typography": {
"fontSize": "var(--wp--custom--button--typography--font-size)"
},
"border": {
"radius": "var(--wp--custom--button--border--radius)"
}
},
"core/heading/h1": {
"typography": {
"fontWeight": "500",
"fontSize": "min(max(48px, 5vw), 80px)",
"lineHeight": "var(--wp--custom--line-height--headings--h1)"
}
},
"core/heading/h2": {
"typography": {
"fontWeight": "500",
"fontSize": "min(max(36px, 5vw), 65px)",
"lineHeight": "var(--wp--custom--line-height--headings--h2)"
}
},
"core/heading/h3": {
"typography": {
"fontWeight": "500",
"fontSize": "min(max(28px, 5vw), 38px)",
"lineHeight": "var(--wp--custom--line-height--headings--h3)"
}
},
"core/heading/h4": {
"typography": {
"fontWeight": "500",
"fontSize": "20px",
"lineHeight": "var(--wp--custom--line-height--headings--h4)"
}
},
"core/heading/h5": {
"typography": {
"fontSize": "18px",
"lineHeight": "var(--wp--custom--line-height--headings--h5)"
}
},
"core/heading/h6": {
"typography": {
"fontSize": "16px",
"lineHeight": "vvar(--wp--custom--line-height--headings--h6)"
}
},
"core/post-title/h1": {
"typography": {
"fontWeight": "500",
"fontSize": "min(max(36px, 5vw), 65px)",
"lineHeight": "var(--wp--custom--line-height--headings--h2)"
}
},
"core/quote": {
"typography": {
"fontWeight": "normal",
"fontStyle": "normal"
},
"border": {
"color": "var(--wp--custom--color--primary)",
"style": "solid",
"width": "0 0 0 2px"
}
}
}
}
93 changes: 54 additions & 39 deletions quadrat/experimental-theme.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -103,27 +103,27 @@
},
"margin": {
"baseline": "10px",
"horizontal": "30px",
"horizontal": "20px",
"vertical": "30px"
},
"alignment": {
"alignedMaxWidth": "50%"
},
"button": {
"typography": {
"fontWeight": "normal",
"fontWeight": "600",
"fontFamily": "var(--wp--preset--font-family--base)",
"fontSize": "var(--wp--preset--font-size--normal)",
"fontSize": "20px",
"lineHeight": 2
},
"border": {
"radius": "4px"
"radius": "0"
},
"color": {
"text": "var(--wp--custom--color--background)",
"background": "var(--wp--custom--color--secondary)",
"hoverText": "var(--wp--custom--color--background)",
"hoverBackground": "#006ba1"
"text": "var(--wp--preset--color--blue)",
"background": "var(--wp--preset--color--pink)",
"hoverText": "var(--wp--custom--color--pink)",
"hoverBackground": "transparent"
}
},
"form": {
Expand All @@ -150,11 +150,11 @@
},
"paragraph": {
"dropcap": {
"margin": ".1em .1em 0 0",
"margin": "0 .2em .2em 0",
"typography": {
"fontFamily": "var(--wp--preset--font-family--base)",
"fontSize": "110px",
"fontWeight": "400"
"fontSize": "var(--wp--preset--font-size--huge)",
"fontWeight": "300"
}
}
},
Expand All @@ -170,7 +170,8 @@
"citation": {
"typography": {
"fontSize": "var(--wp--preset--font-size--tiny)",
"fontStyle": "italic"
"fontStyle": "normal",
"fontWeight": "300"
}
}
},
Expand Down Expand Up @@ -274,8 +275,19 @@
}
},
"fontsToLoadFromGoogle": [
"family=Poppins:ital,wght@0,400;0,600;1,400"
]
"family=Poppins:ital,wght@0,300;0,400;0,500;0,600;1,400"
],
"line-height": {
"body": 1.6,
"headings": {
"h1": 1.2,
"h2": 1.2,
"h3": 1.2,
"h4": 1.4,
"h5": 1.4,
"h6": 1.4
}
}
}
}
},
Expand All @@ -292,12 +304,13 @@
"color": {
"background": "var(--wp--custom--color--background)",
"text": "var(--wp--custom--color--foreground)",
"link": "var(--wp--custom--color--secondary)"
"link": "var(--wp--custom--color--foreground)"
},
"typography": {
"fontSize": "var(--wp--preset--font-size--normal)",
"lineHeight": 1.6,
"fontFamily": "var(--wp--preset--font-family--base)"
"fontSize": "20px",
"lineHeight": "var(--wp--custom--line-height--body)",
"fontFamily": "var(--wp--preset--font-family--base)",
"fontWeight": "300"
}
},
"core/button": {
Expand All @@ -317,56 +330,57 @@
},
"core/heading/h1": {
"typography": {
"fontSize": "48px",
"fontSize": "min(max(48px, 5vw), 80px)",
"fontFamily": "var(--wp--preset--font-family--headings)",
"lineHeight": "var(--wp--custom--heading--typography--line-height)",
"fontWeight": "var(--wp--custom--heading--typography--font-weight)"
"lineHeight": "var(--wp--custom--line-height--headings--h1)",
"fontWeight": "500"
}
},
"core/heading/h2": {
"typography": {
"fontSize": "32px",
"fontSize": "min(max(36px, 5vw), 65px)",
"fontFamily": "var(--wp--preset--font-family--headings)",
"lineHeight": "var(--wp--custom--heading--typography--line-height)",
"fontWeight": "var(--wp--custom--heading--typography--font-weight)"
"lineHeight": "var(--wp--custom--line-height--headings--h2)",
"fontWeight": "500"
}
},
"core/heading/h3": {
"typography": {
"fontSize": "var(--wp--preset--font-size--huge)",
"fontSize": "min(max(28px, 5vw), 38px)",
"fontFamily": "var(--wp--preset--font-family--headings)",
"lineHeight": "var(--wp--custom--heading--typography--line-height)",
"fontWeight": "var(--wp--custom--heading--typography--font-weight)"
"lineHeight": "var(--wp--custom--line-height--headings--h3)",
"fontWeight": "500"
}
},
"core/heading/h4": {
"typography": {
"fontSize": "var(--wp--preset--font-size--large)",
"fontSize": "20px",
"fontFamily": "var(--wp--preset--font-family--headings)",
"lineHeight": "var(--wp--custom--heading--typography--line-height)",
"fontWeight": "var(--wp--custom--heading--typography--font-weight)"
"lineHeight": "var(--wp--custom--line-height--headings--h4)",
"fontWeight": "500"
}
},
"core/heading/h5": {
"typography": {
"fontSize": "var(--wp--preset--font-size--normal)",
"fontSize": "18px",
"fontFamily": "var(--wp--preset--font-family--headings)",
"lineHeight": "var(--wp--custom--heading--typography--line-height)",
"lineHeight": "var(--wp--custom--line-height--headings--h5)",
"fontWeight": "var(--wp--custom--heading--typography--font-weight)"
}
},
"core/heading/h6": {
"typography": {
"fontSize": "var(--wp--preset--font-size--small)",
"fontSize": "16px",
"fontFamily": "var(--wp--preset--font-family--headings)",
"lineHeight": "var(--wp--custom--heading--typography--line-height)",
"lineHeight": "vvar(--wp--custom--line-height--headings--h6)",
"fontWeight": "var(--wp--custom--heading--typography--font-weight)"
}
},
"core/post-title/h1": {
"typography": {
"fontSize": "var(--wp--preset--font-size--huge)",
"lineHeight": "var(--wp--custom--heading--typography--line-height)"
"fontSize": "min(max(36px, 5vw), 65px)",
"lineHeight": "var(--wp--custom--line-height--headings--h2)",
"fontWeight": "500"
}
},
"core/post-date": {
Expand Down Expand Up @@ -411,12 +425,13 @@
"core/quote": {
"typography": {
"fontSize": "var(--wp--preset--font-size--normal)",
"fontStyle": "normal"
"fontStyle": "normal",
"fontWeight": "normal"
},
"border": {
"color": "var(--wp--custom--color--secondary)",
"color": "var(--wp--custom--color--primary)",
"style": "solid",
"width": "0 0 0 1px"
"width": "0 0 0 2px"
},
"spacing": {
"padding": {
Expand Down
2 changes: 1 addition & 1 deletion quadrat/style.css
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
/*
Theme Name: Quadrat
Theme URI: https://github.com/Automattic/themes/tree/master/mayland-blocks
Theme URI: https://github.com/Automattic/themes/tree/trunk/quadrat
Author: Automattic
Author URI: https://automattic.com/
Description: Make your online portfolio wonderfully uncluttered with Mayland. Gracefully highlight your photography and other projects. Mayland is versatile enough to be your personal site too.
Expand Down
38 changes: 38 additions & 0 deletions seedlet-blocks/assets/theme.css
View file

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

Loading

0 comments on commit be40736

Please sign in to comment.