style.css

/*
Theme Name: Séance
Theme URI: https://github.com/alexdeborba/seance/
Author: Alex de Borba
Author URI: https://alexdeborba.com/
Description: Séance was designed to provide a uniform, single-color foundation enhanced with hints of two-tone and three-tone color schemes. This design choice caters to individuals with color vision deficiency, covering both darker and lighter color palettes, all while maintaining a gothic aesthetic that appeals to passionate and aspiring writers due to its clarity and minimalist design. Impressively lightweight yet bold, Séance incorporates color palettes focused on accessibility and comes fully equipped with numerous meticulously designed Gutenberg Block Patterns. These elements subtly impart a minimalist visual strength to the content, similar to quickly leafing through a book with delicate fingertips, leisurely absorbing the written words. Fully customizable, Séance supports the Full Site Editing features launched with WordPress 5.9 and, in its unique way, offers a fresh writing and visual experience.
Requires at least: 5.9
Tested up to: 6.3
Requires PHP: 5.6
Version: 1.0.0-alpha.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: seance
Tags: accessibility-ready, block-editor-styles, block-patterns, blog, custom-background, custom-colors, custom-footer, custom-header, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-site-editing, one-column, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, wide-blocks

Séance, (C) 2022-2003 Alex de Borba.
Séance is distributed under the terms of the GNU GPL.
*/

/*
 * Font smoothing.
 * This is a niche setting that will not be available via Global Styles.
 * https://github.com/WordPress/gutenberg/issues/35934
 */

body {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}

/*
 * Text and navigation link styles.
 * Necessary until the following issue is resolved in Gutenberg:
 * https://github.com/WordPress/gutenberg/issues/27075
 */

a {
    text-decoration-thickness: 1px;
    text-underline-offset: 0.25ch;
}

a:hover,
a:focus {
    text-decoration-style: dashed;
}

a:active {
    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;
}

/*
 * 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:
 * https://github.com/WordPress/gutenberg/issues/27075
 */

.wp-block-search__button:hover,
.wp-block-file .wp-block-file__button:hover,
.wp-block-button__link:hover {
    opacity: 0.90;
}

/*
 * Alignment styles.
 * These rules are temporary, and should not be relied on or
 * modified too heavily by themes or plugins that build on
 * Séance. These are meant to be a precursor to
 * a global solution provided by the Block Editor.
 *
 * Relevant issues:
 * https://github.com/WordPress/gutenberg/issues/35607
 * https://github.com/WordPress/gutenberg/issues/35884
 */

.wp-site-blocks,
body>.is-root-container,
.edit-post-visual-editor__post-title-wrapper,
.wp-block-group.alignfull,
.wp-block-group.has-background,
.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;
}

/* Blocks inside columns do not have negative margins. */
.wp-site-blocks .wp-block-columns .wp-block-column .alignfull,
.is-root-container .wp-block-columns .wp-block-column .wp-block[data-align="full"],
/* We also want to avoid stacking negative margins. */
.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;
}

/*
 * Responsive menu container padding.
 * This ensures the responsive container inherits the same
 * spacing defined above. This behavior may be built into
 * the Block Editor in the future.
 */

.wp-block-navigation__responsive-container.is-menu-open {
    padding-top: var(--wp--custom--spacing--outer);
    padding-bottom: var(--wp--custom--spacing--large);
    padding-right: var(--wp--custom--spacing--outer);
    padding-left: var(--wp--custom--spacing--outer);
}

/*
 * Improves spacing for the legacy Post Comments block.
 * https://core.trac.wordpress.org/ticket/57560
 */

footer .wp-site-blocks>.wp-block-template-part> {
    margin-top: 0rem !important;
}

.wp-block-post-comments ol.commentlist ul.children {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.wp-block-post-comments ol.commentlist ul.children li:not(:last-child) {
    margin-bottom: 1rem;
}

/*
 * Remove top margin from footer wp-block-template-part
 */
footer.wp-block-template-part {
	margin-top: 0rem !important;
}

@media (max-width: 768px) {
    /* This media query targets devices with a viewport width of 360 pixels or less */
    .wp-block-group.has-responsive-dark-background {
        background: #0f0f10 !important;
    }
    .wp-block-group.has-responsive-light-background {
        background: #f9f9f9 !important;
    }
}