Update nutri_call.html

nutri_call.html

@@ -148,7 +148,8 @@ legend {
 }
 
 
-/* Стили для блока NPK */
+/* Стили для блока NPK (Ca-Mg-S)*/
+/* Общие стили для всех блоков */
 .npk-block {
     display: flex;
     flex-direction: column;
@@ -158,7 +159,7 @@ legend {
     background-color: #eaffea;
     border: 1px solid #2e8b57;
     border-radius: 8px;
-    width: 250px;
+    width: 280px; /* Увеличиваем ширину */
     margin-left: 18px; /* Сдвигаем блок */
 }
 
@@ -178,7 +179,7 @@ legend {
 
 .npk-label {
     font-weight: bold;
-    min-width: 20px;
+    min-width: 40px; /* Увеличиваем минимальную ширину меток */
     text-align: right;
 }
 
@@ -186,6 +187,16 @@ legend {
     font-size: 0.9em;
 }
 
+/* Уникальные стили для первого блока (NPK) */
+.npk-block-npk {
+    margin-top: 10px; /* Отступ сверху */
+}
+
+/* Уникальные стили для второго блока (Ca-Mg-S) */
+.npk-block-camgs {
+    margin-top: 20px; /* Более крупный отступ сверху */
+    margin-left: 30px; /* Сдвигаем правее */
+}
 
 
 
@@ -427,40 +438,40 @@ legend {
                 </div>
             </div>
 
-<!-- Блок NPK -->
-<!-- Блок NPK -->
-            <div class="npk-block">
-                <div class="npk-header">N-P-K</div>
-                <div class="npk-row">
-                    <span class="npk-label">N:</span>
-                    <span id="npk-n-value">0</span>
-                </div>
-                <div class="npk-row">
-                    <span class="npk-label">P:</span>
-                    <span id="npk-p-value">0</span>
-                </div>
-                <div class="npk-row">
-                    <span class="npk-label">K:</span>
-                    <span id="npk-k-value">0</span>
-                
-            </div>
-            </div>
-            <div class="npk-block">
-                <div class="npk-header">Ca-Ma-S</div>
-                <div class="npk-row">
-                    <span class="npk-label">CaO:</span>
-                    <span id="caMaS-ca-value">0</span>
-                </div>
-                <div class="npk-row">
-                    <span class="npk-label">MgO:</span>
-                    <span id="caMaS-mg-value">0</span>
-                </div>
-                <div class="npk-row">
-                    <span class="npk-label">SO:</span>
-                    <span id="caMaS-so-value">0</span>
-                
-            </div>
-            </div>
+
+<!-- Первый блок NPK -->
+<div class="npk-block npk-block-npk">
+    <div class="npk-header">N-P-K</div>
+    <div class="npk-row">
+        <span class="npk-label">N:</span>
+        <span id="npk-n-value">0</span>
+    </div>
+    <div class="npk-row">
+        <span class="npk-label">P:</span>
+        <span id="npk-p-value">0</span>
+    </div>
+    <div class="npk-row">
+        <span class="npk-label">K:</span>
+        <span id="npk-k-value">0</span>
+    </div>
+</div>
+
+<!-- Второй блок Ca-Mg-S -->
+<div class="npk-block npk-block-camgs">
+    <div class="npk-header">Ca-Mg-S</div>
+    <div class="npk-row">
+        <span class="npk-label">CaO:</span>
+        <span id="caMaS-ca-value">0</span>
+    </div>
+    <div class="npk-row">
+        <span class="npk-label">MgO:</span>
+        <span id="caMaS-mg-value">0</span>
+    </div>
+    <div class="npk-row">
+        <span class="npk-label">SO:</span>
+        <span id="caMaS-so-value">0</span>
+    </div>
+</div>
         </div>
     </div>
 </fieldset>