Spaces:
Sleeping
Sleeping
Update nutri_call.html
Browse files- nutri_call.html +1 -410
nutri_call.html
CHANGED
@@ -389,416 +389,7 @@ legend {
|
|
389 |
</div>
|
390 |
</div>
|
391 |
</div>
|
392 |
-
</fieldset
|
393 |
-
Вот исправленный код с учетом всех замечаний:
|
394 |
-
|
395 |
-
html
|
396 |
-
<style>
|
397 |
-
/* Общие стили для всех рамок */
|
398 |
-
fieldset, .calculation-box {
|
399 |
-
border: 2px solid #2e8b57;
|
400 |
-
background-color: #eaffea;
|
401 |
-
padding: 1em;
|
402 |
-
margin-bottom: 20px;
|
403 |
-
border-radius: 8px;
|
404 |
-
width: 1000px;
|
405 |
-
box-sizing: border-box;
|
406 |
-
}
|
407 |
-
|
408 |
-
/* Стили для заголовка */
|
409 |
-
h1 {
|
410 |
-
background-color: #2e8b57;
|
411 |
-
color: white;
|
412 |
-
text-align: center;
|
413 |
-
padding: 1em;
|
414 |
-
border-radius: 10px;
|
415 |
-
margin: 0 auto 20px;
|
416 |
-
width: 1000px;
|
417 |
-
box-sizing: border-box;
|
418 |
-
}
|
419 |
-
|
420 |
-
legend {
|
421 |
-
font-weight: bold;
|
422 |
-
color: #2e8b57;
|
423 |
-
padding: 0 10px;
|
424 |
-
}
|
425 |
-
|
426 |
-
/* Стили для основного контейнера профиля */
|
427 |
-
.main-container {
|
428 |
-
display: grid;
|
429 |
-
grid-template-columns: 120px repeat(8, 110px);
|
430 |
-
gap: 15px;
|
431 |
-
padding: 10px;
|
432 |
-
}
|
433 |
-
|
434 |
-
.profile-container {
|
435 |
-
display: contents;
|
436 |
-
}
|
437 |
-
|
438 |
-
.profile-element {
|
439 |
-
display: flex;
|
440 |
-
flex-direction: column;
|
441 |
-
align-items: center;
|
442 |
-
gap: 8px;
|
443 |
-
}
|
444 |
-
|
445 |
-
.profile-label {
|
446 |
-
font-weight: bold;
|
447 |
-
}
|
448 |
-
|
449 |
-
.profile-element input {
|
450 |
-
width: 100%;
|
451 |
-
padding: 8px;
|
452 |
-
border: 1px solid #ccc;
|
453 |
-
border-radius: 4px;
|
454 |
-
text-align: center;
|
455 |
-
}
|
456 |
-
|
457 |
-
/* Стили для азотных элементов */
|
458 |
-
.nitrogen-container {
|
459 |
-
grid-column: 1 / -1;
|
460 |
-
display: flex;
|
461 |
-
gap: 30px;
|
462 |
-
padding-left: 120px;
|
463 |
-
margin-top: 15px;
|
464 |
-
}
|
465 |
-
|
466 |
-
.nitrogen-group {
|
467 |
-
display: flex;
|
468 |
-
align-items: center;
|
469 |
-
gap: 10px;
|
470 |
-
}
|
471 |
-
|
472 |
-
.nitrogen-group label {
|
473 |
-
font-weight: bold;
|
474 |
-
}
|
475 |
-
|
476 |
-
.nitrogen-group input {
|
477 |
-
width: 80px;
|
478 |
-
padding: 8px;
|
479 |
-
border: 1px solid #ccc;
|
480 |
-
border-radius: 4px;
|
481 |
-
}
|
482 |
-
|
483 |
-
/* Стили для таблицы удобрений */
|
484 |
-
.fertilisers-container {
|
485 |
-
display: flex;
|
486 |
-
flex-direction: column;
|
487 |
-
gap: 10px;
|
488 |
-
}
|
489 |
-
|
490 |
-
.fert-row {
|
491 |
-
display: flex;
|
492 |
-
align-items: center;
|
493 |
-
gap: 10px;
|
494 |
-
}
|
495 |
-
|
496 |
-
.fert-header {
|
497 |
-
font-weight: bold;
|
498 |
-
text-align: center;
|
499 |
-
width: 110px;
|
500 |
-
padding: 5px;
|
501 |
-
}
|
502 |
-
|
503 |
-
.fert-name {
|
504 |
-
font-weight: bold;
|
505 |
-
width: 120px;
|
506 |
-
text-align: left;
|
507 |
-
}
|
508 |
-
|
509 |
-
.fert-cell {
|
510 |
-
text-align: center;
|
511 |
-
width: 110px;
|
512 |
-
padding: 5px;
|
513 |
-
}
|
514 |
-
|
515 |
-
.fert-input {
|
516 |
-
width: 100px;
|
517 |
-
padding: 8px;
|
518 |
-
border: 1px solid #ccc;
|
519 |
-
border-radius: 4px;
|
520 |
-
text-align: center;
|
521 |
-
}
|
522 |
-
|
523 |
-
/* Стили для блока расчета */
|
524 |
-
.calculation-container {
|
525 |
-
display: flex;
|
526 |
-
gap: 50px;
|
527 |
-
align-items: flex-start;
|
528 |
-
}
|
529 |
-
|
530 |
-
.compensation-section {
|
531 |
-
display: flex;
|
532 |
-
flex-direction: column;
|
533 |
-
gap: 15px;
|
534 |
-
}
|
535 |
-
|
536 |
-
.enhancement-title {
|
537 |
-
font-weight: bold;
|
538 |
-
color: #2e8b57;
|
539 |
-
font-size: 1.1em;
|
540 |
-
}
|
541 |
-
|
542 |
-
.compensation-weights {
|
543 |
-
display: flex;
|
544 |
-
flex-direction: column;
|
545 |
-
gap: 12px;
|
546 |
-
}
|
547 |
-
|
548 |
-
.weight-input-group {
|
549 |
-
display: flex;
|
550 |
-
align-items: center;
|
551 |
-
gap: 15px;
|
552 |
-
}
|
553 |
-
|
554 |
-
.weight-input-group label {
|
555 |
-
width: 100px;
|
556 |
-
text-align: right;
|
557 |
-
font-weight: bold;
|
558 |
-
}
|
559 |
-
|
560 |
-
.weight-input-group input {
|
561 |
-
width: 100px;
|
562 |
-
padding: 8px;
|
563 |
-
border: 1px solid #ccc;
|
564 |
-
border-radius: 4px;
|
565 |
-
}
|
566 |
-
|
567 |
-
.input-column {
|
568 |
-
display: flex;
|
569 |
-
flex-direction: column;
|
570 |
-
gap: 15px;
|
571 |
-
margin-top: 10px;
|
572 |
-
}
|
573 |
-
|
574 |
-
#calculate-btn {
|
575 |
-
background-color: #2e8b57;
|
576 |
-
color: white;
|
577 |
-
border: none;
|
578 |
-
padding: 10px 20px;
|
579 |
-
font-size: 16px;
|
580 |
-
border-radius: 5px;
|
581 |
-
cursor: pointer;
|
582 |
-
transition: background-color 0.3s;
|
583 |
-
font-weight: bold;
|
584 |
-
}
|
585 |
-
|
586 |
-
#calculate-btn:hover {
|
587 |
-
background-color: #3cb371;
|
588 |
-
}
|
589 |
-
|
590 |
-
.input-group {
|
591 |
-
display: flex;
|
592 |
-
align-items: center;
|
593 |
-
gap: 15px;
|
594 |
-
}
|
595 |
-
|
596 |
-
.input-group label {
|
597 |
-
width: 100px;
|
598 |
-
text-align: right;
|
599 |
-
font-weight: bold;
|
600 |
-
}
|
601 |
-
|
602 |
-
.input-group input {
|
603 |
-
width: 100px;
|
604 |
-
padding: 8px;
|
605 |
-
border: 1px solid #ccc;
|
606 |
-
border-radius: 4px;
|
607 |
-
}
|
608 |
-
|
609 |
-
/* Общие стили страницы */
|
610 |
-
body {
|
611 |
-
margin: 0 auto;
|
612 |
-
width: 1000px;
|
613 |
-
padding: 1em;
|
614 |
-
background-color: #f0f0f0;
|
615 |
-
font-family: Arial, sans-serif;
|
616 |
-
display: flex;
|
617 |
-
flex-direction: column;
|
618 |
-
align-items: center;
|
619 |
-
}
|
620 |
-
</style>
|
621 |
-
|
622 |
-
<body>
|
623 |
-
<h1>Калькулятор удобрений</h1>
|
624 |
-
|
625 |
-
<fieldset>
|
626 |
-
<legend>Макропрофиль в мг/л (ppm)</legend>
|
627 |
-
<div class="main-container">
|
628 |
-
<!-- Основные элементы -->
|
629 |
-
<div class="profile-container">
|
630 |
-
<div class="profile-element" style="grid-column: 2">
|
631 |
-
<span class="profile-label">N</span>
|
632 |
-
<input id="profile_n" type="number" value="125.000" step="0.001"/>
|
633 |
-
</div>
|
634 |
-
<div class="profile-element" style="grid-column: 3">
|
635 |
-
<span class="profile-label">P</span>
|
636 |
-
<input id="profile_p" type="number" value="31.000" step="0.001"/>
|
637 |
-
</div>
|
638 |
-
<div class="profile-element" style="grid-column: 4">
|
639 |
-
<span class="profile-label">K</span>
|
640 |
-
<input id="profile_k" type="number" value="210.000" step="0.001"/>
|
641 |
-
</div>
|
642 |
-
<div class="profile-element" style="grid-column: 5">
|
643 |
-
<span class="profile-label">Ca</span>
|
644 |
-
<input id="profile_ca" type="number" value="84.000" step="0.001"/>
|
645 |
-
</div>
|
646 |
-
<div class="profile-element" style="grid-column: 6">
|
647 |
-
<span class="profile-label">Mg</span>
|
648 |
-
<input id="profile_mg" type="number" value="24.000" step="0.001"/>
|
649 |
-
</div>
|
650 |
-
<div class="profile-element" style="grid-column: 7">
|
651 |
-
<span class="profile-label">S</span>
|
652 |
-
<input id="profile_s" type="number" value="56.439" step="0.001"/>
|
653 |
-
</div>
|
654 |
-
<div class="profile-element" style="grid-column: 8">
|
655 |
-
<span class="profile-label">EC</span>
|
656 |
-
<input id="profile_ec" type="number" value="0.0" step="0.001"/>
|
657 |
-
</div>
|
658 |
-
</div>
|
659 |
-
|
660 |
-
<!-- Азотные элементы -->
|
661 |
-
<div class="nitrogen-container">
|
662 |
-
<div class="nitrogen-group">
|
663 |
-
<label for="profile_nh4">NH4:</label>
|
664 |
-
<input id="profile_nh4" type="number" value="1.0" step="1.0" readonly style="background-color: #f0f0f0; color: #666;">
|
665 |
-
</div>
|
666 |
-
<div class="nitrogen-group">
|
667 |
-
<label for="profile_no3">NO3:</label>
|
668 |
-
<input id="profile_no3" type="number" value="10.0" step="0.01" min="5" max="10.001"/>
|
669 |
-
</div>
|
670 |
-
</div>
|
671 |
-
</div>
|
672 |
-
</fieldset>
|
673 |
-
|
674 |
-
<fieldset>
|
675 |
-
<legend>Составы солей</legend>
|
676 |
-
<div class="fertilisers-container">
|
677 |
-
<!-- Заголовки -->
|
678 |
-
<div class="fert-row">
|
679 |
-
<span class="fert-name">Удобрение</span>
|
680 |
-
<span class="fert-header">NH4</span>
|
681 |
-
<span class="fert-header">NO3</span>
|
682 |
-
<span class="fert-header">P</span>
|
683 |
-
<span class="fert-header">K</span>
|
684 |
-
<span class="fert-header">Ca</span>
|
685 |
-
<span class="fert-header">Mg</span>
|
686 |
-
<span class="fert-header">S</span>
|
687 |
-
<span class="fert-header">Грамм</span>
|
688 |
-
</div>
|
689 |
-
|
690 |
-
<!-- Строки с удобрениями -->
|
691 |
-
<div class="fert-row">
|
692 |
-
<span class="fert-name">CaN2O6</span>
|
693 |
-
<span class="fert-cell">-</span>
|
694 |
-
<input class="fert-input" type="number" value="11.863" step="0.001" id="fert_ca_no3"/>
|
695 |
-
<span class="fert-cell">-</span>
|
696 |
-
<span class="fert-cell">-</span>
|
697 |
-
<input class="fert-input" type="number" value="16.972" step="0.001" id="fert_ca_ca"/>
|
698 |
-
<span class="fert-cell">-</span>
|
699 |
-
<span class="fert-cell">-</span>
|
700 |
-
<input class="fert-input" type="number" step="0.001" id="calcium_nitrate"/>
|
701 |
-
</div>
|
702 |
-
|
703 |
-
<div class="fert-row">
|
704 |
-
<span class="fert-name">KNO3</span>
|
705 |
-
<span class="fert-cell">-</span>
|
706 |
-
<input class="fert-input" type="number" value="13.854" step="0.001" id="fert_kno3_no3"/>
|
707 |
-
<span class="fert-cell">-</span>
|
708 |
-
<input class="fert-input" type="number" value="36.672" step="0.001" id="fert_kno3_k"/>
|
709 |
-
<span class="fert-cell">-</span>
|
710 |
-
<span class="fert-cell">-</span>
|
711 |
-
<span class="fert-cell">-</span>
|
712 |
-
<input class="fert-input" type="number" step="0.001" id="potassium_nitrate"/>
|
713 |
-
</div>
|
714 |
-
|
715 |
-
<div class="fert-row">
|
716 |
-
<span class="fert-name">NH4NO3</span>
|
717 |
-
<input class="fert-input" type="number" value="17.499" step="0.001" id="fert_nh4no3_nh4"/>
|
718 |
-
<input class="fert-input" type="number" value="17.499" step="0.001" id="fert_nh4no3_no3"/>
|
719 |
-
<span class="fert-cell">-</span>
|
720 |
-
<span class="fert-cell">-</span>
|
721 |
-
<span class="fert-cell">-</span>
|
722 |
-
<span class="fert-cell">-</span>
|
723 |
-
<span class="fert-cell">-</span>
|
724 |
-
<input class="fert-input" type="number" step="0.001" id="ammonium_nitrate"/>
|
725 |
-
</div>
|
726 |
-
|
727 |
-
<div class="fert-row">
|
728 |
-
<span class="fert-name">MgSO4</span>
|
729 |
-
<span class="fert-cell">-</span>
|
730 |
-
<span class="fert-cell">-</span>
|
731 |
-
<span class="fert-cell">-</span>
|
732 |
-
<span class="fert-cell">-</span>
|
733 |
-
<span class="fert-cell">-</span>
|
734 |
-
<input class="fert-input" type="number" value="10.22" step="0.001" id="fert_mgso4_mg"/>
|
735 |
-
<input class="fert-input" type="number" value="13.483" step="0.001" id="fert_mgso4_s"/>
|
736 |
-
<input class="fert-input" type="number" step="0.001" id="magnesium_sulfate"/>
|
737 |
-
</div>
|
738 |
-
|
739 |
-
<div class="fert-row">
|
740 |
-
<span class="fert-name">KH2PO4</span>
|
741 |
-
<span class="fert-cell">-</span>
|
742 |
-
<span class="fert-cell">-</span>
|
743 |
-
<input class="fert-input" type="number" value="22.761" step="0.001" id="fert_kh2po4_p"/>
|
744 |
-
<input class="fert-input" type="number" value="28.731" step="0.001" id="fert_kh2po4_k"/>
|
745 |
-
<span class="fert-cell">-</span>
|
746 |
-
<span class="fert-cell">-</span>
|
747 |
-
<span class="fert-cell">-</span>
|
748 |
-
<input class="fert-input" type="number" step="0.001" id="monopotassium_phosphate"/>
|
749 |
-
</div>
|
750 |
-
|
751 |
-
<div class="fert-row">
|
752 |
-
<span class="fert-name">K2SO4</span>
|
753 |
-
<span class="fert-cell">-</span>
|
754 |
-
<span class="fert-cell">-</span>
|
755 |
-
<span class="fert-cell">-</span>
|
756 |
-
<input class="fert-input" type="number" value="44.874" step="0.001" id="fert_k2so4_k"/>
|
757 |
-
<span class="fert-cell">-</span>
|
758 |
-
<span class="fert-cell">-</span>
|
759 |
-
<input class="fert-input" type="number" value="18.401" step="0.001" id="fert_k2so4_s"/>
|
760 |
-
<input class="fert-input" type="number"" value="0.0000000" step="0.001" id="potassium_sulfate"/>
|
761 |
-
</div>
|
762 |
-
</div>
|
763 |
-
</fieldset>
|
764 |
-
|
765 |
-
<fieldset class="calculation-box">
|
766 |
-
<legend>Расчёт удобрений</legend>
|
767 |
-
<div class="calculation-container">
|
768 |
-
<!-- Блок с заголовком "Усиление" -->
|
769 |
-
<div class="compensation-section">
|
770 |
-
<div class="enhancement-title">Усиление:</div>
|
771 |
-
|
772 |
-
<!-- Веса компенсации -->
|
773 |
-
<div class="compensation-weights">
|
774 |
-
<div class="weight-input-group">
|
775 |
-
<label for="weight-k2so4">K₂SO₄:</label>
|
776 |
-
<input type="number" id="weight-k2so4" value="0.23" step="0.01" min="-1" max="1">
|
777 |
-
</div>
|
778 |
-
<div class="weight-input-group">
|
779 |
-
<label for="weight-mgso4">MgSO₄:</label>
|
780 |
-
<input type="number" id="weight-mgso4" value="-0.10" step="0.01" min="-1" max="1">
|
781 |
-
</div>
|
782 |
-
<div class="weight-input-group">
|
783 |
-
<label for="weight-kh2po4">KH₂PO₄:</label>
|
784 |
-
<input type="number" id="weight-kh2po4" value="0.14" step="0.01" min="-1" max="1">
|
785 |
-
</div>
|
786 |
-
</div>
|
787 |
-
</div>
|
788 |
-
|
789 |
-
<div class="input-column">
|
790 |
-
<button id="calculate-btn">Рассчитать</button>
|
791 |
-
<div class="input-group">
|
792 |
-
<label for="liters-input">Литры:</label>
|
793 |
-
<input type="number" id="liters-input" value="100" min="1" step="1">
|
794 |
-
</div>
|
795 |
-
<div class="input-group">
|
796 |
-
<label for="rounding-precision">Точность:</label>
|
797 |
-
<input type="number" id="rounding-precision" value="3" min="0" max="3" step="1">
|
798 |
-
</div>
|
799 |
-
</div>
|
800 |
-
</div>
|
801 |
-
</fieldset>
|
802 |
|
803 |
|
804 |
<script>
|
|
|
389 |
</div>
|
390 |
</div>
|
391 |
</div>
|
392 |
+
</fieldset>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
393 |
|
394 |
|
395 |
<script>
|