Alexey Boroda / openeurope

Commit c3e7999ef9d20506a27c22ba64b7a52f72cda178

Authored by Виталий
1 parent 10eacd2d

header + gallery page

Showing 6 changed files with 351 additions and 155 deletions   Show diff stats
Inline Side-by-side
frontend/views/gallery/index.php
  Show/Hide comments   View file @c3e7999
... ... @@ -20,12 +20,13 @@
20 20 <?php foreach ($images as $gallery){?>
21 21  
22 22  
23   - <figure class="reviews_gallery">
24   - <figcaption class="image_figcapture"> <?=$gallery->language->title;?></figcaption>
  23 + <figure class="reviews_gallery gallery_txt">
  24 +
25 25 <a href="<?=$gallery->image->getUrl()?>" itemprop="contentUrl" data-size="<?= getimagesize(
26 26 $gallery->image->getPath()
27 27 )[ 0 ] ?>x<?= getimagesize($gallery->image->getPath()
28 28 )[ 1 ] ?>">
  29 + <figcaption class="image_figcapture"> <?=$gallery->language->title;?></figcaption>
29 30 <img src="<?= ImageHelper::set($gallery->image->getPath())
30 31 ->cropResize(360, 216)
31 32 ->quality(82)
... ...
frontend/views/layouts/main.php
  Show/Hide comments   View file @c3e7999
... ... @@ -118,10 +118,10 @@ _________________________________________________________ --&gt;
118 118 }
119 119 ?>
120 120 </p>
121   - <p class="hidden-md hidden-lg">
122   - <a href="#" data-animate-hover="pulse"><i class="fa fa-phone"></i></a>
123   - <a href="#" data-animate-hover="pulse"><i class="fa fa-envelope"></i></a>
124   - </p>
  121 +<!-- <p class="hidden-md hidden-lg hidden-xs hidden-sm">-->
  122 +<!-- <a href="#" data-animate-hover="pulse"><i class="fa fa-phone"></i></a>-->
  123 +<!-- <a href="#" data-animate-hover="pulse"><i class="fa fa-envelope"></i></a>-->
  124 +<!-- </p>-->
125 125 </div>
126 126 <div class="col-xs-7">
127 127 <div class="social">
... ...
frontend/web/css/custom.css
  Show/Hide comments   View file @c3e7999
1 1 /* your styles go here */
2   -#footer{
3   - padding: 20px 0;
4   -}
5   -#get-it{
6   - padding: 30px 0 10px;
7   -}
  2 +#footer {
  3 + padding: 20px 0; }
  4 +
  5 +#get-it {
  6 + padding: 30px 0 10px; }
8 7  
9 8 figure.reviews_gallery {
10   - width: 33.333%;
11   - float: left;
12   - padding: 10px;
13   -}
  9 + width: 33.333%;
  10 + float: left;
  11 + padding: 10px; }
  12 +
14 13 .reviews_gallery img {
15   - width: 100%;
16   - height: 100%;
17   - position: absolute;
18   - top: 0;
19   -}
20   -.reviews_gallery:last-child img{
21   - margin-bottom:60px;
22   -}
23   -.my-gallery{
24   - position:relative;
25   -}
  14 + width: 100%;
  15 + height: 100%;
  16 + position: absolute;
  17 + top: 0; }
  18 +
  19 +.reviews_gallery:last-child img {
  20 + margin-bottom: 60px; }
  21 +
  22 +.gallery_txt a {
  23 + height: auto;
  24 + padding: 0; }
  25 +.gallery_txt .image_figcapture {
  26 + color: #333;
  27 + margin-bottom: 5px; }
  28 +.gallery_txt img {
  29 + position: relative;
  30 + max-width: 100%;
  31 + width: 360px;
  32 + top: auto;
  33 + height: auto; }
  34 +.gallery_txt:nth-child(3n + 4) {
  35 + clear: both; }
  36 +
  37 +.my-gallery {
  38 + position: relative; }
  39 +
26 40 .my-gallery:after {
27   - content: '';
28   - display: block;
29   - position: relative;
30   - clear: both;
31   - margin-bottom: 25px;
32   -}
  41 + content: '';
  42 + display: block;
  43 + position: relative;
  44 + clear: both;
  45 + margin-bottom: 25px; }
  46 +
33 47 .my-gallery a {
34   - width: 100%;
35   - overflow: hidden;
36   - display: block;
37   - height: 0;
38   - padding-bottom: 60%;
39   - position: relative;
40   -}
  48 + width: 100%;
  49 + overflow: hidden;
  50 + display: block;
  51 + height: 0;
  52 + padding-bottom: 60%;
  53 + position: relative; }
  54 +
41 55 .testimonials .item .testimonial .name-picture {
42   - float: right;
43   - width: 90%;
44   - text-align: right;
45   -}
  56 + float: right;
  57 + width: 90%;
  58 + text-align: right; }
  59 +
46 60 .testimonials .item .testimonial .bottom .icon {
47   - color: #6aae7a;
48   - font-size: 20px;
49   - float: left;
50   - width: 10%;
51   -}
52   -.testimonials .item .testimonial .name-picture img{
53   - margin-bottom:10px;
54   -}
55   -@media ( max-width: 690px ) {
56   - figure.reviews_gallery{
57   - width:50%;
58   - }
59   -}
60   -@media ( max-width: 380px ) {
61   - figure.reviews_gallery{
62   - width:100%;
63   - }
64   -}
65   -ul.list-style-none{
66   - margin:0;padding:0;
67   -}
68   -.articles-flex{
69   - display: flex;
70   - flex-wrap: wrap;
71   -}
72   -.articles-flex .box-image-text{
73   - height: 100%;
74   - margin-bottom: 30px;
75   -}
  61 + color: #6aae7a;
  62 + font-size: 20px;
  63 + float: left;
  64 + width: 10%; }
  65 +
  66 +.testimonials .item .testimonial .name-picture img {
  67 + margin-bottom: 10px; }
  68 +
  69 +@media (max-width: 690px) {
  70 + figure.reviews_gallery {
  71 + width: 50%; } }
  72 +@media (max-width: 380px) {
  73 + figure.reviews_gallery {
  74 + width: 100%; } }
  75 +ul.list-style-none {
  76 + margin: 0;
  77 + padding: 0; }
  78 +
  79 +.articles-flex {
  80 + display: flex;
  81 + flex-wrap: wrap; }
  82 +
  83 +.articles-flex .box-image-text {
  84 + height: 100%;
  85 + margin-bottom: 30px; }
  86 +
76 87 .articles-flex p.read-more {
77   - position: absolute;
78   - bottom: 10px;
79   - width: 100%;
80   -}
  88 + position: absolute;
  89 + bottom: 10px;
  90 + width: 100%; }
81 91  
82 92 /****/
83   -.main-car-mobile .img-responsive{
84   - width:100%;
85   - max-width:350px;
86   - margin:0 auto;
87   - text-align: center;
88   -}
89   -
90   -.main-car-mobile ul, .main-car-mobile p{
91   - font-weight:400!important;
92   - font-size: 12px;
93   -}
94   -.main-car-mobile ul li{
95   - margin-bottom: 5px;
96   -}
97   -
98   -@media(max-width:515px){
99   - .main-car-mobile h1, .main-car-mobile h2 {
100   - font-size: 7vw;
101   - }
102   -}
103   -@media(max-width:365px){
104   - li.previous, li.next {font-size:3.5vw;}
105   -}
106   -@media(max-width:350px){
107   - section .container h2.text-uppercase, .big-text{font-size: 9vw;}
108   - .big-text-2{font-size: 7vw;}
109   -}
  93 +.main-car-mobile .img-responsive {
  94 + width: 100%;
  95 + max-width: 350px;
  96 + margin: 0 auto;
  97 + text-align: center; }
  98 +
  99 +.main-car-mobile ul, .main-car-mobile p {
  100 + font-weight: 400 !important;
  101 + font-size: 12px; }
110 102  
  103 +.main-car-mobile ul li {
  104 + margin-bottom: 5px; }
  105 +
  106 +@media (max-width: 515px) {
  107 + .main-car-mobile h1, .main-car-mobile h2 {
  108 + font-size: 7vw; } }
  109 +@media (max-width: 365px) {
  110 + li.previous, li.next {
  111 + font-size: 3.5vw; } }
  112 +@media (max-width: 350px) {
  113 + section .container h2.text-uppercase, .big-text {
  114 + font-size: 9vw; }
  115 +
  116 + .big-text-2 {
  117 + font-size: 7vw; } }
111 118 #back-to-top {
112   - position: fixed;
113   - bottom: 50px;
114   - right: 50px;
115   - z-index: 9999;
116   - width: 48px;
117   - height: 48px;
118   - text-align: center;
119   - line-height: 50px;
120   - background-color: #6aae7a;
121   - cursor: pointer;
122   - text-decoration: none;
123   - transition: opacity 0.2s ease-out;
124   - opacity: 0;
125   - border-radius: 50%;
126   - box-shadow: 1px 4px 3px 0px rgba(0, 0, 0, 0.2);
127   - background-image: url("/img/arrow-up-big.png") !important;
128   - background-position: 50% 50% !important;
129   - background-repeat: no-repeat !important;
130   -}
  119 + position: fixed;
  120 + bottom: 50px;
  121 + right: 50px;
  122 + z-index: 9999;
  123 + width: 48px;
  124 + height: 48px;
  125 + text-align: center;
  126 + line-height: 50px;
  127 + background-color: #6aae7a;
  128 + cursor: pointer;
  129 + text-decoration: none;
  130 + transition: opacity 0.2s ease-out;
  131 + opacity: 0;
  132 + border-radius: 50%;
  133 + box-shadow: 1px 4px 3px 0px rgba(0, 0, 0, 0.2);
  134 + background-image: url("/img/arrow-up-big.png") !important;
  135 + background-position: 50% 50% !important;
  136 + background-repeat: no-repeat !important; }
131 137  
132 138 #back-to-top:hover {
133   - transition: 0.2s;
134   - background: #206b5c;
135   - color: #fff;
136   -}
  139 + transition: 0.2s;
  140 + background: #206b5c;
  141 + color: #fff; }
137 142  
138 143 #back-to-top.show {
139   - opacity: 1;
140   -}
  144 + opacity: 1; }
141 145  
142 146 .langs {
143   - text-transform: uppercase;
144   - line-height: 23px;
145   - margin-top: 2px;
146   - display: inline-block;
147   - margin-bottom: -2px;
148   - margin-left: 10px;
149   -}
  147 + text-transform: uppercase;
  148 + line-height: 23px;
  149 + margin-top: 2px;
  150 + display: inline-block;
  151 + margin-bottom: -2px;
  152 + margin-left: 10px; }
150 153  
151 154 .langs a.active {
152   - color: #2f5a89 !important;
153   - font-weight: bold;
154   - cursor: default;
155   - text-decoration: none;
156   -}
157   -
158   -.has-error .form-control {border-color: #e80000;}
159   -.has-success .form-control {border-color: #009e03;}
160 155 \ No newline at end of file
  156 + color: #2f5a89 !important;
  157 + font-weight: bold;
  158 + cursor: default;
  159 + text-decoration: none; }
  160 +
  161 +.has-error .form-control {
  162 + border-color: #e80000; }
  163 +
  164 +.has-success .form-control {
  165 + border-color: #009e03; }
  166 +
  167 +/*# sourceMappingURL=custom.css.map */
... ...
frontend/web/css/custom.css.map 0 → 100644
  Show/Hide comments   View file @c3e7999
  1 +{
  2 +"version": 3,
  3 +"mappings": "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",
  4 +"sources": ["custom.scss"],
  5 +"names": [],
  6 +"file": "custom.css"
  7 +}
0 8 \ No newline at end of file
... ...
frontend/web/css/custom.scss 0 → 100644
  Show/Hide comments   View file @c3e7999
  1 +/* your styles go here */
  2 +#footer{
  3 + padding: 20px 0;
  4 +}
  5 +#get-it{
  6 + padding: 30px 0 10px;
  7 +}
  8 +
  9 +figure.reviews_gallery {
  10 + width: 33.333%;
  11 + float: left;
  12 + padding: 10px;
  13 +}
  14 +.reviews_gallery img {
  15 + width: 100%;
  16 + height: 100%;
  17 + position: absolute;
  18 + top: 0;
  19 +}
  20 +.reviews_gallery:last-child img{
  21 + margin-bottom:60px;
  22 +}
  23 +
  24 +
  25 +.gallery_txt {
  26 + a {
  27 + height: auto;
  28 + padding: 0;
  29 + }
  30 + .image_figcapture {
  31 + color: #333;
  32 + margin-bottom: 5px;
  33 + }
  34 + img {
  35 + position: relative;
  36 + max-width: 100%;
  37 + width: 360px;
  38 + top: auto;
  39 + height: auto;
  40 + }
  41 + &:nth-child(3n + 4) {
  42 + clear: both;
  43 + }
  44 +}
  45 +.my-gallery{
  46 + position:relative;
  47 +}
  48 +.my-gallery:after {
  49 + content: '';
  50 + display: block;
  51 + position: relative;
  52 + clear: both;
  53 + margin-bottom: 25px;
  54 +}
  55 +.my-gallery a {
  56 + width: 100%;
  57 + overflow: hidden;
  58 + display: block;
  59 + height: 0;
  60 + padding-bottom: 60%;
  61 + position: relative;
  62 +}
  63 +.testimonials .item .testimonial .name-picture {
  64 + float: right;
  65 + width: 90%;
  66 + text-align: right;
  67 +}
  68 +.testimonials .item .testimonial .bottom .icon {
  69 + color: #6aae7a;
  70 + font-size: 20px;
  71 + float: left;
  72 + width: 10%;
  73 +}
  74 +.testimonials .item .testimonial .name-picture img{
  75 + margin-bottom:10px;
  76 +}
  77 +@media ( max-width: 690px ) {
  78 + figure.reviews_gallery{
  79 + width:50%;
  80 + }
  81 +}
  82 +@media ( max-width: 380px ) {
  83 + figure.reviews_gallery{
  84 + width:100%;
  85 + }
  86 +}
  87 +ul.list-style-none{
  88 + margin:0;padding:0;
  89 +}
  90 +.articles-flex{
  91 + display: flex;
  92 + flex-wrap: wrap;
  93 +}
  94 +.articles-flex .box-image-text{
  95 + height: 100%;
  96 + margin-bottom: 30px;
  97 +}
  98 +.articles-flex p.read-more {
  99 + position: absolute;
  100 + bottom: 10px;
  101 + width: 100%;
  102 +}
  103 +
  104 +/****/
  105 +.main-car-mobile .img-responsive{
  106 + width:100%;
  107 + max-width:350px;
  108 + margin:0 auto;
  109 + text-align: center;
  110 +}
  111 +
  112 +.main-car-mobile ul, .main-car-mobile p{
  113 + font-weight:400!important;
  114 + font-size: 12px;
  115 +}
  116 +.main-car-mobile ul li{
  117 + margin-bottom: 5px;
  118 +}
  119 +
  120 +@media(max-width:515px){
  121 + .main-car-mobile h1, .main-car-mobile h2 {
  122 + font-size: 7vw;
  123 + }
  124 +}
  125 +@media(max-width:365px){
  126 + li.previous, li.next {font-size:3.5vw;}
  127 +}
  128 +@media(max-width:350px){
  129 + section .container h2.text-uppercase, .big-text{font-size: 9vw;}
  130 + .big-text-2{font-size: 7vw;}
  131 +}
  132 +
  133 +#back-to-top {
  134 + position: fixed;
  135 + bottom: 50px;
  136 + right: 50px;
  137 + z-index: 9999;
  138 + width: 48px;
  139 + height: 48px;
  140 + text-align: center;
  141 + line-height: 50px;
  142 + background-color: #6aae7a;
  143 + cursor: pointer;
  144 + text-decoration: none;
  145 + transition: opacity 0.2s ease-out;
  146 + opacity: 0;
  147 + border-radius: 50%;
  148 + box-shadow: 1px 4px 3px 0px rgba(0, 0, 0, 0.2);
  149 + background-image: url("/img/arrow-up-big.png") !important;
  150 + background-position: 50% 50% !important;
  151 + background-repeat: no-repeat !important;
  152 +}
  153 +
  154 +#back-to-top:hover {
  155 + transition: 0.2s;
  156 + background: #206b5c;
  157 + color: #fff;
  158 +}
  159 +
  160 +#back-to-top.show {
  161 + opacity: 1;
  162 +}
  163 +
  164 +.langs {
  165 + text-transform: uppercase;
  166 + line-height: 23px;
  167 + margin-top: 2px;
  168 + display: inline-block;
  169 + margin-bottom: -2px;
  170 + margin-left: 10px;
  171 +}
  172 +
  173 +.langs a.active {
  174 + color: #2f5a89 !important;
  175 + font-weight: bold;
  176 + cursor: default;
  177 + text-decoration: none;
  178 +}
  179 +
  180 +.has-error .form-control {border-color: #e80000;}
  181 +.has-success .form-control {border-color: #009e03;}
0 182 \ No newline at end of file
... ...
frontend/web/js/front.js
  Show/Hide comments   View file @c3e7999
... ... @@ -668,17 +668,17 @@ $.fn.alignElementsSameHeight = function() {
668 668 }
669 669  
670 670 var windowWidth = $(window).width();
671   -$(window).load(
672   - function() {
673   -
674   - windowWidth = $(window).width();
675   -
676   - $(this)
677   - .alignElementsSameHeight();
678   - pictureZoom();
679   - }
680   - );
681   -alert('dfs')
  671 +// $(window).load(
  672 +// function() {
  673 +//
  674 +// windowWidth = $(window).width();
  675 +//
  676 +// $(this)
  677 +// .alignElementsSameHeight();
  678 +// pictureZoom();
  679 +// }
  680 +// );
  681 +// alert('dfs')
682 682 $(window).resize(function() {
683 683  
684 684  
... ...