From: stephen@cubedesigners.com Date: Wed, 11 Mar 2020 23:43:42 +0000 (+0000) Subject: WordPress + Plugin updates. Wait #3329 @4.5 X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=44b026aac68b770bf1603671505aa2b6d65452d1;p=physioassist-wordpress.git WordPress + Plugin updates. Wait #3329 @4.5 --- diff --git a/wp-content/mu-plugins/physioassist/src/Elementor/Widgets/HeroBlock.php b/wp-content/mu-plugins/physioassist/src/Elementor/Widgets/HeroBlock.php index 58c2f723..51f6f803 100644 --- a/wp-content/mu-plugins/physioassist/src/Elementor/Widgets/HeroBlock.php +++ b/wp-content/mu-plugins/physioassist/src/Elementor/Widgets/HeroBlock.php @@ -67,6 +67,17 @@ class HeroBlock extends Widget_Base { ] ); + $this->add_control( + 'content_reversed', + [ + 'label' => __('Reverse content order?', 'cube'), + 'type' => Controls_Manager::SWITCHER, + 'default' => '', + 'return_value' => 'content-reversed', + 'prefix_class' => '', + ] + ); + $this->add_control( 'subtitle', [ @@ -270,6 +281,9 @@ class HeroBlock extends Widget_Base { // Rendered content echo '
'; echo '
'; + + // TODO: instead of inserting image like this, maybe it should be a bg image with proportional padding set to allow it to take up space. Then set to cover / right. Maybe text could be non-absolute so it pushes when needed? Check CCV, Elens and other sites where I've used these kinds of techniques recently... + echo "get_render_attribute_string('image')}>"; echo '
'; echo '
'; diff --git a/wp-content/mu-plugins/physioassist/src/Elementor/Widgets/TextBlock.php b/wp-content/mu-plugins/physioassist/src/Elementor/Widgets/TextBlock.php index 0a60cceb..9c50084f 100644 --- a/wp-content/mu-plugins/physioassist/src/Elementor/Widgets/TextBlock.php +++ b/wp-content/mu-plugins/physioassist/src/Elementor/Widgets/TextBlock.php @@ -117,6 +117,20 @@ class TextBlock extends Widget_Base { ] ); + $this->add_control( + 'cta_type', + [ + 'label' => __( 'Call to Action type', 'physioassist' ), + 'type' => Controls_Manager::SELECT, + 'options' => [ + 'link' => 'Link', + 'button' => 'Button', + ], + 'default' => 'link', + 'prefix_class' => 'text-block-cta-type-' + ] + ); + // Additional link control // Ideally this would be a widget of its own but due to the text-block scaling // and the need for absolute positioning it, we can't put another widget under diff --git a/wp-content/themes/physioassist/resources/assets/styles/components/buttons.styl b/wp-content/themes/physioassist/resources/assets/styles/components/buttons.styl index 7a911694..56fad607 100644 --- a/wp-content/themes/physioassist/resources/assets/styles/components/buttons.styl +++ b/wp-content/themes/physioassist/resources/assets/styles/components/buttons.styl @@ -1,17 +1,39 @@ .elementor-button, +.elementor-button.elementor-size-xs, .elementor-button.elementor-size-sm, .elementor-button.elementor-size-md, .elementor-button.elementor-size-lg, .elementor-button.elementor-size-xl background-color: $colors.blue color: #fff - border-radius: 0 + border-radius: 99em font-smoothing() - font-size: 18px font-weight: 700 text-align: center text-transform: uppercase - padding: 0.75em 2em + padding: 1.2em 2em + transition: background-color 0.15s ease-out &:hover - opacity: 0.85 + background-color: $colors.dark-blue + +.elementor-button + + &.elementor-size + &-xs, &-sm + font-size: 14px + &-md + font-size: 16px + &-lg + font-size: 18px + &-xl + font-size: 20px + + &-icon svg + width: auto + height: 0.7em + + .elementor-align-icon-left + margin-right: 0.57em + .elementor-align-icon-right + margin-left: 0.57em diff --git a/wp-content/themes/physioassist/resources/assets/styles/widgets/hero-block.styl b/wp-content/themes/physioassist/resources/assets/styles/widgets/hero-block.styl index aac4075e..9c4eb23e 100644 --- a/wp-content/themes/physioassist/resources/assets/styles/widgets/hero-block.styl +++ b/wp-content/themes/physioassist/resources/assets/styles/widgets/hero-block.styl @@ -42,6 +42,11 @@ $header-height = 84px // How much space to leave for transparent header constrain(left, 10vw) width: 672px // Max width a full size (should be kept in sync with JS!) transform-origin: left + display: flex + flex-direction: column + + .elementor-widget-cube-hero.content-reversed & + flex-direction: column-reverse +below($breakpoint-hero-block) position: relative @@ -57,11 +62,19 @@ $header-height = 84px // How much space to leave for transparent header color: #fff margin-bottom: 20px + .elementor-widget-cube-hero.content-reversed & + margin-bottom: 0 + margin-top: 0 + &-title color: currentColor font-size: 44px margin-bottom: 0.5em + .elementor-widget-cube-hero.content-reversed & + margin-bottom: 0 + margin-top: 0.5em + +below(700px) font-size: 7vw !important +below(500px) @@ -81,5 +94,9 @@ $header-height = 84px // How much space to leave for transparent header color: #fff margin-top: 30px + .elementor-widget-cube-hero.content-reversed & + margin-top: 0 + margin-bottom: 30px + +below(700px) margin-top: 1.5em diff --git a/wp-content/themes/physioassist/resources/assets/styles/widgets/text-block.styl b/wp-content/themes/physioassist/resources/assets/styles/widgets/text-block.styl index be7f2d16..f92d158f 100644 --- a/wp-content/themes/physioassist/resources/assets/styles/widgets/text-block.styl +++ b/wp-content/themes/physioassist/resources/assets/styles/widgets/text-block.styl @@ -36,6 +36,12 @@ font-weight: 400 margin-top: 2.5em + h3 + color: $colors.headings + font-size: 18px + margin-bottom: 1em + text-transform: uppercase + li margin-bottom: 0.5em @@ -44,6 +50,17 @@ line-height: 1.5 &-cta - display: block + display: inline-block margin-top: (30/14)em cursor: pointer // may not always have href (eg. for lightbox triggers) + + .text-block-cta-type-button & + color: #fff + background-color: $colors.blue + border-radius: 99em + padding: 1.2em 2em + transition: background-color 0.15s ease-out + + &:hover + background-color: $colors.dark-blue + diff --git a/wp-content/themes/physioassist/resources/assets/styles/widgets/video-carousel.styl b/wp-content/themes/physioassist/resources/assets/styles/widgets/video-carousel.styl index 24b8289b..1e30cf4e 100644 --- a/wp-content/themes/physioassist/resources/assets/styles/widgets/video-carousel.styl +++ b/wp-content/themes/physioassist/resources/assets/styles/widgets/video-carousel.styl @@ -93,3 +93,29 @@ left: 0 .slick-next right: 0 + + + ul.slick-dots + position: relative + bottom: 0 + constrain(margin-top, 2.5vw) + + li + &:not(:last-child) + margin-right: 11px + + button + width: 18px + height: @width + + &:before + content: '' + width: 100% + height: @width + border-radius: 50% + background-color: #dbdcdf + opacity: 1 !important + + &.slick-active + button:before + background-color: #1f8ccc diff --git a/wp-content/themes/physioassist/resources/views/widgets/video-gallery-carousel.blade.php b/wp-content/themes/physioassist/resources/views/widgets/video-gallery-carousel.blade.php index 5c324229..0b0422b9 100644 --- a/wp-content/themes/physioassist/resources/views/widgets/video-gallery-carousel.blade.php +++ b/wp-content/themes/physioassist/resources/views/widgets/video-gallery-carousel.blade.php @@ -3,6 +3,7 @@ $settings = [ 'slidesToShow' => 4, 'slidesToScroll' => 1, + 'dots' => count($videos) > 4, // Only show dots when there are enough videos 'infinite' => true, 'responsive' => [ [