Skip to content

Commit

Permalink
Button block consolidation with new button element support
Browse files Browse the repository at this point in the history 
Addresses #64
  • Loading branch information
@colorful-tones
colorful-tones committed Jun 13, 2022
1 parent 8a71561 commit 6b015cf
Show file tree
Hide file tree
Showing 15 changed files with 951 additions and 478 deletions.
17 changes: 0 additions & 17 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,23 +58,6 @@ a:active {
text-decoration-style: solid;
}

/*
* Search and File Block button styles.
* Necessary until the following issues are resolved in Gutenberg:
* https://github.com/WordPress/gutenberg/issues/36444
* https://github.com/WordPress/gutenberg/issues/27760
*/

.wp-block-search__button,
.wp-block-file .wp-block-file__button {
background-color: var(--wp--preset--color--primary);
border-radius: 0;
border: none;
color: var(--wp--preset--color--background);
font-size: var(--wp--preset--font-size--medium);
padding: calc(.667em + 2px) calc(1.333em + 2px);
}

/*
* Button hover styles.
* Necessary until the following issue is resolved in Gutenberg:
Expand Down
101 changes: 68 additions & 33 deletions styles/brisbane.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,41 @@
}
}
},
"elements": {
"button": {
"border": {
"color": "var(--wp--preset--color--primary)",
"radius": {
"bottomLeft": "26px",
"bottomRight": "7px",
"topLeft": "12px",
"topRight": "16px"
},
"style": "solid solid solid solid",
"width": "1px !important"
},
"color": {
"background": "var(--wp--preset--color--primary)",
"text": "var(--wp--preset--color--foreground)"
},
"spacing": {
"padding": {
"top": "1.1rem",
"bottom": "1.1rem",
"right": "1.6rem",
"left": "1.6rem"
}
},
"typography": {
"fontFamily": "var(--wp--preset--font-family--heading)",
"fontSize": "var(--wp--custom--typography--font-size--large)",
"fontWeight": "var(--wp--custom--typography--font-weight--light)",
"letterSpacing": "0.03em",
"lineHeight": "1",
"textTransform": "none"
}
}
},
"spacing": {
"small": "clamp(1rem, 0.818rem + 0.91vw, 1.5rem)",
"medium": "clamp(1.5rem, 1.318rem + 0.91vw, 2rem)",
Expand Down Expand Up @@ -219,39 +254,6 @@
},
"styles": {
"blocks": {
"core/button": {
"border": {
"color": "var(--wp--preset--color--primary)",
"radius": {
"bottomLeft": "26px",
"bottomRight": "7px",
"topLeft": "12px",
"topRight": "16px"
},
"style": "solid solid solid solid",
"width": "1px !important"
},
"color": {
"background": "var(--wp--preset--color--primary)",
"text": "var(--wp--preset--color--foreground)"
},
"spacing": {
"padding": {
"top": "1.1rem",
"bottom": "1.1rem",
"right": "1.6rem",
"left": "1.6rem"
}
},
"typography": {
"fontFamily": "var(--wp--preset--font-family--heading)",
"fontSize": "var(--wp--custom--typography--font-size--large)",
"fontWeight": "var(--wp--custom--typography--font-weight--light)",
"letterSpacing": "0.03em",
"lineHeight": "1",
"textTransform": "none"
}
},
"core/comment-content": {
"spacing": {
"margin": {
Expand Down Expand Up @@ -440,6 +442,39 @@
"text": "var(--wp--preset--color--foreground)"
},
"elements": {
"button": {
"border": {
"color": "var(--wp--custom--elements--button--border--color, currentColor)",
"radius": {
"bottomLeft": "var(--wp--custom--elements--button--border--radius--bottom-left, 0)",
"bottomRight": "var(--wp--custom--elements--button--border--radius--bottom-right, 0)",
"topLeft": "var(--wp--custom--elements--button--border--radius--top-left, 0)",
"topRight": "var(--wp--custom--elements--button--border--radius--top-right, 0)"
},
"style": "var(--wp--custom--elements--button--border--style, solid)",
"width": "var(--wp--custom--elements--button--border--width, 1px)"
},
"color": {
"background": "var(--wp--custom--elements--button--color--background, --wp--preset--color--primary)",
"text": "var(--wp--custom--elements--button--color--text, currentColor)"
},
"spacing": {
"padding": {
"top": "var(--wp--custom--elements--button--spacing--padding--top, 1.1rem)",
"bottom": "var(--wp--custom--elements--button--spacing--padding--bottom, 1.1rem)",
"right": "var(--wp--custom--elements--button--spacing--padding--right, 2rem)",
"left": "var(--wp--custom--elements--button--spacing--padding--left, 2rem)"
}
},
"typography": {
"fontFamily": "var(--wp--custom--elements--button--typography--font-family, inherit)",
"fontSize": "var(--wp--custom--elements--button--typography--font-size, inherit)",
"fontWeight": "var(--wp--custom--elements--button--typography--font-weight, 400)",
"letterSpacing": "var(--wp--custom--elements--button--typography--letter-spacing, 0)",
"lineHeight": "var(--wp--custom--elements--button--typography--line-height, 1)",
"textTransform": "var(--wp--custom--elements--button--typography--text-transform, none)"
}
},
"h1": {
"typography": {
"fontFamily": "var(--wp--preset--font-family--heading)",
Expand Down
101 changes: 68 additions & 33 deletions styles/cairo.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -114,6 +114,41 @@
}
}
},
"elements": {
"button": {
"border": {
"color": "var(--wp--preset--color--primary)",
"radius": {
"bottomLeft": "100rem",
"bottomRight": "100rem",
"topLeft": "100rem",
"topRight": "100rem"
},
"style": "solid solid solid solid",
"width": "2px !important"
},
"color": {
"background": "var(--wp--preset--color--primary)",
"text": "var(--wp--preset--color--foreground)"
},
"spacing": {
"padding": {
"top": "1.2rem",
"bottom": "1.2rem",
"right": "2rem",
"left": "2rem"
}
},
"typography": {
"fontFamily": "var(--wp--preset--font-family--body)",
"fontSize": "var(--wp--preset--font-size--medium)",
"fontWeight": "var(--wp--custom--typography--font-weight--regular)",
"letterSpacing": "0",
"lineHeight": "1",
"textTransform": "none"
}
}
},
"spacing": {
"small": "clamp(1rem, 0.818rem + 0.91vw, 1.5rem)",
"medium": "clamp(1.5rem, 1.318rem + 0.91vw, 2rem)",
Expand Down Expand Up @@ -226,39 +261,6 @@
},
"styles": {
"blocks": {
"core/button": {
"border": {
"color": "var(--wp--preset--color--primary)",
"radius": {
"bottomLeft": "100rem",
"bottomRight": "100rem",
"topLeft": "100rem",
"topRight": "100rem"
},
"style": "solid solid solid solid",
"width": "2px !important"
},
"color": {
"background": "var(--wp--preset--color--primary)",
"text": "var(--wp--preset--color--foreground)"
},
"spacing": {
"padding": {
"top": "1.2rem",
"bottom": "1.2rem",
"right": "2rem",
"left": "2rem"
}
},
"typography": {
"fontFamily": "var(--wp--preset--font-family--body)",
"fontSize": "var(--wp--preset--font-size--medium)",
"fontWeight": "var(--wp--custom--typography--font-weight--regular)",
"letterSpacing": "0",
"lineHeight": "1",
"textTransform": "none"
}
},
"core/comment-content": {
"spacing": {
"margin": {
Expand Down Expand Up @@ -447,6 +449,39 @@
"text": "var(--wp--preset--color--foreground)"
},
"elements": {
"button": {
"border": {
"color": "var(--wp--custom--elements--button--border--color, currentColor)",
"radius": {
"bottomLeft": "var(--wp--custom--elements--button--border--radius--bottom-left, 0)",
"bottomRight": "var(--wp--custom--elements--button--border--radius--bottom-right, 0)",
"topLeft": "var(--wp--custom--elements--button--border--radius--top-left, 0)",
"topRight": "var(--wp--custom--elements--button--border--radius--top-right, 0)"
},
"style": "var(--wp--custom--elements--button--border--style, solid)",
"width": "var(--wp--custom--elements--button--border--width, 1px)"
},
"color": {
"background": "var(--wp--custom--elements--button--color--background, --wp--preset--color--primary)",
"text": "var(--wp--custom--elements--button--color--text, currentColor)"
},
"spacing": {
"padding": {
"top": "var(--wp--custom--elements--button--spacing--padding--top, 1.1rem)",
"bottom": "var(--wp--custom--elements--button--spacing--padding--bottom, 1.1rem)",
"right": "var(--wp--custom--elements--button--spacing--padding--right, 2rem)",
"left": "var(--wp--custom--elements--button--spacing--padding--left, 2rem)"
}
},
"typography": {
"fontFamily": "var(--wp--custom--elements--button--typography--font-family, inherit)",
"fontSize": "var(--wp--custom--elements--button--typography--font-size, inherit)",
"fontWeight": "var(--wp--custom--elements--button--typography--font-weight, 400)",
"letterSpacing": "var(--wp--custom--elements--button--typography--letter-spacing, 0)",
"lineHeight": "var(--wp--custom--elements--button--typography--line-height, 1)",
"textTransform": "var(--wp--custom--elements--button--typography--text-transform, none)"
}
},
"h1": {
"typography": {
"fontFamily": "var(--wp--preset--font-family--heading)",
Expand Down
101 changes: 68 additions & 33 deletions styles/gdansk.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -114,6 +114,41 @@
}
}
},
"elements": {
"button": {
"border": {
"color": "var(--wp--preset--color--primary)",
"radius": {
"bottomLeft": "999px",
"bottomRight": "999px",
"topLeft": "999px",
"topRight": "999px"
},
"style": "solid solid solid solid",
"width": "4px !important"
},
"color": {
"background": "var(--wp--preset--color--primary)",
"text": "var(--wp--preset--color--background)"
},
"spacing": {
"padding": {
"top": "1.1rem",
"bottom": "1.1rem",
"right": "1.6rem",
"left": "1.6rem"
}
},
"typography": {
"fontFamily": "var(--wp--preset--font-family--heading)",
"fontSize": "var(--wp--preset--font-size--small)",
"fontWeight": "var(--wp--custom--typography--font-weight--medium)",
"letterSpacing": "0.03em",
"lineHeight": "1",
"textTransform": "none"
}
}
},
"spacing": {
"small": "clamp(1rem, 0.818rem + 0.91vw, 1.5rem)",
"medium": "clamp(1.5rem, 1.318rem + 0.91vw, 2rem)",
Expand Down Expand Up @@ -234,39 +269,6 @@
},
"styles": {
"blocks": {
"core/button": {
"border": {
"color": "var(--wp--preset--color--primary)",
"radius": {
"bottomLeft": "999px",
"bottomRight": "999px",
"topLeft": "999px",
"topRight": "999px"
},
"style": "solid solid solid solid",
"width": "4px !important"
},
"color": {
"background": "var(--wp--preset--color--primary)",
"text": "var(--wp--preset--color--background)"
},
"spacing": {
"padding": {
"top": "1.1rem",
"bottom": "1.1rem",
"right": "1.6rem",
"left": "1.6rem"
}
},
"typography": {
"fontFamily": "var(--wp--preset--font-family--heading)",
"fontSize": "var(--wp--preset--font-size--small)",
"fontWeight": "var(--wp--custom--typography--font-weight--medium)",
"letterSpacing": "0.03em",
"lineHeight": "1",
"textTransform": "none"
}
},
"core/comment-content": {
"spacing": {
"margin": {
Expand Down Expand Up @@ -455,6 +457,39 @@
"text": "var(--wp--preset--color--foreground)"
},
"elements": {
"button": {
"border": {
"color": "var(--wp--custom--elements--button--border--color, currentColor)",
"radius": {
"bottomLeft": "var(--wp--custom--elements--button--border--radius--bottom-left, 0)",
"bottomRight": "var(--wp--custom--elements--button--border--radius--bottom-right, 0)",
"topLeft": "var(--wp--custom--elements--button--border--radius--top-left, 0)",
"topRight": "var(--wp--custom--elements--button--border--radius--top-right, 0)"
},
"style": "var(--wp--custom--elements--button--border--style, solid)",
"width": "var(--wp--custom--elements--button--border--width, 1px)"
},
"color": {
"background": "var(--wp--custom--elements--button--color--background, --wp--preset--color--primary)",
"text": "var(--wp--custom--elements--button--color--text, currentColor)"
},
"spacing": {
"padding": {
"top": "var(--wp--custom--elements--button--spacing--padding--top, 1.1rem)",
"bottom": "var(--wp--custom--elements--button--spacing--padding--bottom, 1.1rem)",
"right": "var(--wp--custom--elements--button--spacing--padding--right, 2rem)",
"left": "var(--wp--custom--elements--button--spacing--padding--left, 2rem)"
}
},
"typography": {
"fontFamily": "var(--wp--custom--elements--button--typography--font-family, inherit)",
"fontSize": "var(--wp--custom--elements--button--typography--font-size, inherit)",
"fontWeight": "var(--wp--custom--elements--button--typography--font-weight, 400)",
"letterSpacing": "var(--wp--custom--elements--button--typography--letter-spacing, 0)",
"lineHeight": "var(--wp--custom--elements--button--typography--line-height, 1)",
"textTransform": "var(--wp--custom--elements--button--typography--text-transform, none)"
}
},
"h1": {
"typography": {
"fontFamily": "var(--wp--preset--font-family--heading)",
Expand Down
Loading

0 comments on commit 6b015cf

Please sign in to comment.