From 13ec9195df88f6f7413426cc1ae39bdd03c61e55 Mon Sep 17 00:00:00 2001 From: mateuswetah Date: Tue, 12 Mar 2019 16:55:04 -0300 Subject: [PATCH] Begins implementation of editor style. Ref. #10. --- compile-sass.sh | 3 +++ src/assets/scss/editor-style.scss | 42 +++++++++++++++++++++++++++++++ src/editor-style.css | 30 ++++++++++++++++++++++ src/editor-style.css.map | 7 ++++++ src/functions.php | 11 +++++++- 5 files changed, 92 insertions(+), 1 deletion(-) create mode 100644 src/assets/scss/editor-style.scss create mode 100644 src/editor-style.css create mode 100644 src/editor-style.css.map diff --git a/compile-sass.sh b/compile-sass.sh index 97f1995..8af3dd6 100755 --- a/compile-sass.sh +++ b/compile-sass.sh @@ -20,6 +20,8 @@ echo "Compiling Sass..." cd src/assets/scss sass -E 'UTF-8' style.scss:../../style.css echo "Style of Tainacan Compiled"; +sass -E 'UTF-8' editor-style.scss:../../editor-style.css +echo "Style of Tainacan for Gutenberg Editor Compiled"; sass bootstrap_custom.scss:../vendor/bootstrap/scss/bootstrap.min.css --style compressed echo "Bootstrap Compiled"; rm -rf .sass-cache @@ -30,6 +32,7 @@ echo "Slick for slider carousel Compiled"; rm -rf slick-theme.min.css.map slick.min.css.map .sass-cache/ cd ../../../scss rm -rf ../../style.css.map +# rm -rf ../../editor-style.css.map echo "Sass compilation Completed!" exit 0 diff --git a/src/assets/scss/editor-style.scss b/src/assets/scss/editor-style.scss new file mode 100644 index 0000000..95f36d2 --- /dev/null +++ b/src/assets/scss/editor-style.scss @@ -0,0 +1,42 @@ +.edit-post-visual-editor.editor-styles-wrapper { + + font-family: 'Roboto', sans-serif !important; + + .editor-block-list__layout { + padding-left: 4.16667%; + padding-right: 4.16667%; + } + + /* Main column width */ + .wp-block { + max-width: 1400px; + margin-left: 8.3333333333%; + margin-right: 8.3333333333%; + } + + /* Width of "wide" blocks */ + .wp-block[data-align="wide"] { + margin-left: auto; + margin-right: auto; + } + + /* Width of "full" blocks */ + .wp-block[data-align="full"] { + max-width: calc(100% + 8.333333333%); + width: calc(100% + 8.333333333%); + margin-left: -4.16667%; + margin-right: -4.16667%; + } + + /* Post title */ + .wp-block.editor-post-title__block, + .wp-block.editor-post-title__input { + font-size: 14px; + font-family: 'Roboto', sans-serif; + } + .wp-block.editor-post-title__block { + border-bottom: 2px solid #3f3f3f; + margin-bottom: 24px; + } + +} \ No newline at end of file diff --git a/src/editor-style.css b/src/editor-style.css new file mode 100644 index 0000000..92d8d75 --- /dev/null +++ b/src/editor-style.css @@ -0,0 +1,30 @@ +.edit-post-visual-editor.editor-styles-wrapper { + font-family: 'Roboto', sans-serif !important; + /* Main column width */ + /* Width of "wide" blocks */ + /* Width of "full" blocks */ + /* Post title */ } + .edit-post-visual-editor.editor-styles-wrapper .editor-block-list__layout { + padding-left: 4.16667%; + padding-right: 4.16667%; } + .edit-post-visual-editor.editor-styles-wrapper .wp-block { + max-width: 1400px; + margin-left: 8.3333333333%; + margin-right: 8.3333333333%; } + .edit-post-visual-editor.editor-styles-wrapper .wp-block[data-align="wide"] { + margin-left: auto; + margin-right: auto; } + .edit-post-visual-editor.editor-styles-wrapper .wp-block[data-align="full"] { + max-width: calc(100% + 8.333333333%); + width: calc(100% + 8.333333333%); + margin-left: -4.16667%; + margin-right: -4.16667%; } + .edit-post-visual-editor.editor-styles-wrapper .wp-block.editor-post-title__block, + .edit-post-visual-editor.editor-styles-wrapper .wp-block.editor-post-title__input { + font-size: 14px; + font-family: 'Roboto', sans-serif; } + .edit-post-visual-editor.editor-styles-wrapper .wp-block.editor-post-title__block { + border-bottom: 2px solid #3f3f3f; + margin-bottom: 24px; } + +/*# sourceMappingURL=editor-style.css.map */ diff --git a/src/editor-style.css.map b/src/editor-style.css.map new file mode 100644 index 0000000..4b0a935 --- /dev/null +++ b/src/editor-style.css.map @@ -0,0 +1,7 @@ +{ +"version": 3, +"mappings": "AAAA,8CAA+C;EAE3C,WAAW,EAAE,+BAA+B;EAO5C,uBAAuB;EAOvB,4BAA4B;EAM5B,4BAA4B;EAQ5B,gBAAgB;EA1BhB,yEAA2B;IACvB,YAAY,EAAE,QAAQ;IACtB,aAAa,EAAE,QAAQ;EAI3B,wDAAU;IACN,SAAS,EAAE,MAAM;IACjB,WAAW,EAAE,aAAa;IAC1B,YAAY,EAAE,aAAa;EAI/B,2EAA6B;IACzB,WAAW,EAAE,IAAI;IACjB,YAAY,EAAE,IAAI;EAItB,2EAA6B;IACzB,SAAS,EAAE,yBAAyB;IACpC,KAAK,EAAE,yBAAyB;IAChC,WAAW,EAAE,SAAS;IACtB,YAAY,EAAE,SAAS;EAI3B;mFACmC;IAC/B,SAAS,EAAE,IAAI;IACf,WAAW,EAAE,oBAAoB;EAErC,iFAAmC;IAC/B,aAAa,EAAE,iBAAiB;IAChC,aAAa,EAAE,IAAI", +"sources": ["assets/scss/editor-style.scss"], +"names": [], +"file": "editor-style.css" +} diff --git a/src/functions.php b/src/functions.php index 95168bc..c07a52a 100644 --- a/src/functions.php +++ b/src/functions.php @@ -294,11 +294,20 @@ function tainacan_setup_theme_supported_features() { ), ) ); add_theme_support( 'align-wide' ); - + add_theme_support( 'editor-style' ); + add_editor_style( 'editor-style.css' ); } add_action( 'after_setup_theme', 'tainacan_setup_theme_supported_features' ); +/** +* Enqueue editor styles for Gutenberg +*/ + +function tainacan_editor_styles() { + wp_enqueue_style( 'tainacan-editor-style', get_template_directory_uri() . '/editor-style.css' ); +} +add_action( 'enqueue_block_editor_assets', 'tainacan_editor_styles' ); require get_template_directory() . '/functions/customizer.php'; require get_template_directory() . '/functions/single-functions.php';