← All changes | resources/frontend/css/broadcasts.css +3 -85 2.2.4 → 2.0.3 View file →

		@@ -16,105 +16,23 @@
16	16	list-style: none;
17	17	margin: 0;
18	18	padding: 0;
19	19	}
20		-
21		-/**
22		- * List View
23		- */
24	20	.convertkit-broadcasts-list li {
25	21	display: grid;
26		- grid-template-areas:
27		- "date title"
28		- "image text";
	22	+ grid-template-areas: "date subject";
29	23	grid-template-columns: 150px auto;
30	24	grid-column-gap: 20px;
31		-}
32		-@media screen and (max-width: 478px) {
33		- .convertkit-broadcasts-list li {
34		- grid-template-areas:
35		- "image image"
36		- "date date"
37		- "title title"
38		- "text text";
39		- grid-row-gap: 10px;
40		- }
41		-}
42		-
43		-/**
44		- * Grid View.
45		- */
46		-.convertkit-broadcasts[data-display-grid="1"] .convertkit-broadcasts-list {
47		- display: grid;
48		- grid-template-columns: repeat(3, 1fr);
49		- grid-column-gap: 20px;
50		- grid-row-gap: 20px;
51		- align-items: start;
52		-}
53		-.convertkit-broadcasts[data-display-grid="1"] .convertkit-broadcasts-list li {
54		- grid-template-areas:
55		- "image"
56		- "date"
57		- "title"
58		- "text";
59		- grid-template-columns: none;
60		- grid-row-gap: 10px;
61		-}
62		-.convertkit-broadcasts[data-display-grid="1"] .convertkit-broadcasts-list li .convertkit-broadcast-read-more {
63		- margin: 10px 0 0 0;
64		-}
65		-@media screen and (max-width: 768px) {
66		- .convertkit-broadcasts[data-display-grid="1"] .convertkit-broadcasts-list {
67		- grid-template-columns: repeat(2, 1fr);
68		- }
69		-}
70		-@media screen and (max-width: 478px) {
71		- .convertkit-broadcasts[data-display-grid="1"] .convertkit-broadcasts-list {
72		- grid-template-columns: repeat(1, 1fr);
73		- }
74		-}
75		-
76		-/**
77		- * Broadcast Item
78		- */
79		-.convertkit-broadcasts-list li {
80	25	list-style: none;
81	26	margin: 0;
82	27	padding: 5px 0;
83	28	}
84	29	.convertkit-broadcasts-list li time {
85		- display: inline-block;
86	30	grid-area: date;
87	31	}
88		-.convertkit-broadcasts-list li .convertkit-broadcast-title {
89		- display: inline-block;
90		- grid-area: title;
	32	+.convertkit-broadcasts-list li a {
	33	+ grid-area: subject;
91	34	}
92		-.convertkit-broadcasts-list li .convertkit-broadcast-image {
93		- display: inline-block;
94		- grid-area: image;
95		-}
96		-.convertkit-broadcasts-list li .convertkit-broadcast-image img {
97		- max-width: 100%;
98		- height: auto;
99		-}
100		-.convertkit-broadcasts-list li .convertkit-broadcast-text {
101		- display: inline-block;
102		- grid-area: text;
103		- font-size: 16px;
104		-}
105		-.convertkit-broadcasts-list li .convertkit-broadcast-read-more {
106		- display: block;
107		-}
108		-@media screen and (max-width: 478px) {
109		- .convertkit-broadcasts[data-display-image="1"] .convertkit-broadcasts-list li {
110		- margin: 0 0 20px 0;
111		- }
112		-}
113		-
114		-/**
115		- * Pagination
116		- */
117	35	.convertkit-broadcasts-pagination {
118	36	display: grid;
119	37	grid-template-areas: "prev next";
120	38	grid-template-columns: repeat(2, 1fr);