From: soufiane Date: Thu, 4 May 2023 13:20:35 +0000 (+0200) Subject: wip #5874 @56:00 X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=ff1f77ec2d5ed58641ae6db88929b207b15c94b3;p=sycomore-fondation.git wip #5874 @56:00 --- diff --git a/wp-content/mu-plugins/cube-loader.php b/wp-content/mu-plugins/cube-loader.php new file mode 100644 index 0000000..6be5928 --- /dev/null +++ b/wp-content/mu-plugins/cube-loader.php @@ -0,0 +1,29 @@ +register(); + } +} + + +class Setup { + + public function register() { + add_action('elementor/elements/categories_registered', [$this, 'register_widgets_category']); + + add_action( 'elementor/widgets/widgets_registered', [$this, 'register_widgets'] ); + + $this->customise_sections(); + $this->customise_widget(); + $this->customise_container(); + } + + public function register_widgets($widgets_manager) { + $widgets_manager->register(new Widgets\TextWithBtn()); + $widgets_manager->register(new Widgets\FormattedText()); + $widgets_manager->register(new Widgets\HighlightTitle()); + $widgets_manager->register(new Widgets\AssociationSectionImage()); + $widgets_manager->register(new Widgets\AssocationList()); + $widgets_manager->register(new Widgets\BannerTitle()); + $widgets_manager->register(new Widgets\BlockOrganisation()); + } + + public function register_widgets_category($elements_manager) { + $elements_manager->add_category( + 'cube', + [ + 'title' => esc_html__( 'Cubedesigners', 'cube' ), + 'icon' => 'fa fa-plug', + ] + ); + } + + public function customise_sections() { + + // Section Layout and Padding Controls + add_action('elementor/element/after_section_start', function($element, $section_id, $args) { + + //echo ""; + // Add our custom layout controls to the "Layout" section in the "Advanced" tab of each element + // Note: for normal widgets, section_id for the Layout section is '_section_style', + // while for containers, it is called 'section_layout' (due to different implementation of Containers) + if (in_array($section_id, ['section_style_image'])) { + $element->add_control( + 'responsive', + [ + 'label' => __('Is responsive image?', 'cube'), + 'type' => Controls_Manager::SWITCHER, + 'default' => '', + 'return_value' => 'grid-constrain-fluid', + 'prefix_class' => '', + ] + ); + + $element->add_control( + 'padding-bottom', + [ + 'label' => __('Height (%)', 'cube'), + 'type' => Controls_Manager::SLIDER, + 'range' => [ + 'px' => [ // Not really a px measure but the slider doesn't work properly if we set a custom type here + 'min' => 1, + 'max' => 200, + 'step' => .01, + ], + ], + 'default' => [ + 'size' => 56.25, + ], + 'condition' => [ + 'responsive!' => '', + ], + 'separator' => 'after', + //'render_type' => 'ui', + 'selectors' => [ + '{{WRAPPER}} .elementor-widget-container' => 'height:0;position:relative;padding-bottom:{{SIZE}}%', + '{{WRAPPER}} img' => 'width:100%;height:100%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);object-fit:cover;' + ], + ] + ); + } + + if (in_array($section_id, ['_section_style', 'section_layout'])) { + /* @var \Elementor\Controls_Stack $element */ + + + // Grid Width Controls + $element->add_control( + 'constrain_width', + [ + 'label' => __('Constrain width?', 'cube'), + 'type' => Controls_Manager::SWITCHER, + 'default' => '', + 'return_value' => 'grid-constrain-fluid', + 'prefix_class' => '', + ] + ); + + $element->add_control( + 'max_grid_cols', + [ + 'label' => __('Max Width (measured in grid columns)', 'cube'), + 'type' => Controls_Manager::SLIDER, + 'range' => [ + 'px' => [ // Not really a px measure but the slider doesn't work properly if we set a custom type here + 'min' => 1, + 'max' => 12, + 'step' => 1, + ], + ], + 'default' => [ + 'size' => 12, + ], + 'condition' => [ + 'constrain_width!' => '', + ], + 'separator' => 'after', + //'render_type' => 'ui', + 'selectors' => [ + '{{WRAPPER}}' => 'width: calc(({{SIZE}} * 100%) / 12)', + ], + ] + ); + + // TODO: Check to see if the width constraint can be integrated into the main _element_width control. Need to think about if I want to use the responsive controls here too or have something more automatic that just cancels the max-width once we hit a certain minimum (like currently) 🤔 ============> see add_control() / update_control() functions, especially the $options['position'] setting that seems to allow us to inject a new control at a specific point in the stack. This would be needed to add the custom grid-based width control + + $spacing_controls = [ + 'margin-top' => __('Top Margin ↥', 'cube'), + 'padding-top' => __('Top Padding ⤒', 'cube'), + 'padding-bottom' => __('Bottom Padding ⤓', 'cube'), + 'margin-bottom' => __('Bottom Margin ↧', 'cube'), + ]; + + foreach ($spacing_controls as $spacing_control_name => $spacing_control_label) { + $field_name = 'spacing_' . $spacing_control_name; + $element->add_responsive_control( + $field_name, + [ + 'label' => $spacing_control_label, + 'type' => Controls_Manager::SELECT, + 'options' => static::spacing_options(), + 'default' => '0', + 'selectors' => [ + '{{WRAPPER}}' => "{$spacing_control_name}: var(--space-{{VALUE}});", + ], + ] + ); + } + } + + }, 10, 3 ); + + } + + public function customise_widget() { + // Add some extra hooks that we can use on the Elementor elements... + add_action('elementor/frontend/widget/before_render', function (Element_Base $element) { + // Add number child items in this container + //$element->add_render_attribute('_wrapper', 'class', 'm-0'); + + }, 10, 3); + } + + public function customise_container() { + // Add some extra hooks that we can use on the Elementor elements... + add_action('elementor/frontend/container/before_render', function (Element_Base $element) { + // Add number child items in this container + var_dump($element); + }); + } + + public static function spacing_options() { + // List of base spacing scales along with their descriptions + // Note: this should match what is in the theme's `tailwind.config.cjs` + return [ + '' => __('(par défaut)', 'cube'), + '0' => __('Aucun', 'cube'), + '3xs' => '3XS (4px — 5px)', + '2xs' => '2XS (8px — 10px)', + 'xs' => 'XS (12px — 15px)', + 's' => 'S (16px — 20px)', + 'm' => 'M (24px — 30px)', + 'l' => 'L (32px — 40px)', + 'xl' => 'XL (48px — 60px)', + '2xl' => '2XL (64px — 80px)', + '3xl' => '3XL (96px — 120px)', + '4xl' => '4XL (112px — 140px)', + '5xl' => '5XL (128px — 160px)', + + // Not all of these are needed for now, so removing them to lighten the UI + // '3xs-2xs' => '3XS ↔ 2XS (4px — 10px)', + // '2xs-xs' => '2XS ↔ XS (8px — 15px)', + // 'xs-s' => 'XS ↔ S (12px — 20px)', + // 's-m' => 'S ↔ M (16px — 30px)', + // 'm-l' => 'M ↔ L (24px — 40px)', + // 'l-xl' => 'L ↔ XL (32px — 60px)', + // 'xl-2xl' => 'XL ↔ 2XL (48px — 80px)', + // '2xl-3xl' => '2XL ↔ 3XL (64px — 120px)', + // '3xl-4xl' => '3XL ↔ 4XL (96px — 140px)', + // '4xl-5xl' => '4XL ↔ 5XL (112px — 160px)', + + 's-l' => 'S ↔ L (16px — 40px)', + 'm-xl' => 'M ↔ XL (24px — 60px)', + 'l-xl' => 'L ↔ XL (34px — 86px)', + 'l-2xl' => 'L ↔ 2XL (38px — 86px)', + '2xl-5xl' => '2XL ↔ 5XL (72px — 126px)', + ]; + } +} \ No newline at end of file diff --git a/wp-content/mu-plugins/cube/Widgets/AssocationList.php b/wp-content/mu-plugins/cube/Widgets/AssocationList.php new file mode 100644 index 0000000..d7c2663 --- /dev/null +++ b/wp-content/mu-plugins/cube/Widgets/AssocationList.php @@ -0,0 +1,206 @@ +start_controls_section( + 'content_section', + [ + 'label' => esc_html__( 'Content', 'cube' ), + 'tab' => Controls_Manager::TAB_CONTENT, + ] + ); + + /* Start repeater */ + + $repeater = new \Elementor\Repeater(); + + $repeater->add_control( + 'text', + [ + 'label' => esc_html__( 'Text', 'cube' ), + 'type' => Controls_Manager::TEXT, + 'placeholder' => esc_html__( 'List Item', 'cube' ), + 'default' => esc_html__( 'List Item', 'cube' ), + 'label_block' => true, + 'dynamic' => [ + 'active' => true, + ], + ] + ); + + $repeater->add_control( + 'link', + [ + 'label' => esc_html__( 'Link', 'cube' ), + 'type' => Controls_Manager::URL, + 'placeholder' => esc_html__( 'https://your-link.com', 'cube' ), + 'dynamic' => [ + 'active' => true, + ], + ] + ); + + /* End repeater */ + + $this->add_control( + 'list_items', + [ + 'label' => esc_html__( 'List Items', 'cube' ), + 'type' => Controls_Manager::REPEATER, + 'fields' => $repeater->get_controls(), /* Use our repeater */ + 'default' => [ + [ + 'text' => esc_html__( 'List Item #1', 'cube' ), + 'link' => '', + ], + [ + 'text' => esc_html__( 'List Item #2', 'cube' ), + 'link' => '', + ], + [ + 'text' => esc_html__( 'List Item #3', 'cube' ), + 'link' => '', + ], + ], + 'title_field' => '{{{ text }}}', + ] + ); + + $this->end_controls_section(); + + $this->start_controls_section( + 'marker_section', + [ + 'label' => esc_html__( 'List Marker', 'cube' ), + 'tab' => Controls_Manager::TAB_CONTENT, + ] + ); + + $this->add_control( + 'marker_type', + [ + 'label' => esc_html__( 'Marker Type', 'cube' ), + 'type' => Controls_Manager::CHOOSE, + 'options' => [ + 'ordered' => [ + 'title' => esc_html__( 'Ordered List', 'cube' ), + 'icon' => 'eicon-editor-list-ol', + ], + 'unordered' => [ + 'title' => esc_html__( 'Unordered List', 'cube' ), + 'icon' => 'eicon-editor-list-ul', + ], + 'other' => [ + 'title' => esc_html__( 'Custom List', 'cube' ), + 'icon' => 'eicon-edit', + ], + ], + 'default' => 'ordered', + 'toggle' => false, + ] + ); + + $this->end_controls_section(); + } + + protected function render() { + $items = $this->get_settings("list_items"); + $marker_type = $this->get_settings("marker_type"); + $html_tag = [ + 'ordered' => 'ol', + 'unordered' => 'ul', + 'other' => 'ul', + ]; + + $this->add_render_attribute( 'list', 'class', 'assoc-list' ); + + echo "
"; + echo "<{$html_tag[$marker_type]} {$this->get_render_attribute_string( 'list' )} >"; + foreach ( $items as $index => $item ) { + $repeater_setting_key = $this->get_repeater_setting_key( 'text', 'list_items', $index ); + $this->add_render_attribute( $repeater_setting_key, 'class', 'elementor-list-widget-text' ); + $this->add_inline_editing_attributes( $repeater_setting_key ); + ?> +
  • get_render_attribute_string( $repeater_setting_key ); ?>> + add_link_attributes( "link_{$index}", $item['link'] ); + $linked_title = sprintf( '%2$s', $this->get_render_attribute_string( "link_{$index}" ), $title ); + echo $linked_title; + } else { + echo $title; + } + ?> +
  • + + + "; + } + + /** + * Render list widget output in the editor. + * + * Written as a Backbone JavaScript template and used to generate the live preview. + * + * @since 1.0.0 + * @access protected + */ + protected function content_template() { + ?> + <# + html_tag = { + 'ordered': 'ol', + 'unordered': 'ul', + 'other': 'ul', + }; + view.addRenderAttribute( 'list', 'class', 'assoc-list' ); + #> +
    + <{{{ html_tag[ settings.marker_type ] }}} {{{ view.getRenderAttributeString( 'list' ) }}}> + <# _.each( settings.list_items, function( item, index ) { + var repeater_setting_key = view.getRepeaterSettingKey( 'text', 'list_items', index ); + view.addRenderAttribute( repeater_setting_key, 'class', 'elementor-list-widget-text' ); + view.addInlineEditingAttributes( repeater_setting_key ); + #> +
  • + <# var title = item.text; #> + <# if ( item.link ) { #> + <# view.addRenderAttribute( `link_${index}`, item.link ); #> + + {{{title}}} + + <# } else { #> + {{{title}}} + <# } #> +
  • + <# } ); #> + +
    + start_controls_section( + 'content_section', + [ + 'label' => esc_html__('Content', 'cube'), + 'tab' => \Elementor\Controls_Manager::TAB_CONTENT, + ] + ); + + $this->add_control( + 'title', + [ + 'label' => esc_html__('Title'), + 'type' => Controls_Manager::TEXT, + 'placeholder' => 'Enter your title', + 'default' => 'Lorem ipsum' + ] + ); + + $this->add_control( + 'title_tag', + [ + 'label' => __( 'Tag (SEO)', 'cube' ), + 'type' => Controls_Manager::SELECT, + 'options' => [ + 'h2' => __( 'H2', 'cube' ), + 'h3' => __( 'H3 (Défaut)', 'cube' ), + ], + 'default' => 'h3', + ] + ); + + $this->add_control( + 'gallery', + [ + 'label' => esc_html__('Association images'), + 'type' => Controls_Manager::GALLERY, + 'show_label' => false, + 'default' => [] + ] + ); + + $repeater = new \Elementor\Repeater(); + + $repeater->add_control( + 'text', + [ + 'label' => esc_html__( 'Text', 'cube' ), + 'type' => Controls_Manager::TEXT, + 'placeholder' => esc_html__( 'List Item', 'cube' ), + 'default' => esc_html__( 'List Item', 'cube' ), + 'label_block' => true, + 'dynamic' => [ + 'active' => true, + ], + ] + ); + + $repeater->add_control( + 'link', + [ + 'label' => esc_html__( 'Link', 'cube' ), + 'type' => Controls_Manager::URL, + 'placeholder' => esc_html__( 'https://your-link.com', 'cube' ), + 'dynamic' => [ + 'active' => true, + ], + ] + ); + + /* End repeater */ + + $this->add_control( + 'list_items', + [ + 'label' => esc_html__( 'List Items', 'cube' ), + 'type' => Controls_Manager::REPEATER, + 'fields' => $repeater->get_controls(), /* Use our repeater */ + 'default' => [ + [ + 'text' => esc_html__( 'List Item #1', 'cube' ), + 'link' => '', + ], + [ + 'text' => esc_html__( 'List Item #2', 'cube' ), + 'link' => '', + ], + [ + 'text' => esc_html__( 'List Item #3', 'cube' ), + 'link' => '', + ], + ], + 'title_field' => '{{{ text }}}', + ] + ); + + $this->end_controls_section(); + + $this->start_controls_section( + 'marker_section', + [ + 'label' => esc_html__( 'List Marker', 'cube' ), + 'tab' => Controls_Manager::TAB_CONTENT, + ] + ); + + $this->add_control( + 'marker_type', + [ + 'label' => esc_html__( 'Marker Type', 'cube' ), + 'type' => Controls_Manager::CHOOSE, + 'options' => [ + 'ordered' => [ + 'title' => esc_html__( 'Ordered List', 'cube' ), + 'icon' => 'eicon-editor-list-ol', + ], + 'unordered' => [ + 'title' => esc_html__( 'Unordered List', 'cube' ), + 'icon' => 'eicon-editor-list-ul', + ], + 'other' => [ + 'title' => esc_html__( 'Custom List', 'cube' ), + 'icon' => 'eicon-edit', + ], + ], + 'default' => 'ordered', + 'toggle' => false, + ] + ); + + $this->end_controls_section(); + } + + protected function render() { + $gallery = $this->get_settings("gallery"); + $title = $this->get_settings('title'); + $title_tag = $this->get_settings('title_tag'); + $items = $this->get_settings("list_items"); + $marker_type = $this->get_settings("marker_type"); + $html_tag = [ + 'ordered' => 'ol', + 'unordered' => 'ul', + 'other' => 'ul', + ]; + + $this->add_render_attribute( 'list', 'class', 'assoc-list' ); + + // Inline Editing settings + $this->add_inline_editing_attributes('title', 'none'); + + // CSS Classes for elements + $this->add_render_attribute('title', 'class', ["font-bold text-lg text-center relative"]); + + echo "
    "; + if (!empty($title)) echo "
    + <{$title_tag} {$this->get_render_attribute_string('title')}> + $title + + +
    "; + echo ""; + echo "<{$html_tag[$marker_type]} {$this->get_render_attribute_string( 'list' )} >"; + foreach ( $items as $index => $item ) { + $repeater_setting_key = $this->get_repeater_setting_key( 'text', 'list_items', $index ); + $this->add_render_attribute( $repeater_setting_key, 'class', 'elementor-list-widget-text' ); + $this->add_inline_editing_attributes( $repeater_setting_key ); + ?> +
  • get_render_attribute_string( $repeater_setting_key ); ?>> + add_link_attributes( "link_{$index}", $item['link'] ); + $linked_title = sprintf( '%2$s', $this->get_render_attribute_string( "link_{$index}" ), $title ); + echo $linked_title; + } else { + echo $title; + } + ?> +
  • + + + "; + } + + protected function content_template() { + ?> + <# + html_tag = { + 'ordered': 'ol', + 'unordered': 'ul', + 'other': 'ul', + }; + view.addRenderAttribute( 'list', 'class', 'assoc-list' ); + + view.addRenderAttribute( 'title', 'class', ['font-bold text-lg text-center relative']); + + view.addInlineEditingAttributes( 'title', 'none' ); + + #> + +
    + <# if ('' !== settings.title) { #> +
    + <{{{ settings.title_tag }}} {{{ view.getRenderAttributeString( 'title' ) }}}> + {{{ settings.title }}} + + +
    + <# } #> + + <{{{ html_tag[ settings.marker_type ] }}} {{{ view.getRenderAttributeString( 'list' ) }}}> + <# _.each( settings.list_items, function( item, index ) { + var repeater_setting_key = view.getRepeaterSettingKey( 'text', 'list_items', index ); + view.addRenderAttribute( repeater_setting_key, 'class', 'elementor-list-widget-text' ); + view.addInlineEditingAttributes( repeater_setting_key ); + #> +
  • + <# var title = item.text; #> + <# if ( item.link ) { #> + <# view.addRenderAttribute( `link_${index}`, item.link ); #> + + {{{title}}} + + <# } else { #> + {{{title}}} + <# } #> +
  • + <# } ); #> + +
    + start_controls_section( + 'content_section', + [ + 'label' => esc_html__('Content', 'cube'), + 'tab' => Controls_Manager::TAB_CONTENT, + ] + ); + + $this->add_control( + 'title', + [ + 'label' => __( 'Title', 'elementor' ), + 'type' => Controls_Manager::TEXT, + 'placeholder' => __( 'Enter your title', 'elementor' ), + 'default' => 'Lorem ipsum', + ] + ); + + $this->add_control( + 'title_tag', + [ + 'label' => __( 'Tag (SEO)', 'cube' ), + 'type' => Controls_Manager::SELECT, + 'options' => [ + 'h1' => __( 'H1 (Default)', 'cube' ), + 'h2' => __( 'H2 (Default)', 'cube' ), + ], + 'default' => 'h1', + ] + ); + $this->end_controls_section(); + + $this->start_controls_section( + 'style_section', + [ + 'label' => esc_html__( 'Style', 'cube' ), + 'tab' => Controls_Manager::TAB, + ] + ); + $this->add_control( + 'background_color', + [ + 'label' => esc_html__( 'Background color', 'cube' ), + 'type' => Controls_Manager::COLOR, + 'selectors' => [ + '{{WRAPPER}} .banner-title' => 'background-color: {{VALUE}}', + ], + ] + ); + $this->end_controls_section(); + } + + protected function render() { + $title = $this->get_settings("title"); + $title_tag = $this->get_settings("title_tag"); + + $this->add_render_attribute('title', 'class', ["font-bold text-2xl text-center"]); + ?> + + + <# view.addRenderAttribute( 'title', 'class', ['font-bold text-2xl text-center']); #> + + add_control( + 'gallery', + [ + 'label' => esc_html__('Organisation images'), + 'type' => Controls_Manager::GALLERY, + 'show_label' => false, + 'default' => [] + ] + ); + } + + protected function register_controls() { + parent::start('content', 'Content'); + $this->controls(); + parent::end(); + + self::start('style_section', 'Style'); + self::styleControls(); + self::end(); + } + + protected function render() { + parent::render(); + + $gallery = $this->get_settings("gallery"); + + echo ""; + } + + protected function content_template() { + parent::backboneTemplate(); + + ?> + + start_controls_section( + $id, + [ + 'label' => esc_html__($name, 'cube'), + 'tab' => Controls_Manager::TAB_CONTENT, + ] + ); + } + protected function controls() { + $this->add_control( + 'title', + [ + 'label' => __( 'Title', 'elementor' ), + 'type' => Controls_Manager::TEXTAREA, + 'placeholder' => __( 'Enter your title', 'elementor' ), + 'default' => 'Lorem ipsum', + ] + ); + + $this->add_control( + 'title_tag', + [ + 'label' => __( 'Tag (SEO)', 'cube' ), + 'type' => Controls_Manager::SELECT, + 'options' => [ + 'h2' => __( 'H2 (Default)', 'cube' ), + 'h3' => __( 'H3', 'cube' ), + ], + 'default' => 'h2', + ] + ); + + $this->add_control( + 'subtitle', + [ + 'label' => __( 'Subtitle', 'elementor' ), + 'type' => Controls_Manager::TEXTAREA, + 'placeholder' => __( 'Enter your subtitle', 'elementor' ), + 'default' => 'Lorem ipsum', + ] + ); + + $this->add_control( + 'subtitle_tag', + [ + 'label' => __( 'Tag (SEO)', 'cube' ), + 'type' => Controls_Manager::SELECT, + 'options' => [ + 'h2' => __( 'H2', 'cube' ), + 'h3' => __( 'H3 (Default)', 'cube' ), + ], + 'default' => 'h3', + ] + ); + + $this->add_control( + 'body', + [ + 'label' => __('Body', 'cube'), + 'type' => Controls_Manager::WYSIWYG, + 'default' => 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, + sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi + ut aliquip ex ea commodo consequat.', + ] + ); + } + + protected function styleControls() { + $this->add_control( + 'text_size', + [ + 'label' => esc_html__( 'Title size', 'cube' ), + 'type' => Controls_Manager::SELECT, + 'options' => [ + 'xlarge' => [ + 'title' => esc_html__( 'Extra Large', 'cube' ), + ], + 'large' => [ + 'title' => esc_html__( 'Large', 'cube' ), + ] + ], + 'default' => 'large', + 'toggle' => true, + ] + ); + } + + protected function end() { + $this->end_controls_section(); + } + + protected function register_controls() { + self::start('content_section', 'Content'); + $this->controls(); + self::end(); + + + self::start('style_section', 'Style'); + self::styleControls(); + self::end(); + } + + /** + * Render list widget output on the frontend. + * + * Written in PHP and used to generate the final HTML. + * + * @since 1.0.0 + * @access protected + */ + protected function render() { + + $title = $this->get_settings('title'); + $title_tag = $this->get_settings('title_tag'); + $subtitle = $this->get_settings('subtitle'); + $subtitle_tag = $this->get_settings('subtitle_tag'); + $body = $this->parse_text_editor($this->get_settings('body')); + $size = $this->get_settings('text_size') ? $this->get_settings('text_size') : 'large'; + + $size_classes = [ + 'xlarge' => 'text-xl', + 'large' => 'text-lg', + ]; + + // Inline Editing settings + $this->add_inline_editing_attributes('title', 'none'); + $this->add_inline_editing_attributes('subtitle', 'none'); + $this->add_inline_editing_attributes('body', 'none'); + + // CSS Classes for elements + $this->add_render_attribute('title', 'class', ["text-block-title font-bold text-xl $size_classes[$size]"]); + $this->add_render_attribute('subtitle', 'class', ["text-block-subtitle font-bold text-md"]); + $this->add_render_attribute('body', 'class', ['text-block-body']); + + // Rendered content + echo '
    '; + if (!empty($title)) echo "<{$title_tag} {$this->get_render_attribute_string('title')}>$title"; + if (!empty($subtitle)) echo "<{$subtitle_tag} {$this->get_render_attribute_string('subtitle')}>$subtitle"; + if (!empty($body)) echo "
    get_render_attribute_string('body')}>$body
    "; + echo '
    '; + } + + protected function backboneTemplate(){ ?> + <# + size_classes = { + 'xlarge': 'text-xl', + 'large': 'text-lg', + }; + + view.addRenderAttribute( + 'title', + { + 'class': [ 'text-block-title font-bold text-xl', size_classes[settings.text_size] ] + } + ); + view.addRenderAttribute( 'subtitle', 'class', ['text-block-subtitle font-bold text-md']); + view.addRenderAttribute( 'body', 'class', ['text-block-body']); + + view.addInlineEditingAttributes( 'title', 'none' ); + view.addInlineEditingAttributes( 'subtitle', 'none' ); + view.addInlineEditingAttributes( 'body', 'none' ); + #> +
    + + <# if ('' !== settings.title) { #> + <{{{ settings.title_tag }}} {{{ view.getRenderAttributeString( 'title' ) }}}>{{{ settings.title }}} + <# } #> + + <# if ('' !== settings.subtitle) { #> + <{{{ settings.subtitle_tag }}} {{{ view.getRenderAttributeString( 'subtitle' ) }}}>{{{ settings.subtitle }}} + <# } #> + + <# if ('' !== settings.body) { #> +
    {{{ settings.body }}}
    + <# } #> + +
    + start_controls_section( + 'content_section', + [ + 'label' => esc_html__( 'Content', 'cube' ), + 'tab' => \Elementor\Controls_Manager::TAB_CONTENT, + ] + ); + + + $this->add_control( + 'title', + [ + 'label' => __( 'Text', 'elementor' ), + 'type' => Controls_Manager::TEXTAREA, + 'placeholder' => __( 'Enter your title', 'elementor' ), + 'default' => 'Lorem ipsum', + ] + ); + + $this->add_control( + 'title_tag', + [ + 'label' => __( 'Tag (SEO)', 'cube' ), + 'type' => Controls_Manager::SELECT, + 'options' => [ + 'h2' => __( 'H2', 'cube' ), + 'h3' => __( 'H3 (Défaut)', 'cube' ), + ], + 'default' => 'h3', + ] + ); + + $this->end_controls_section(); + $this->start_controls_section( + 'style_section', + [ + 'label' => esc_html__( 'Style', 'cube' ), + 'tab' => \Elementor\Controls_Manager::TAB_CONTENT, + ] + ); + + $this->add_control( + 'text_color', + [ + 'label' => esc_html__( 'Text Color', 'cube' ), + 'type' => Controls_Manager::COLOR, + 'selectors' => [ + '{{WRAPPER}} .highlight' => 'color: {{VALUE}}', + ], + ] + ); + + $this->add_control( + 'bar_color', + [ + 'label' => esc_html__( 'Bar Color', 'cube' ), + 'type' => Controls_Manager::COLOR, + 'selectors' => [ + '{{WRAPPER}} .highlight-bar' => 'background-color: {{VALUE}}', + ], + ] + ); + + $this->add_control( + 'text_size', + [ + 'label' => esc_html__( 'Size', 'cube' ), + 'type' => Controls_Manager::SELECT, + 'options' => [ + 'large' => [ + 'title' => esc_html__( 'Large', 'cube' ), + ], + 'small' => [ + 'title' => esc_html__( 'Small', 'cube' ), + ] + ], + 'default' => 'small', + 'toggle' => true, + ] + ); + + $this->add_control( + 'text_weight', + [ + 'label' => esc_html__( 'Font weight', 'cube' ), + 'type' => Controls_Manager::SELECT, + 'options' => [ + 'bold' => [ + 'title' => esc_html__( 'Bold', 'cube' ), + ], + 'semibold' => [ + 'title' => esc_html__( 'Semi bold', 'cube' ), + ] + ], + 'default' => 'semibold', + 'toggle' => true, + ] + ); + } + + /** + * Render list widget output on the frontend. + * + * Written in PHP and used to generate the final HTML. + * + * @since 1.0.0 + * @access protected + */ + protected function render() { + + $title = $this->get_settings('title'); + $title_tag = $this->get_settings('title_tag'); + $size = $this->get_settings('text_size'); + $weight = $this->get_settings('text_weight'); + + $size_classes = [ + 'large' => 'text-lg', + 'small' => 'text-sm', + ]; + + // Inline Editing settings + $this->add_inline_editing_attributes('title', 'none'); + + // CSS Classes for elements + $this->add_render_attribute('title', 'class', ["highlight relative font-$weight $size_classes[$size]"]); + + // Rendered content + + if (!empty($title)) echo "<{$title_tag} {$this->get_render_attribute_string('title')}>$title"; + } + + /** + * Render text editor widget output in the editor. + * + * Written as a Backbone JavaScript template and used to generate the live preview. + * + * @since 1.0.0 + * @access protected + */ + protected function content_template() { + ?> + <# + + size_classes = { + 'large': 'text-lg', + 'small': 'text-sm', + }; + + weight_classes = { + 'bold': 'font-bold', + 'semibold': 'font-semibold', + } + + view.addRenderAttribute( + 'title', + { + 'class': [ 'highlight', weight_classes[settings.text_weight], size_classes[settings.text_size] ] + } + ); + + view.addInlineEditingAttributes( 'title', 'none' ); + #> + + <# if ('' !== settings.title) { #> + <{{{ settings.title_tag }}} {{{ view.getRenderAttributeString( 'title' ) }}}> + {{{ settings.title }}} + + + <# } #> + + start_controls_section( + 'content_section', + [ + 'label' => esc_html__( 'Content', 'cube' ), + 'tab' => \Elementor\Controls_Manager::TAB_CONTENT, + ] + ); + + $this->add_control( + 'above_title', + [ + 'label' => __( 'Above title', 'elementor' ), + 'type' => Controls_Manager::TEXT, + 'placeholder' => __( 'Enter your above title', 'elementor' ), + 'default' => 'Abovetitle', + ] + ); + + $this->add_control( + 'title', + [ + 'label' => __( 'Title', 'elementor' ), + 'type' => Controls_Manager::TEXT, + 'placeholder' => __( 'Enter your title', 'elementor' ), + 'default' => 'Title', + ] + ); + + $this->add_control( + 'title_tag', + [ + 'label' => __( 'Balise de titre (SEO)', 'cube' ), + 'type' => Controls_Manager::SELECT, + 'options' => [ + 'h2' => __( 'H2', 'cube' ), + 'h3' => __( 'H3 (Défaut)', 'cube' ), + ], + 'default' => 'h3', + ] + ); + + $this->add_control( + 'body', + [ + 'label' => __('Body', 'cube'), + 'type' => Controls_Manager::WYSIWYG, + 'default' => 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, + sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi + ut aliquip ex ea commodo consequat.', + ] + ); + + $this->add_control( + 'cta_text', + [ + 'label' => __('Call to Action text', 'cube'), + 'type' => Controls_Manager::TEXT, + 'default' => 'Lorem ipsum' + ] + ); + + $this->add_control( + 'cta_link', + [ + 'label' => __('Call to Action link', 'cube'), + 'type' => Controls_Manager::URL, + 'default' => [ + 'url' => '', + 'is_external' => false, + ], + 'show_external' => true + ] + ); + + $this->end_controls_section(); + $this->start_controls_section( + 'style_section', + [ + 'label' => esc_html__( 'Style', 'cube' ), + 'tab' => Controls_Manager::TAB, + ] + ); + $this->add_control( + 'color', + [ + 'label' => esc_html__( 'Background color', 'cube' ), + 'type' => Controls_Manager::COLOR, + 'selectors' => [ + '{{WRAPPER}} .highlight-' => 'background-color: {{VALUE}}', + ], + ], + '' + ); + $this->end_controls_section(); + } + + /** + * Render list widget output on the frontend. + * + * Written in PHP and used to generate the final HTML. + * + * @since 1.0.0 + * @access protected + */ + protected function render() { + + $abovetitle = $this->get_settings('above_title'); + $title = $this->get_settings('title'); + $title_tag = $this->get_settings('title_tag'); + $body = $this->parse_text_editor($this->get_settings('body')); + $cta_text = $this->get_settings('cta_text'); + $cta_link = $this->get_settings('cta_link'); + + if ( ! empty( $cta_link['url'] ) ) { + $this->add_render_attribute( 'cta_text', 'href', $cta_link['url'] ); + } + + // Inline Editing settings + $this->add_inline_editing_attributes('above_title', 'none'); + $this->add_inline_editing_attributes('title', 'none'); + $this->add_inline_editing_attributes('body', 'none'); + $this->add_inline_editing_attributes('cta_text', 'none'); + + // CSS Classes for elements + $this->add_render_attribute('above_title', 'class', ["text-blockbtn-above-title font-semibold"]); + $this->add_render_attribute('title', 'class', ["text-blockbtn-title font-bold text-xl"]); + $this->add_render_attribute('body', 'class', ['text-blockbtn-body font-semibold']); + $this->add_render_attribute('cta_text', 'class', ['text-blockbtn-cta btn font-semibold']); + + // Rendered content + echo '
    '; + if (!empty($abovetitle)) echo "

    get_render_attribute_string('above_title')}>$abovetitle

    "; + if (!empty($title)) echo "<{$title_tag} {$this->get_render_attribute_string('title')}>$title"; + if (!empty($body)) echo "
    get_render_attribute_string('body')}>$body
    "; + if (!empty($cta_text)) { + echo '
    get_render_attribute_string('cta_text') .'>'; + echo $cta_text; + echo '
    '; + } + echo '
    '; + } + + /** + * Render text editor widget output in the editor. + * + * Written as a Backbone JavaScript template and used to generate the live preview. + * + * @since 1.0.0 + * @access protected + */ + protected function content_template() { + ?> + <# + div_tag = "div"; + view.addRenderAttribute( 'above_title', 'class', ['text-block-above-title font-semibold']); + view.addRenderAttribute( 'title', 'class', ['text-block-title font-bold text-xl']); + view.addRenderAttribute( 'body', 'class', ['text-block-body font-semibold']); + view.addRenderAttribute( 'cta_text', 'class', ['text-block-cta btn font-semibold']); + + view.addInlineEditingAttributes( 'above_title', 'none' ); + view.addInlineEditingAttributes( 'title', 'none' ); + view.addInlineEditingAttributes( 'body', 'none' ); + view.addInlineEditingAttributes( 'cta_text', 'none' ); + #> + <{{{ div_tag }}} class="text-blockbtn"> + <# if ('' !== settings.above_title) { #> +

    {{{ settings.above_title }}}

    + <# } #> + + <# if ('' !== settings.title) { #> + <{{{ settings.title_tag }}} {{{ view.getRenderAttributeString( 'title' ) }}}>{{{ settings.title }}} + <# } #> + + <# if ('' !== settings.body) { #> +
    {{{ settings.body }}}
    + <# } #> + + <# if ('' !== settings.cta_text) { #> +
    + + {{{ settings.cta_text }}} + +
    + <# } #> + + + .elementor-container + width: 90% + margin: 0 auto + +screen-size('tablet') + width: 80% + max-width: 1344px + +.btn + border: 1px solid + border-radius: 10px + padding: 15px 26px + display: inline-block + cursor: pointer + +.image-double + .elementor-container + align-items: center + +.relative + position: relative + +.text-center + text-align: center + +h5 + font-size: map-get($fontSizes, 'md') + +b + font-weight: 500 + +p + line-height: 22px + font-weight: normal + +[class^=col-] + +screen-size('tablet') + width: 100% + +.grid-constrain-fluid + margin: 0 auto + +.z-1 + z-index: 1 + +.elementor-widget-wrap + display: grid !important + +body:not(.home) + .elementor-section:nth-child(2) + margin-top: -84px + +h1,h2,h3,h4,h5,h6 + &:not(.highlight) + font-family: "Circe", sans-serif + line-height: 100% diff --git a/wp-content/themes/sycomore-fondation/resources/styles/common/helpers.sass b/wp-content/themes/sycomore-fondation/resources/styles/common/helpers.sass new file mode 100644 index 0000000..97b89d4 --- /dev/null +++ b/wp-content/themes/sycomore-fondation/resources/styles/common/helpers.sass @@ -0,0 +1,75 @@ +$fontSizes: ( '3xl': 9.313rem,'2xl': 4.768rem,'xl': 3.815rem,'lg': 1.953rem,'md': 1.25rem, 'sm': 1rem) +$fontWeights: (light: 300,normal: 400,medium: 500,semibold: 600,bold: 700,'extra-bold': 800,black: 900) +$colors: ('red': ('full': '#F42865','clear': '#707070','transparent': 'rgba(249,195,211,.5)'),'turquoise': '#28CABD','blue': ('full': '#092CC8','clear': '#C3CBF0'),'orange': ( 'full': '#FD6120','transparent': 'rgba(255,226,199,.5)'),'grey': ('disabled': '#B0B4C1','dark': '#141414')) +$breakpoint: ('phone': '500px', 'tablet': '768px', 'small-desktop': '1024px', 'desktop': '1344px', 'widescreen': '1680px') + +@for $i from 1 through 12 + .col-#{$i} + --cols: calc((#{$i} * 100) / 12)'%' + +@each $size,$value in $fontSizes + .text-#{$size} + font-size: $value + line-height: normal + +@each $weight,$value in $fontWeights + .font-#{$weight} + font-weight: $value + +@mixin screen-size($key, $query: 'min') + @media screen and (#{$query}-width: map-get($breakpoint, $key)) + @content + +@mixin gap + gap: 1.25vw + +screen-size('widescreen') + gap: 21px + +@mixin special-gap($y) + gap: #{$y}vw 1.25vw + +screen-size('widescreen') + gap: #{$y}vw 21px + +/* @link https://utopia.fyi/space/calculator?c=320,16,1.125,1344,16,1.25,6,2,&s=0.75|0.5|0.25,1.5|2|3|4|6|7|8,s-l|m-xl|l-2xl|2xl-4xl&g=s,l,xl,12 */ + +\:root + --space-3xs: clamp(0.25rem, calc(0.25rem + 0.00vw), 0.25rem) + --space-2xs: clamp(0.50rem, calc(0.50rem + 0.00vw), 0.50rem) + --space-xs: clamp(0.75rem, calc(0.75rem + 0.00vw), 0.75rem) + --space-s: clamp(1.00rem, calc(1.00rem + 0.00vw), 1.00rem) + --space-m: clamp(1.50rem, calc(1.50rem + 0.00vw), 1.50rem) + --space-l: clamp(2.00rem, calc(2.00rem + 0.00vw), 2.00rem) + --space-xl: clamp(3.00rem, calc(3.00rem + 0.00vw), 3.00rem) + --space-2xl: clamp(4.00rem, calc(4.00rem + 0.00vw), 4.00rem) + --space-3xl: clamp(6.00rem, calc(6.00rem + 0.00vw), 6.00rem) + --space-4xl: clamp(7.00rem, calc(7.00rem + 0.00vw), 7.00rem) + --space-5xl: clamp(8.00rem, calc(8.00rem + 0.00vw), 8.00rem) + + /* One-up pairs */ + --space-3xs-2xs: clamp(0.25rem, calc(0.17rem + 0.39vw), 0.50rem) + --space-2xs-xs: clamp(0.50rem, calc(0.42rem + 0.39vw), 0.75rem) + --space-xs-s: clamp(0.75rem, calc(0.67rem + 0.39vw), 1.00rem) + --space-s-m: clamp(1.00rem, calc(0.84rem + 0.78vw), 1.50rem) + --space-m-l: clamp(1.50rem, calc(1.34rem + 0.78vw), 2.00rem) + --space-l-xl: clamp(2.13rem, calc(1.11rem + 5.08vw), 5.38rem) + --space-xl-2xl: clamp(3.00rem, calc(2.69rem + 1.56vw), 4.00rem) + --space-2xl-3xl: clamp(4.00rem, calc(3.38rem + 3.13vw), 6.00rem) + --space-3xl-4xl: clamp(6.00rem, calc(5.69rem + 1.56vw), 7.00rem) + --space-4xl-5xl: clamp(7.00rem, calc(6.69rem + 1.56vw), 8.00rem) + + /* Custom pairs */ + --space-s-l: clamp(1.00rem, calc(0.69rem + 1.56vw), 2.00rem) + --space-m-xl: clamp(1.50rem, calc(1.03rem + 2.34vw), 3.00rem) + --space-l-2xl: clamp(2.375rem, calc(1.38rem + 3.13vw), 5.375rem) + --space-2xl-4xl: clamp(4.00rem, calc(3.06rem + 4.69vw), 7.00rem) + --space-2xl-5xl: clamp(4.00rem, calc(2.75rem + 6.25vw), 7.875rem) + + --step--2: clamp(1.93rem, calc(1.58rem + 1.74vw), 3.04rem) + --step--1: clamp(2.17rem, calc(1.66rem + 2.55vw), 3.80rem) + --step-0: clamp(2.44rem, calc(1.71rem + 3.61vw), 4.75rem) + --step-1: clamp(2.74rem, calc(1.74rem + 4.99vw), 5.94rem) + --step-2: clamp(3.09rem, calc(1.73rem + 6.78vw), 7.42rem) + --step-3: clamp(3.47rem, calc(1.66rem + 9.07vw), 9.28rem) + --step-4: clamp(3.90rem, calc(1.50rem + 12.02vw), 11.60rem) + --step-5: clamp(4.39rem, calc(1.24rem + 15.79vw), 14.50rem) + --step-6: clamp(4.94rem, calc(0.82rem + 20.59vw), 18.12rem) diff --git a/wp-content/themes/sycomore-fondation/resources/styles/common/reset.sass b/wp-content/themes/sycomore-fondation/resources/styles/common/reset.sass new file mode 100644 index 0000000..7fbd4ae --- /dev/null +++ b/wp-content/themes/sycomore-fondation/resources/styles/common/reset.sass @@ -0,0 +1,8 @@ +.m-0 + margin-bottom: 0 !important + +.elementor-widget-wrap + padding: 0 !important + +* + line-height: normal diff --git a/wp-content/themes/sycomore-fondation/resources/styles/partials/footer.css b/wp-content/themes/sycomore-fondation/resources/styles/partials/footer.css new file mode 100644 index 0000000..942bdc2 --- /dev/null +++ b/wp-content/themes/sycomore-fondation/resources/styles/partials/footer.css @@ -0,0 +1,7 @@ +footer.content-info { + padding: 51px 0; +} + +.nav-footer li:not(:last-child) { + margin-right: 42px; +} diff --git a/wp-content/themes/sycomore-fondation/resources/styles/partials/galleryTwin.sass b/wp-content/themes/sycomore-fondation/resources/styles/partials/galleryTwin.sass new file mode 100644 index 0000000..a8b7fe0 --- /dev/null +++ b/wp-content/themes/sycomore-fondation/resources/styles/partials/galleryTwin.sass @@ -0,0 +1,24 @@ +.gallery-columns-2 + .gallery + &-item + &:nth-of-type(2n+1) + + max-width: calc(4 * 100% / 7) !important + .gallery-icon + padding-bottom: 119.79% + + &:nth-of-type(2n+2) + max-width: calc(3 * 100% / 7) !important + .gallery-icon + padding-bottom: 134.61% + + &-icon + position: relative + img + position: absolute + width: 100% + height: 100% + left: 50% + top: 50% + transform: translate(-50%,-50%) + object-fit: cover diff --git a/wp-content/themes/sycomore-fondation/resources/styles/partials/header.css b/wp-content/themes/sycomore-fondation/resources/styles/partials/header.css deleted file mode 100644 index bf7d0d8..0000000 --- a/wp-content/themes/sycomore-fondation/resources/styles/partials/header.css +++ /dev/null @@ -1,13 +0,0 @@ -#menu-menu { - display: flex; - li:not(:last-child) { - margin-right: 62px - } - li.current-menu-item a, - li.current-menu-item:hover a { - color: theme('colors.red.clear'); - } - a { - font-weight: 500; - } -} diff --git a/wp-content/themes/sycomore-fondation/resources/styles/partials/header.scss b/wp-content/themes/sycomore-fondation/resources/styles/partials/header.scss new file mode 100644 index 0000000..ad4aa60 --- /dev/null +++ b/wp-content/themes/sycomore-fondation/resources/styles/partials/header.scss @@ -0,0 +1,32 @@ +header.banner { + position: fixed; + width: 100%; + z-index: 99; + transition: all .3s; + img { + width: 100%; + transition: all .3s; + } +} + +body.sticky header.banner { + background-color: #FFFFFF; + padding: 0.5rem 0; + img { + width: 80%; + } +} + +#menu-menu { + display: flex; + li:not(:last-child) { + margin-right: 62px + } + li.current-menu-item a, + li.current-menu-item:hover a { + color: theme('colors.red.clear'); + } + a { + font-weight: 500; + } +} diff --git a/wp-content/themes/sycomore-fondation/resources/styles/widgets/bannerTitle.sass b/wp-content/themes/sycomore-fondation/resources/styles/widgets/bannerTitle.sass new file mode 100644 index 0000000..abd50e9 --- /dev/null +++ b/wp-content/themes/sycomore-fondation/resources/styles/widgets/bannerTitle.sass @@ -0,0 +1,7 @@ +.banner-title + padding: 168px 0 + h1,h2,h3 + font-size: var(--step-0) + max-width: 889px + width: 100% + margin: 0 auto diff --git a/wp-content/themes/sycomore-fondation/resources/styles/widgets/blockAssociation.sass b/wp-content/themes/sycomore-fondation/resources/styles/widgets/blockAssociation.sass new file mode 100644 index 0000000..f475848 --- /dev/null +++ b/wp-content/themes/sycomore-fondation/resources/styles/widgets/blockAssociation.sass @@ -0,0 +1,34 @@ +.assoc + &-block + padding-bottom: 86px + border-bottom: 1px solid #D8D8D8 + h3,h2 + width: max-content + margin: 0 auto 46px + z-index: 1 + background: #ffffff + padding: 0 50px + .design-line + width: 100% + height: 1px + background-color: #D8D8D8 + position: absolute + bottom: 6px + left: 0 + &-gallery + margin-bottom: 76px + +screen-size('small-desktop', 'max') + display: none + img + filter: grayscale(1) + &-list + width: 83.33% + margin: 0 auto + list-style-type: disc + list-style-position: inside + display: grid + flex-wrap: wrap + grid-template-columns: repeat(3, 1fr) + +gap + li + width: 100% diff --git a/wp-content/themes/sycomore-fondation/resources/styles/widgets/blockFormattedText.sass b/wp-content/themes/sycomore-fondation/resources/styles/widgets/blockFormattedText.sass new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/sycomore-fondation/resources/styles/widgets/blockOrganisation.sass b/wp-content/themes/sycomore-fondation/resources/styles/widgets/blockOrganisation.sass new file mode 100644 index 0000000..a7f8483 --- /dev/null +++ b/wp-content/themes/sycomore-fondation/resources/styles/widgets/blockOrganisation.sass @@ -0,0 +1,37 @@ +.elementor-widget-cube-organisation + .elementor-widget-container + display: grid + grid-template-columns: repeat(2, 1fr) + +gap +.organisation-gallery + display: grid + grid-template-columns: repeat(3, 1fr) + +special-gap(2.976) + .img-container + height: 0 + border-radius: 3px + overflow: hidden + margin-bottom: 10px + padding-bottom: 100% + img + width: 100% + height: 100% + position: absolute + top: 0 + left: 0 + object-fit: cover + .title, + .desc + line-height: normal + .title + font-size: 20px + margin-bottom: 7px + .desc + font-size: 12px + color: #818181 + text-transform: uppercase + +.elementor-widget-cube-organisation + .text-block + width: 66.666666% + margin: 0 auto diff --git a/wp-content/themes/sycomore-fondation/resources/styles/widgets/blockText.sass b/wp-content/themes/sycomore-fondation/resources/styles/widgets/blockText.sass new file mode 100644 index 0000000..724a94b --- /dev/null +++ b/wp-content/themes/sycomore-fondation/resources/styles/widgets/blockText.sass @@ -0,0 +1,13 @@ +.elementor-col-50 + .elementor-widget-cube-highlight-title, + .elementor-widget-cube-formatted-text, + .elementor-widget-cube-textwith-btn, + .elementor-widget-text-editor, + .elementor-widget-cube-textwith-btn + width: 83.33% + margin: 0 auto + +.text-block + &-title, + &-subtitle + margin-bottom: 21px diff --git a/wp-content/themes/sycomore-fondation/resources/styles/widgets/blocktextbtn.sass b/wp-content/themes/sycomore-fondation/resources/styles/widgets/blocktextbtn.sass new file mode 100644 index 0000000..422d3a4 --- /dev/null +++ b/wp-content/themes/sycomore-fondation/resources/styles/widgets/blocktextbtn.sass @@ -0,0 +1,16 @@ +.text-blockbtn + &-above-title + position: relative + width: max-content + &:after + content: "" + position: absolute + left: 0 + bottom: 6px + width: 100% + height: 7px + background-color: inherit + &-title + margin-bottom: 21px + &-body + margin-bottom: 24px diff --git a/wp-content/themes/sycomore-fondation/resources/styles/widgets/highlightTitle.sass b/wp-content/themes/sycomore-fondation/resources/styles/widgets/highlightTitle.sass new file mode 100644 index 0000000..097a587 --- /dev/null +++ b/wp-content/themes/sycomore-fondation/resources/styles/widgets/highlightTitle.sass @@ -0,0 +1,10 @@ +.highlight + width: max-content + line-height: 1 + &-bar + width: 100% + height: 38.8% + position: absolute + bottom: 0 + left: 0 + z-index: 0