Subversion Repositories cheapmusic

Rev

Rev 143 | Rev 151 | Go to most recent revision | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
118 - 1 
/* body to start below sticky navigation bar */
81 - 2 
body {
83 - 3 
    padding-top: 50px;
81 - 4 
}
5 
 
137 - 6 
/* height of sticky header */
7 
html, body {
8 
  scroll-padding-top: 70px;
9 
}
10 
 
1 - 11 
/* Override Progress Bar Transition Time */
12 
.progress-bar {
65 - 13 
	transition: width 0.1s ease !important;
137 - 14 
	width: 0;
1 - 15 
}
16 
 
62 - 17 
/* Black Background */
18 
.bg-black {
65 - 19 
	background-color: black !important;
20 
	color: white !important;
62 - 21 
}
22 
 
68 - 23 
/* Black Background */
24 
.bg-white {
25 
	background-color: white !important;
26 
	color: black !important;
27 
}
28 
 
62 - 29 
/* Invert element */
30 
.invert {
65 - 31 
	filter: invert(20%);
62 - 32 
}
33 
 
17 - 34 
/* Three additional bigger font sizes */
3 - 35 
.display-5 {
65 - 36 
	font-size: 2.5rem;
37 
	font-weight: 300;
38 
	line-height: 1.2;
3 - 39 
}
65 - 40 
 
3 - 41 
.display-6 {
65 - 42 
	font-size: 1.5rem;
43 
	font-weight: 300;
44 
	line-height: 1.2;
5 - 45 
}
46 
 
17 - 47 
.display-7 {
65 - 48 
	font-size: 1.25rem;
49 
	font-weight: 300;
50 
	line-height: 1.2;
17 - 51 
}
52 
 
43 - 53 
/* Pagination */
65 - 54 
.paginateNav {
55 
	padding: 5px 5px;
56 
}
43 - 57 
 
65 - 58 
.paginateNav a {
59 
	padding: 3px 3px;
60 
	color: black;
61 
}
62 
 
114 - 63 
.paginateNav .current {
65 - 64 
	font-weight: bold;
65 
	text-decoration: underline;
66 
	color: white;
67 
}
68 
 
149 - 69 
/* Do not wrap */
118 - 70 
.nowrap {
71 
    white-space: nowrap;
72 
}
73 
 
74 
/* User Images */
65 - 75 
.user-img {
76 
	max-height: 45px;
77 
}
47 - 78 
 
118 - 79 
/* wishlist image */
80 
.wl-img {
124 - 81 
	min-width: 80px;
118 - 82 
}
83 
 
65 - 84 
.btn-dismiss {
85 
	font-size: 24px;
86 
}
87 
 
47 - 88 
/* Icons */
66 - 89 
.media-icon {
116 - 90 
	font-size: 36px;
65 - 91 
	text-shadow: 2px 2px 4px #000000;
92 
}
47 - 93 
 
66 - 94 
.media-icon-silver {
65 - 95 
	color: silver;
96 
}
97 
 
68 - 98 
.media-icon-black {
99 
	color: black;
100 
}
101 
 
116 - 102 
/* Material Icons */
103 
.material-text {
149 - 104 
    vertical-align: -3px;
116 - 105 
}
106 
 
107 
/* Material Icon on Button */
108 
button.material-icons, a.material-icons {
109 
    vertical-align: middle !important;;
110 
    line-height: 0 !important;
111 
    position: relative;
112 
    top: -1px;
113 
}
114 
 
115 
/* Negative left and right margins */
116 
.material-nlm {
117 
    margin-left: -.2em;
118 
}
119 
 
120 
.material-nrm {
121 
    margin-right: -.2em;
122 
}
123 
 
141 - 124 
.material-icons.md-12 { font-size: 12px; }
116 - 125 
.material-icons.md-18 { font-size: 18px; }
126 
.material-icons.md-24 { font-size: 24px; }
127 
.material-icons.md-36 { font-size: 36px; }
128 
.material-icons.md-48 { font-size: 48px; }
129 
 
119 - 130 
.svg-24 { width:24px; height:24px; }
131 
.svg-yt { color:red; width:36px; height:36px; }
132 
 
133 
.hidden-default-btn { width: 0; height: 0; overflow: hidden; }
134 
 
47 - 135 
/* Cursor Pointer */
65 - 136 
.cursor-pointer {
137 
	cursor: pointer;
138 
}
47 - 139 
 
61 - 140 
/* Cards and their images */
65 - 141 
.result-card {
142 
	min-width: 160px !important;
143 
	max-width: 160px !important;
144 
}
68 - 145 
.result-card:hover {
146 
    transform: scale(1.1);
147 
}
124 - 148 
.result-card-image {
65 - 149 
	max-height: 160px !important;
150 
	min-height: 160px !important;
151 
}
152 
 
124 - 153 
/* Table Images */
154 
.result-table-image {
155 
	max-height: 160px !important;
156 
}
157 
 
158 
/* Discogs Cards */
65 - 159 
.discogs-card {
160 
	min-width: 180px !important;
161 
	max-width: 180px !important;
162 
}
68 - 163 
.discogs-card:hover {
164 
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
165 
}
65 - 166 
 
62 - 167 
/* Youtube list bullet */
68 - 168 
.youtube {
169 
	color: #ff0000;
62 - 170 
}
171 
 
114 - 172 
/* Social Buttons */
173 
.socialBtn {
174 
    max-height:32px;
175 
}
176 
 
66 - 177 
/* Filter Button Counters */
178 
.filterButton {
179 
  text-decoration: none;
180 
}
181 
 
182 
.filterButton .badge {
183 
  position: absolute;
184 
  top: -10px;
185 
  right: -10px;
186 
  padding: 3px 6px;
187 
  border-radius: 50%;
188 
  background-color: black;
189 
  color: white;
190 
}
191 
 
81 - 192 
/* Sticky Table header below the navigation bar */
193 
.table-header-sticky {
194 
    position: -webkit-sticky !important;
195 
    position: -moz-sticky !important;
196 
    position: -ms-sticky !important;
197 
    position: -o-sticky !important;
198 
    position: sticky !important;
114 - 199 
    top: 50px !important; /* bugbug: size of panigation bar */
81 - 200 
}
201 
 
17 - 202 
/* Hide on larger and smaller screens */
68 - 203 
/* search term entry width */
204 
@media screen and (min-width: 1200px) {
205 
	.searchTerm-width {
206 
	    width:30em!important;
207 
	}
208 
}
209 
 
17 - 210 
@media screen and (max-width: 1199px) {
65 - 211 
	.hide-large {
212 
		display: none !important;
213 
	}
68 - 214 
 
215 
	.searchTerm-width {
216 
	    width:25em!important;
217 
	}
17 - 218 
}
219 
 
220 
/* Hide on medium and smaller screens */
221 
@media screen and (max-width: 991px) {
65 - 222 
	.hide-medium {
223 
		display: none !important;
224 
	}
68 - 225 
 
226 
	.searchTerm-width {
227 
	    width:20em!important;
228 
	}
17 - 229 
}
230 
 
231 
/* Hide on small and extra-small screens */
232 
@media screen and (max-width: 767px) {
65 - 233 
	.hide-small {
234 
		display: none !important;
235 
	}
68 - 236 
 
237 
	.searchTerm-width {
238 
	    width:15em!important;
239 
	}
17 - 240 
}
241 
 
242 
/* Hide on extra-small screens */
61 - 243 
/* Wider cards */
17 - 244 
@media screen and (max-width: 575px) {
65 - 245 
	.hide-extra-small {
246 
		display: none !important;
247 
	}
248 
 
249 
	.result-card {
250 
		min-width: 80% !important;
251 
		max-width: 80% !important;
252 
	}
253 
 
254 
	.result-image {
255 
		max-height: none !important;
256 
		min-height: none !important;
257 
	}
258 
 
259 
	.discogs-card {
260 
		max-height: none !important;
261 
		min-height: none !important;
262 
	}
68 - 263 
 
264 
	.searchTerm-width {
265 
	    width:15em!important;
266 
	}
124 - 267 
}
128 - 268 
 
269 
/* Social bar on bottomn on larger screen */
270 
@media screen and (max-width: 991px) {
271 
    .social-icon-bar {
272 
      position: fixed;
273 
      display: inline;
274 
      padding: 0;
129 - 275 
      left: 40%;
137 - 276 
      bottom: 0;
128 - 277 
      -webkit-transform: translateY(-50%);
278 
      -ms-transform: translateY(-50%);
279 
      transform: translateY(-50%);
280 
    }
281 
 
282 
    .social-icon-bar a, .social-icon-bar button {
283 
        display: inline;
284 
    }
285 
}
286 
 
287 
/* Social bar on bottomn on larger screen */
288 
@media screen and (min-width: 992px) {
289 
    .social-icon-bar {
290 
      position: fixed;
291 
      display: block;
292 
      top: 80%;
293 
      -webkit-transform: translateY(-50%);
294 
      -ms-transform: translateY(-50%);
295 
      transform: translateY(-50%);
296 
    }
297 
 
298 
    .social-icon-bar a, .social-icon-bar button {
299 
      display: block;
300 
    }
301 
}
302 
 
303 
.social-icon-bar a, .social-icon-bar button {
304 
  text-align: center;
305 
  transition: all 0.3s ease;
306 
  color: white;
307 
  font-size: 20px;
308 
  border-radius: 0;
309 
}
310 
 
311 
.social-icon-bar a:hover, .social-icon-bar button:hover {
312 
  background-color: #000;
313 
  color: #fff;
314 
}
315 
 
316 
.cfacebook {
317 
  background: #3B5998;
318 
}
319 
 
320 
.ctwitter {
321 
  background: #55ACEE;
322 
}
323 
 
324 
.jump-top {
325 
  background: grey;
326 
}
327 
 
328 
.social-icon-svg {
329 
  width: 24px;
330 
}
137 - 331 
 
332 
/* .col-form-label to align label text and input field (from twitter bootstrap */
333 
.col-form-label {
334 
  padding-top: calc(0.375rem + 1px);
335 
  padding-bottom: calc(0.375rem + 1px);
336 
  margin-bottom: 0;
337 
  font-size: inherit;
338 
  line-height: 1.5;
339 
}
340 
 
341 
.col-form-label-lg {
342 
  padding-top: calc(0.5rem + 1px);
343 
  padding-bottom: calc(0.5rem + 1px);
344 
  font-size: 1.25rem;
345 
  line-height: 1.5;
346 
}
347 
 
348 
.col-form-label-sm {
349 
  padding-top: calc(0.25rem + 1px);
350 
  padding-bottom: calc(0.25rem + 1px);
351 
  font-size: 0.875rem;
352 
  line-height: 1.5;
141 - 353 
}
143 - 354 
 
355 
/* Clearable input fields */
356 
.clearable{
357 
  background: #fff url("data:image/gif;base64,R0lGODlhBwAHAIAAAP///5KSkiH5BAAAAAAALAAAAAAHAAcAAAIMTICmsGrIXnLxuDMLADs=") no-repeat right -10px center;
358 
  border: 1px solid #999;
359 
  padding: 3px 18px 3px 4px;     /* Use the same right padding (18) in jQ! */
360 
  border-radius: 3px;
361 
  transition: background 0.4s;
362 
}
363 
.clearable.x  { background-position: right 5px center; } /* (jQ) Show icon */
364 
.clearable.onX{ cursor: pointer; }              /* (jQ) hover cursor style */
365 
.clearable::-ms-clear {display: none; width:0; height:0;} /* Remove IE default X */