/* --------------------------------------------------------------------------------------------- Theme Name: Beaumont Text Domain: beaumont Version: 0.1.4 Description: Beaumont is a simple block theme for your words. It includes a handful of block patterns to help you create beautiful layouts, and 10 different theme styles to choose from. Demo: https://andersnoren.se/themes/beaumont/ Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, sticky-post, threaded-comments, translation-ready, block-styles, wide-blocks, full-site-editing Author: Anders Norén Author URI: https://andersnoren.se Theme URI: https://andersnoren.se/teman/beaumont-wordpress-theme/ License: GNU General Public License version 2.0 License URI: http://www.gnu.org/licenses/gpl-2.0.html Requires PHP: 5.6 Tested up to: 6.0 All files, unless otherwise stated, are released under the GNU General Public License version 2.0 (http://www.gnu.org/licenses/gpl-2.0.html) /* --------------------------------------------------------------------------------------------- */ body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } a { text-decoration-thickness: 1px; text-underline-offset: 0.2em; } a:hover { text-decoration: none; } .wp-block-navigation .wp-block-navigation-item a:hover, .wp-block-navigation .wp-block-navigation-item a:focus { text-decoration: underline; text-decoration-style: solid; } /* Input styles */ input, textarea, select, button { background-color: inherit; border-radius: 0; font-family: inherit; font-size: inherit; font-weight: inherit; letter-spacing: inherit; margin: 0; } input, textarea, select { background-color: var( --wp--preset--color--background ); border: .1rem solid var( --wp--preset--color--secondary ); box-sizing: border-box; color: var( --wp--preset--color--foreground ); max-width: 100%; padding: .5em; } ::placeholder { color: var( --wp--preset--color--primary ); opacity: 1; } label { font-size: var( --wp--preset--font-size--small ); font-weight: 500; } input[type="button"], input[type="submit"], input[type="reset"], .wp-block-search__button, .wp-block-file .wp-block-file__button { background-color: var( --wp--preset--color--foreground ); border: none; border-radius: 999rem; color: var(--wp--preset--color--background); font-size: var(--wp--preset--font-size--medium); letter-spacing: 0; padding: .867em 1.6em; -webkit-appearance: none; } .wp-block-file .wp-block-file__button:hover, .wp-block-button__link:hover, .wp-block-button__link:visited { color: var( --wp--preset--color--background ); } /* Figure Styles */ figure { margin: 0; } figcaption { font-family: var( --wp--preset--font-family--default-sans ); } :root figcaption { color: var( --wp--preset--color--primary ); font-size: var( --wp--preset--font-size--small ); font-weight: 500; } /* Alignment Styles */ .wp-site-blocks, body>.is-root-container, .edit-post-visual-editor__post-title-wrapper, .wp-block-group.alignfull, .wp-block-cover.alignfull, .is-root-container .wp-block[data-align="full"]>.wp-block-group, .is-root-container .wp-block[data-align="full"]>.wp-block-cover { padding-left: var(--wp--custom--spacing--outer); padding-right: var(--wp--custom--spacing--outer); } .wp-site-blocks .alignfull, .wp-site-blocks>.wp-block-group.has-background, .wp-site-blocks>.wp-block-cover, .wp-site-blocks>.wp-block-template-part>.wp-block-group.has-background, .wp-site-blocks>.wp-block-template-part>.wp-block-cover, body>.is-root-container>.wp-block-cover, body>.is-root-container>.wp-block-template-part>.wp-block-group.has-background, body>.is-root-container>.wp-block-template-part>.wp-block-cover, .is-root-container .wp-block[data-align="full"] { margin-left: calc(-1 * var(--wp--custom--spacing--outer)) !important; margin-right: calc(-1 * var(--wp--custom--spacing--outer)) !important; width: unset; } @media ( min-width: 781px ) { .wp-site-blocks .wp-block-columns .wp-block-column .alignfull, .is-root-container .wp-block-columns .wp-block-column .wp-block[data-align="full"], .wp-site-blocks .alignfull:not(.wp-block-group) .alignfull, .is-root-container .wp-block[data-align="full"]>*:not(.wp-block-group) .wp-block[data-align="full"] { margin-left: auto !important; margin-right: auto !important; width: inherit; } } :root:root .alignleft { margin-inline-end: 1em; } :root:root .alignright { margin-inline-start: 1em; } /* Editor Post Title */ .editor-post-title__input { text-align: center; } /* Background Padding */ h1.has-background, h2.has-background, h3.has-background, h4.has-background, h5.has-background, h6.has-background,p.has-background { padding: min( 1em, var( --wp--custom--spacing--small ) ); } :where(.wp-block-group.has-background) { padding: min( 2em, var( --wp--custom--spacing--small ) ); } /* ------------------------------------------- */ /* Typography /* ------------------------------------------- */ .has-huge-font-size, .has-heading-1-font-size, .has-heading-2-font-size, .has-heading-3-font-size, .has-heading-4-font-size, .has-heading-5-font-size { letter-spacing: var( --wp--custom--typography--letter-spacing--heading ); line-height: var( --wp--custom--typography--line-height--headings ); } .has-medium-font-size { line-height: var( --wp--custom--typography--line-height--body ); } /* Text Decoration */ #cancel-comment-reply-link, .wp-block-comment-edit-link a, .comment-reply-link, .wp-block-comment-date a, .wp-block-comment-author-name a, .wp-block-comments-pagination a, .wp-block-post-date a, .wp-block-site-title a, .wp-block-query-pagination a, .wp-block-post-title a { text-decoration: none; } #cancel-comment-reply-link:hover, #cancel-comment-reply-link:focus, .wp-block-comment-edit-link a:hover, .wp-block-comment-edit-link a:focus, .comment-reply-link:hover, .comment-reply-link:focus, .wp-block-comment-date a:hover, .wp-block-comment-date a:focus, .wp-block-comment-author-name a:hover, .wp-block-comment-author-name a:focus, .wp-block-comments-pagination a:hover, .wp-block-comments-pagination a:focus, .wp-block-post-date a:hover, .wp-block-post-date a:focus, .wp-block-site-title a:hover, .wp-block-site-title a:focus, .wp-block-query-pagination a:hover, .wp-block-query-pagination a:focus, .wp-block-post-title a:hover, .wp-block-post-title a:focus { text-decoration: underline; } /* ------------------------------------------- */ /* Helper Classes /* ------------------------------------------- */ .hide-when-empty:empty { display: none !important; } .no-shrink { flex-shrink: 0 !important; } /* ------------------------------------------- */ /* Template Parts /* ------------------------------------------- */ .wp-site-blocks { display: flex; flex-direction: column; justify-content: space-between; min-height: calc( 100svh - var( --wp-admin--admin-bar--height, 0 ) ); } .wp-site-blocks > * + * { margin-top: 0; } /* ------------------------------------------- */ /* Blocks /* ------------------------------------------- */ /* Block: Avatar ----------------------------- */ .wp-block-avatar img { display: block; } /* Block: Calendar --------------------------- */ .wp-block-calendar table caption, .wp-block-calendar table tbody { color: var( --wp--preset--color--foreground ); } .wp-block-calendar th, .wp-block-calendar tbody td { border-color: var( --wp--preset--color--primary ); } .wp-block-calendar table th { background-color: var( --wp--preset--color--primary ); } /* Block: Comments --------------------------- */ #cancel-comment-reply-link { font-weight: 500; letter-spacing: var(--wp--custom--typography--letter-spacing--body); } .wp-block-post-comments-form input[type=submit] { border-radius: 999px; font-size: var( --wp--preset--font-size--small ); } /* Block: File ------------------------------- */ .wp-block-file { align-items: center; display: flex; justify-content: space-between; } :root .wp-block-file__button:not(:only-child) { margin-left: var( --wp--custom--spacing--baseline ); } /* Block: Heading ---------------------------- */ .wp-block-post-content h1:not([style*="margin-top"]):not(:first-child), .wp-block-post-content h2:not([style*="margin-top"]):not(:first-child), .wp-block-post-content h3:not([style*="margin-top"]):not(:first-child), .wp-block-post-content h4:not([style*="margin-top"]):not(:first-child), .wp-block-post-content h5:not([style*="margin-top"]):not(:first-child), .wp-block-post-content h6:not([style*="margin-top"]):not(:first-child) { margin-top: 1.25em !important; } .wp-block-post-content h1:not([style*="margin-bottom"]):not(:last-child), .wp-block-post-content h2:not([style*="margin-bottom"]):not(:last-child), .wp-block-post-content h3:not([style*="margin-bottom"]):not(:last-child), .wp-block-post-content h4:not([style*="margin-bottom"]):not(:last-child), .wp-block-post-content h5:not([style*="margin-bottom"]):not(:last-child), .wp-block-post-content h6:not([style*="margin-bottom"]):not(:last-child) { margin-bottom: .75em !important; } /* Block: Navigation ------------------------- */ .wp-block-navigation__responsive-container.is-menu-open { padding: var(--wp--custom--spacing--outer); } /* Block: Paragraph -------------------------- */ .has-drop-cap:not(:focus):first-letter { font-size: 5.3em; font-weight: inherit; transform: translateY( .06em ); } /* Block: Post Comments Form ----------------- */ ol.wp-block-comment-template { margin: 0; } .wp-block-post-comments-form input:not([type=submit]), .wp-block-post-comments-form textarea { border-color: var( --wp--preset--color--secondary ); } .required-field-message, .comment-notes { display: none; } .logged-in-as { color: var( --wp--preset--color--primary ); } .comment-reply-title { margin: 0; } /* Block: Post Content ----------------------- */ .is-root-container > .alignwide:not(:first-child), .wp-block-post-content > .alignwide:not(:first-child), .is-root-container > .alignfull:not(:first-child), .wp-block-post-content > .alignfull:not(:first-child) { margin-top: 64px; } .is-root-container > .alignwide:not(:last-child), .wp-block-post-content > .alignwide:not(:last-child), .is-root-container > .alignfull:not(:last-child), .wp-block-post-content > .alignfull:not(:last-child) { margin-bottom: 64px; } /* Block: Post Template ---------------------- */ .wp-block-post-template { --wp--style--block-gap: 0; } /* Block: Pull Quote ------------------------- */ :root .wp-block-pullquote blockquote, :root .wp-block-pullquote blockquote p { line-height: inherit; } :root .wp-block-pullquote blockquote p { hanging-punctuation: first; font-size: inherit; } :root .wp-block-pullquote__citation, :root .wp-block-pullquote cite, :root .wp-block-pullquote footer { font-size: var( --wp--preset--font-size--medium ); font-weight: 600; margin-top: 1em; text-transform: none; } :root .wp-block-pullquote.alignleft, :root .wp-block-pullquote.alignright { max-width: min( 316px, 50% ); } :root .wp-block-pullquote:first-child { padding-top: 0; } :root .wp-block-pullquote:last-child { padding-bottom: 0; } /* Block: Query Pagination ------------------- */ .wp-block-query-pagination > .wp-block-query-pagination-next, .wp-block-query-pagination > .wp-block-query-pagination-numbers, .wp-block-query-pagination > .wp-block-query-pagination-previous { margin-bottom: 0; } .wp-block-query-pagination-next:only-child { margin-left: auto; } .wp-block-query-pagination-numbers { display: flex; gap: .5em; } .wp-block-query-pagination-numbers .current { color: var( --wp--preset--color--primary ); } /* STYLE: VERTICAL SEPARATORS */ .wp-block-query-pagination.is-style-beaumont-vertical-separators { border-top: 1px solid var( --wp--preset--color--secondary ); gap: 0; } .wp-block-query-pagination.is-style-beaumont-vertical-separators a, .wp-block-query-pagination-numbers { position: relative; } .wp-block-query-pagination.is-style-beaumont-vertical-separators .post-navigation-link-previous a:before, .wp-block-query-pagination.is-style-beaumont-vertical-separators .post-navigation-link-next a:before { position: absolute; } .wp-block-query-pagination.is-style-beaumont-vertical-separators .post-navigation-link-previous a:before { content: "←"; } .wp-block-query-pagination.is-style-beaumont-vertical-separators .post-navigation-link-next a:before { content: "→"; } /* Horizontal Orientation */ .wp-block-query-pagination.is-style-beaumont-vertical-separators:not(.is-vertical) { border-bottom: 1px solid var( --wp--preset--color--secondary ); gap: 16px; padding: 16px 0; } .wp-block-query-pagination.is-style-beaumont-vertical-separators:not(.is-vertical) .post-navigation-link-previous a { padding-left: 1.6em; } .wp-block-query-pagination.is-style-beaumont-vertical-separators:not(.is-vertical) .post-navigation-link-previous a:before { left: 0; } .wp-block-query-pagination.is-style-beaumont-vertical-separators:not(.is-vertical) .post-navigation-link-next a { padding-right: 1.6em; } .wp-block-query-pagination.is-style-beaumont-vertical-separators:not(.is-vertical) .post-navigation-link-next a:before { right: 0; } /* Vertical Orientation */ .wp-block-query-pagination.is-style-beaumont-vertical-separators.is-vertical > *:empty { display: none; } .wp-block-query-pagination.is-style-beaumont-vertical-separators.is-vertical > *:not(:empty) { border-bottom: 1px solid var( --wp--preset--color--secondary ); margin: 0; padding: 16px 0; width: 100%; } .wp-block-query-pagination.is-style-beaumont-vertical-separators.is-vertical .post-navigation-link-previous a, .wp-block-query-pagination.is-style-beaumont-vertical-separators.is-vertical .post-navigation-link-previous + .wp-block-query-pagination-numbers, .wp-block-query-pagination.is-style-beaumont-vertical-separators.is-vertical .post-navigation-link-next a { box-sizing: border-box; padding-left: 1.6em; } .wp-block-query-pagination.is-style-beaumont-vertical-separators.is-vertical .post-navigation-link-next a:before, .wp-block-query-pagination.is-style-beaumont-vertical-separators.is-vertical .post-navigation-link-previous a:before { left: 0; } /* Block: Quote ------------------------------ */ blockquote { margin: 0; } blockquote p:first-child { margin-top: 0; } blockquote p:last-child { margin-bottom: 0; } /* Block: Separator -------------------------- */ :root hr[class*="is-style-beaumont-diamond"] { background-color: transparent !important; background: linear-gradient(90deg, currentColor 0%, currentColor calc( 50% - 20px ), transparent calc( 50% - 20px ), transparent calc( 50% + 20px ), currentColor calc( 50% + 20px ), currentColor 100%); border: none; height: 1px !important; position: relative; } :root hr.is-style-beaumont-diamond { width: 201px !important; } :root hr.is-style-beaumont-diamond-wide { width: 100% !important; } :root hr[class*="is-style-beaumont-diamond"]:before { background-color: currentColor; content: ""; display: block; position: absolute; left: calc( 50% - 3.5px ); top: calc( 50% - 3.5px ); height: 7px; transform: rotate( 45deg ); width: 7px; } /* Block: Search Form ------------------------ */ .wp-block-search { font-size: var( --wp--preset--font-size--small ); } .wp-block-search .wp-block-search__label { font-weight: inherit; } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper, .wp-block-search__input { border-color: var( --wp--preset--color--secondary ); } .wp-block-search__input { margin: 0; padding: .75em 1.25em; } .wp-block-search__button { border-radius: 999rem; flex-shrink: 0; font-size: inherit; font-weight: 600; margin: 0 0 0 .75em; } /* SETTING: BUTTON INSIDE */ .wp-block-search__button-inside .wp-block-search__inside-wrapper, .wp-block-search__button-inside .wp-block-search__input { box-sizing: border-box; margin: 0; padding: .375em .5em .375em .75em !important; } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button { border-radius: 0; } .wp-block-search__button svg { transform: scale( 1.15 ); } /* Block: Table ------------------------------ */ :root .wp-block-table *, .wp-block-table.is-style-stripes { border-color: var(--wp--preset--color--primary); } .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background-color: var(--wp--preset--color--primary); } /* Block: Term Description ------------------- */ .wp-block-term-description > *:last-child { margin-bottom: 0; }