create custom css file that loads on editor and frontend

This commit is contained in:
Aadil Ayub 2024-06-13 12:04:16 +05:00
parent 289ebea30b
commit 02b9d53f27
2 changed files with 92 additions and 80 deletions

0
assets/css/custom.css Normal file
View File

View File

@ -1,5 +1,97 @@
<?php
// enqueue custom css on front-end and editor
function jett_editor_css() {
add_editor_style( get_theme_file_uri('/assets/css/custom.css') );
}
add_action( 'after_setup_theme', 'twentytwentytwo_support' );
function jett_frontend_css() {
wp_enqueue_style('jett_css', get_theme_file_uri('/assets/css/custom.css'));
}
add_action('wp_enqueue_scripts', 'jett_frontend_css');
// define block styles
function jett_block_styles() {
register_block_style(
'core/heading',
array(
'name' => 'gradient',
'label' => __( 'Gradient', 'jett' ),
'inline_style' => '
.wp-block-heading.is-style-gradient {
background: var(--wp--preset--gradient--violet-to-green);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
line-height: 1.1;
}
'
)
);
register_block_style(
'core/paragraph',
array(
'name' => 'gradient',
'label' => __( 'Gradient', 'jett' ),
'inline_style' => '
p.is-style-gradient {
background: var(--wp--preset--gradient--violet-to-green);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
line-height: 1.1;
}
'
)
);
register_block_style(
'core/list',
array(
'name' => 'arrow',
'label' => __( 'Arrow', 'lex-scotland' ),
'inline_style' => '
ul.is-style-arrow {
list-style: none;
}
ul.is-style-arrow div {
display: inline;
}
ul.is-style-arrow li::before {
content: "";
margin-right: 0.5em;
font-weight: bold;
}
'
)
);
register_block_style(
'core/post-terms',
array(
'name' => 'hashtags',
'label' => __('Hashtags', 'lex-scotland'),
'inline_style' => '
.is-style-hashtags.taxonomy-post_tag.wp-block-post-terms a::before {
content: "#";
}
.is-style-hashtags.taxonomy-post_tag.wp-block-post-terms a {
background: var(--wp--preset--color--black);
padding: .5rem;
display: inline-block;
color: white;
font-family: var(--wp--preset--font-family--instrument-sans);
text-decoration: none;
margin-right: 5px;
margin-bottom: 5px;
font-size: 13px;
font-weight: 500;
}
'
)
);
}
add_action( 'init', 'jett_block_styles' );
/* Remove default CSS variables that come with Wordpress
https://github.com/WordPress/gutenberg/issues/56180#issuecomment-1819222376
*/
@ -53,83 +145,3 @@ function cc_mime_types($mimes) {
return $mimes;
}
add_filter('upload_mimes', 'cc_mime_types');
// define block styles
function jett_block_styles() {
register_block_style(
'core/heading',
array(
'name' => 'gradient',
'label' => __( 'Gradient', 'jett' ),
'inline_style' => '
.wp-block-heading.is-style-gradient {
background: var(--wp--preset--gradient--violet-to-green);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
line-height: 1.1;
}
'
)
);
register_block_style(
'core/paragraph',
array(
'name' => 'gradient',
'label' => __( 'Gradient', 'jett' ),
'inline_style' => '
p.is-style-gradient {
background: var(--wp--preset--gradient--violet-to-green);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
line-height: 1.1;
}
'
)
);
register_block_style(
'core/list',
array(
'name' => 'arrow',
'label' => __( 'Arrow', 'lex-scotland' ),
'inline_style' => '
ul.is-style-arrow {
list-style: none;
}
ul.is-style-arrow div {
display: inline;
}
ul.is-style-arrow li::before {
content: "";
margin-right: 0.5em;
font-weight: bold;
}
'
)
);
register_block_style(
'core/post-terms',
array(
'name' => 'hashtags',
'label' => __('Hashtags', 'lex-scotland'),
'inline_style' => '
.is-style-hashtags.taxonomy-post_tag.wp-block-post-terms a::before {
content: "#";
}
.is-style-hashtags.taxonomy-post_tag.wp-block-post-terms a {
background: var(--wp--preset--color--black);
padding: .5rem;
display: inline-block;
color: white;
font-family: var(--wp--preset--font-family--instrument-sans);
text-decoration: none;
margin-right: 5px;
margin-bottom: 5px;
font-size: 13px;
font-weight: 500;
}
'
)
);
}
add_action( 'init', 'jett_block_styles' );