PluginProbe
Automatic YouTube Gallery – Embed Auto-Updating YouTube Video Galleries, Feeds, Playlists & Channels / 1.6.2
Automatic YouTube Gallery – Embed Auto-Updating YouTube Video Galleries, Feeds, Playlists & Channels v1.6.2
2.9.1 2.9.0 trunk 1.0.0 1.1.0 1.2.0 1.3.0 1.4.0 1.5.0 1.6.0 1.6.1 1.6.2 1.6.3 1.6.4 1.6.5 2.0.0 2.1.0 2.2.0 2.3.2 2.3.3 2.3.5 2.3.6 2.3.8 2.3.9 2.4.3 All 37 releases
automatic-youtube-gallery / public / assets / css / public.css

public.css in Automatic YouTube Gallery – Embed Auto-Updating YouTube Video Galleries, Feeds, Playlists & Channels 1.6.2, at public/assets/css/public.css

218 lines 4.3 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /*----------------------------------------------------------------------------------------------
2 *
3 * Global
4 *
5 *--------------------------------------------------------------------------------------------*/
6 .ayg-no-scroll {
7 overflow: hidden;
8 }
9
10 .ayg-btn {
11 margin: 1px;
12 padding: 5px 10px;
13 background: #e6e6e6;
14 border-radius: 2px;
15 color: #666;
16 text-transform: uppercase;
17 line-height: 1;
18 cursor: pointer;
19 }
20
21 .ayg-btn:hover,
22 .ayg-btn:focus {
23 background: #333;
24 color: #fff;
25 }
26
27 /*----------------------------------------------------------------------------------------------
28 *
29 * Player
30 *
31 *--------------------------------------------------------------------------------------------*/
32 .ayg-player-wrapper {
33 position: relative;
34 width: 100%;
35 height: 0;
36 padding-bottom: 56.25%;
37 }
38
39 .ayg-player-wrapper .fluid-width-video-wrapper {
40 position: static !important;
41 }
42
43 .ayg-player-iframe {
44 position: absolute;
45 width: 100%;
46 height: 100%;
47 top: 0;
48 left: 0;
49 }
50
51 .ayg-player-caption,
52 .ayg-player-title,
53 .ayg-player-description {
54 margin: 0 !important;
55 padding: 7px 0;
56 }
57
58 .ayg-player-description-more {
59 display: none;
60 }
61
62 .ayg-player-description-toggle-btn {
63 display: block;
64 margin: 10px 0;
65 }
66
67 /*----------------------------------------------------------------------------------------------
68 *
69 * Responsive Grid
70 *
71 *--------------------------------------------------------------------------------------------*/
72 .ayg-row {
73 display: -webkit-flex; /* Safari */
74 -webkit-flex-wrap: wrap; /* Safari 6.1+ */
75 display: flex;
76 flex-wrap: wrap;
77 margin: 0 -15px;
78 }
79
80 .ayg-col {
81 width: 100%;
82 }
83
84 @media only screen and (min-width: 480px) {
85 .ayg-col-2 {
86 width: 50%;
87 }
88
89 .ayg-col-3 {
90 width: 33.33%;
91 }
92
93 .ayg-col-4 {
94 width: 25%;
95 }
96
97 .ayg-col-5 {
98 width: 20%;
99 }
100
101 .ayg-col-6 {
102 width: 16.66%;
103 }
104
105 .ayg-col-7 {
106 width: 14.28%;
107 }
108
109 .ayg-col-8 {
110 width: 12.5%;
111 }
112
113 .ayg-col-9 {
114 width: 11.11%;
115 }
116
117 .ayg-col-10 {
118 width: 10%;
119 }
120
121 .ayg-col-11 {
122 width: 9.09%;
123 }
124
125 .ayg-col-12 {
126 width: 8.33%;
127 }
128 }
129
130 /*----------------------------------------------------------------------------------------------
131 *
132 * Thumbnail
133 *
134 *--------------------------------------------------------------------------------------------*/
135 .ayg-thumbnail {
136 padding: 15px;
137 cursor: pointer;
138 }
139
140 .ayg-thumbnail-image-wrapper {
141 position: relative;
142 }
143
144 .ayg-thumbnail-image {
145 display: block;
146 width: 100%;
147 height: auto;
148 }
149
150 .ayg-thumbnail-play-icon {
151 position: absolute;
152 width: 100%;
153 height: 100%;
154 top: 0;
155 left: 0;
156 background-image: url( '../images/play.png' );
157 background-repeat: no-repeat;
158 background-position: center;
159 pointer-events: none;
160 z-index: 2;
161 }
162
163 .ayg-thumbnail-title,
164 .ayg-thumbnail-excerpt {
165 margin: 10px 0 0 0;
166 padding: 0;
167 }
168
169 .ayg-thumbnail-title {
170 font-weight: bold;
171 }
172
173 .ayg-thumbnail-active {
174 position: absolute;
175 padding: 5px 7px;
176 right: 0;
177 bottom: 0;
178 background: #64b450;
179 color: #ffffff;
180 font-size: 12px;
181 line-height: 1;
182 z-index: 1;
183 }
184
185 .ayg-active .ayg-thumbnail-active {
186 display: inline-block !important;
187 }
188
189 /*----------------------------------------------------------------------------------------------
190 *
191 * Pagination
192 *
193 *--------------------------------------------------------------------------------------------*/
194 .ayg-pagination {
195 margin: 15px 0;
196 text-align: center;
197 }
198
199 .ayg-pagination-info {
200 padding: 0 7px;
201 }
202
203 .ayg-pagination.ayg-loading {
204 display: block;
205 width: 100%;
206 height: 32px;
207 background-image: url( '../images/spinner-light.gif' );
208 background-position: center center;
209 background-repeat: no-repeat;
210 }
211
212 .ayg-pagination.ayg-loading .ayg-pagination-prev,
213 .ayg-pagination.ayg-loading .ayg-pagination-info,
214 .ayg-pagination.ayg-loading .ayg-pagination-next,
215 .ayg-pagination.ayg-loading .ayg-pagination-more {
216 visibility: hidden;
217 }
218