1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 | .mdc-image-list {
|
9 | display: flex;
|
10 | flex-wrap: wrap;
|
11 | margin: 0 auto;
|
12 | padding: 0;
|
13 | }
|
14 |
|
15 | .mdc-image-list__item,
|
16 | .mdc-image-list__image-aspect-container {
|
17 | position: relative;
|
18 | box-sizing: border-box;
|
19 | }
|
20 |
|
21 | .mdc-image-list__item {
|
22 | list-style-type: none;
|
23 | }
|
24 |
|
25 | .mdc-image-list__image {
|
26 | width: 100%;
|
27 | }
|
28 |
|
29 | .mdc-image-list__image-aspect-container .mdc-image-list__image {
|
30 | position: absolute;
|
31 | top: 0;
|
32 | right: 0;
|
33 | bottom: 0;
|
34 | left: 0;
|
35 | height: 100%;
|
36 | background-repeat: no-repeat;
|
37 | background-position: center;
|
38 | background-size: cover;
|
39 | }
|
40 |
|
41 | .mdc-image-list__image-aspect-container {
|
42 | padding-bottom: calc(100% / 1);
|
43 | }
|
44 |
|
45 | .mdc-image-list__image {
|
46 | border-radius: 0;
|
47 | }
|
48 |
|
49 | .mdc-image-list--with-text-protection .mdc-image-list__supporting {
|
50 | border-top-left-radius: 0;
|
51 | border-top-right-radius: 0;
|
52 | border-bottom-right-radius: 0;
|
53 | border-bottom-left-radius: 0;
|
54 | }
|
55 |
|
56 | .mdc-image-list__supporting {
|
57 | color: rgba(0, 0, 0, 0.87);
|
58 |
|
59 | color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87));
|
60 | display: flex;
|
61 | align-items: center;
|
62 | justify-content: space-between;
|
63 | box-sizing: border-box;
|
64 | padding: 8px 0;
|
65 | line-height: 24px;
|
66 | }
|
67 |
|
68 | .mdc-image-list__label {
|
69 | -moz-osx-font-smoothing: grayscale;
|
70 | -webkit-font-smoothing: antialiased;
|
71 | font-family: Roboto, sans-serif;
|
72 |
|
73 | font-family: var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));
|
74 | font-size: 1rem;
|
75 |
|
76 | font-size: var(--mdc-typography-subtitle1-font-size, 1rem);
|
77 | line-height: 1.75rem;
|
78 |
|
79 | line-height: var(--mdc-typography-subtitle1-line-height, 1.75rem);
|
80 | font-weight: 400;
|
81 |
|
82 | font-weight: var(--mdc-typography-subtitle1-font-weight, 400);
|
83 | letter-spacing: 0.009375em;
|
84 |
|
85 | letter-spacing: var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);
|
86 | text-decoration: inherit;
|
87 |
|
88 | -webkit-text-decoration: var(--mdc-typography-subtitle1-text-decoration, inherit);
|
89 | text-decoration: var(--mdc-typography-subtitle1-text-decoration, inherit);
|
90 | text-transform: inherit;
|
91 |
|
92 | text-transform: var(--mdc-typography-subtitle1-text-transform, inherit);
|
93 | text-overflow: ellipsis;
|
94 | white-space: nowrap;
|
95 | overflow: hidden;
|
96 | }
|
97 |
|
98 | .mdc-image-list--with-text-protection .mdc-image-list__supporting {
|
99 | position: absolute;
|
100 | bottom: 0;
|
101 | width: 100%;
|
102 | height: 48px;
|
103 | padding: 0 16px;
|
104 | background: rgba(0, 0, 0, 0.6);
|
105 | color: #fff;
|
106 | }
|
107 |
|
108 | .mdc-image-list--masonry {
|
109 | display: block;
|
110 | }
|
111 | .mdc-image-list--masonry .mdc-image-list__item {
|
112 | -webkit-column-break-inside: avoid;
|
113 | break-inside: avoid-column;
|
114 | }
|
115 | .mdc-image-list--masonry .mdc-image-list__image {
|
116 | display: block;
|
117 | height: auto;
|
118 | }
|
119 |
|
120 |
|
\ | No newline at end of file |