diff --git a/assets/course-theme/blocks/index.js b/assets/course-theme/blocks/index.js index 94be8fc289..aa53d0a61d 100644 --- a/assets/course-theme/blocks/index.js +++ b/assets/course-theme/blocks/index.js @@ -6,6 +6,7 @@ import courseNavigationBlock from './course-navigation'; import uiBlocks from './ui'; import lessonBlocks from './lesson-blocks'; import quizBlocks from './quiz-blocks'; +import senseiLogo from './sensei-logo-block'; import { templateStyleBlock } from './template-style'; const blocks = [ @@ -14,6 +15,7 @@ const blocks = [ ...uiBlocks, courseNavigationBlock, templateStyleBlock, + senseiLogo, ]; registerTemplateBlocks( blocks ); diff --git a/assets/course-theme/blocks/sensei-logo-block/block.json b/assets/course-theme/blocks/sensei-logo-block/block.json new file mode 100644 index 0000000000..8b915b0ab6 --- /dev/null +++ b/assets/course-theme/blocks/sensei-logo-block/block.json @@ -0,0 +1,12 @@ +{ + "apiVersion": 2, + "name": "sensei-lms/sensei-logo", + "title": "Sensei LMS Logo", + "category": "sensei-lms", + "textdomain": "sensei-lms", + "description": "Show the Sensei logo.", + "supports": { + "inserter": true, + "html": true + } +} \ No newline at end of file diff --git a/assets/course-theme/blocks/sensei-logo-block/index.js b/assets/course-theme/blocks/sensei-logo-block/index.js new file mode 100644 index 0000000000..cf0bba5d2a --- /dev/null +++ b/assets/course-theme/blocks/sensei-logo-block/index.js @@ -0,0 +1,29 @@ +/** + * Internal dependencies + */ +import meta from './block.json'; +import SenseiLogoTree from '../../../icons/sensei-logo-tree.svg'; +import LogoTreeIcon from '../../../icons/logo-tree.svg'; + +/** + * WordPress dependencies + */ +const Edit = () => { + return ( + + + + ); +}; + +/** + * Sensei Logo block. + */ +export default { + ...meta, + icon: { + src: , + foreground: '#43AF99', + }, + edit: Edit, +}; diff --git a/assets/css/sensei-course-theme/fixed-sidebar.scss b/assets/css/sensei-course-theme/fixed-sidebar.scss index 03a606b3d9..124723bc0b 100644 --- a/assets/css/sensei-course-theme/fixed-sidebar.scss +++ b/assets/css/sensei-course-theme/fixed-sidebar.scss @@ -22,7 +22,7 @@ $min_desktop_width: 783px; overscroll-behavior: contain; display: flex; flex-direction: column; - padding: 32px 24px 40px 24px; + padding: 32px 24px 46px 24px; } &__header ~ &__columns &__sidebar { diff --git a/assets/icons/sensei-logo-tree.svg b/assets/icons/sensei-logo-tree.svg new file mode 100644 index 0000000000..c7426fa8c9 --- /dev/null +++ b/assets/icons/sensei-logo-tree.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/includes/blocks/course-theme/class-course-theme-blocks.php b/includes/blocks/course-theme/class-course-theme-blocks.php index 8d66120d19..f0006b009b 100644 --- a/includes/blocks/course-theme/class-course-theme-blocks.php +++ b/includes/blocks/course-theme/class-course-theme-blocks.php @@ -67,5 +67,6 @@ public function initialize_blocks() { new \Sensei_Block_Quiz_Progress(); new Blocks\Lesson_Properties(); new Blocks\Lesson_Video(); + new Blocks\Sensei_Logo(); } } diff --git a/includes/blocks/course-theme/class-sensei-logo.php b/includes/blocks/course-theme/class-sensei-logo.php new file mode 100644 index 0000000000..e14413b905 --- /dev/null +++ b/includes/blocks/course-theme/class-sensei-logo.php @@ -0,0 +1,61 @@ +assets->src_path( 'course-theme/blocks' ) . self::BLOCK_JSON_FILE; + + Sensei_Blocks::register_sensei_block( + 'sensei-lms/sensei-logo', + [ + 'render_callback' => [ $this, 'render' ], + 'style' => 'sensei-theme-blocks', + ], + $block_json_path + ); + } + + /** + * Renders the block. + * + * @access private + * + * @return string The block HTML. + */ + public function render(): string { + $icon = Sensei()->assets->get_icon( + 'sensei-logo-tree', + '', + [ + 'width' => '85', + 'height' => '40', + ] + ); + + return '' . $icon . ''; + } +} diff --git a/includes/class-sensei-assets.php b/includes/class-sensei-assets.php index 58a1a87dc9..3d4af8f3d3 100644 --- a/includes/class-sensei-assets.php +++ b/includes/class-sensei-assets.php @@ -304,13 +304,16 @@ private function get_icon_href( string $name ) : string { * * @param string $name The name of the icon file at "assets/images/.svg". * @param string $class_names Classnames to add to the SVG element. + * @param array $size Set the icon width/height. * * @return string The SVG HTML. */ - public function get_icon( string $name, string $class_names = '' ) : string { - $href = $this->get_icon_href( $name ); + public function get_icon( string $name, string $class_names = '', array $size = [] ) : string { + $href = $this->get_icon_href( $name ); + $width = $size['width'] ?? ''; + $height = $size['height'] ?? ''; - return ''; + return '" . ''; } /** diff --git a/themes/sensei-course-theme/templates/default/lesson.html b/themes/sensei-course-theme/templates/default/lesson.html index 4fb1b1b039..968a2b94f6 100644 --- a/themes/sensei-course-theme/templates/default/lesson.html +++ b/themes/sensei-course-theme/templates/default/lesson.html @@ -35,7 +35,17 @@
-
+ + + +
+ + + +
+
+ +