PluginProbe
WP Directory Kit / 1.5.7
WP Directory Kit v1.5.7
1.5.9 1.5.7 1.5.6 1.5.5 1.5.4 1.5.3 trunk 1.1.0 1.1.6 1.1.8 1.2.3 1.2.4 1.2.5 1.2.6 1.2.7 1.2.8 1.2.9 1.3.0 1.3.1 1.3.2 1.3.3 1.3.4 1.3.5 1.3.6 1.3.8 All 37 releases
wpdirectorykit / public / css / wpdirectorykit-public-responsive.scss

wpdirectorykit-public-responsive.scss in WP Directory Kit 1.5.7, at public/css/wpdirectorykit-public-responsive.scss

183 lines 4.3 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 @charset 'UTF-8';
2
3 /*------------------------------------------------------------------
4 [Media Stylesheet]
5 -------------------------------------------------------------------*/
6
7 /*------------------------------------------------------------------
8 [Table of contents]
9
10 1. Min width 992px and Max width: 1199px
11 2. Max width: 1140px
12 3. Max width: 992px
13 4. Max width: 992px and min width: 768px
14 5. Max width: 767px
15 6. Max width: 480px
16 7. Custom media for IE
17
18 -------------------------------------------------------------------*/
19 @media (min-width: 1300px){
20
21 }
22
23 @media (max-width: 1270px) {
24 }
25
26 @media (min-width: 1140px) and (max-width: 1350px) {}
27
28 @media (max-width: 1199px) {}
29
30 /*------------------------------------------------------------------
31 [1. Min width 992px and Max width: 1199px ]
32 */
33
34 @media (min-width: 992px) and (max-width: 1199px) {}
35
36 /*------------------------------------------------------------------
37 [2. Max width: 1140px ]
38 */
39 @media (max-width: 1140px) {
40 }
41
42 /*------------------------------------------------------------------
43 [3. Max width: 991px ]
44 */
45 @media (max-width: 991px) {
46 body .wdk-element .wdk-row .wdk-col {
47 width: 50%;
48 -webkit-flex: 0 0 calc(100% / 2);
49 flex: 0 0 calc(100% / 2);
50 }
51 .wdk-element .wdk-search.layout_inline .wdk-field {
52 &.LOCATION,
53 &.CATEGORY {
54 width: 50%;
55 }
56 }
57 }
58
59 /*------------------------------------------------------------------
60 [4. Max width: 992px and min width: 768px]
61 */
62
63 @media (min-width: 768px) and (max-width: 991px) {}
64
65 /*------------------------------------------------------------------
66 [5. Max width: 767px]
67 */
68 @media (max-width: 767px) {
69 .jconfirm .jconfirm-box {
70 max-width: 100%;
71 width: calc(100% - 30px) !important;
72 }
73
74 .wdk-element .wdk-map .wdk-listing-card .wdk-thumbnail .wdk-image {
75 height: 110px;
76 }
77
78 body .wdk-element .wdk-row .wdk-col {
79 width: 100%;
80 -webkit-flex: 0 0 calc(100% / 1);
81 flex: 0 0 calc(100% / 1);
82 }
83 .wdk-element .wdk-search.layout_inline .wdk-field {
84 &.LOCATION,
85 &.CATEGORY {
86 width: 100%;
87 }
88 }
89
90 body .wdk-element .wdk-map .wdk-listing-card .wdk-subtitle-part span {
91 overflow: hidden;
92 text-overflow: ellipsis;
93 display: -webkit-box;
94 -webkit-line-clamp: 2 !important;
95 -webkit-box-orient: vertical;
96 }
97
98 body .wdk-element .wdk-map .infobox {
99 width: 250px;
100 }
101
102 .wdk-search.layout_inline .wdk-row div.wdk-col.SLIDER_RANGE {
103 width: 100%;
104 padding: 5px 0;
105 }
106
107 .wdk-search.layout_inline .wdk-slider-range-field .irs--round {
108 margin-top: -1px;
109 }
110
111 .wdk-search.layout_inline .irs--round.irs-with-grid {
112 height: 49px;
113 }
114
115 .wdk-listing-card.list .wdk-thumbnail {
116 max-width: 30%;
117 }
118
119 .wdk-listing-card.list .wdk-content {
120 overflow: hidden;
121 }
122
123 }
124
125 /*------------------------------------------------------------------
126 [6. Max width: 540px]
127 */
128
129 @media (max-width:600px) {}
130
131 /*------------------------------------------------------------------
132 [6. Max width: 576px]
133 */
134
135 @media (max-width:576px) {
136
137 .wdk-listings-list .listing-item {
138 justify-content: center;
139 }
140
141 body .wdk-listings-list .listing-item .listing-inf-sec {
142 flex: 0 0 auto;
143 }
144
145 .wdk-filter-head .filter-group.filter-status {
146 flex: 1 2;
147 order: 0;
148 text-align: left;
149 margin-top: 0;
150 }
151
152 .wdk-filter-head .filter-group.filter-status > span {
153 padding-left: 0;
154 }
155
156 .wdk-filter-head .filter-group.order,
157 .wdk-filter-head .filter-group.wmvc-view-type {
158 flex: 0 0;
159 order: 1;
160 }
161
162 }
163
164 /*------------------------------------------------------------------
165 [6. Max width: 540px]
166 */
167
168 @media (max-width:540px) {}
169
170
171 /*------------------------------------------------------------------
172 [7. Custom media for IE]
173 */
174
175 @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
176 }
177
178 @media screen and (max-width:1140px) and (-ms-high-contrast: active) and (-ms-high-contrast: none) {
179 }
180
181 @media screen and (max-width:768px) and (-ms-high-contrast: active) and (-ms-high-contrast: none) {
182 }
183