comparison .cms/css/rss.css @ 0:78edf6b517a0 draft

24.10
author Coffee CMS <info@coffee-cms.ru>
date Fri, 11 Oct 2024 22:40:23 +0000
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:78edf6b517a0
1 #rss {
2 display: grid;
3 height: 100%;
4 overflow-y: auto;
5 grid-auto-rows: max-content;
6 row-gap: 1rem;
7 }
8 #rss form {
9 display: grid;
10 gap: 1rem;
11 }
12
13 @media (max-width: 1023px) {
14 #rss {
15 padding: 1rem 0.4rem 1rem 0.4rem;
16 display: flex; /*Samsung Browser - padding-bottom*/
17 flex-direction: column; /*Samsung Browser - padding-bottom*/
18 }
19 #rss form {
20 grid-template-columns: 1fr;
21 grid-template-areas:
22 "xml-wrapper-hidden"
23 "xml-static-dynamic"
24 "xml-static-cron";
25 }
26 }
27 @media (min-width: 1024px) {
28 #rss {
29 padding: 1rem;
30 }
31 #rss form {
32 grid-template-columns: 1fr 1fr;
33 grid-template-areas:
34 "xml-wrapper-hidden xml-static-dynamic"
35 "xml-wrapper-hidden xml-static-cron";
36 }
37 }
38
39 @media (min-width: 1024px) {
40 #rss .xml-wrapper-hidden {
41 grid-area: xml-wrapper-hidden;
42 }
43 #rss .xml-static-dynamic {
44 grid-area: xml-static-dynamic;
45 }
46 #rss .xml-static-cron {
47 grid-area: xml-static-cron;
48 }
49 }
50
51 #rss .xml-wrapper-hidden, #rss .xml-static-dynamic, #rss .xml-static-cron {
52 display: grid;
53 grid-auto-rows: max-content;
54 row-gap: 0.7rem;
55 box-shadow: var(--shadows);
56 border-radius: 0.3rem;
57 background-color: var(--windows);
58 background-image: var(--noise);
59 }
60 .xml-wrapper-hidden div, .xml-static-dynamic div, .xml-static-cron div {
61 color: var(--windows-font);
62 }
63
64 @media (max-width: 1023px) {
65 #rss .xml-wrapper-hidden, #rss .xml-static-dynamic, #rss .xml-static-cron {
66 padding: 1rem 0.7rem 1rem 0.7rem;
67 }
68 }
69 @media (min-width: 1024px) {
70 #rss .xml-wrapper-hidden, #rss .xml-static-dynamic, #rss .xml-static-cron {
71 padding: 1rem;
72 }
73 }
74
75 #rss textarea {
76 line-height: 1.3em;
77 resize: vertical;
78 width: 100%;
79 background-color: var(--input-bg);
80 border: 2px solid var(--input-border);
81 border-radius: 4px;
82 font-family: var(--monospace);
83 font-size: 1rem;
84 color: var(--input-font);
85 padding: 0 8px;
86 min-height: 30px;
87 }
88
89 #rss form div > input {
90 border-radius: 4px;
91 font-size: 0.875rem;
92 padding: 0 0.54rem;
93 min-height: 35px;
94 width: 100%;
95 color: var(--input-font);
96 background-color: var(--input-bg);
97 border: 2px solid var(--input-border);
98 }
99
100 #rss form div > button {
101 width: fit-content;
102 }
103
104 #rss .save_2_col {
105 display: grid;
106 }
107 #rss .save_2_col > button {
108 grid-area: button;
109 }
110 #rss .save_2_col > div {
111 grid-area: div;
112 }
113 @media (max-width: 767px) {
114 #rss .save_2_col {
115 grid-template-columns: 1fr;
116 row-gap: 0.7rem;
117 }
118 #rss .save_2_col {
119 grid-template-areas:
120 "div"
121 "button";
122 }
123 }
124 @media (min-width: 768px) {
125 #rss .save_2_col {
126 grid-template-areas:
127 "button div";
128 grid-template-columns: auto 1fr;
129 column-gap: 1rem;
130 }
131 }
132
133 #rss .select-dropdown {
134 position: relative;
135 }
136 #rss .select-dropdown ul.list-search {
137 height: 0;
138 background-color: var(--bg-3);
139 display: grid;
140 margin: 0;
141 margin-top: 2px;
142 padding: 0;
143 overflow-y: auto;
144 max-height: 17rem;
145 overscroll-behavior: contain;
146 position: absolute;
147 width: 100%;
148 border-radius: 4px;
149 }
150 #rss .select-dropdown.open ul.list-search {
151 height: auto;
152 border: 2px solid var(--bg-4);
153 }
154 #rss .select-dropdown .list-search li {
155 display: block;
156 list-style-type: none;
157 padding: 0.4rem 0.44rem;
158 cursor: pointer;
159 font-size: 0.94rem;
160 text-align: left;
161 }
162 #rss .select-dropdown .list-search li:hover {
163 background-color: var(--menu-item-list-search-li-hover-active);
164 }
165
166 #rss .xml-static-dynamic input[type="text"] {
167 color: var(--input-font);
168 }
169 #rss .xml-static-dynamic label input[type="radio"] {
170 cursor: pointer;
171 display: inline-block;
172 margin-right: 0.3rem;
173 border-radius: 50%;
174 width: 0.73rem;
175 height: 0.73rem;
176 background-color: var(--bg-4);
177 transform: translate(0, 0);
178 appearance: none;
179 }
180 #rss .xml-static-dynamic label input:checked {
181 background-color: var(--orange);
182 border-color: var(--orange);
183 box-shadow: 0 0 0 0.25rem var(--focus-orange);
184 }
185
186 #rss .xml-static-dynamic label {
187 cursor: pointer;
188 line-height: 1.1em;
189 font-size: 1rem;
190 color: var(--link);
191 user-select: none;
192 }
193
194 #rss .xml-static-cron p, #rss .xml-static-dynamic p {
195 font-size: 1rem;
196 color: var(--text);
197 }
198 #rss .xml-static-cron input[type="text"], #rss .xml-static-dynamic input[type="text"] {
199 max-width: 70px;
200 border-radius: 4px;
201 font-size: 0.875rem;
202 padding: 0 0.54rem;
203 min-height: 35px;
204 background-color: var(--input-bg);
205 border: 2px solid var(--input-border);
206 color: var(--input-font);
207 text-align: center;
208 }
209 #rss .rss {
210 grid-auto-rows: max-content;
211 box-shadow: var(--shadows);
212 border-radius: 0.3rem;
213 background-color: var(--windows);
214 background-image: var(--noise);
215 color: var(--text);
216 font-size: 1rem;
217 }
218 @media (max-width: 1023px) {
219 #rss .rss {
220 padding: 1rem 0.7rem 1rem 0.7rem;
221 }
222 }
223 @media (min-width: 1024px) {
224 #rss .rss {
225 padding: 1rem;
226 }
227 }
228 #rss .rss a {
229 color: var(--link);
230 text-decoration: none;
231 border-bottom: 1px solid;
232 }