Commit 6e295927629128d83af8fdbdf859da14a7ec95cc

Authored by Eugeny Galkovskiy
1 parent 3554b767

smi about styles

frontend/views/site/media-about.php
... ... @@ -30,6 +30,24 @@ use yii\web\View;
30 30 <div class="row portfolio">
31 31 <div class="col-sm-4">
32 32 <div class="box-image">
  33 + <div class="post" style="background-image: url('/img/post_cover_3.jpg');">
  34 + <a href="https://ecotechnica.com.ua/stati/2927-kakie-solnechnye-elektrostantsii-perspektivnee-kryshnye-ili-nazemnye.html" target="_blank">
  35 + <div class="title">Какие солнечные электростанции перспективнее - крышные или наземные?</div>
  36 + </a>
  37 + </div>
  38 + </div>
  39 + </div>
  40 + <div class="col-sm-4">
  41 + <div class="box-image">
  42 + <div class="post" style="background-image: url('/img/post_cover_2.jpg');">
  43 + <a href="http://censor.net.ua/resonance/322240/kak_ya_stal_nezavisimym_ot_veernyh_otklyucheniyi_pervaya_domashnyaya_elektrostantsiya_v_kievskoyi_oblasti" target="_blank">
  44 + <div class="title">"Как я стал независим от веерных отключений" - первая домашняя электростанция в Киевской области</div>
  45 + </a>
  46 + </div>
  47 + </div>
  48 + </div>
  49 + <div class="col-sm-4">
  50 + <div class="box-image">
33 51 <div style="position: absolute;padding-bottom:56.27%;top: 0;width: 100%;height: 100%;"><iframe src="https://www.youtube.com/embed/4XJ_UHggzto?ecver=2" style="position:absolute;width:100%;height:100%;left:0" width="100%" height="100%" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe></div>
34 52 </div>
35 53 </div>
... ...
frontend/web/css/main.css
... ... @@ -569,6 +569,35 @@ section.bar.background-gray.steps-pre:before {
569 569 .links-ses-for-wr .container .row p{display: inline-block;background-position: top left;background-repeat: no-repeat;padding: 13px 0 13px 58px;}
570 570  
571 571 #mediaabout-wr .portfolio .box-image {padding-top: 56.1%;}
  572 +#mediaabout-wr .portfolio .box-image .post{
  573 + position: absolute;
  574 + top: 0;
  575 + left: 0;
  576 + width: 100%;
  577 + height: 100%;
  578 + background-position: center;
  579 + background-repeat: no-repeat;
  580 + background-size: contain;
  581 +}
  582 +#mediaabout-wr .portfolio .box-image .post a{
  583 + position: absolute;
  584 + width: 100%;
  585 + height: 100%;
  586 + top: 0;
  587 + left: 0;
  588 +}
  589 +#mediaabout-wr .portfolio .box-image .post .title{
  590 + text-align: left;
  591 + color: #fff;
  592 + width:100%;
  593 + font-size: 15px;
  594 + padding: 10px 20px;
  595 + padding-bottom: 15px;
  596 + position: absolute;
  597 + bottom: 0;
  598 + background-color: rgba(0, 0, 0, 0.5);
  599 + max-height: 50%;
  600 +}
572 601  
573 602 @media(min-width:1200px){
574 603 .links-ses-for-wr .container .row p {margin: 7px 20px;}
... ...