How to make a responsive Z-pattern on Bootstrap 4?

Question

Bootstrap

It took me a hard time to type up my own new site on Bootstrap 4 instead of the 3rd one, which I have known well for several years. As it happens in such situations - instead of a quick swoop with a sword drawn, you are forced to spend up to 90% of the time on a Google project and studying the documentation for a new product for yourself.
Here's the z-pattern, for those who don't understand, in 2 versions (some call it "apple-like"))):

Here's a really working section on Bootstrap 3:

<div class="row">
  <div class="col-md-5 col-sm-5">
    <img src="" alt="" class="img-responsive">
  </div>
  <div class="col-md-7 col-sm-7">
    <p>Текстовка</p>
  </div>
</div>
<hr />
<div class="row">
  <div class="col-md-5 col-sm-5 col-md-push-7 col-sm-push-7 col-xs-push-0">
    <img src="" alt="" class="img-responsive">
  </div>
  <div class="col-md-7 col-sm-7 col-md-pull-5 col-sm-pull-5 col-xs-pull-0">
    <p>Текстовка</p>
  </div>
</div>

The solution is based on the "push-pull" classes pull and push. In Bootstrap 4, I did not find anything like this!
The question is how to make it on 4-ke?

Answer 1

Have a look here https://getbootstrap.com/docs/4.0/examples/carousel/ featurette section. Are you looking for this?
And it makes no sense to put the same cm / md. You can set the minimum screen and move from it. For example, count-lg-3 count-md-12. In general, bootstrap is an evil that destroys skills)