DmitrMakeev commited on
Commit
1651e07
·
verified ·
1 Parent(s): 9562a62

Update nutri_call.html

Browse files
Files changed (1) hide show
  1. nutri_call.html +194 -185
nutri_call.html CHANGED
@@ -4,109 +4,116 @@
4
  <meta charset="UTF-8">
5
  <title>Калькулятор удобрений</title>
6
  <style>
7
- body {
8
- margin: 0 auto;
9
- width: 1000px;
10
- padding: 1em;
11
- background-color: #f0f0f0;
12
- font-family: Arial, sans-serif;
13
- }
14
-
15
- h1 {
16
- background-color: #2e8b57;
17
- color: white;
18
- text-align: center;
19
- padding: 1em;
20
- border-radius: 10px;
21
- margin-bottom: 20px;
22
- }
23
-
24
- fieldset {
25
- border: 2px solid #2e8b57;
26
- background-color: #eaffea;
27
- padding: 1em;
28
- margin-bottom: 20px;
29
- border-radius: 8px;
30
- }
31
-
32
- legend {
33
- font-weight: bold;
34
- color: #2e8b57;
35
- padding: 0 10px;
36
- }
37
-
38
- input[type=number] {
39
- width: 80px;
40
- padding: 3px;
41
- border: 1px solid #ccc;
42
- border-radius: 4px;
43
- text-align: center;
44
- }
45
-
46
- /* Верхний блок */
47
- .main-container {
48
- display: grid;
49
- grid-template-columns: 140px repeat(8, 100px); /* 1 колонка под названия + 8 одинаковых столбцов */
50
- gap: 10px;
51
- padding: 10px;
52
- align-items: center;
53
- }
54
-
55
- .profile-container {
56
- display: contents;
57
- }
58
-
59
- .profile-element {
60
- display: flex;
61
- flex-direction: column;
62
- align-items: center;
63
- }
64
-
65
- .profile-label {
66
- font-weight: bold;
67
- margin-bottom: 5px;
68
- }
69
-
70
- .nitrogen-container {
71
- grid-column: 1 / -1;
72
- display: flex;
73
- gap: 20px;
74
- padding-left: 140px;
75
- margin-top: 10px;
76
- }
77
-
78
- .nitrogen-group {
79
- display: flex;
80
- align-items: center;
81
- gap: 5px;
82
- }
83
-
84
- /* Нижний блок - удобрения */
85
-
86
- .fert-header {
87
- font-weight: bold;
88
- text-align: center;
89
- }
90
-
91
- .fert-name {
92
- font-weight: bold;
93
- text-align: left;
94
- padding-left: 5px;
95
- }
96
-
97
- .fert-cell {
98
- text-align: center;
99
- }
100
-
101
- .fert-input {
102
- text-align: center;
103
- box-sizing: border-box;
104
- width: 100%;
105
- }
106
-
107
-
 
 
 
 
 
 
 
 
108
  </style>
109
-
110
  </head>
111
 
112
  <body>
@@ -163,90 +170,92 @@ input[type=number] {
163
 
164
  <fieldset>
165
  <legend>Составы солей</legend>
166
-
167
- <div class="fert-header-row">
168
- <span class="fert-name">Удобрение</span>
169
- <span class="fert-cell">NH4</span>
170
- <span class="fert-cell">NO3</span>
171
- <span class="fert-cell">P</span>
172
- <span class="fert-cell">K</span>
173
- <span class="fert-cell">Ca</span>
174
- <span class="fert-cell">Mg</span>
175
- <span class="fert-cell">S</span>
176
- <span class="fert-cell">грамм</span>
177
- </div>
178
-
179
- <div class="fert-row">
180
- <span class="fert-name">CaN2O6</span>
181
- <span class="fert-cell">-</span>
182
- <input class="fert-input" type="number" step="0.001" id="fert_ca_no3" />
183
- <span class="fert-cell">-</span>
184
- <span class="fert-cell">-</span>
185
- <input class="fert-input" type="number" step="0.001" id="fert_ca_ca" />
186
- <span class="fert-cell">-</span>
187
- <span class="fert-cell">-</span>
188
- <input class="fert-input" type="number" step="0.001" id="fert_ca_gram" />
189
- </div>
190
-
191
- <div class="fert-row">
192
- <span class="fert-name">KNO3</span>
193
- <span class="fert-cell">-</span>
194
- <input class="fert-input" type="number" step="0.001" id="fert_kno3_no3" />
195
- <span class="fert-cell">-</span>
196
- <input class="fert-input" type="number" step="0.001" id="fert_kno3_k" />
197
- <span class="fert-cell">-</span>
198
- <span class="fert-cell">-</span>
199
- <span class="fert-cell">-</span>
200
- <input class="fert-input" type="number" step="0.001" id="fert_kno3_gram" />
201
- </div>
202
-
203
- <div class="fert-row">
204
- <span class="fert-name">NH4NO3</span>
205
- <input class="fert-input" type="number" step="0.001" id="fert_nh4no3_nh4" />
206
- <input class="fert-input" type="number" step="0.001" id="fert_nh4no3_no3" />
207
- <span class="fert-cell">-</span>
208
- <span class="fert-cell">-</span>
209
- <span class="fert-cell">-</span>
210
- <span class="fert-cell">-</span>
211
- <span class="fert-cell">-</span>
212
- <input class="fert-input" type="number" step="0.001" id="fert_nh4no3_gram" />
213
- </div>
214
-
215
- <div class="fert-row">
216
- <span class="fert-name">MgSO4</span>
217
- <span class="fert-cell">-</span>
218
- <span class="fert-cell">-</span>
219
- <span class="fert-cell">-</span>
220
- <span class="fert-cell">-</span>
221
- <input class="fert-input" type="number" step="0.001" id="fert_mgso4_mg" />
222
- <input class="fert-input" type="number" step="0.001" id="fert_mgso4_s" />
223
- <input class="fert-input" type="number" step="0.001" id="fert_mgso4_gram" />
224
- </div>
225
-
226
- <div class="fert-row">
227
- <span class="fert-name">KH2PO4</span>
228
- <span class="fert-cell">-</span>
229
- <span class="fert-cell">-</span>
230
- <input class="fert-input" type="number" step="0.001" id="fert_kh2po4_p" />
231
- <input class="fert-input" type="number" step="0.001" id="fert_kh2po4_k" />
232
- <span class="fert-cell">-</span>
233
- <span class="fert-cell">-</span>
234
- <span class="fert-cell">-</span>
235
- <input class="fert-input" type="number" step="0.001" id="fert_kh2po4_gram" />
236
- </div>
237
-
238
- <div class="fert-row">
239
- <span class="fert-name">K2SO4</span>
240
- <span class="fert-cell">-</span>
241
- <span class="fert-cell">-</span>
242
- <span class="fert-cell">-</span>
243
- <input class="fert-input" type="number" step="0.001" id="fert_k2so4_k" />
244
- <span class="fert-cell">-</span>
245
- <span class="fert-cell">-</span>
246
- <input class="fert-input" type="number" step="0.001" id="fert_k2so4_s" />
247
- <input class="fert-input" type="number" step="0.001" id="fert_k2so4_gram" />
 
 
 
248
  </div>
249
  </fieldset>
250
-
251
  </body>
252
  </html>
 
4
  <meta charset="UTF-8">
5
  <title>Калькулятор удобрений</title>
6
  <style>
7
+ body {
8
+ margin: 0 auto;
9
+ width: 1000px;
10
+ padding: 1em;
11
+ background-color: #f0f0f0;
12
+ font-family: Arial, sans-serif;
13
+ }
14
+ h1 {
15
+ background-color: #2e8b57;
16
+ color: white;
17
+ text-align: center;
18
+ padding: 1em;
19
+ border-radius: 10px;
20
+ margin-bottom: 20px;
21
+ }
22
+ fieldset {
23
+ border: 2px solid #2e8b57;
24
+ background-color: #eaffea;
25
+ padding: 1em;
26
+ margin-bottom: 20px;
27
+ border-radius: 8px;
28
+ }
29
+ legend {
30
+ font-weight: bold;
31
+ color: #2e8b57;
32
+ padding: 0 10px;
33
+ }
34
+ input[type=number] {
35
+ width: 80px;
36
+ padding: 3px;
37
+ border: 1px solid #ccc;
38
+ border-radius: 4px;
39
+ }
40
+
41
+ /* Общие стили для обоих блоков */
42
+ .main-container {
43
+ display: grid;
44
+ grid-template-columns: 120px repeat(8, 90px);
45
+ gap: 10px;
46
+ padding: 10px;
47
+ }
48
+
49
+ /* Верхний блок - макропрофиль */
50
+ .profile-container {
51
+ display: contents;
52
+ }
53
+
54
+ .profile-element {
55
+ display: flex;
56
+ flex-direction: column;
57
+ align-items: center;
58
+ }
59
+
60
+ .profile-label {
61
+ font-weight: bold;
62
+ margin-bottom: 5px;
63
+ }
64
+
65
+ /* Азотные элементы */
66
+ .nitrogen-container {
67
+ grid-column: 1 / -1;
68
+ display: flex;
69
+ gap: 20px;
70
+ padding-left: 120px;
71
+ margin-top: 10px;
72
+ }
73
+
74
+ .nitrogen-group {
75
+ display: flex;
76
+ align-items: center;
77
+ gap: 5px;
78
+ }
79
+
80
+ /* Нижний блок - составы солей (переделан в горизонтальный) */
81
+ .fertilisers-container {
82
+ display: flex;
83
+ flex-direction: column;
84
+ }
85
+
86
+ .fert-row {
87
+ display: flex;
88
+ align-items: center;
89
+ margin-bottom: 10px;
90
+ }
91
+
92
+ .fert-header {
93
+ font-weight: bold;
94
+ text-align: center;
95
+ min-width: 90px;
96
+ padding: 5px;
97
+ }
98
+
99
+ .fert-name {
100
+ font-weight: bold;
101
+ min-width: 120px;
102
+ text-align: left;
103
+ padding-right: 10px;
104
+ }
105
+
106
+ .fert-cell {
107
+ text-align: center;
108
+ min-width: 90px;
109
+ padding: 5px;
110
+ }
111
+
112
+ .fert-input {
113
+ width: 80px;
114
+ margin: 0 5px;
115
+ }
116
  </style>
 
117
  </head>
118
 
119
  <body>
 
170
 
171
  <fieldset>
172
  <legend>Составы солей</legend>
173
+ <div class="fertilisers-container">
174
+ <!-- Заголовки -->
175
+ <div class="fert-row">
176
+ <span class="fert-name">Удобрение</span>
177
+ <span class="fert-header">NH4</span>
178
+ <span class="fert-header">NO3</span>
179
+ <span class="fert-header">P</span>
180
+ <span class="fert-header">K</span>
181
+ <span class="fert-header">Ca</span>
182
+ <span class="fert-header">Mg</span>
183
+ <span class="fert-header">S</span>
184
+ <span class="fert-header">грамм</span>
185
+ </div>
186
+
187
+ <!-- Строки с удобрениями -->
188
+ <div class="fert-row">
189
+ <span class="fert-name">CaN2O6</span>
190
+ <span class="fert-cell">-</span>
191
+ <input class="fert-input" type="number" step="0.001" id="fert_ca_no3"/>
192
+ <span class="fert-cell">-</span>
193
+ <span class="fert-cell">-</span>
194
+ <input class="fert-input" type="number" step="0.001" id="fert_ca_ca"/>
195
+ <span class="fert-cell">-</span>
196
+ <span class="fert-cell">-</span>
197
+ <input class="fert-input" type="number" step="0.001" id="fert_ca_gram"/>
198
+ </div>
199
+
200
+ <div class="fert-row">
201
+ <span class="fert-name">KNO3</span>
202
+ <span class="fert-cell">-</span>
203
+ <input class="fert-input" type="number" step="0.001" id="fert_kno3_no3"/>
204
+ <span class="fert-cell">-</span>
205
+ <input class="fert-input" type="number" step="0.001" id="fert_kno3_k"/>
206
+ <span class="fert-cell">-</span>
207
+ <span class="fert-cell">-</span>
208
+ <span class="fert-cell">-</span>
209
+ <input class="fert-input" type="number" step="0.001" id="fert_kno3_gram"/>
210
+ </div>
211
+
212
+ <div class="fert-row">
213
+ <span class="fert-name">NH4NO3</span>
214
+ <input class="fert-input" type="number" step="0.001" id="fert_nh4no3_nh4"/>
215
+ <input class="fert-input" type="number" step="0.001" id="fert_nh4no3_no3"/>
216
+ <span class="fert-cell">-</span>
217
+ <span class="fert-cell">-</span>
218
+ <span class="fert-cell">-</span>
219
+ <span class="fert-cell">-</span>
220
+ <span class="fert-cell">-</span>
221
+ <input class="fert-input" type="number" step="0.001" id="fert_nh4no3_gram"/>
222
+ </div>
223
+
224
+ <div class="fert-row">
225
+ <span class="fert-name">MgSO4</span>
226
+ <span class="fert-cell">-</span>
227
+ <span class="fert-cell">-</span>
228
+ <span class="fert-cell">-</span>
229
+ <span class="fert-cell">-</span>
230
+ <input class="fert-input" type="number" step="0.001" id="fert_mgso4_mg"/>
231
+ <input class="fert-input" type="number" step="0.001" id="fert_mgso4_s"/>
232
+ <input class="fert-input" type="number" step="0.001" id="fert_mgso4_gram"/>
233
+ </div>
234
+
235
+ <div class="fert-row">
236
+ <span class="fert-name">KH2PO4</span>
237
+ <span class="fert-cell">-</span>
238
+ <span class="fert-cell">-</span>
239
+ <input class="fert-input" type="number" step="0.001" id="fert_kh2po4_p"/>
240
+ <input class="fert-input" type="number" step="0.001" id="fert_kh2po4_k"/>
241
+ <span class="fert-cell">-</span>
242
+ <span class="fert-cell">-</span>
243
+ <span class="fert-cell">-</span>
244
+ <input class="fert-input" type="number" step="0.001" id="fert_kh2po4_gram"/>
245
+ </div>
246
+
247
+ <div class="fert-row">
248
+ <span class="fert-name">K2SO4</span>
249
+ <span class="fert-cell">-</span>
250
+ <span class="fert-cell">-</span>
251
+ <span class="fert-cell">-</span>
252
+ <input class="fert-input" type="number" step="0.001" id="fert_k2so4_k"/>
253
+ <span class="fert-cell">-</span>
254
+ <span class="fert-cell">-</span>
255
+ <input class="fert-input" type="number" step="0.001" id="fert_k2so4_s"/>
256
+ <input class="fert-input" type="number" step="0.001" id="fert_k2so4_gram"/>
257
+ </div>
258
  </div>
259
  </fieldset>
 
260
  </body>
261
  </html>