0
|
1 // main: ../style.scss
|
|
2 /********************************
|
|
3 *********************************
|
|
4 Widgets
|
|
5 *********************************
|
|
6 *********************************/
|
|
7
|
|
8 /* Widgets
|
|
9 ========================*/
|
|
10 .widget-holder,
|
|
11 .widget-latest-comments,
|
|
12 .widget-todo,
|
|
13 .widget-latest-transactions,
|
|
14 .widget-user-activities {
|
|
15 figure {
|
|
16 margin-bottom: 0;
|
|
17 }
|
|
18 .single {
|
|
19 padding: em(15) 0;
|
|
20 border-bottom: 1px solid $theme-border-color;
|
|
21 &:first-of-type { padding-top: 0 }
|
|
22 &:last-of-type {
|
|
23 border-bottom: 0;
|
|
24 padding-bottom: 0;
|
|
25 }
|
|
26 }
|
|
27 .single-header {
|
|
28 margin-bottom: 10px;
|
|
29 }
|
|
30 .single-amount,
|
|
31 .single-user-details {
|
|
32 margin-left: 1.5em;
|
|
33 }
|
|
34 .single-event-icon,
|
|
35 .single-user-avatar {
|
|
36 margin-right: 1.5em;
|
|
37 }
|
|
38 .single-user-details {
|
|
39 font-size: em(14);
|
|
40 small { line-height: 1 }
|
|
41 }
|
|
42 .single-user-name {
|
|
43 line-height: 1.3;
|
|
44 font-weight: 600;
|
|
45 color: $headings-color;
|
|
46 display: block;
|
|
47 }
|
|
48 .single-user-name {
|
|
49 font-family: $headings-font-family;
|
|
50 }
|
|
51
|
|
52 body.rtl & {
|
|
53 .single-user-avatar {
|
|
54 margin-left: 1.5em;
|
|
55 margin-right: 0;
|
|
56 }
|
|
57 }
|
|
58 }
|
|
59
|
|
60 /* Latest Transactions
|
|
61 ========================*/
|
|
62 .widget-latest-transactions {
|
|
63 width: 100%;
|
|
64 tr {
|
|
65 border-bottom: 1px solid $theme-border-color;
|
|
66 }
|
|
67 td {
|
|
68 padding: em(15) 0;
|
|
69 }
|
|
70 tr:first-child td { padding-top: 0 }
|
|
71 tr:last-child td { padding-bottom: 0; }
|
|
72 tr:last-child { border-bottom: 0; }
|
|
73 figure {
|
|
74 margin-bottom: 0;
|
|
75 }
|
|
76 .single-amount,
|
|
77 .single-user-details {
|
|
78 flex: 1;
|
|
79 margin-left: 1.5em;
|
|
80 }
|
|
81 .single-user-details {
|
|
82 font-size: em(14);
|
|
83 small { line-height: 1 }
|
|
84 }
|
|
85 .single-status,
|
|
86 .single-amount {
|
|
87 font-size: em(13);
|
|
88 }
|
|
89 .single-amount {
|
|
90 color: $headings-color;
|
|
91 margin-bottom: 0;
|
|
92 font-weight: 500;
|
|
93 }
|
|
94 .single-status {
|
|
95 vertical-align: middle;
|
|
96 letter-spacing: -0.05em;
|
|
97 i { margin-right: 0.4em; }
|
|
98 }
|
|
99 .single-status, .single-user-name, .single-amount {
|
|
100 font-family: $headings-font-family;
|
|
101 }
|
|
102 }
|
|
103
|
|
104 /* User Activities
|
|
105 ========================*/
|
|
106 .widget-user-activities {
|
|
107 width: 100%;
|
|
108 .single {
|
|
109 flex-wrap: wrap;
|
|
110 padding: em(25) 0;
|
|
111 }
|
|
112 .single-body {
|
|
113 flex-basis: 100%;
|
|
114 padding-left: calc(50px + 1.5em);
|
|
115 p { font-size: em(13) }
|
|
116 }
|
|
117 .single-likes {
|
|
118 i {
|
|
119 margin-right: 0.5em;
|
|
120 color: $text-muted;
|
|
121 }
|
|
122 }
|
|
123 .single-attachment {
|
|
124 display: block;
|
|
125 background: rgba($info, 0.05);
|
|
126 border: 1px solid rgba($info, 0.1);
|
|
127 border-radius: 3px;
|
|
128 padding: em(10);
|
|
129 margin-top: em(10);
|
|
130 }
|
|
131 .single-attachment-icon {
|
|
132 background: $info;
|
|
133 display: inline-flex;
|
|
134 justify-content: center;
|
|
135 align-items: center;
|
|
136 @include size(em(40,20));
|
|
137 color: #fff;
|
|
138 font-size: em(20);
|
|
139 border-radius: 3px;
|
|
140 float: left;
|
|
141 margin-right: em(15,20);
|
|
142 }
|
|
143 .single-attachment-filesize,
|
|
144 .single-attachment-filename {
|
|
145 display: block;
|
|
146 font-size: em(12);
|
|
147 }
|
|
148 .single-attachment-filename {
|
|
149 font-family: $headings-font-family;
|
|
150 font-weight: 600;
|
|
151 color: $headings-color;
|
|
152 }
|
|
153 .single-attachment-filesize {
|
|
154 color: $text-muted;
|
|
155 }
|
|
156 .single-event-icon {
|
|
157 background: $color-scheme;
|
|
158 color: #fff;
|
|
159 border-radius: 100px;
|
|
160 font-size: rem(20);
|
|
161 @include size(rem(50));
|
|
162 display: inline-flex;
|
|
163 justify-content: center;
|
|
164 align-items: center;
|
|
165 }
|
|
166
|
|
167 .single-users-list {
|
|
168 display: flex;
|
|
169 flex-flow: row-reverse;
|
|
170 align-items: center;
|
|
171 justify-content: flex-end;
|
|
172 a {
|
|
173 @include size(rem(35));
|
|
174 margin-left: rem(-10);
|
|
175 &:nth-last-child(2) { margin-left: 0 }
|
|
176 img {
|
|
177 border-radius: 100px;
|
|
178 border: 2px solid $widget-bg;
|
|
179 }
|
|
180
|
|
181 &.more {
|
|
182 @include size(auto);
|
|
183 order: -1;
|
|
184 margin-left: 1em;
|
|
185 color: $content-color;
|
|
186 }
|
|
187 }
|
|
188 }
|
|
189 body.rtl & {
|
|
190 .single-event-icon {
|
|
191 margin-right: 0;
|
|
192 margin-left: 1.5em;
|
|
193 }
|
|
194 .single-users-list a.more {
|
|
195 margin-left: 0;
|
|
196 margin-right: 1em;
|
|
197 }
|
|
198 }
|
|
199 }
|
|
200
|
|
201 /* Chat Activities
|
|
202 ========================*/
|
|
203 .widget-chat-activity {
|
|
204 .message {
|
|
205 margin: em(10) 0;
|
|
206 &:first-child { margin-top: 0; }
|
|
207 &:last-child { margin-bottom: 0; }
|
|
208 p {
|
|
209 background: $color-scheme;
|
|
210 border: 1px solid $color-scheme;
|
|
211 border-top-left-radius: 3px;
|
|
212 border-bottom-left-radius: 3px;
|
|
213 padding: .5em 1em;
|
|
214 color: #fff;
|
|
215 margin-bottom: .5em;
|
|
216 position: relative;
|
|
217 &:first-child {
|
|
218 &:before,
|
|
219 &:after {
|
|
220 content: "";
|
|
221 @include size(0);
|
|
222 display: block;
|
|
223 @include position(absolute, rem(20) -7px null auto);
|
|
224 border-style: solid;
|
|
225 border-width: 6px 0 7px 6px;
|
|
226 border-color: transparent transparent transparent $color-scheme;
|
|
227 transform: translateY(-50%);
|
|
228 }
|
|
229 &:before {
|
|
230 right: -7px;
|
|
231 border-left-color: $color-scheme;
|
|
232 }
|
|
233 }
|
|
234 }
|
|
235 .message-body {
|
|
236 margin-top: .5em;
|
|
237 display: inline-flex;
|
|
238 flex-direction: column;
|
|
239 align-items: flex-end;
|
|
240 margin: auto 1.5em;
|
|
241 order: 1;
|
|
242 }
|
|
243 figure {
|
|
244 order: 2;
|
|
245 }
|
|
246 &.reply {
|
|
247 p {
|
|
248 background: #fff;
|
|
249 border: 1px solid $theme-border-color;
|
|
250 border-radius: 0;
|
|
251 border-top-right-radius: 3px;
|
|
252 border-bottom-right-radius: 3px;
|
|
253 color: #666;
|
|
254 &:first-child {
|
|
255 &:before,
|
|
256 &:after {
|
|
257 content: "";
|
|
258 @include size(0);
|
|
259 display: block;
|
|
260 @include position(absolute, null auto null -7px);
|
|
261 border-style: solid;
|
|
262 border-width: 6px 7px 6px 0;
|
|
263 border-color: transparent #fff transparent transparent;
|
|
264 transform: translateY(-50%);
|
|
265 }
|
|
266 &:before {
|
|
267 left: -9px;
|
|
268 border-right-color: $theme-border-color;
|
|
269 }
|
|
270 }
|
|
271 }
|
|
272 figure {
|
|
273 order: 1;
|
|
274 }
|
|
275 .message-body {
|
|
276 align-items: flex-start;
|
|
277 order: 2;
|
|
278 }
|
|
279 }
|
|
280 }
|
|
281
|
|
282 body.rtl & {
|
|
283 .message {
|
|
284 p:first-child::before,
|
|
285 p:first-child::after {
|
|
286 border-width: 6px 7px 6px 0;
|
|
287 border-color: transparent $color-scheme transparent transparent;
|
|
288 }
|
|
289
|
|
290 p:first-child:after,
|
|
291 p:first-child:before {
|
|
292 right: auto;
|
|
293 left: -7px;
|
|
294 }
|
|
295
|
|
296 &.reply p:first-child::after,
|
|
297 &.reply p:first-child::before {
|
|
298 border-width: 6px 0 6px 7px;
|
|
299 border-color: transparent transparent transparent $color-scheme;
|
|
300 }
|
|
301
|
|
302 &.reply p:first-child:after,
|
|
303 &.reply p:first-child:before {
|
|
304 left: auto;
|
|
305 right: -7px;
|
|
306 }
|
|
307
|
|
308 &.reply p:first-child:before {
|
|
309 border-left-color: $theme-border-color;
|
|
310 right: -8px;
|
|
311 }
|
|
312
|
|
313 &.reply p:first-child:after {
|
|
314 border-left-color: #fff;
|
|
315 }
|
|
316 }
|
|
317 }
|
|
318 }
|
|
319
|
|
320 /* Latest Comments
|
|
321 ========================*/
|
|
322 .widget-latest-comments {
|
|
323 .single {
|
|
324 align-items: flex-start;
|
|
325 }
|
|
326 .single-body {
|
|
327 margin-left: 1.5em;
|
|
328 }
|
|
329 .single-user-name {
|
|
330 display: inline;
|
|
331 }
|
|
332 .single-timestamp {
|
|
333 font-size: em(13);
|
|
334 margin-left: 0.4em;
|
|
335 }
|
|
336 .single:hover .single-footer ul {
|
|
337 display: block;
|
|
338 }
|
|
339 .single-footer {
|
|
340 .badge {
|
|
341 @include padding(null $spacer(1));
|
|
342 font-family: $headings-font-family;
|
|
343 }
|
|
344 ul {
|
|
345 list-style: none;
|
|
346 padding-left: 0;
|
|
347 margin-bottom: 0;
|
|
348 display: none;
|
|
349 @include tablet {
|
|
350 display: block;
|
|
351 }
|
|
352 @include mobile {
|
|
353 display: block;
|
|
354 }
|
|
355 li {
|
|
356 display: inline-block;
|
|
357 font-size: em(18);
|
|
358 line-height: 1em;
|
|
359 padding-left: em(5,18);
|
|
360 padding-right: em(5,18);
|
|
361 a {
|
|
362 color: $text-muted;
|
|
363 &:hover {
|
|
364 color: $color-scheme;
|
|
365 }
|
|
366 }
|
|
367 }
|
|
368 }
|
|
369 }
|
|
370 }
|
|
371
|
|
372
|
|
373 /* Latest Posts
|
|
374 ========================*/
|
|
375 .widget-latest-posts {
|
|
376 position: relative;
|
|
377 .widget-bg {
|
|
378 border-radius: 5px;
|
|
379 overflow: hidden;
|
|
380 }
|
|
381 .widget-body {
|
|
382 padding: 0;
|
|
383 }
|
|
384 .box-title {
|
|
385 text-transform: uppercase;
|
|
386 font-size: rem(12);
|
|
387 font-weight: 600;
|
|
388 color: $text-muted;
|
|
389 letter-spacing: .1em;
|
|
390 }
|
|
391 article {
|
|
392 margin-left: 0;
|
|
393 margin-right: 0;
|
|
394 display: flex;
|
|
395 flex-flow: column;
|
|
396 .row { margin: 0; }
|
|
397 }
|
|
398 figure { margin-bottom: 0; }
|
|
399 .post-img { padding: 0 }
|
|
400 .post-details {
|
|
401 display: flex;
|
|
402 flex-direction: column;
|
|
403 padding: em(30) em(20);
|
|
404 figure { @include size(rem(30)) }
|
|
405 .post-links {
|
|
406 display: flex;
|
|
407 align-items: center;
|
|
408 ul {
|
|
409 margin-left: 1em;
|
|
410 padding-left: 0;
|
|
411 margin-bottom: 0;
|
|
412 list-style: none;
|
|
413 }
|
|
414 li {
|
|
415 display: inline-block;
|
|
416 padding: 0 0.5em;
|
|
417 font-family: $headings-font-family;
|
|
418 font-size: em(11);
|
|
419 font-weight: 700;
|
|
420 a {
|
|
421 i { color: $text-muted }
|
|
422 color: $headings-color;
|
|
423 &:hover { color: $color-scheme }
|
|
424 }
|
|
425 }
|
|
426 }
|
|
427 }
|
|
428 .post-title {
|
|
429 margin-top: 0;
|
|
430 margin-bottom: rem(20);
|
|
431 font-weight: 300;
|
|
432 a {
|
|
433 color: $headings-color;
|
|
434 &:hover { color: $color-scheme }
|
|
435 }
|
|
436 }
|
|
437 .carousel.slick-slider.slick-dotted {
|
|
438 margin-bottom: 0;
|
|
439 }
|
|
440 .carousel.slick-slider .slick-dots {
|
|
441 @include position(absolute, null null 20px 0);
|
|
442 width: 42%;
|
|
443 text-align: center;
|
|
444
|
|
445 li {
|
|
446 @include margin(null 3px);
|
|
447 }
|
|
448 li button::before {
|
|
449 background: none;
|
|
450 border: 2px solid #fff;
|
|
451 opacity: 1;
|
|
452 @include size(12px);
|
|
453 }
|
|
454 .slick-active button::before {
|
|
455 transform: none;
|
|
456 background: #fff;
|
|
457 }
|
|
458 }
|
|
459 body.rtl & {
|
|
460 .post-details {
|
|
461 direction: rtl;
|
|
462 }
|
|
463 }
|
|
464 }
|
|
465
|
|
466 /* User Profile
|
|
467 ========================*/
|
|
468 .widget-user-profile {
|
|
469 .profile-wall-img img {
|
|
470 width: 100%;
|
|
471 height: auto;
|
|
472 }
|
|
473 .profile-body {
|
|
474 padding: 0 $widget-padding-y;
|
|
475 text-align: center;
|
|
476 display: flex;
|
|
477 flex-direction: column;
|
|
478 justify-content: center;
|
|
479 align-items: center;
|
|
480 }
|
|
481 .profile-user-avatar {
|
|
482 margin-top: em(-80);
|
|
483 a {
|
|
484 display: block;
|
|
485 }
|
|
486 img {
|
|
487 border-radius: 100px;
|
|
488 border: 2px solid #fff;
|
|
489 box-shadow: 0 0 5px 0 rgba(0,0,0,.4);
|
|
490 }
|
|
491 &:after {
|
|
492 content: '';
|
|
493 width: 30px;
|
|
494 height: 1px;
|
|
495 background: $theme-border-color;
|
|
496 margin-top: em(20);
|
|
497 }
|
|
498 }
|
|
499 .profile-user-name {
|
|
500 font-weight: 300;
|
|
501 margin-top: rem(24);
|
|
502 margin-bottom: rem(5);
|
|
503 }
|
|
504 .profile-seperator {
|
|
505 width: 30px;
|
|
506 border-top-color: $theme-border-color;
|
|
507 margin-top: rem(20);
|
|
508 }
|
|
509 .profile-user-address {
|
|
510 font-size: em(12);
|
|
511 font-family: $headings-font-family;
|
|
512 font-weight: 600;
|
|
513 }
|
|
514 }
|
|
515
|
|
516 /* Counter Widget
|
|
517 ========================*/
|
|
518 .widget-todo {
|
|
519 .single {
|
|
520 padding: em(20) 0;
|
|
521 }
|
|
522 .single-icon {
|
|
523 margin-right: em(15);
|
|
524 margin-top: em(3);
|
|
525 font-size: em(20);
|
|
526 }
|
|
527 .single-title {
|
|
528 margin: em(6) 0;
|
|
529 font-size: rem(14);
|
|
530 letter-spacing: 0;
|
|
531 font-weight: 600;
|
|
532 }
|
|
533 .dropdown-item {
|
|
534 display: flex;
|
|
535 align-items: center;
|
|
536 .list-icon {
|
|
537 margin-right: em(6);
|
|
538 font-size: 1em;
|
|
539 }
|
|
540 }
|
|
541 .single-tags {
|
|
542 font-family: $headings-font-family;
|
|
543 li {
|
|
544 display: inline-block;
|
|
545 margin-right: em(5);
|
|
546 font-weight: 600;
|
|
547 font-size: 0.9em;
|
|
548 a:before {
|
|
549 content: '\0023';
|
|
550 }
|
|
551 }
|
|
552 }
|
|
553 .single.done {
|
|
554 .media-body {
|
|
555 opacity: 0.4;
|
|
556 }
|
|
557 }
|
|
558 .dropdown > .dropdown-toggle {
|
|
559 color: $content-color;
|
|
560 }
|
|
561 .add-btn {
|
|
562 @include position(absolute, null 50% 0 null);
|
|
563 transform: translateY(50%) translateX(50%);
|
|
564 }
|
|
565
|
|
566 body.rtl & {
|
|
567 .dropdown-item .list-icon {
|
|
568 margin-right: 0;
|
|
569 margin-left: em(6);
|
|
570 }
|
|
571 }
|
|
572 }
|
|
573
|
|
574
|
|
575 /* Counter Widget
|
|
576 ========================*/
|
|
577 .widget-counter {
|
|
578 padding-left: em(10);
|
|
579
|
|
580 h6 {
|
|
581 text-transform: uppercase;
|
|
582 font-weight: bold;
|
|
583 margin-top: em(10);
|
|
584 padding-right: em(30);
|
|
585 }
|
|
586
|
|
587 small {
|
|
588 font-weight: 700;
|
|
589 letter-spacing: .05em;
|
|
590 display: block;
|
|
591 opacity: .5;
|
|
592 margin-top: em(5, 10.5);
|
|
593 text-transform: none;
|
|
594 }
|
|
595
|
|
596 i {
|
|
597 position: absolute;
|
|
598 top: em(30,19);
|
|
599 right: em(40,19);
|
|
600 font-size: em(19,14);
|
|
601
|
|
602 &::before,
|
|
603 &::after {
|
|
604 content: "";
|
|
605 background: #e5e5e5;
|
|
606 position: absolute;
|
|
607 left: em(-7,19);
|
|
608 }
|
|
609
|
|
610 .text-inverse &::before,
|
|
611 .text-inverse &::after {
|
|
612 background: #fff;
|
|
613 background: rgba(255,255,255,.3);
|
|
614 }
|
|
615
|
|
616 &::before {
|
|
617 top: em(6,19);
|
|
618 height: em(20,19);
|
|
619 width: em(1,19);
|
|
620 }
|
|
621
|
|
622 &::after{
|
|
623 bottom: em(-8,19);
|
|
624 width: em(20,19);
|
|
625 height: em(1,19);
|
|
626 }
|
|
627 }
|
|
628
|
|
629 h3 {
|
|
630 font-family: $tertiary-font-family;
|
|
631 font-weight: 300;
|
|
632 font-size: em(40);
|
|
633 }
|
|
634 }
|
|
635
|
|
636
|
|
637 /* User List
|
|
638 =======================*/
|
|
639 ul.widget-user-list {
|
|
640 padding-top: em(10);
|
|
641
|
|
642 .d-flex a {
|
|
643 display: inline-block;
|
|
644 }
|
|
645
|
|
646 li {
|
|
647 padding-bottom: em(10);
|
|
648 padding-top: em(15);
|
|
649 border-bottom: rem(1) solid lighten($theme-border-color, 7%);
|
|
650 &:last-child {
|
|
651 border: none;
|
|
652 }
|
|
653 }
|
|
654
|
|
655 h5 {
|
|
656 font-size: em(15);
|
|
657 margin-top: 0;
|
|
658 }
|
|
659
|
|
660 small {
|
|
661 display: block;
|
|
662 font-size: em(11);
|
|
663 }
|
|
664
|
|
665 .media-body {
|
|
666 position: relative;
|
|
667
|
|
668 .btn {
|
|
669 padding: 0 em(28,13);
|
|
670 text-transform: uppercase;
|
|
671 margin-top: em(3,13);
|
|
672 line-height: em(32,13);
|
|
673 border-radius: em(4,13);
|
|
674 font-size: em(13,14);
|
|
675 float: right;
|
|
676 }
|
|
677
|
|
678 .btn-outline-secondary {
|
|
679 color: #ccc;
|
|
680 &:hover {
|
|
681 color: #555;
|
|
682 background-color: #e4e7ea;
|
|
683 }
|
|
684 }
|
|
685 }
|
|
686
|
|
687 body.rtl & {
|
|
688 @include padding(em(10) $card-spacer-x null);
|
|
689 }
|
|
690
|
|
691 @media (max-width: 480px) {
|
|
692 .media-body .btn {
|
|
693 display: none;
|
|
694 }
|
|
695 }
|
|
696
|
|
697 .media-heading a {
|
|
698 display: inline-block;
|
|
699 color: rgba(0,0,0,.7);
|
|
700 margin: em(4) 0 em(5);
|
|
701 &:hover{
|
|
702 color: $color-scheme;
|
|
703 }
|
|
704 }
|
|
705 }
|
|
706
|
|
707
|
|
708 /* Profile Add Content Widget
|
|
709 ============================*/
|
|
710 .widget-profile-add-tabs {
|
|
711 margin-bottom: em(30);
|
|
712 .nav-pills .nav-link {
|
|
713 padding: .3em 2em;
|
|
714 font-weight: 500;
|
|
715 font-size: em(12);
|
|
716 &.active {
|
|
717 background: rgba($color-scheme, .1);
|
|
718 color: $color-scheme;
|
|
719 }
|
|
720 &.attach-file-link {
|
|
721 @include padding(null 0);
|
|
722 font-size: em(13);
|
|
723 }
|
|
724 }
|
|
725 .tab-content {
|
|
726 border: 1px solid $theme-border-color;
|
|
727 margin-top: em(20);
|
|
728 }
|
|
729 textarea {
|
|
730 border: 0;
|
|
731 box-shadow: 0;
|
|
732 width: 100%;
|
|
733 min-height: 50px;
|
|
734 font-family: $headings-font-family;
|
|
735 resize: none;
|
|
736 }
|
|
737 }
|
|
738
|
|
739 /* Status Table Widget
|
|
740 ============================*/
|
|
741 .widget-status-table {
|
|
742
|
|
743 thead {
|
|
744 color: lighten($body-color, 20%);
|
|
745 }
|
|
746
|
|
747 span {
|
|
748 text-transform: uppercase;
|
|
749 letter-spacing: em(2,10.5);
|
|
750 border-radius: em(15,10.5);
|
|
751 padding: em(5,10.5) em(15,10.5);
|
|
752 }
|
|
753
|
|
754 i {
|
|
755 letter-spacing: em(10,18);
|
|
756 &:hover{ color: $body-color !important; }
|
|
757 }
|
|
758
|
|
759 tbody{
|
|
760 a { color: rgba(0,0,0,.7); }
|
|
761 a:hover { color: $color-scheme; }
|
|
762 }
|
|
763 }
|
|
764
|
|
765
|
|
766 /* User Activity Feed
|
|
767 ====================================*/
|
|
768 .widget-activity-header {
|
|
769 .nav-pills {
|
|
770 .nav-link {
|
|
771 border-radius: em(20,12);
|
|
772 font-family: $tertiary-font-family;
|
|
773 font-size: em(12);
|
|
774 font-weight: 600;
|
|
775 color: $body-color;
|
|
776 }
|
|
777 .nav-link.active {
|
|
778 color: #fff;
|
|
779 background-color: map-get($theme-colors, info);
|
|
780 }
|
|
781 }
|
|
782 form {
|
|
783 position: relative;
|
|
784 .form-control {
|
|
785 border: 2px solid #f2f3f5;
|
|
786 border-radius: em(15);
|
|
787 padding: em(15) em(130) em(15) em(20);
|
|
788 box-shadow: none;
|
|
789 &:focus {
|
|
790 border-color: #f2f3f5;
|
|
791 box-shadow: none;
|
|
792 }
|
|
793 @include placeholder {
|
|
794 color: #b9bec3;
|
|
795 font-family: $tertiary-font-family;
|
|
796 }
|
|
797 }
|
|
798 div {
|
|
799 position: absolute;
|
|
800 bottom: em(20);
|
|
801 right: em(20);
|
|
802 i { color: #c9d2da; }
|
|
803 button {
|
|
804 border-radius: em(12);
|
|
805 font-family: $tertiary-font-family;
|
|
806 letter-spacing: em(1);
|
|
807 background-color: #c9d2da;
|
|
808 }
|
|
809 }
|
|
810 }
|
|
811 }
|
|
812
|
|
813 .widget-activitys {
|
|
814 padding-top: em(10);
|
|
815
|
|
816 li {
|
|
817 position: relative;
|
|
818 margin-top: 0;
|
|
819 padding: em(10) 0;
|
|
820
|
|
821 &::before {
|
|
822 content: "";
|
|
823 background: #e5e5e5;
|
|
824 position: absolute;
|
|
825 top: 0;
|
|
826 left: em(21);
|
|
827 width: rem(1);
|
|
828 height: 100%;
|
|
829 }
|
|
830
|
|
831 &:first-child { padding-top: 0; }
|
|
832 &:last-child {
|
|
833 &, .media-body { padding-bottom: 0; }
|
|
834 }
|
|
835 }
|
|
836
|
|
837 .media-body {
|
|
838 padding: em(12) 0;
|
|
839 font-family: $tertiary-font-family;
|
|
840 }
|
|
841
|
|
842 .media-heading {
|
|
843 line-height: em(21);
|
|
844 margin-top: 0;
|
|
845 strong a {
|
|
846 color: $headings-color;
|
|
847 &:hover { text-decoration: underline; }
|
|
848 }
|
|
849 }
|
|
850
|
|
851 .media-body-content {
|
|
852 padding-top: em(15);
|
|
853 }
|
|
854
|
|
855 .widget-body-image-list {
|
|
856 figcaption{
|
|
857 text-align: center;
|
|
858 padding-top: em(8);
|
|
859 font-family: $headings-font-family;
|
|
860 small{
|
|
861 display: block;
|
|
862 font-size: 70%;
|
|
863 }
|
|
864 }
|
|
865 }
|
|
866 }
|
|
867
|
|
868
|
|
869 /* Widget Social Twitter
|
|
870 ====================================*/
|
|
871 .facebook-widget,
|
|
872 .twitter-widget {
|
|
873 overflow: hidden;
|
|
874 position: relative;
|
|
875 padding: em(30) em(20);
|
|
876 display: flex;
|
|
877 min-height: rem(220);
|
|
878 .status {
|
|
879 font-size: em(15);
|
|
880 margin-top: 2em;
|
|
881 }
|
|
882 .status-container {
|
|
883 width: 100%;
|
|
884 display: flex;
|
|
885 flex-direction: column;
|
|
886 }
|
|
887 h5, h6 {
|
|
888 color: #fff;
|
|
889 }
|
|
890 .after {
|
|
891 font-family: 'feather';
|
|
892 font-size: em(300);
|
|
893 line-height: rem(100);
|
|
894 opacity: 0.3;
|
|
895 color: #fff;
|
|
896 @include position( absolute, null 0 0 null);
|
|
897 pointer-events: none;
|
|
898 }
|
|
899 .user-info {
|
|
900 width: 100%;
|
|
901 display: flex;
|
|
902 align-items: center;
|
|
903 }
|
|
904 .widget-icon {
|
|
905 font-size: em(24);
|
|
906 }
|
|
907 figure {
|
|
908 margin-bottom: 0;
|
|
909 }
|
|
910 .user-name-group { flex: 1 }
|
|
911 .user-profile-picture {
|
|
912 @include size( em(30) );
|
|
913 border-radius: em(100);
|
|
914 float: left;
|
|
915 margin-right: em(10);
|
|
916 }
|
|
917 .user-name {
|
|
918 margin-top: em(5);
|
|
919 margin-bottom: em(5);
|
|
920 text-transform: uppercase;
|
|
921 font-weight: 600;
|
|
922 font-size: em(12);
|
|
923 letter-spacing: .05em;
|
|
924 }
|
|
925 .user-screen-name {
|
|
926 margin: 0;
|
|
927 opacity: 0.7;
|
|
928 font-weight: normal;
|
|
929 font-size: em(11);
|
|
930 letter-spacing: 0;
|
|
931 }
|
|
932 p {
|
|
933 margin-bottom: 0;
|
|
934 font-family: $headings-font-family;
|
|
935 }
|
|
936 body.rtl & {
|
|
937 .user-profile-picture {
|
|
938 margin-right: 0;
|
|
939 margin-left: em(10);
|
|
940 }
|
|
941 }
|
|
942 }
|
|
943
|
|
944
|
|
945 /* Chart Specific Styles
|
|
946 ====================================*/
|
|
947 .progress-stats-round {
|
|
948 position: relative;
|
|
949
|
|
950 .list-icon {
|
|
951 font-size: em(30);
|
|
952 font-weight: 600;
|
|
953 position: absolute;
|
|
954 top: em(30,30);
|
|
955 left: 50%;
|
|
956 transform: translateX(-50%);
|
|
957 }
|
|
958 }
|
|
959
|
|
960 .widget-social {
|
|
961 a{
|
|
962 margin-top: em(-20);
|
|
963 margin-bottom: em(-20);
|
|
964 padding-top: em(30);
|
|
965 padding-bottom: em(15);
|
|
966 &:hover {
|
|
967 text-decoration: none;
|
|
968 }
|
|
969 i {
|
|
970 font-size: em(40);
|
|
971 }
|
|
972 }
|
|
973 }
|
|
974
|
|
975 .widget-social-ft {
|
|
976 margin-top: em(-20);
|
|
977 margin-bottom: em(-20);
|
|
978 header {
|
|
979 padding: em(20) 0;
|
|
980 i {
|
|
981 font-size: em(40);
|
|
982 }
|
|
983 }
|
|
984 div {
|
|
985 div {
|
|
986 &:last-child {
|
|
987 border-left: rem(1) solid $theme-border-color;
|
|
988 }
|
|
989 }
|
|
990 }
|
|
991 }
|
|
992
|
|
993 .doughnut-widget {
|
|
994 position: relative;
|
|
995 section {
|
|
996 position: absolute;
|
|
997 top: 50%;
|
|
998 left: 50%;
|
|
999 transform: translate(-50%, -50%);
|
|
1000 small {
|
|
1001 display: inline-block;
|
|
1002 }
|
|
1003 }
|
|
1004 }
|
|
1005
|
|
1006 .doughnut-widget-details {
|
|
1007 ul {
|
|
1008 width: em(100);
|
|
1009 line-height: em(30);
|
|
1010 margin-left: 50%;
|
|
1011 transform: translateX(-50%);
|
|
1012 }
|
|
1013 }
|
|
1014
|
|
1015 .statistic-squares {
|
|
1016 [class*="col-"] {
|
|
1017 border-top: rem(1) solid #eee;
|
|
1018 border-left: rem(1) solid #eee;
|
|
1019 padding-top: em(30);
|
|
1020 padding-bottom: em(30);
|
|
1021
|
|
1022 &:first-child {
|
|
1023 border-left: 0;
|
|
1024 }
|
|
1025 }
|
|
1026
|
|
1027 > .row:first-child [class*="col-"] {
|
|
1028 border-top: 0;
|
|
1029 }
|
|
1030 }
|
|
1031
|
|
1032 .knob-widget {
|
|
1033 section {
|
|
1034 position: relative;
|
|
1035 i {
|
|
1036 font-size: em(60);
|
|
1037 color: rgba(0,0,0,.1);
|
|
1038 position: absolute;
|
|
1039 left: 50%;
|
|
1040 top: 50%;
|
|
1041 transform: translate(-50%, -50%);
|
|
1042 }
|
|
1043 }
|
|
1044
|
|
1045 ul {
|
|
1046 li{
|
|
1047 padding-left: em(20);
|
|
1048 padding-right: em(20);
|
|
1049 &:last-child{
|
|
1050 border-left: rem(1) solid $theme-border-color;
|
|
1051 }
|
|
1052 }
|
|
1053 }
|
|
1054 }
|
|
1055
|
|
1056 .card-user-info-widget {
|
|
1057 .caption-btn {
|
|
1058 > a {
|
|
1059 margin-bottom: em(10,15);
|
|
1060 letter-spacing: em(2,15);
|
|
1061 }
|
|
1062 }
|
|
1063 .followers-details-list {
|
|
1064 li {
|
|
1065 border: rem(1) solid $theme-border-color;
|
|
1066 padding: 0 em(40);
|
|
1067 &:first-child {
|
|
1068 border-left: 0;
|
|
1069 }
|
|
1070 &:last-child {
|
|
1071 border-left: 0;
|
|
1072 border-right: 0;
|
|
1073 }
|
|
1074 }
|
|
1075 }
|
|
1076
|
|
1077 .email-details-list {
|
|
1078 li {
|
|
1079 padding: 0px em(30);
|
|
1080 line-height: em(30);
|
|
1081 }
|
|
1082 }
|
|
1083 }
|
|
1084
|
|
1085
|
|
1086 /********************************
|
|
1087 *********************************
|
|
1088 Light Box Gallery
|
|
1089 *********************************
|
|
1090 *********************************/
|
|
1091 .lightbox-gallery {
|
|
1092 .lightbox {
|
|
1093 img {
|
|
1094 width: 100%;
|
|
1095 height: auto;
|
|
1096 }
|
|
1097 a {
|
|
1098 overflow: hidden;
|
|
1099 display: block;
|
|
1100 position: relative;
|
|
1101
|
|
1102 img {
|
|
1103 transition: all 250ms;
|
|
1104 }
|
|
1105
|
|
1106 &:hover {
|
|
1107 img { transform: scale(1.1); }
|
|
1108 }
|
|
1109 }
|
|
1110 }
|
|
1111 }
|
|
1112
|
|
1113 .promo-code-widget {
|
|
1114 header {
|
|
1115 h5 {
|
|
1116 background-color: #adc1c8;
|
|
1117 width: em(40);
|
|
1118 height: em(40);
|
|
1119 line-height: em(40);
|
|
1120 color: #ffffff;
|
|
1121 }
|
|
1122 }
|
|
1123
|
|
1124 section {
|
|
1125 > a {
|
|
1126 display: inline-block;
|
|
1127 border: 1px dashed $theme-border-color;
|
|
1128 }
|
|
1129 > input {
|
|
1130 max-width: 100%;
|
|
1131 }
|
|
1132 }
|
|
1133 }
|
|
1134
|
|
1135
|
|
1136 .social-icon-widget {
|
|
1137 div:first-child {
|
|
1138 position: relative;
|
|
1139 &::after {
|
|
1140 content: "";
|
|
1141 position: absolute;
|
|
1142 width: em(1);
|
|
1143 height: em(50);
|
|
1144 background-color: #dfe3e9;
|
|
1145 right: 0;
|
|
1146 top: 50%;
|
|
1147 transform: translateY(-50%);
|
|
1148 }
|
|
1149 }
|
|
1150 }
|
|
1151
|
|
1152
|
|
1153 .latest-widget {
|
|
1154 header {
|
|
1155 border-bottom: 1px solid #efefef;
|
|
1156 }
|
|
1157 section {
|
|
1158 .col-md-3 {
|
|
1159 border-right: 1px solid #efefef;
|
|
1160 &:last-child {
|
|
1161 border-right: 0;
|
|
1162 }
|
|
1163 h5 {
|
|
1164 line-height: em(22);
|
|
1165 }
|
|
1166 }
|
|
1167 }
|
|
1168 footer {
|
|
1169 .btn {
|
|
1170 background-color: #333333;
|
|
1171 color: #fff;
|
|
1172 outline: none;
|
|
1173 }
|
|
1174 .btn-default:active {
|
|
1175 background-color: #333333;
|
|
1176 color: #fff;
|
|
1177 }
|
|
1178 }
|
|
1179 }
|
|
1180
|
|
1181 .card-bench-widget {
|
|
1182 figure {
|
|
1183 position: relative;
|
|
1184 header {
|
|
1185 position: absolute;
|
|
1186 top: em(20);
|
|
1187 right: em(20);
|
|
1188 .btn {
|
|
1189 font-weight: 700;
|
|
1190 letter-spacing: em(1);
|
|
1191 color: #fff;
|
|
1192 border-color: #fff;
|
|
1193 &:hover {
|
|
1194 background-color: #fff;
|
|
1195 color: #000;
|
|
1196 }
|
|
1197 }
|
|
1198 }
|
|
1199
|
|
1200 section {
|
|
1201 position: absolute;
|
|
1202 bottom: em(40);
|
|
1203 right: em(20);
|
|
1204 }
|
|
1205
|
|
1206 ul {
|
|
1207 position: absolute;
|
|
1208 bottom: em(0);
|
|
1209 right: em(20);
|
|
1210 }
|
|
1211 }
|
|
1212 }
|
|
1213
|
|
1214 .city-card-widget {
|
|
1215 figure {
|
|
1216 position: relative;
|
|
1217 .city-card-status,
|
|
1218 .city-card-details {
|
|
1219 position: absolute;
|
|
1220 left: em(20);
|
|
1221 }
|
|
1222
|
|
1223 .city-card-status {
|
|
1224 top: em(20);
|
|
1225 }
|
|
1226
|
|
1227 .city-card-details {
|
|
1228 bottom: 0;
|
|
1229 }
|
|
1230
|
|
1231 .city-card-button {
|
|
1232 position: absolute;
|
|
1233 right: em(20);
|
|
1234 bottom: em(20);
|
|
1235 .btn {
|
|
1236 color: #fff;
|
|
1237 border-color: #fff;
|
|
1238 &:hover {
|
|
1239 color: #000;
|
|
1240 background-color: #fff;
|
|
1241 }
|
|
1242 }
|
|
1243 }
|
|
1244 }
|
|
1245 }
|
|
1246
|
|
1247
|
|
1248 .ecommerce-products-card {
|
|
1249 figure {
|
|
1250 position: relative;
|
|
1251 figcaption {
|
|
1252 position: absolute;
|
|
1253 top: em(20);
|
|
1254 right: em(20);
|
|
1255 }
|
|
1256 }
|
|
1257
|
|
1258 .ecommerce-products-card-details {
|
|
1259 padding: em(30) em(40) em(25);
|
|
1260 .product-title {
|
|
1261 h6 {
|
|
1262 color: #bbc7d3;
|
|
1263 }
|
|
1264 }
|
|
1265
|
|
1266 .buy-button {
|
|
1267 .btn {
|
|
1268 border-radius: 0;
|
|
1269 color: #ffffff;
|
|
1270 background-color: #88bf57;
|
|
1271 outline: none;
|
|
1272 }
|
|
1273 }
|
|
1274
|
|
1275 .buyer-button {
|
|
1276 .btn {
|
|
1277 color: #bbc7d3;
|
|
1278 border-color: #bbc7d3;
|
|
1279 &:hover,
|
|
1280 &:focus {
|
|
1281 color: #000;
|
|
1282 }
|
|
1283 }
|
|
1284 }
|
|
1285
|
|
1286 .product-ratings {
|
|
1287 li {
|
|
1288 a {
|
|
1289 i {
|
|
1290 color: #f3a855;
|
|
1291 }
|
|
1292 }
|
|
1293 }
|
|
1294 }
|
|
1295 }
|
|
1296 }
|
|
1297
|
|
1298
|
|
1299 /* Simple Thumnail Gallery
|
|
1300 ========================*/
|
|
1301 .gallery-small {
|
|
1302 a {
|
|
1303 display: inline-block;
|
|
1304 overflow: hidden;
|
|
1305 background: #000;
|
|
1306 position: relative;
|
|
1307 text-align: center;
|
|
1308 }
|
|
1309
|
|
1310 img {
|
|
1311 transition: 250ms transform, 250ms opacity;
|
|
1312 width: 100%;
|
|
1313 height: auto;
|
|
1314 }
|
|
1315
|
|
1316 a:hover > img,
|
|
1317 a.active > img {
|
|
1318 transform: scale(1.1);
|
|
1319 }
|
|
1320
|
|
1321 a:hover,
|
|
1322 .active {
|
|
1323 img {
|
|
1324 opacity: .7;
|
|
1325 }
|
|
1326
|
|
1327 span {
|
|
1328 display: block;
|
|
1329 width: 100%;
|
|
1330 position: absolute;
|
|
1331 color: #fff;
|
|
1332 top: 50%;
|
|
1333 left: 0;
|
|
1334 transform: translateY(-50%);
|
|
1335 font-size: em(24,15);
|
|
1336 line-height: 1;
|
|
1337 font-weight: 700;
|
|
1338 letter-spacing: -2px;
|
|
1339 font-family: $headings-font-family;
|
|
1340 }
|
|
1341
|
|
1342 small {
|
|
1343 display: block;
|
|
1344 color: #fff;
|
|
1345 font-size: .8rem;
|
|
1346 margin-top: 5px;
|
|
1347 letter-spacing: 0;
|
|
1348 }
|
|
1349 }
|
|
1350 }
|
|
1351
|
|
1352
|
|
1353 /* Chart Widgets
|
|
1354 ============================*/
|
|
1355 .chart-widget {
|
|
1356
|
|
1357 .card {
|
|
1358 .card-header {
|
|
1359 padding-left: em(30);
|
|
1360 background-color: #f9faff;
|
|
1361 span {
|
|
1362 color: #9ca0a8;
|
|
1363 }
|
|
1364 }
|
|
1365 .card-body { background-color: #f9faff; }
|
|
1366 .card-footer {
|
|
1367 background: none;
|
|
1368 border-color: #edf3f8;
|
|
1369 }
|
|
1370 }
|
|
1371
|
|
1372 .pie-chart {
|
|
1373 position: relative;
|
|
1374 section {
|
|
1375 color: #9ca0a8;
|
|
1376 position: absolute;
|
|
1377 top: 50%;
|
|
1378 left: 50%;
|
|
1379 transform: translate(-50%, -50%);
|
|
1380 }
|
|
1381 }
|
|
1382 }
|
|
1383
|
|
1384 .online-course-widget {
|
|
1385 .card-header {
|
|
1386 background: none;
|
|
1387 position: relative;
|
|
1388 &::after {
|
|
1389 content: "";
|
|
1390 position: absolute;
|
|
1391 height: em(3);
|
|
1392 width: em(40);
|
|
1393 bottom: 0;
|
|
1394 left: em(20);
|
|
1395 background: #e9ecf0;
|
|
1396 }
|
|
1397 a {
|
|
1398 i {
|
|
1399 font-size: em(22);
|
|
1400 background: #e9ecf0;
|
|
1401 padding: em(15,22);
|
|
1402 }
|
|
1403 &:hover i { background-color: $color-scheme; }
|
|
1404 }
|
|
1405 span {
|
|
1406 color: #6a768c;
|
|
1407 font-size: em(13);
|
|
1408 font-weight: 600;
|
|
1409 padding: em(15,13) em(20,13);
|
|
1410 }
|
|
1411 }
|
|
1412 .card-body {
|
|
1413 margin-bottom: em(10);
|
|
1414 h5 {
|
|
1415 a {
|
|
1416 font-weight: 300;
|
|
1417 line-height: em(25);
|
|
1418 color: #6a768c;
|
|
1419 }
|
|
1420 }
|
|
1421 }
|
|
1422 .card-footer {
|
|
1423 padding: em(15) em(20);
|
|
1424 background-color: #fff;
|
|
1425 border-color: $theme-border-color;
|
|
1426 }
|
|
1427 }
|
|
1428
|
|
1429 .select-widget {
|
|
1430 font-family: $tertiary-font-family;
|
|
1431 margin-bottom: em(30);
|
|
1432 section {
|
|
1433 margin-top: em(30);
|
|
1434 a {
|
|
1435 div {
|
|
1436 margin-left: em(-10);
|
|
1437 margin-right: em(-10);
|
|
1438 border: 1px solid $theme-border-color;
|
|
1439 border-radius: em(5);
|
|
1440 padding: 0 em(10) em(40) em(10);
|
|
1441 }
|
|
1442 }
|
|
1443 i {
|
|
1444 font-size: em(76);
|
|
1445 vertical-align: bottom;
|
|
1446 }
|
|
1447 }
|
|
1448 }
|
|
1449
|
|
1450 .subscribe-widget {
|
|
1451 border: em(2) dashed $theme-border-color;
|
|
1452 padding: em(20) em(20) em(40) em(20);
|
|
1453 .col-md-2 {
|
|
1454 position: relative;
|
|
1455 i {
|
|
1456 font-size: em(76);
|
|
1457 &::before {
|
|
1458 position: absolute;
|
|
1459 transform: rotate(15deg);
|
|
1460 left: 40%;
|
|
1461 top: 20%;
|
|
1462 }
|
|
1463 }
|
|
1464 }
|
|
1465 .form-control { box-shadow: none; }
|
|
1466 }
|
|
1467
|
|
1468 .tickets-table {
|
|
1469 table {
|
|
1470 thead {
|
|
1471 background: #fbfbfc;
|
|
1472 th {
|
|
1473 padding: em(20);
|
|
1474 border-top: 1px solid $theme-border-color;
|
|
1475 border-bottom: 1px solid $theme-border-color;
|
|
1476 }
|
|
1477 }
|
|
1478
|
|
1479 tbody {
|
|
1480 tr {
|
|
1481 margin: em(10) 0;
|
|
1482 &:last-child {
|
|
1483 td { border: none; }
|
|
1484 }
|
|
1485 td {
|
|
1486 padding: em(10) em(20);
|
|
1487 border-bottom: 1px solid $theme-border-color;
|
|
1488 i {
|
|
1489 font-size: em(18);
|
|
1490 &::before {
|
|
1491 vertical-align: -webkit-baseline-middle;
|
|
1492 }
|
|
1493 }
|
|
1494 }
|
|
1495 }
|
|
1496 }
|
|
1497 }
|
|
1498 }
|
|
1499
|
|
1500 .schedule-widget {
|
|
1501 .col-md-3 {
|
|
1502 position: relative;
|
|
1503 &::after {
|
|
1504 content: "";
|
|
1505 position: absolute;
|
|
1506 height: em(40);
|
|
1507 width: em(1);
|
|
1508 right: 0;
|
|
1509 top: 50%;
|
|
1510 transform: translateY(-50%);
|
|
1511 background-color: $theme-border-color;
|
|
1512 }
|
|
1513 &:last-child {
|
|
1514 &::after {
|
|
1515 display: none;
|
|
1516 }
|
|
1517 }
|
|
1518 }
|
|
1519 a {
|
|
1520 i {
|
|
1521 position: relative;
|
|
1522 background: $theme-border-color;
|
|
1523 font-size: em(18);
|
|
1524 @include size(em(50), em(50));
|
|
1525 &::before {
|
|
1526 position: absolute;
|
|
1527 left: 50%;
|
|
1528 top: 50%;
|
|
1529 transform: translate(-50%, -50%);
|
|
1530 }
|
|
1531 }
|
|
1532 }
|
|
1533 }
|
|
1534
|
|
1535 .purpose-widget {
|
|
1536 .card {
|
|
1537 .card-body {
|
|
1538 .col-md-6 {
|
|
1539 padding: em(30);
|
|
1540 border-right: 1px solid $theme-border-color;
|
|
1541 &:last-child { border: none; }
|
|
1542 }
|
|
1543 border-bottom: 1px solid $theme-border-color;
|
|
1544 &:last-child { border: none; }
|
|
1545 }
|
|
1546
|
|
1547 }
|
|
1548 }
|
|
1549
|
|
1550 .status-view-widget {
|
|
1551 .col-md-6 {
|
|
1552 a {
|
|
1553 padding: em(35) em(25);
|
|
1554 border: 1px solid #fff;
|
|
1555 border-radius: em(5);
|
|
1556 background: #f9f9f9;
|
|
1557 i {
|
|
1558 font-size: em(20);
|
|
1559 &::before { vertical-align: -webkit-baseline-middle; }
|
|
1560 }
|
|
1561 h3 { color: #444; }
|
|
1562
|
|
1563 &:hover {
|
|
1564 background: none;
|
|
1565 border-color: map-get($theme-colors, success);
|
|
1566 }
|
|
1567 }
|
|
1568 }
|
|
1569 }
|
|
1570
|
|
1571 .sports-card {
|
|
1572 .card {
|
|
1573 .card-header {
|
|
1574 .list-icon {
|
|
1575 width: auto;
|
|
1576 height: auto;
|
|
1577 line-height: normal;
|
|
1578 }
|
|
1579 }
|
|
1580 .card-body {
|
|
1581 > div {
|
|
1582 > a {
|
|
1583 small {
|
|
1584 border-bottom: 1px solid $theme-border-color;
|
|
1585 }
|
|
1586 }
|
|
1587 }
|
|
1588 }
|
|
1589 }
|
|
1590 }
|
|
1591
|
|
1592 /* Map Widgets
|
|
1593 ============================*/
|
|
1594 .widget-map {
|
|
1595 .gmap {
|
|
1596 position: relative;
|
|
1597 &:after {
|
|
1598 content: '';
|
|
1599 display: block;
|
|
1600 @include position(absolute,0);
|
|
1601 box-shadow: inset 0 0 10px 0 rgba(0,0,0,.2);
|
|
1602 pointer-events: none;
|
|
1603 }
|
|
1604 }
|
|
1605 .card {
|
|
1606 box-shadow: 0 0 10px 0 rgba(0,0,0,.2);
|
|
1607 }
|
|
1608 }
|
|
1609
|
|
1610 /* Project Index
|
|
1611 ============================*/
|
|
1612 .widget-project-index {
|
|
1613 .card {
|
|
1614 border: 0;
|
|
1615 .card-header {
|
|
1616 background: $widget-bg;
|
|
1617 border: 0;
|
|
1618 a {
|
|
1619 padding-right: rem(20);
|
|
1620 padding-left: rem(20);
|
|
1621 }
|
|
1622 a::after {
|
|
1623 display: none;
|
|
1624 }
|
|
1625 }
|
|
1626 .card-title {
|
|
1627 padding: 0;
|
|
1628 }
|
|
1629
|
|
1630 .count {
|
|
1631 @include size(rem(20));
|
|
1632 line-height: rem(18);
|
|
1633 text-align: center;
|
|
1634 border-radius: 100%;
|
|
1635 border: 2px solid $theme-border-color;
|
|
1636 display: inline-block;
|
|
1637 }
|
|
1638 }
|
|
1639 .list-group {
|
|
1640 border: 0;
|
|
1641 background: $body-bg;
|
|
1642 .list-group-item {
|
|
1643 @include padding(0.75em rem(20));
|
|
1644 display: flex;
|
|
1645 align-items: top;
|
|
1646 background: $body-bg;
|
|
1647 border: 0;
|
|
1648 color: $text-muted;
|
|
1649 font-size: em(13);
|
|
1650 font-weight: 500;
|
|
1651 &.active {
|
|
1652 color: $headings-color;
|
|
1653 box-shadow: inset 4px 0 0 0 $primary;
|
|
1654 }
|
|
1655 }
|
|
1656 small {
|
|
1657 margin-left: 1em;
|
|
1658 }
|
|
1659
|
|
1660 .list-icon {
|
|
1661 line-height: em(30);
|
|
1662 margin-right: 1em;
|
|
1663 color: $text-muted;
|
|
1664 }
|
|
1665
|
|
1666 .done-icon {
|
|
1667 display: block;
|
|
1668 font-size: rem(12);
|
|
1669 @include size(em(20,12));
|
|
1670 line-height: em(20,12);
|
|
1671 text-align: center;
|
|
1672 border-radius: 100%;
|
|
1673 margin-top: .2em;
|
|
1674 }
|
|
1675 }
|
|
1676
|
|
1677 body.rtl & {
|
|
1678 .list-group {
|
|
1679 .list-group-item.active {
|
|
1680 box-shadow: inset -4px 0 0 0 $primary;
|
|
1681 }
|
|
1682 .list-icon {
|
|
1683 margin-right: 0;
|
|
1684 margin-left: 1em;
|
|
1685 }
|
|
1686 }
|
|
1687 }
|
|
1688 }
|