DmitrMakeev commited on
Commit
1bff278
·
verified ·
1 Parent(s): 8232114

Update nutri_call.html

Browse files
Files changed (1) hide show
  1. 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>