iguazio.dashboard-controls 0.37.12-patch1 → 0.37.12-patch2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3628,6 +3628,149 @@ ncl-functions {
3628
3628
  }
3629
3629
  }
3630
3630
 
3631
+ /**
3632
+ UI.Layout CSS
3633
+ *************************************/
3634
+ .stretch {
3635
+ position: absolute;
3636
+ top: 0;
3637
+ left: 0;
3638
+ right: 0;
3639
+ bottom: 0;
3640
+ /* Can be changed by hand ;)*/
3641
+ overflow: auto;
3642
+ }
3643
+
3644
+ .animate-row, .animate-column {
3645
+ -webkit-transition: all .2s cubic-bezier(0, 0, 0.2, 1);
3646
+ -moz-transition: all .2s cubic-bezier(0, 0, 0.2, 1);
3647
+ -ms-transition: all .2s cubic-bezier(0, 0, 0.2, 1);
3648
+ -o-transition: all .2s cubic-bezier(0, 0, 0.2, 1);
3649
+ transition: all .2s cubic-bezier(0, 0, 0.2, 1);
3650
+ }
3651
+
3652
+ .ui-splitbar {
3653
+ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
3654
+ display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
3655
+ display: -ms-flexbox; /* TWEENER - IE 10 */
3656
+ display: -webkit-flex; /* NEW - Chrome */
3657
+ display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
3658
+ -webkit-justify-content: center;
3659
+ justify-content: center;
3660
+
3661
+ background-color: #ffffff;
3662
+ right: auto;
3663
+ position: absolute;
3664
+ z-index: 1;
3665
+ }
3666
+
3667
+ .ui-layout-row > .ui-splitbar {
3668
+ height: 8px;
3669
+ width: 100%;
3670
+ cursor: row-resize;
3671
+ text-align: center;
3672
+ justify-content: center;
3673
+ align-items: center;
3674
+ background: linear-gradient(to bottom, #fff 0%, #eee 100%);
3675
+ overflow-y: hidden;
3676
+ }
3677
+
3678
+ .ui-layout-column > .ui-splitbar {
3679
+ width: 8px;
3680
+ height: 100%;
3681
+ cursor: col-resize;
3682
+ -webkit-flex-direction: column;
3683
+ flex-direction: column;
3684
+ background: linear-gradient(to right, #fff 0%, #eee 100%);
3685
+ overflow-x: hidden;
3686
+ }
3687
+
3688
+ .ui-layout-column > .ui-splitbar > a,
3689
+ .ui-layout-row > .ui-splitbar > a {
3690
+ cursor: pointer;
3691
+ text-align: center;
3692
+ font-size: 16px;
3693
+ color: #aaa;
3694
+ }
3695
+
3696
+ .ui-layout-column > .ui-splitbar > a:nth-child(2) {
3697
+ margin-top: 0.35rem;
3698
+ }
3699
+
3700
+ .ui-layout-row > .ui-splitbar > a:nth-child(2) {
3701
+ margin-left: 0.35rem;
3702
+ }
3703
+
3704
+
3705
+ /**
3706
+ * Icons
3707
+ **/
3708
+
3709
+ .ui-splitbar-icon {
3710
+ width: 0;
3711
+ height: 0;
3712
+ display: inline-block;
3713
+ }
3714
+
3715
+ .ui-splitbar-icon-up {
3716
+ border-left: 0.45em solid transparent;
3717
+ border-right: 0.45em solid transparent;
3718
+ border-bottom: 0.45em solid;
3719
+ }
3720
+
3721
+ .ui-splitbar-icon-down {
3722
+ border-left: 0.45em solid transparent;
3723
+ border-right: 0.45em solid transparent;
3724
+ border-top: 0.45em solid;
3725
+ margin-right: 0.45em;
3726
+ }
3727
+
3728
+ .ui-splitbar-icon-right {
3729
+ border-top: 0.45em solid transparent;
3730
+ border-bottom: 0.45em solid transparent;
3731
+ border-left: 0.45em solid;
3732
+
3733
+ }
3734
+
3735
+ .ui-splitbar-icon-left {
3736
+ border-top: 0.45em solid transparent;
3737
+ border-bottom: 0.45em solid transparent;
3738
+ border-right: 0.45em solid;
3739
+ margin-top: 0.45em;
3740
+ }
3741
+
3742
+ /* Allow disabling of icons */
3743
+ .no-toggle .ui-splitbar-icon {
3744
+ display: none;
3745
+ }
3746
+
3747
+ @media only screen and (max-device-width: 480px) {
3748
+ .no-mobile-toggle .ui-splitbar-icon {
3749
+ display: none;
3750
+ }
3751
+ }
3752
+
3753
+ @media print {
3754
+ .ui-splitbar {
3755
+ display: none;
3756
+ }
3757
+
3758
+ .stretch {
3759
+ position: relative;
3760
+ }
3761
+
3762
+ /* The last item can take up any amount of space. */
3763
+ .stretch.ui-layout-container:last-child {
3764
+ position: static;
3765
+ overflow: visible;
3766
+ }
3767
+ }
3768
+
3769
+ /* Make sure hidden elements are in fact not rendered. */
3770
+ .ui-layout-hidden {
3771
+ display: none;
3772
+ }
3773
+
3631
3774
  /*
3632
3775
  == malihu jquery custom scrollbar plugin ==
3633
3776
  Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller
@@ -5350,191 +5493,65 @@ yx-axis
5350
5493
 
5351
5494
  /* ---------------------------------------- */
5352
5495
 
5353
- /**
5354
- UI.Layout CSS
5355
- *************************************/
5356
- .stretch {
5357
- position: absolute;
5358
- top: 0;
5359
- left: 0;
5360
- right: 0;
5361
- bottom: 0;
5362
- /* Can be changed by hand ;)*/
5363
- overflow: auto;
5364
- }
5496
+ .action-checkbox {
5497
+ .action-checkbox-color-set();
5365
5498
 
5366
- .animate-row, .animate-column {
5367
- -webkit-transition: all .2s cubic-bezier(0, 0, 0.2, 1);
5368
- -moz-transition: all .2s cubic-bezier(0, 0, 0.2, 1);
5369
- -ms-transition: all .2s cubic-bezier(0, 0, 0.2, 1);
5370
- -o-transition: all .2s cubic-bezier(0, 0, 0.2, 1);
5371
- transition: all .2s cubic-bezier(0, 0, 0.2, 1);
5372
- }
5499
+ line-height: 16px;
5500
+ text-align: center;
5373
5501
 
5374
- .ui-splitbar {
5375
- display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
5376
- display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
5377
- display: -ms-flexbox; /* TWEENER - IE 10 */
5378
- display: -webkit-flex; /* NEW - Chrome */
5379
- display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
5380
- -webkit-justify-content: center;
5381
- justify-content: center;
5502
+ .check-item {
5503
+ font-size: 16px;
5504
+ cursor: pointer;
5505
+ line-height: 1;
5506
+ vertical-align: middle;
5382
5507
 
5383
- background-color: #ffffff;
5384
- right: auto;
5385
- position: absolute;
5386
- z-index: 1;
5387
- }
5508
+ &.igz-icon-checkbox-unchecked {
5509
+ color: @icon-checkbox-unchecked;
5510
+ }
5388
5511
 
5389
- .ui-layout-row > .ui-splitbar {
5390
- height: 8px;
5391
- width: 100%;
5392
- cursor: row-resize;
5393
- text-align: center;
5394
- justify-content: center;
5395
- align-items: center;
5396
- background: linear-gradient(to bottom, #fff 0%, #eee 100%);
5397
- overflow-y: hidden;
5512
+ &.igz-icon-checkbox-checked {
5513
+ color: @icon-checkbox-checked;
5514
+ }
5515
+ }
5398
5516
  }
5517
+ .action-checkbox-all {
5518
+ .action-checkbox-all-color-set();
5399
5519
 
5400
- .ui-layout-column > .ui-splitbar {
5401
- width: 8px;
5402
- height: 100%;
5403
- cursor: col-resize;
5404
- -webkit-flex-direction: column;
5405
- flex-direction: column;
5406
- background: linear-gradient(to right, #fff 0%, #eee 100%);
5407
- overflow-x: hidden;
5408
- }
5520
+ text-align: center;
5409
5521
 
5410
- .ui-layout-column > .ui-splitbar > a,
5411
- .ui-layout-row > .ui-splitbar > a {
5412
- cursor: pointer;
5413
- text-align: center;
5414
- font-size: 16px;
5415
- color: #aaa;
5416
- }
5522
+ .check-item {
5523
+ cursor: pointer;
5524
+ color: @check-item-color;
5525
+ font-size: 16px;
5526
+ line-height: 1;
5527
+ vertical-align: middle;
5417
5528
 
5418
- .ui-layout-column > .ui-splitbar > a:nth-child(2) {
5419
- margin-top: 0.35rem;
5529
+ &.igz-icon-checkbox-checked {
5530
+ color: @check-item-icon-checkbox-checked-color;
5531
+ }
5532
+ }
5420
5533
  }
5534
+ .igz-action-menu {
5535
+ .action-menu-color-set();
5536
+ .action-icon-color-set();
5421
5537
 
5422
- .ui-layout-row > .ui-splitbar > a:nth-child(2) {
5423
- margin-left: 0.35rem;
5424
- }
5538
+ opacity: 1;
5539
+ position: relative;
5425
5540
 
5541
+ .menu-button {
5542
+ color: @menu-btn-color;
5543
+ cursor: pointer;
5544
+ font-size: 18px;
5545
+ height: 19px;
5546
+ text-align: center;
5547
+ transition: @igz-basic-transition-color;
5548
+ width: 30px;
5426
5549
 
5427
- /**
5428
- * Icons
5429
- **/
5430
-
5431
- .ui-splitbar-icon {
5432
- width: 0;
5433
- height: 0;
5434
- display: inline-block;
5435
- }
5436
-
5437
- .ui-splitbar-icon-up {
5438
- border-left: 0.45em solid transparent;
5439
- border-right: 0.45em solid transparent;
5440
- border-bottom: 0.45em solid;
5441
- }
5442
-
5443
- .ui-splitbar-icon-down {
5444
- border-left: 0.45em solid transparent;
5445
- border-right: 0.45em solid transparent;
5446
- border-top: 0.45em solid;
5447
- margin-right: 0.45em;
5448
- }
5449
-
5450
- .ui-splitbar-icon-right {
5451
- border-top: 0.45em solid transparent;
5452
- border-bottom: 0.45em solid transparent;
5453
- border-left: 0.45em solid;
5454
-
5455
- }
5456
-
5457
- .ui-splitbar-icon-left {
5458
- border-top: 0.45em solid transparent;
5459
- border-bottom: 0.45em solid transparent;
5460
- border-right: 0.45em solid;
5461
- margin-top: 0.45em;
5462
- }
5463
-
5464
- /* Allow disabling of icons */
5465
- .no-toggle .ui-splitbar-icon {
5466
- display: none;
5467
- }
5468
-
5469
- @media only screen and (max-device-width: 480px) {
5470
- .no-mobile-toggle .ui-splitbar-icon {
5471
- display: none;
5472
- }
5473
- }
5474
-
5475
- @media print {
5476
- .ui-splitbar {
5477
- display: none;
5478
- }
5479
-
5480
- .stretch {
5481
- position: relative;
5482
- }
5483
-
5484
- /* The last item can take up any amount of space. */
5485
- .stretch.ui-layout-container:last-child {
5486
- position: static;
5487
- overflow: visible;
5488
- }
5489
- }
5490
-
5491
- /* Make sure hidden elements are in fact not rendered. */
5492
- .ui-layout-hidden {
5493
- display: none;
5494
- }
5495
-
5496
- .action-checkbox {
5497
- .action-checkbox-color-set();
5498
-
5499
- line-height: 16px;
5500
- text-align: center;
5501
-
5502
- .check-item {
5503
- font-size: 16px;
5504
- cursor: pointer;
5505
- line-height: 1;
5506
- vertical-align: middle;
5507
-
5508
- &.igz-icon-checkbox-unchecked {
5509
- color: @icon-checkbox-unchecked;
5510
- }
5511
-
5512
- &.igz-icon-checkbox-checked {
5513
- color: @icon-checkbox-checked;
5514
- }
5515
- }
5516
- }
5517
- .igz-action-menu {
5518
- .action-menu-color-set();
5519
- .action-icon-color-set();
5520
-
5521
- opacity: 1;
5522
- position: relative;
5523
-
5524
- .menu-button {
5525
- color: @menu-btn-color;
5526
- cursor: pointer;
5527
- font-size: 18px;
5528
- height: 19px;
5529
- text-align: center;
5530
- transition: @igz-basic-transition-color;
5531
- width: 30px;
5532
-
5533
- &.active,
5534
- &:hover {
5535
- color: @menu-btn-active-hover-color;
5536
- }
5537
- }
5550
+ &.active,
5551
+ &:hover {
5552
+ color: @menu-btn-active-hover-color;
5553
+ }
5554
+ }
5538
5555
 
5539
5556
  .menu-dropdown {
5540
5557
  visibility: hidden;
@@ -5672,23 +5689,6 @@ yx-axis
5672
5689
  }
5673
5690
  }
5674
5691
 
5675
- .action-checkbox-all {
5676
- .action-checkbox-all-color-set();
5677
-
5678
- text-align: center;
5679
-
5680
- .check-item {
5681
- cursor: pointer;
5682
- color: @check-item-color;
5683
- font-size: 16px;
5684
- line-height: 1;
5685
- vertical-align: middle;
5686
-
5687
- &.igz-icon-checkbox-checked {
5688
- color: @check-item-icon-checkbox-checked-color;
5689
- }
5690
- }
5691
- }
5692
5692
  .igz-action-panel {
5693
5693
  .action-panel-color-set();
5694
5694
  .action-icon-color-set();
@@ -6855,232 +6855,79 @@ yx-axis
6855
6855
  }
6856
6856
  }
6857
6857
 
6858
- .igz-number-input {
6859
- .number-input-color-set();
6858
+ .igz-navigation-tabs {
6859
+ .navigation-tabs-color-set();
6860
6860
 
6861
- min-width: 115px;
6862
- font-family: @font-family-sans-serif;
6863
- font-size: 14px;
6864
- font-weight: 400;
6865
- height: 36px;
6866
- position: relative;
6867
- background-color: @number-input-bg-color;
6868
- border: @number-input-border;
6869
- border-radius: 2px;
6870
- color: @number-input-color;
6871
- display: flex;
6872
- justify-content: flex-start;
6873
- align-items: center;
6874
- padding: 0 10px 0 11px;
6875
- z-index: 3;
6861
+ background-color: @navigation-tabs-bg-color;
6862
+ height: 56px;
6863
+ padding-top: 7px;
6876
6864
 
6877
- &:not(.disabled) {
6878
- &:focus.ng-invalid:not(.ng-pristine), &.ng-invalid.ng-touched {
6879
- background-color: @number-input-not-disabled-focus-invalid-bg-color;
6880
- border: @number-input-not-disabled-focus-invalid-border;
6881
- box-shadow: none;
6882
- outline: none;
6883
- }
6865
+ .navigation-tab {
6866
+ float: left;
6867
+ height: 32px;
6868
+ padding: 15px 24px 0;
6869
+ font-family: @font-family-sans-serif;
6870
+ color: @navigation-tab-color;
6871
+ font-size: 14px;
6872
+ text-align: center;
6873
+ cursor: pointer;
6874
+ border-bottom: @navigation-tab-border-bottom;
6875
+ box-sizing: content-box;
6884
6876
 
6885
- &:focus-within, &.focused {
6886
- outline: 0;
6887
- border: @number-input-not-disabled-hover-focus-border;
6877
+ &.active, &.active:hover {
6878
+ background-color: @navigation-tab-active-hover-bg-color;
6879
+ color: @navigation-tab-active-hover-color;
6880
+ border-bottom: @navigation-tab-active-hover-border-bottom;
6888
6881
  }
6889
6882
 
6890
- &.invalid:not(.pristine), &.invalid.submitted {
6891
- background-color: @number-input-not-disabled-invalid-bg-color;
6892
- border: @number-input-not-disabled-invalid-border;
6893
- box-shadow: none;
6883
+ &:hover {
6884
+ background-color: @navigation-tab-hover-bg-color;
6894
6885
  }
6895
6886
 
6896
- &:focus.ng-valid, &:focus.ng-pristine {
6897
- border: @number-input-not-disabled-valid-border;
6898
- box-shadow: none;
6899
- outline: none;
6887
+ &.active {
6888
+ background-color: @navigation-tab-active-bg-color;
6900
6889
  }
6901
- }
6902
6890
 
6903
- &.additional-left-padding {
6904
- padding-left: 22px;
6905
- }
6906
-
6907
- .input-field {
6908
- border: none;
6909
- outline: 0;
6910
- padding: 0;
6911
- text-align: left;
6912
- background-color: @number-input-field-bg-color;
6891
+ @media screen and (max-width: 940px) {
6892
+ padding: 15px 12px 0;
6893
+ }
6913
6894
  }
6895
+ }
6914
6896
 
6915
- //
6916
- // placeholder
6917
- //
6897
+ .igz-pagination {
6898
+ .pagination-color-set();
6918
6899
 
6919
- ::-webkit-input-placeholder {
6920
- /* Chrome, Chromium, Edge, Safari, Opera*/
6921
- color: @number-input-placeholder-color;
6922
- }
6900
+ float: right;
6901
+ padding: 24px 36px 5px 30px;
6923
6902
 
6924
- :-moz-placeholder {
6925
- /* Firefox 4-18 */
6926
- color: @number-input-placeholder-color;
6903
+ > div {
6904
+ vertical-align: top;
6927
6905
  }
6928
6906
 
6929
- ::-moz-placeholder {
6930
- /* Firefox 19+ */
6931
- color: @number-input-placeholder-color;
6907
+ .rows-title, .per-page, .jump-to-page, .to-page-prev, .to-page-next {
6908
+ display: inline-block;
6909
+ vertical-align: baseline;
6932
6910
  }
6933
6911
 
6934
- :-ms-input-placeholder {
6935
- /* - Internet Explorer 10–11
6936
- - Internet Explorer Mobile 10-11 */
6937
- color: @number-input-placeholder-color !important;
6912
+ .rows-title {
6913
+ font-size: 13px;
6914
+ color: @rows-title-color;
6915
+ font-family: @font-family-sans-serif;
6938
6916
  }
6939
6917
 
6940
- ::placeholder {
6941
- /* modern browser versions */
6942
- color: @number-input-placeholder-color;
6943
- }
6918
+ .per-page {
6919
+ width: 66px;
6944
6920
 
6945
- .additional-left-block {
6946
- .prefix-unit {
6947
- color: @number-input-additional-left-block-prefix-unit-color;
6921
+ .default-dropdown-field {
6922
+ background: none;
6923
+ border: none;
6924
+ box-shadow: none;
6948
6925
  font-size: 14px;
6949
- font-weight: 700;
6950
- padding-right: 7px;
6951
- }
6952
- }
6926
+ height: 36px;
6953
6927
 
6954
- .suffix-unit-container {
6955
- display: flex;
6956
- align-items: center;
6957
-
6958
- .suffix-unit {
6959
- color: @number-input-suffix-unit-color;
6960
- font-size: 14px;
6961
- font-weight: 400;
6962
- padding-left: 3px;
6963
- }
6964
- }
6965
-
6966
- .arrow-block {
6967
- font-size: 11px;
6968
- display: flex;
6969
- flex-direction: column;
6970
- justify-content: center;
6971
- height: 100%;
6972
- margin-left: 6px;
6973
-
6974
- .igz-icon-dropup, .igz-icon-dropdown {
6975
- color: @number-input-arrow-block-icon-color;
6976
- cursor: pointer;
6977
- display: block;
6978
- line-height: 11px;
6979
- outline: 0;
6980
-
6981
- &:hover {
6982
- color: @number-input-arrow-block-icon-hover-color;
6983
- }
6984
- }
6985
- }
6986
-
6987
- &.disabled {
6988
- background-color: @number-input-disabled-bg-color;
6989
- opacity: 0.5;
6990
-
6991
- .suffix-unit {
6992
- opacity: 0.5;
6993
- }
6994
-
6995
- .igz-icon-dropup, .igz-icon-dropdown {
6996
- &, &:hover {
6997
- color: @number-input-disabled-icon-hover-color;
6998
- opacity: 0.5;
6999
- cursor: default;
7000
- }
7001
- }
7002
- }
7003
- }
7004
-
7005
- .step3, .step4 {
7006
- .additional-right-padding {
7007
- padding-right: 50px;
7008
- }
7009
- }
7010
-
7011
- .igz-navigation-tabs {
7012
- .navigation-tabs-color-set();
7013
-
7014
- background-color: @navigation-tabs-bg-color;
7015
- height: 56px;
7016
- padding-top: 7px;
7017
-
7018
- .navigation-tab {
7019
- float: left;
7020
- height: 32px;
7021
- padding: 15px 24px 0;
7022
- font-family: @font-family-sans-serif;
7023
- color: @navigation-tab-color;
7024
- font-size: 14px;
7025
- text-align: center;
7026
- cursor: pointer;
7027
- border-bottom: @navigation-tab-border-bottom;
7028
- box-sizing: content-box;
7029
-
7030
- &.active, &.active:hover {
7031
- background-color: @navigation-tab-active-hover-bg-color;
7032
- color: @navigation-tab-active-hover-color;
7033
- border-bottom: @navigation-tab-active-hover-border-bottom;
7034
- }
7035
-
7036
- &:hover {
7037
- background-color: @navigation-tab-hover-bg-color;
7038
- }
7039
-
7040
- &.active {
7041
- background-color: @navigation-tab-active-bg-color;
7042
- }
7043
-
7044
- @media screen and (max-width: 940px) {
7045
- padding: 15px 12px 0;
7046
- }
7047
- }
7048
- }
7049
-
7050
- .igz-pagination {
7051
- .pagination-color-set();
7052
-
7053
- float: right;
7054
- padding: 24px 36px 5px 30px;
7055
-
7056
- > div {
7057
- vertical-align: top;
7058
- }
7059
-
7060
- .rows-title, .per-page, .jump-to-page, .to-page-prev, .to-page-next {
7061
- display: inline-block;
7062
- vertical-align: baseline;
7063
- }
7064
-
7065
- .rows-title {
7066
- font-size: 13px;
7067
- color: @rows-title-color;
7068
- font-family: @font-family-sans-serif;
7069
- }
7070
-
7071
- .per-page {
7072
- width: 66px;
7073
-
7074
- .default-dropdown-field {
7075
- background: none;
7076
- border: none;
7077
- box-shadow: none;
7078
- font-size: 14px;
7079
- height: 36px;
7080
-
7081
- .dropdown-selected-item {
7082
- font-size: 14px;
7083
- }
6928
+ .dropdown-selected-item {
6929
+ font-size: 14px;
6930
+ }
7084
6931
 
7085
6932
  .dropdown-arrow {
7086
6933
  margin-top: 5px;
@@ -7195,296 +7042,77 @@ yx-axis
7195
7042
  }
7196
7043
  }
7197
7044
  }
7198
- .igz-slider-input-block {
7199
- .igz-slider-input-block-color-set();
7045
+ .search-input {
7046
+ .search-input-color-set();
7200
7047
 
7201
7048
  position: relative;
7049
+ color: @search-input-color;
7202
7050
 
7203
- .igz-slider-input-title {
7204
- float: left;
7205
- display: table;
7206
- min-height: 30px;
7207
- line-height: 1;
7208
- color: @slider-input-title-color;
7209
- font-size: 14px;
7051
+ .container-search-input {
7052
+ background-color: @search-input-bg-color;
7053
+ border: 0;
7054
+ font-family: @font-family-sans-serif;
7055
+ font-size: 15px;
7210
7056
  font-weight: 400;
7211
- text-align: left;
7212
- cursor: default;
7057
+ height: 52px;
7058
+ line-height: 52px;
7059
+ margin: 0;
7060
+ outline: 0;
7061
+ padding-right: 20px;
7062
+ width: 100%;
7213
7063
 
7214
- .igz-slider-input-title-text {
7215
- display: table-cell;
7216
- vertical-align: middle;
7064
+ &::-webkit-input-placeholder {
7065
+ color: @search-input-placeholder-color;
7217
7066
  }
7218
- }
7219
7067
 
7220
- // Custom styles for third-party library slider
7221
- .igz-slider-input-rz-slider {
7222
- float: left;
7223
- min-height: 16px;
7224
- line-height: 16px;
7068
+ &:-moz-placeholder { /* Firefox 18- */
7069
+ color: @search-input-placeholder-color;
7070
+ }
7225
7071
 
7226
- .rzslider {
7227
- margin: 0;
7228
- height: 8px;
7072
+ &::-moz-placeholder { /* Firefox 19+ */
7073
+ color: @search-input-placeholder-color;
7074
+ }
7229
7075
 
7230
- .rz-bar-wrapper {
7231
- height: auto;
7232
- margin: 0;
7233
- padding: 0;
7076
+ &:-ms-input-placeholder {
7077
+ color: @search-input-placeholder-color;
7078
+ }
7234
7079
 
7235
- .rz-bar {
7236
- background-color: @rz-bar-bg-color;
7237
- height: 3px;
7238
- }
7080
+ &:focus {
7081
+ &, & + .igz-icon-search:before {
7082
+ color: @search-input-focus-icon-search-before-color;
7239
7083
  }
7240
7084
 
7241
- .rz-bubble {
7242
- display: none;
7085
+ &::-webkit-input-placeholder {
7086
+ color: @search-input-focus-placeholder-color;
7243
7087
  }
7244
7088
 
7245
- .rz-pointer {
7246
- height: 14px;
7247
- width: 14px;
7248
- top: -6px;
7249
- box-shadow: @rz-pointer-box-shadow;
7250
- outline: 0;
7251
-
7252
- &:after {
7253
- display: none;
7254
- }
7089
+ &:-moz-placeholder { /* Firefox 18- */
7090
+ color: @search-input-focus-placeholder-color;
7255
7091
  }
7256
7092
 
7257
- &:not([disabled]) {
7258
- .rz-bar.rz-selection {
7259
- background-color: @rz-selection-bg-color;
7260
- }
7261
-
7262
- .rz-pointer {
7263
- background-color: @rz-pointer-bg-color;
7264
- }
7093
+ &::-moz-placeholder { /* Firefox 19+ */
7094
+ color: @search-input-focus-placeholder-color;
7265
7095
  }
7266
- }
7267
- }
7268
-
7269
- // Current value
7270
- .igz-slider-input-current-value {
7271
- float: left;
7272
- min-height: 30px;
7273
- line-height: 30px;
7274
7096
 
7275
- &.with-measure-units {
7276
- width: 18%;
7277
- padding-right: 0;
7278
-
7279
- .igz-slider-input-current-value-text {
7280
- margin-right: 4px;
7097
+ &:-ms-input-placeholder {
7098
+ color: @search-input-focus-placeholder-color;
7281
7099
  }
7282
- }
7283
-
7284
- &.with-value-unit {
7285
- padding-right: 21px;
7286
- }
7287
7100
 
7288
- .igz-slider-input-current-value-text {
7289
- color: @slider-input-current-value-text-color;
7290
- font-size: 13px;
7291
- font-weight: 400;
7292
- background-color: @slider-input-current-value-text-bg-color;
7293
- text-align: right;
7101
+ &::placeholder {
7102
+ /* modern browser versions */
7103
+ color: @search-input-focus-placeholder-color !important;
7104
+ }
7294
7105
  }
7295
7106
  }
7296
7107
 
7297
- .igz-slider-input-unit-label {
7108
+ .igz-icon-search {
7109
+ font-size: 16px;
7110
+ height: 16px;
7298
7111
  position: absolute;
7299
7112
  right: 0;
7300
- min-height: 30px;
7301
- line-height: 30px;
7302
- }
7303
-
7304
- // Units dropdown
7305
- .igz-slider-input-units-dropdown {
7306
- float: left;
7307
-
7308
- .default-dropdown {
7309
- height: 30px;
7310
-
7311
- .default-dropdown-field {
7312
- border: none;
7313
- background-color: @default-dropdown-field-bg-color;
7314
-
7315
- .dropdown-selected-item {
7316
- padding-left: 0;
7317
- }
7318
-
7319
- .dropdown-arrow {
7320
- margin-right: 0;
7321
- }
7322
- }
7323
- }
7324
- }
7325
- }
7326
-
7327
- .igz-size {
7328
- .size-color-set();
7329
-
7330
- align-items: center;
7331
- display: flex;
7332
- justify-content: space-between;
7333
-
7334
- &:after {
7335
- content: ' ';
7336
- display: inline-block;
7337
- vertical-align: middle;
7338
- }
7339
-
7340
- .size-value {
7341
- line-height: 1;
7342
- flex: 0 0 100px;
7343
- min-width: 100px;
7344
-
7345
- > span {
7346
- line-height: 25px;
7347
- }
7348
-
7349
- &.short {
7350
- flex: 0 0 75px;
7351
- min-width: 75px;
7352
- }
7353
-
7354
- &.shorten {
7355
- flex: 0 0 60px;
7356
- min-width: 60px;
7357
- }
7358
-
7359
- &.shortest {
7360
- flex: 0 0 40px;
7361
- min-width: 40px;
7362
- }
7363
- }
7364
-
7365
- .size-reserved {
7366
- color: @size-reserved-color;
7367
- font-size: 12px;
7368
-
7369
- .icon-font-arrow-right:before {
7370
- color: @size-reserved-arrow-right-before-color;
7371
- font-size: 10px;
7372
- padding: 0 4px 0 4px;
7373
- }
7374
-
7375
- .icon-font-infinity:before {
7376
- color: @size-reserved-infinity-before-color;
7377
- font-size: 10px;
7378
- }
7379
- }
7380
-
7381
- .size-chart {
7382
- flex: 1 1 auto;
7383
- min-width: 0;
7384
-
7385
- div.highcharts-tooltip {
7386
- position: fixed !important;
7387
-
7388
- .igz-tooltip-wrapper {
7389
- color: @size-chart-tooltip-wrapper-color;
7390
-
7391
- &.used-capacity-tooltip-wrapper {
7392
- .igz-row {
7393
- .tooltip-label,
7394
- .tooltip-value {
7395
- text-overflow: unset;
7396
- }
7397
- }
7398
- }
7399
-
7400
- .tooltip-header {
7401
- padding-bottom: 6px;
7402
- margin-bottom: 5px;
7403
- line-height: 1.1;
7404
- text-align: center;
7405
- }
7406
- }
7407
- }
7408
- }
7409
-
7410
- .igz-highcharts-wrapper {
7411
- height: 40px;
7412
- position: relative;
7413
- width: 100%;
7414
- }
7415
- }
7416
-
7417
- .search-input {
7418
- .search-input-color-set();
7419
-
7420
- position: relative;
7421
- color: @search-input-color;
7422
-
7423
- .container-search-input {
7424
- background-color: @search-input-bg-color;
7425
- border: 0;
7426
- font-family: @font-family-sans-serif;
7427
- font-size: 15px;
7428
- font-weight: 400;
7429
- height: 52px;
7430
- line-height: 52px;
7431
- margin: 0;
7432
- outline: 0;
7433
- padding-right: 20px;
7434
- width: 100%;
7435
-
7436
- &::-webkit-input-placeholder {
7437
- color: @search-input-placeholder-color;
7438
- }
7439
-
7440
- &:-moz-placeholder { /* Firefox 18- */
7441
- color: @search-input-placeholder-color;
7442
- }
7443
-
7444
- &::-moz-placeholder { /* Firefox 19+ */
7445
- color: @search-input-placeholder-color;
7446
- }
7447
-
7448
- &:-ms-input-placeholder {
7449
- color: @search-input-placeholder-color;
7450
- }
7451
-
7452
- &:focus {
7453
- &, & + .igz-icon-search:before {
7454
- color: @search-input-focus-icon-search-before-color;
7455
- }
7456
-
7457
- &::-webkit-input-placeholder {
7458
- color: @search-input-focus-placeholder-color;
7459
- }
7460
-
7461
- &:-moz-placeholder { /* Firefox 18- */
7462
- color: @search-input-focus-placeholder-color;
7463
- }
7464
-
7465
- &::-moz-placeholder { /* Firefox 19+ */
7466
- color: @search-input-focus-placeholder-color;
7467
- }
7468
-
7469
- &:-ms-input-placeholder {
7470
- color: @search-input-focus-placeholder-color;
7471
- }
7472
-
7473
- &::placeholder {
7474
- /* modern browser versions */
7475
- color: @search-input-focus-placeholder-color !important;
7476
- }
7477
- }
7478
- }
7479
-
7480
- .igz-icon-search {
7481
- font-size: 16px;
7482
- height: 16px;
7483
- position: absolute;
7484
- right: 0;
7485
- top: 17px;
7486
- width: 16px;
7487
- z-index: 1;
7113
+ top: 17px;
7114
+ width: 16px;
7115
+ z-index: 1;
7488
7116
  }
7489
7117
 
7490
7118
  .clear-button {
@@ -7601,57 +7229,429 @@ yx-axis
7601
7229
  }
7602
7230
  }
7603
7231
  }
7604
- .splash-screen {
7605
- .splash-screen-color-set();
7606
-
7607
- position: absolute;
7608
- z-index: 996;
7609
- width: 100%;
7610
- height: 100%;
7611
- background-color: @splash-screen-bg-color;
7612
- transform-style: preserve-3d;
7613
-
7614
- // ngAnimate appearance for show/hide
7615
- transition: opacity linear .25s 0s;
7232
+ .igz-number-input {
7233
+ .number-input-color-set();
7616
7234
 
7617
- &.ng-hide-remove {
7618
- opacity: 0;
7619
- }
7235
+ min-width: 115px;
7236
+ font-family: @font-family-sans-serif;
7237
+ font-size: 14px;
7238
+ font-weight: 400;
7239
+ height: 36px;
7240
+ position: relative;
7241
+ background-color: @number-input-bg-color;
7242
+ border: @number-input-border;
7243
+ border-radius: 2px;
7244
+ color: @number-input-color;
7245
+ display: flex;
7246
+ justify-content: flex-start;
7247
+ align-items: center;
7248
+ padding: 0 10px 0 11px;
7249
+ z-index: 3;
7620
7250
 
7621
- .loading-splash-screen {
7622
- position: absolute;
7623
- top: 50%;
7624
- left: 50%;
7625
- transform: translate(-50%, -50%);
7626
- color: @loading-splash-screen-color;
7627
- font-size: 20px;
7628
- text-align: center;
7629
- font-weight: 500;
7630
- width: 217px;
7631
- border-radius: 6px;
7632
- background-image: @loading-splash-screen-bg-image;
7633
- padding: 49px 0;
7251
+ &:not(.disabled) {
7252
+ &:focus.ng-invalid:not(.ng-pristine), &.ng-invalid.ng-touched {
7253
+ background-color: @number-input-not-disabled-focus-invalid-bg-color;
7254
+ border: @number-input-not-disabled-focus-invalid-border;
7255
+ box-shadow: none;
7256
+ outline: none;
7257
+ }
7634
7258
 
7635
- .splash-logo-wrapper {
7636
- position: relative;
7637
- text-align: center;
7259
+ &:focus-within, &.focused {
7260
+ outline: 0;
7261
+ border: @number-input-not-disabled-hover-focus-border;
7262
+ }
7638
7263
 
7639
- .loader-fading-circle {
7640
- width: 60px;
7641
- height: 60px;
7642
- }
7264
+ &.invalid:not(.pristine), &.invalid.submitted {
7265
+ background-color: @number-input-not-disabled-invalid-bg-color;
7266
+ border: @number-input-not-disabled-invalid-border;
7267
+ box-shadow: none;
7643
7268
  }
7644
7269
 
7645
- .loading-text {
7646
- padding: 31px 0 0 12px;
7647
- font-family: @font-family-sans-serif;
7648
- font-size: 20px;
7649
- color: @loading-splash-screen-text-color;
7270
+ &:focus.ng-valid, &:focus.ng-pristine {
7271
+ border: @number-input-not-disabled-valid-border;
7272
+ box-shadow: none;
7273
+ outline: none;
7650
7274
  }
7651
7275
  }
7652
7276
 
7653
- .alert-splash-screen {
7654
- position: absolute;
7277
+ &.additional-left-padding {
7278
+ padding-left: 22px;
7279
+ }
7280
+
7281
+ .input-field {
7282
+ border: none;
7283
+ outline: 0;
7284
+ padding: 0;
7285
+ text-align: left;
7286
+ background-color: @number-input-field-bg-color;
7287
+ }
7288
+
7289
+ //
7290
+ // placeholder
7291
+ //
7292
+
7293
+ ::-webkit-input-placeholder {
7294
+ /* Chrome, Chromium, Edge, Safari, Opera*/
7295
+ color: @number-input-placeholder-color;
7296
+ }
7297
+
7298
+ :-moz-placeholder {
7299
+ /* Firefox 4-18 */
7300
+ color: @number-input-placeholder-color;
7301
+ }
7302
+
7303
+ ::-moz-placeholder {
7304
+ /* Firefox 19+ */
7305
+ color: @number-input-placeholder-color;
7306
+ }
7307
+
7308
+ :-ms-input-placeholder {
7309
+ /* - Internet Explorer 10–11
7310
+ - Internet Explorer Mobile 10-11 */
7311
+ color: @number-input-placeholder-color !important;
7312
+ }
7313
+
7314
+ ::placeholder {
7315
+ /* modern browser versions */
7316
+ color: @number-input-placeholder-color;
7317
+ }
7318
+
7319
+ .additional-left-block {
7320
+ .prefix-unit {
7321
+ color: @number-input-additional-left-block-prefix-unit-color;
7322
+ font-size: 14px;
7323
+ font-weight: 700;
7324
+ padding-right: 7px;
7325
+ }
7326
+ }
7327
+
7328
+ .suffix-unit-container {
7329
+ display: flex;
7330
+ align-items: center;
7331
+
7332
+ .suffix-unit {
7333
+ color: @number-input-suffix-unit-color;
7334
+ font-size: 14px;
7335
+ font-weight: 400;
7336
+ padding-left: 3px;
7337
+ }
7338
+ }
7339
+
7340
+ .arrow-block {
7341
+ font-size: 11px;
7342
+ display: flex;
7343
+ flex-direction: column;
7344
+ justify-content: center;
7345
+ height: 100%;
7346
+ margin-left: 6px;
7347
+
7348
+ .igz-icon-dropup, .igz-icon-dropdown {
7349
+ color: @number-input-arrow-block-icon-color;
7350
+ cursor: pointer;
7351
+ display: block;
7352
+ line-height: 11px;
7353
+ outline: 0;
7354
+
7355
+ &:hover {
7356
+ color: @number-input-arrow-block-icon-hover-color;
7357
+ }
7358
+ }
7359
+ }
7360
+
7361
+ &.disabled {
7362
+ background-color: @number-input-disabled-bg-color;
7363
+ opacity: 0.5;
7364
+
7365
+ .suffix-unit {
7366
+ opacity: 0.5;
7367
+ }
7368
+
7369
+ .igz-icon-dropup, .igz-icon-dropdown {
7370
+ &, &:hover {
7371
+ color: @number-input-disabled-icon-hover-color;
7372
+ opacity: 0.5;
7373
+ cursor: default;
7374
+ }
7375
+ }
7376
+ }
7377
+ }
7378
+
7379
+ .step3, .step4 {
7380
+ .additional-right-padding {
7381
+ padding-right: 50px;
7382
+ }
7383
+ }
7384
+
7385
+ .igz-size {
7386
+ .size-color-set();
7387
+
7388
+ align-items: center;
7389
+ display: flex;
7390
+ justify-content: space-between;
7391
+
7392
+ &:after {
7393
+ content: ' ';
7394
+ display: inline-block;
7395
+ vertical-align: middle;
7396
+ }
7397
+
7398
+ .size-value {
7399
+ line-height: 1;
7400
+ flex: 0 0 100px;
7401
+ min-width: 100px;
7402
+
7403
+ > span {
7404
+ line-height: 25px;
7405
+ }
7406
+
7407
+ &.short {
7408
+ flex: 0 0 75px;
7409
+ min-width: 75px;
7410
+ }
7411
+
7412
+ &.shorten {
7413
+ flex: 0 0 60px;
7414
+ min-width: 60px;
7415
+ }
7416
+
7417
+ &.shortest {
7418
+ flex: 0 0 40px;
7419
+ min-width: 40px;
7420
+ }
7421
+ }
7422
+
7423
+ .size-reserved {
7424
+ color: @size-reserved-color;
7425
+ font-size: 12px;
7426
+
7427
+ .icon-font-arrow-right:before {
7428
+ color: @size-reserved-arrow-right-before-color;
7429
+ font-size: 10px;
7430
+ padding: 0 4px 0 4px;
7431
+ }
7432
+
7433
+ .icon-font-infinity:before {
7434
+ color: @size-reserved-infinity-before-color;
7435
+ font-size: 10px;
7436
+ }
7437
+ }
7438
+
7439
+ .size-chart {
7440
+ flex: 1 1 auto;
7441
+ min-width: 0;
7442
+
7443
+ div.highcharts-tooltip {
7444
+ position: fixed !important;
7445
+
7446
+ .igz-tooltip-wrapper {
7447
+ color: @size-chart-tooltip-wrapper-color;
7448
+
7449
+ &.used-capacity-tooltip-wrapper {
7450
+ .igz-row {
7451
+ .tooltip-label,
7452
+ .tooltip-value {
7453
+ text-overflow: unset;
7454
+ }
7455
+ }
7456
+ }
7457
+
7458
+ .tooltip-header {
7459
+ padding-bottom: 6px;
7460
+ margin-bottom: 5px;
7461
+ line-height: 1.1;
7462
+ text-align: center;
7463
+ }
7464
+ }
7465
+ }
7466
+ }
7467
+
7468
+ .igz-highcharts-wrapper {
7469
+ height: 40px;
7470
+ position: relative;
7471
+ width: 100%;
7472
+ }
7473
+ }
7474
+
7475
+ .igz-slider-input-block {
7476
+ .igz-slider-input-block-color-set();
7477
+
7478
+ position: relative;
7479
+
7480
+ .igz-slider-input-title {
7481
+ float: left;
7482
+ display: table;
7483
+ min-height: 30px;
7484
+ line-height: 1;
7485
+ color: @slider-input-title-color;
7486
+ font-size: 14px;
7487
+ font-weight: 400;
7488
+ text-align: left;
7489
+ cursor: default;
7490
+
7491
+ .igz-slider-input-title-text {
7492
+ display: table-cell;
7493
+ vertical-align: middle;
7494
+ }
7495
+ }
7496
+
7497
+ // Custom styles for third-party library slider
7498
+ .igz-slider-input-rz-slider {
7499
+ float: left;
7500
+ min-height: 16px;
7501
+ line-height: 16px;
7502
+
7503
+ .rzslider {
7504
+ margin: 0;
7505
+ height: 8px;
7506
+
7507
+ .rz-bar-wrapper {
7508
+ height: auto;
7509
+ margin: 0;
7510
+ padding: 0;
7511
+
7512
+ .rz-bar {
7513
+ background-color: @rz-bar-bg-color;
7514
+ height: 3px;
7515
+ }
7516
+ }
7517
+
7518
+ .rz-bubble {
7519
+ display: none;
7520
+ }
7521
+
7522
+ .rz-pointer {
7523
+ height: 14px;
7524
+ width: 14px;
7525
+ top: -6px;
7526
+ box-shadow: @rz-pointer-box-shadow;
7527
+ outline: 0;
7528
+
7529
+ &:after {
7530
+ display: none;
7531
+ }
7532
+ }
7533
+
7534
+ &:not([disabled]) {
7535
+ .rz-bar.rz-selection {
7536
+ background-color: @rz-selection-bg-color;
7537
+ }
7538
+
7539
+ .rz-pointer {
7540
+ background-color: @rz-pointer-bg-color;
7541
+ }
7542
+ }
7543
+ }
7544
+ }
7545
+
7546
+ // Current value
7547
+ .igz-slider-input-current-value {
7548
+ float: left;
7549
+ min-height: 30px;
7550
+ line-height: 30px;
7551
+
7552
+ &.with-measure-units {
7553
+ width: 18%;
7554
+ padding-right: 0;
7555
+
7556
+ .igz-slider-input-current-value-text {
7557
+ margin-right: 4px;
7558
+ }
7559
+ }
7560
+
7561
+ &.with-value-unit {
7562
+ padding-right: 21px;
7563
+ }
7564
+
7565
+ .igz-slider-input-current-value-text {
7566
+ color: @slider-input-current-value-text-color;
7567
+ font-size: 13px;
7568
+ font-weight: 400;
7569
+ background-color: @slider-input-current-value-text-bg-color;
7570
+ text-align: right;
7571
+ }
7572
+ }
7573
+
7574
+ .igz-slider-input-unit-label {
7575
+ position: absolute;
7576
+ right: 0;
7577
+ min-height: 30px;
7578
+ line-height: 30px;
7579
+ }
7580
+
7581
+ // Units dropdown
7582
+ .igz-slider-input-units-dropdown {
7583
+ float: left;
7584
+
7585
+ .default-dropdown {
7586
+ height: 30px;
7587
+
7588
+ .default-dropdown-field {
7589
+ border: none;
7590
+ background-color: @default-dropdown-field-bg-color;
7591
+
7592
+ .dropdown-selected-item {
7593
+ padding-left: 0;
7594
+ }
7595
+
7596
+ .dropdown-arrow {
7597
+ margin-right: 0;
7598
+ }
7599
+ }
7600
+ }
7601
+ }
7602
+ }
7603
+
7604
+ .splash-screen {
7605
+ .splash-screen-color-set();
7606
+
7607
+ position: absolute;
7608
+ z-index: 996;
7609
+ width: 100%;
7610
+ height: 100%;
7611
+ background-color: @splash-screen-bg-color;
7612
+ transform-style: preserve-3d;
7613
+
7614
+ // ngAnimate appearance for show/hide
7615
+ transition: opacity linear .25s 0s;
7616
+
7617
+ &.ng-hide-remove {
7618
+ opacity: 0;
7619
+ }
7620
+
7621
+ .loading-splash-screen {
7622
+ position: absolute;
7623
+ top: 50%;
7624
+ left: 50%;
7625
+ transform: translate(-50%, -50%);
7626
+ color: @loading-splash-screen-color;
7627
+ font-size: 20px;
7628
+ text-align: center;
7629
+ font-weight: 500;
7630
+ width: 217px;
7631
+ border-radius: 6px;
7632
+ background-image: @loading-splash-screen-bg-image;
7633
+ padding: 49px 0;
7634
+
7635
+ .splash-logo-wrapper {
7636
+ position: relative;
7637
+ text-align: center;
7638
+
7639
+ .loader-fading-circle {
7640
+ width: 60px;
7641
+ height: 60px;
7642
+ }
7643
+ }
7644
+
7645
+ .loading-text {
7646
+ padding: 31px 0 0 12px;
7647
+ font-family: @font-family-sans-serif;
7648
+ font-size: 20px;
7649
+ color: @loading-splash-screen-text-color;
7650
+ }
7651
+ }
7652
+
7653
+ .alert-splash-screen {
7654
+ position: absolute;
7655
7655
  top: 50%;
7656
7656
  left: 50%;
7657
7657
  transform: translate(-50%, -50%);
@@ -7708,143 +7708,6 @@ yx-axis
7708
7708
  }
7709
7709
  }
7710
7710
  }
7711
- .ngdialog.text-edit {
7712
- .text-edit-color-set();
7713
-
7714
- .ngdialog-content {
7715
- padding: 0;
7716
- width: 1000px;
7717
- height: 678px;
7718
-
7719
- .text-preview-directive-wrapper {
7720
- .title {
7721
- margin: 25px 0 0 24px;
7722
- padding: 0 70px 0 0;
7723
- }
7724
-
7725
- .close-button {
7726
- position: absolute;
7727
- top: 24px;
7728
- right: 24px;
7729
- font-size: 18px;
7730
- color: @close-btn-color;
7731
- }
7732
-
7733
- .buttons {
7734
- margin-right: 24px;
7735
- }
7736
-
7737
- .text-preview-wrapper {
7738
- background-color: @text-preview-wrapper-bg-color;
7739
- border-top: @text-preview-wrapper-border-top;
7740
- border-bottom: @text-preview-wrapper-border-bottom;
7741
- border-radius: 2px;
7742
- margin-bottom: 16px;
7743
- padding: 15px 22px 17px;
7744
- min-width: 690px;
7745
- height: 550px;
7746
-
7747
- .text-preview-container {
7748
- width: 100%;
7749
- line-height: 1.9;
7750
- text-align: left;
7751
- padding-right: 22px;
7752
- font-size: 13px;
7753
- color: @text-preview-container-color;
7754
- resize: none;
7755
- overflow: hidden;
7756
- border-color: @text-preview-container-border-color;
7757
- background-color: @text-preview-container-bg-color;
7758
- cursor: text;
7759
- }
7760
-
7761
- .text-preview-container:focus {
7762
- outline: 0;
7763
- }
7764
-
7765
- .word-wrap-checkbox-wrapper {
7766
- width: 100%;
7767
- display: flex;
7768
- justify-content: flex-end;
7769
-
7770
- .col-checkbox {
7771
- line-height: normal;
7772
- height: 25px;
7773
-
7774
- label:before {
7775
- font-size: 16px;
7776
- }
7777
- }
7778
- }
7779
- }
7780
- }
7781
- }
7782
-
7783
- .ncl-monaco {
7784
- height: 500px;
7785
- }
7786
- }
7787
-
7788
- .toast-status-panel {
7789
- .toast-status-panel-color-set();
7790
-
7791
- margin-bottom: 20px;
7792
- padding: 16px 36px 16px 12px;
7793
- background-color: @toast-panel-bg-color;
7794
- border: @toast-panel-border;
7795
- position: relative;
7796
-
7797
- &.in-progress {
7798
- background-color: @toast-panel-in-progress-bg-color;
7799
- border: @toast-panel-in-progress-border;
7800
- }
7801
-
7802
- &.failed {
7803
- background-color: @toast-panel-failed-bg-color;
7804
- border: @toast-panel-failed-border;
7805
- }
7806
-
7807
- .panel-status {
7808
- color: @toast-panel-status-color;
7809
- line-height: 24px;
7810
- font-size: 14px;
7811
- font-weight: 700;
7812
- font-family: @font-family-sans-serif;
7813
- align-items: center;
7814
- display: flex;
7815
- justify-content: center;
7816
-
7817
- &.in-progress {
7818
- color: @toast-panel-status-in-progress-color;
7819
- }
7820
-
7821
- &.failed {
7822
- color: @toast-panel-status-failed-color;
7823
- }
7824
-
7825
- .panel-status-icon {
7826
- font-size: 24px;
7827
-
7828
- &.igz-icon-properties {
7829
- -webkit-animation: rotation 4s infinite linear;
7830
-
7831
- @-webkit-keyframes rotation {
7832
- from {
7833
- -webkit-transform: rotate(0deg);
7834
- }
7835
- to {
7836
- -webkit-transform: rotate(359deg);
7837
- }
7838
- }
7839
- }
7840
- }
7841
-
7842
- .panel-status-msg {
7843
- margin-left: 8px;
7844
- }
7845
- }
7846
- }
7847
-
7848
7711
  .validating-input-field {
7849
7712
  .validating-input-field-color-set();
7850
7713
 
@@ -8140,39 +8003,116 @@ yx-axis
8140
8003
  flex-flow: row wrap;
8141
8004
  align-items: baseline;
8142
8005
 
8143
- .field.invalid .cron-select {
8144
- background-color: @input-textarea-field-not-disabled-focus-invalid-bg-color;
8145
- border: @input-textarea-field-not-disabled-focus-invalid-border;
8146
- }
8006
+ .field.invalid .cron-select {
8007
+ background-color: @input-textarea-field-not-disabled-focus-invalid-bg-color;
8008
+ border: @input-textarea-field-not-disabled-focus-invalid-border;
8009
+ }
8010
+
8011
+ .clear-button {
8012
+ margin-left: 15px;
8013
+ background-color: transparent;
8014
+ font-size: 14px;
8015
+ position: static;
8016
+ }
8017
+ }
8018
+ }
8019
+
8020
+ // an invalid input field should be displayed as invalid in case it is in a submitted form even if the field is pristine
8021
+ form.ng-submitted .validating-input-field {
8022
+ .validating-input-field-color-set();
8023
+
8024
+ .input-field, .textarea-field {
8025
+ &:not([disabled]):not([readonly]) {
8026
+ &.ng-invalid, &.invalid {
8027
+ &:focus {
8028
+ background-color: @input-textarea-field-not-disabled-focus-invalid-bg-color;
8029
+ border: @input-textarea-field-not-disabled-focus-invalid-border;
8030
+ }
8031
+
8032
+ &:not(:focus) {
8033
+ background-color: @input-textarea-field-not-disabled-invalid-bg-color;
8034
+ border: @input-textarea-field-not-disabled-invalid-border;
8035
+ }
8036
+ }
8037
+ }
8038
+ }
8039
+ }
8040
+
8041
+ .ngdialog.text-edit {
8042
+ .text-edit-color-set();
8043
+
8044
+ .ngdialog-content {
8045
+ padding: 0;
8046
+ width: 1000px;
8047
+ height: 678px;
8048
+
8049
+ .text-preview-directive-wrapper {
8050
+ .title {
8051
+ margin: 25px 0 0 24px;
8052
+ padding: 0 70px 0 0;
8053
+ }
8054
+
8055
+ .close-button {
8056
+ position: absolute;
8057
+ top: 24px;
8058
+ right: 24px;
8059
+ font-size: 18px;
8060
+ color: @close-btn-color;
8061
+ }
8062
+
8063
+ .buttons {
8064
+ margin-right: 24px;
8065
+ }
8066
+
8067
+ .text-preview-wrapper {
8068
+ background-color: @text-preview-wrapper-bg-color;
8069
+ border-top: @text-preview-wrapper-border-top;
8070
+ border-bottom: @text-preview-wrapper-border-bottom;
8071
+ border-radius: 2px;
8072
+ margin-bottom: 16px;
8073
+ padding: 15px 22px 17px;
8074
+ min-width: 690px;
8075
+ height: 550px;
8076
+
8077
+ .text-preview-container {
8078
+ width: 100%;
8079
+ line-height: 1.9;
8080
+ text-align: left;
8081
+ padding-right: 22px;
8082
+ font-size: 13px;
8083
+ color: @text-preview-container-color;
8084
+ resize: none;
8085
+ overflow: hidden;
8086
+ border-color: @text-preview-container-border-color;
8087
+ background-color: @text-preview-container-bg-color;
8088
+ cursor: text;
8089
+ }
8147
8090
 
8148
- .clear-button {
8149
- margin-left: 15px;
8150
- background-color: transparent;
8151
- font-size: 14px;
8152
- position: static;
8153
- }
8154
- }
8155
- }
8091
+ .text-preview-container:focus {
8092
+ outline: 0;
8093
+ }
8156
8094
 
8157
- // an invalid input field should be displayed as invalid in case it is in a submitted form even if the field is pristine
8158
- form.ng-submitted .validating-input-field {
8159
- .validating-input-field-color-set();
8095
+ .word-wrap-checkbox-wrapper {
8096
+ width: 100%;
8097
+ display: flex;
8098
+ justify-content: flex-end;
8160
8099
 
8161
- .input-field, .textarea-field {
8162
- &:not([disabled]):not([readonly]) {
8163
- &.ng-invalid, &.invalid {
8164
- &:focus {
8165
- background-color: @input-textarea-field-not-disabled-focus-invalid-bg-color;
8166
- border: @input-textarea-field-not-disabled-focus-invalid-border;
8167
- }
8100
+ .col-checkbox {
8101
+ line-height: normal;
8102
+ height: 25px;
8168
8103
 
8169
- &:not(:focus) {
8170
- background-color: @input-textarea-field-not-disabled-invalid-bg-color;
8171
- border: @input-textarea-field-not-disabled-invalid-border;
8104
+ label:before {
8105
+ font-size: 16px;
8106
+ }
8107
+ }
8172
8108
  }
8173
8109
  }
8174
8110
  }
8175
8111
  }
8112
+
8113
+ .ncl-monaco {
8114
+ height: 500px;
8115
+ }
8176
8116
  }
8177
8117
 
8178
8118
  .ncl-api-gateway-row {
@@ -8210,6 +8150,66 @@ form.ng-submitted .validating-input-field {
8210
8150
  }
8211
8151
  }
8212
8152
 
8153
+ .toast-status-panel {
8154
+ .toast-status-panel-color-set();
8155
+
8156
+ margin-bottom: 20px;
8157
+ padding: 16px 36px 16px 12px;
8158
+ background-color: @toast-panel-bg-color;
8159
+ border: @toast-panel-border;
8160
+ position: relative;
8161
+
8162
+ &.in-progress {
8163
+ background-color: @toast-panel-in-progress-bg-color;
8164
+ border: @toast-panel-in-progress-border;
8165
+ }
8166
+
8167
+ &.failed {
8168
+ background-color: @toast-panel-failed-bg-color;
8169
+ border: @toast-panel-failed-border;
8170
+ }
8171
+
8172
+ .panel-status {
8173
+ color: @toast-panel-status-color;
8174
+ line-height: 24px;
8175
+ font-size: 14px;
8176
+ font-weight: 700;
8177
+ font-family: @font-family-sans-serif;
8178
+ align-items: center;
8179
+ display: flex;
8180
+ justify-content: center;
8181
+
8182
+ &.in-progress {
8183
+ color: @toast-panel-status-in-progress-color;
8184
+ }
8185
+
8186
+ &.failed {
8187
+ color: @toast-panel-status-failed-color;
8188
+ }
8189
+
8190
+ .panel-status-icon {
8191
+ font-size: 24px;
8192
+
8193
+ &.igz-icon-properties {
8194
+ -webkit-animation: rotation 4s infinite linear;
8195
+
8196
+ @-webkit-keyframes rotation {
8197
+ from {
8198
+ -webkit-transform: rotate(0deg);
8199
+ }
8200
+ to {
8201
+ -webkit-transform: rotate(359deg);
8202
+ }
8203
+ }
8204
+ }
8205
+ }
8206
+
8207
+ .panel-status-msg {
8208
+ margin-left: 8px;
8209
+ }
8210
+ }
8211
+ }
8212
+
8213
8213
  .new-api-gateway-wizard {
8214
8214
  .new-api-gateway-wizard-color-set();
8215
8215
 
@@ -8778,6 +8778,18 @@ body {
8778
8778
  border: solid 1px @pale-grey;
8779
8779
  }
8780
8780
  }
8781
+ .deploy-deleted-function-dialog {
8782
+ .sub-title {
8783
+ font-size: 16px;
8784
+ color: @silver-chalice-two;
8785
+ }
8786
+
8787
+ .buttons {
8788
+ display: flex;
8789
+ justify-content: flex-end;
8790
+ }
8791
+ }
8792
+
8781
8793
  .duplicate-function-dialog-wrapper {
8782
8794
  .main-content {
8783
8795
  .field-group {
@@ -8799,18 +8811,6 @@ body {
8799
8811
  }
8800
8812
  }
8801
8813
 
8802
- .deploy-deleted-function-dialog {
8803
- .sub-title {
8804
- font-size: 16px;
8805
- color: @silver-chalice-two;
8806
- }
8807
-
8808
- .buttons {
8809
- display: flex;
8810
- justify-content: flex-end;
8811
- }
8812
- }
8813
-
8814
8814
  .ncl-function-collapsing-row {
8815
8815
  background-color: @white;
8816
8816
  margin-bottom: 8px;
@@ -9238,58 +9238,180 @@ body {
9238
9238
  border-bottom: @info-page-actions-bar-border-bottom;
9239
9239
  transition: @igz-basic-transition;
9240
9240
 
9241
- &.upper-pane-opened {
9242
- top: 150px;
9243
- }
9241
+ &.upper-pane-opened {
9242
+ top: 150px;
9243
+ }
9244
+
9245
+ &.filters-opened {
9246
+ right: 376px;
9247
+ padding-right: 8px;
9248
+ }
9249
+
9250
+ &.info-pane-opened {
9251
+ right: 379px;
9252
+ padding-right: 8px;
9253
+ }
9254
+
9255
+ .actions-bar-left {
9256
+ float: left;
9257
+ height: 100%;
9258
+ }
9259
+
9260
+ .actions-bar-right {
9261
+ float: right;
9262
+ height: 100%;
9263
+ text-align: right;
9264
+ }
9265
+
9266
+ &:before, &:after {
9267
+ content: " ";
9268
+ display: table;
9269
+ }
9270
+ &:after {
9271
+ clear: both;
9272
+ }
9273
+
9274
+ .actions-panes-block {
9275
+ padding-left: 16px;
9276
+ border-left: @actions-panes-block-border-left;
9277
+ }
9278
+
9279
+ .actions-content-block {
9280
+ margin: 0 8px 0 32px;
9281
+ }
9282
+
9283
+ .actions-buttons-block {
9284
+ margin-left: 16px;
9285
+ margin-top: 1px;
9286
+
9287
+ [class^="igz-button"]:not(:first-child), [class*="igz-button"]:not(:first-child) {
9288
+ margin-left: 8px;
9289
+ }
9290
+ }
9291
+ }
9292
+
9293
+ .igz-info-page-content-wrapper {
9294
+ .info-page-content-color-set();
9295
+
9296
+ position: absolute;
9297
+ top: 56px;
9298
+ right: 0;
9299
+ bottom: 0;
9300
+ left: 0;
9301
+ padding-top: 0;
9302
+ transition: @igz-basic-transition;
9303
+ background-color: @page-content-bg-color;
9304
+
9305
+ &.upper-pane-opened {
9306
+ top: 216px;
9307
+ }
9308
+
9309
+ &.filters-opened {
9310
+ right: 377px;
9311
+ }
9312
+
9313
+ &.info-pane-opened {
9314
+ right: 379px;
9315
+ }
9316
+
9317
+ .igz-info-page-content {
9318
+ min-width: 946px;
9319
+ max-width: 100%;
9320
+ padding: 40px 25px;
9321
+ }
9322
+ }
9323
+
9324
+ igz-info-page-actions-bar {
9325
+ .igz-info-page-actions-bar .actions-content-block {
9326
+ margin-left: 14px;
9327
+ }
9328
+ }
9329
+
9330
+ igz-info-page-content {
9331
+ .info-page-content-color-set();
9332
+
9333
+ .container-data-access-policy-table, .data-lifecycle-table {
9334
+ &.common-table {
9335
+ .common-table-header {
9336
+ position: relative;
9337
+ height: 49px;
9338
+ line-height: 48px;
9339
+
9340
+ .common-table-cell {
9341
+ margin-top: -1px;
9342
+ height: 49px;
9343
+
9344
+ &.selected {
9345
+ background-color: @common-table-cell-selected-bg-color;
9346
+ border: @common-table-cell-selected-border;
9347
+ }
9348
+
9349
+ &:last-child {
9350
+ margin-right: 0;
9351
+ }
9352
+
9353
+ &.actions-menu {
9354
+ width: 0;
9355
+ }
9244
9356
 
9245
- &.filters-opened {
9246
- right: 376px;
9247
- padding-right: 8px;
9248
- }
9357
+ &.check-all-rows {
9358
+ padding-left: 30px;
9249
9359
 
9250
- &.info-pane-opened {
9251
- right: 379px;
9252
- padding-right: 8px;
9253
- }
9360
+ .action-checkbox-all {
9361
+ padding-top: 2px;
9362
+ }
9363
+ }
9364
+ }
9254
9365
 
9255
- .actions-bar-left {
9256
- float: left;
9257
- height: 100%;
9258
- }
9366
+ .common-table-cells-container {
9367
+ margin-right: 45px;
9259
9368
 
9260
- .actions-bar-right {
9261
- float: right;
9262
- height: 100%;
9263
- text-align: right;
9264
- }
9369
+ .common-table-cell {
9370
+ height: 49px;
9371
+ padding: 0 15px;
9372
+ border-right: @common-table-cell-border-right;
9265
9373
 
9266
- &:before, &:after {
9267
- content: " ";
9268
- display: table;
9269
- }
9270
- &:after {
9271
- clear: both;
9272
- }
9374
+ &:first-child {
9375
+ padding-left: 7px;
9376
+ }
9377
+ }
9378
+ }
9379
+ }
9273
9380
 
9274
- .actions-panes-block {
9275
- padding-left: 16px;
9276
- border-left: @actions-panes-block-border-left;
9277
- }
9381
+ .common-table-body {
9382
+ margin-top: 7px;
9278
9383
 
9279
- .actions-content-block {
9280
- margin: 0 8px 0 32px;
9281
- }
9384
+ .common-table-cell {
9385
+ &.actions-menu {
9386
+ width: 45px;
9387
+ }
9388
+ }
9389
+ }
9282
9390
 
9283
- .actions-buttons-block {
9284
- margin-left: 16px;
9285
- margin-top: 1px;
9391
+ .data-access-policy-layers, .data-lifecycle-layers {
9392
+ &:last-child {
9393
+ margin-bottom: 20px;
9394
+ }
9395
+ }
9396
+ }
9286
9397
 
9287
- [class^="igz-button"]:not(:first-child), [class*="igz-button"]:not(:first-child) {
9288
- margin-left: 8px;
9398
+ .sortable-empty {
9399
+ background-color: @sortable-empty-bg-color;
9400
+ color: @sortable-empty-color;
9401
+ font-size: 14px;
9402
+ font-weight: 400;
9403
+ font-family: 'Open Sans', sans-serif;
9404
+ border-bottom: @sortable-empty-border;
9405
+ border-left: @sortable-empty-border;
9406
+ border-right: @sortable-empty-border;
9407
+ padding-left: 70px;
9408
+ height: 40px;
9409
+ line-height: 38px;
9289
9410
  }
9290
9411
  }
9291
9412
  }
9292
9413
 
9414
+
9293
9415
  .info-page-filters-bookmark {
9294
9416
  .info-page-filters-color-set();
9295
9417
 
@@ -9630,128 +9752,6 @@ body {
9630
9752
  }
9631
9753
  }
9632
9754
 
9633
- .igz-info-page-content-wrapper {
9634
- .info-page-content-color-set();
9635
-
9636
- position: absolute;
9637
- top: 56px;
9638
- right: 0;
9639
- bottom: 0;
9640
- left: 0;
9641
- padding-top: 0;
9642
- transition: @igz-basic-transition;
9643
- background-color: @page-content-bg-color;
9644
-
9645
- &.upper-pane-opened {
9646
- top: 216px;
9647
- }
9648
-
9649
- &.filters-opened {
9650
- right: 377px;
9651
- }
9652
-
9653
- &.info-pane-opened {
9654
- right: 379px;
9655
- }
9656
-
9657
- .igz-info-page-content {
9658
- min-width: 946px;
9659
- max-width: 100%;
9660
- padding: 40px 25px;
9661
- }
9662
- }
9663
-
9664
- igz-info-page-actions-bar {
9665
- .igz-info-page-actions-bar .actions-content-block {
9666
- margin-left: 14px;
9667
- }
9668
- }
9669
-
9670
- igz-info-page-content {
9671
- .info-page-content-color-set();
9672
-
9673
- .container-data-access-policy-table, .data-lifecycle-table {
9674
- &.common-table {
9675
- .common-table-header {
9676
- position: relative;
9677
- height: 49px;
9678
- line-height: 48px;
9679
-
9680
- .common-table-cell {
9681
- margin-top: -1px;
9682
- height: 49px;
9683
-
9684
- &.selected {
9685
- background-color: @common-table-cell-selected-bg-color;
9686
- border: @common-table-cell-selected-border;
9687
- }
9688
-
9689
- &:last-child {
9690
- margin-right: 0;
9691
- }
9692
-
9693
- &.actions-menu {
9694
- width: 0;
9695
- }
9696
-
9697
- &.check-all-rows {
9698
- padding-left: 30px;
9699
-
9700
- .action-checkbox-all {
9701
- padding-top: 2px;
9702
- }
9703
- }
9704
- }
9705
-
9706
- .common-table-cells-container {
9707
- margin-right: 45px;
9708
-
9709
- .common-table-cell {
9710
- height: 49px;
9711
- padding: 0 15px;
9712
- border-right: @common-table-cell-border-right;
9713
-
9714
- &:first-child {
9715
- padding-left: 7px;
9716
- }
9717
- }
9718
- }
9719
- }
9720
-
9721
- .common-table-body {
9722
- margin-top: 7px;
9723
-
9724
- .common-table-cell {
9725
- &.actions-menu {
9726
- width: 45px;
9727
- }
9728
- }
9729
- }
9730
-
9731
- .data-access-policy-layers, .data-lifecycle-layers {
9732
- &:last-child {
9733
- margin-bottom: 20px;
9734
- }
9735
- }
9736
- }
9737
-
9738
- .sortable-empty {
9739
- background-color: @sortable-empty-bg-color;
9740
- color: @sortable-empty-color;
9741
- font-size: 14px;
9742
- font-weight: 400;
9743
- font-family: 'Open Sans', sans-serif;
9744
- border-bottom: @sortable-empty-border;
9745
- border-left: @sortable-empty-border;
9746
- border-right: @sortable-empty-border;
9747
- padding-left: 70px;
9748
- height: 40px;
9749
- line-height: 38px;
9750
- }
9751
- }
9752
- }
9753
-
9754
-
9755
9755
  ncl-breadcrumbs {
9756
9756
  .main-header-title {
9757
9757
  &:not(.disable-behavior) {
@@ -9901,64 +9901,26 @@ ncl-breadcrumbs {
9901
9901
  color: @dusk-three;
9902
9902
  vertical-align:top;
9903
9903
  text-decoration: none;
9904
- height: 32px;
9905
- }
9906
-
9907
- .igz-icon-tick {
9908
- display: inline-block;
9909
- font-size: 16px;
9910
- width: 41px;
9911
- height: 32px;
9912
- padding: 0 19px 0 12px;
9913
- vertical-align: top;
9914
- }
9915
-
9916
- &:hover {
9917
- height: 32px;
9918
- background-color: @pale-grey-two;
9919
- }
9920
- }
9921
- }
9922
- }
9923
-
9924
- .ncl-deploy-log-wrapper {
9925
- .log-panel {
9926
- .logs-common();
9927
- background-color: @dark-grey;
9928
- color: @light-grey-three;
9929
- padding: 5px;
9930
- margin: 21px 0 0 4px;
9931
- min-height: 280px;
9932
- max-height: 280px;
9933
- height: 280px;
9934
-
9935
- .log-entry {
9936
- .log-entry-time {
9937
- color: @solid-grey;
9938
- }
9939
-
9940
- .log-entry-level-debug{
9941
- color: @dusty-blue;
9942
- }
9943
-
9944
- .log-entry-level-info {
9945
- color: @cloudy-blue;
9946
- }
9947
-
9948
- .log-entry-level-warn{
9949
- color: @sunflower-yellow;
9904
+ height: 32px;
9950
9905
  }
9951
9906
 
9952
- .log-entry-level-error {
9953
- color: @darkish-pink;
9907
+ .igz-icon-tick {
9908
+ display: inline-block;
9909
+ font-size: 16px;
9910
+ width: 41px;
9911
+ height: 32px;
9912
+ padding: 0 19px 0 12px;
9913
+ vertical-align: top;
9954
9914
  }
9955
9915
 
9956
- .log-entry-message {
9957
- font-weight: 600;
9916
+ &:hover {
9917
+ height: 32px;
9918
+ background-color: @pale-grey-two;
9958
9919
  }
9959
9920
  }
9960
9921
  }
9961
9922
  }
9923
+
9962
9924
  .ncl-collapsing-row {
9963
9925
  margin-bottom: 9px;
9964
9926
 
@@ -10082,24 +10044,6 @@ ncl-breadcrumbs {
10082
10044
  }
10083
10045
  }
10084
10046
 
10085
- .view-yaml-dialog-wrapper {
10086
- .ngdialog-content {
10087
- .view-yaml-dialog-header {
10088
- .title {
10089
- margin-bottom: 10px;
10090
- }
10091
-
10092
- .copy-to-clipboard {
10093
- width: 20px;
10094
- }
10095
- }
10096
-
10097
- .monaco-editor {
10098
- min-width: 700px;
10099
- min-height: 450px;
10100
- }
10101
- }
10102
- }
10103
10047
  .ncl-edit-item {
10104
10048
  width: 100%;
10105
10049
  padding: 6px 0;
@@ -10158,45 +10102,262 @@ ncl-breadcrumbs {
10158
10102
  padding: 35px 0 19px;
10159
10103
  }
10160
10104
 
10161
- .more-info-wrapper {
10162
- height: auto;
10163
- }
10164
- }
10105
+ .more-info-wrapper {
10106
+ height: auto;
10107
+ }
10108
+ }
10109
+
10110
+ .no-class-selected {
10111
+ line-height: 48px;
10112
+ .duskThree(0.64);
10113
+ color: @color;
10114
+ }
10115
+
10116
+ .ingresses-wrapper {
10117
+ .ingresses-table-headers {
10118
+ width: calc(100% - 30px);
10119
+
10120
+ .host-header {
10121
+ width: 38%;
10122
+ padding-left: 16px;
10123
+ }
10124
+
10125
+ .paths-header, .secret-header{
10126
+ width: 31%;
10127
+ padding-left: 16px;
10128
+ }
10129
+ }
10130
+ }
10131
+
10132
+ .advanced-section {
10133
+ .collapsed-block-title {
10134
+ font-size: 15px;
10135
+ font-weight: bold;
10136
+ margin: 15px 0;
10137
+
10138
+ .icon-collapsed {
10139
+ color: .duskThree(0.64)[@color];
10140
+ font-size: 12px;
10141
+ margin: 0 11px 0 4px;
10142
+ }
10143
+ }
10144
+ }
10145
+ }
10146
+
10147
+ .ncl-deploy-log-wrapper {
10148
+ .log-panel {
10149
+ .logs-common();
10150
+ background-color: @dark-grey;
10151
+ color: @light-grey-three;
10152
+ padding: 5px;
10153
+ margin: 21px 0 0 4px;
10154
+ min-height: 280px;
10155
+ max-height: 280px;
10156
+ height: 280px;
10157
+
10158
+ .log-entry {
10159
+ .log-entry-time {
10160
+ color: @solid-grey;
10161
+ }
10162
+
10163
+ .log-entry-level-debug{
10164
+ color: @dusty-blue;
10165
+ }
10166
+
10167
+ .log-entry-level-info {
10168
+ color: @cloudy-blue;
10169
+ }
10170
+
10171
+ .log-entry-level-warn{
10172
+ color: @sunflower-yellow;
10173
+ }
10174
+
10175
+ .log-entry-level-error {
10176
+ color: @darkish-pink;
10177
+ }
10178
+
10179
+ .log-entry-message {
10180
+ font-weight: 600;
10181
+ }
10182
+ }
10183
+ }
10184
+ }
10185
+ .view-yaml-dialog-wrapper {
10186
+ .ngdialog-content {
10187
+ .view-yaml-dialog-header {
10188
+ .title {
10189
+ margin-bottom: 10px;
10190
+ }
10191
+
10192
+ .copy-to-clipboard {
10193
+ width: 20px;
10194
+ }
10195
+ }
10196
+
10197
+ .monaco-editor {
10198
+ min-width: 700px;
10199
+ min-height: 450px;
10200
+ }
10201
+ }
10202
+ }
10203
+ ncl-navigation-tabs {
10204
+ .ncl-navigation-tabs-color-set();
10205
+
10206
+ position: relative;
10207
+ z-index: 999;
10208
+ background: @navigation-tabs-bg-color;
10209
+
10210
+ .ncl-navigation-tabs-wrapper {
10211
+ display: flex;
10212
+ align-items: center;
10213
+ justify-content: space-between;
10214
+ border-bottom: 1px solid @mystic-two;
10215
+ border-top: none;
10216
+
10217
+ .ncl-navigation-tabs {
10218
+ background: @navigation-tabs-bg-color;
10219
+ height: 54px;
10220
+
10221
+ .navigation-tab {
10222
+ position: relative;
10223
+ float: left;
10224
+ height: 32px;
10225
+ padding: 20px 40px 0;
10226
+ font-family: @font-family-sans-serif;
10227
+ color: @navigation-tab-color;
10228
+ font-size: 13px;
10229
+ text-align: center;
10230
+ cursor: pointer;
10231
+ border-bottom: @navigation-tab-border-bottom;
10232
+ box-sizing: content-box;
10233
+
10234
+ &.active, &.active:hover {
10235
+ background: none;
10236
+ color: @navigation-tab-active-hover-color;
10237
+ border-bottom: @navigation-tab-active-hover-border-bottom;
10238
+ font-weight: bold;
10239
+ }
10240
+
10241
+ &.ncl-status-indicator {
10242
+ padding-right: 8px;
10243
+
10244
+ &:hover {
10245
+ .ncl-status-tooltip {
10246
+ display: flex;
10247
+ }
10248
+ }
10249
+ }
10250
+
10251
+ .ncl-status-light {
10252
+ position: relative;
10253
+ display: inline-block;
10254
+ width: 8px;
10255
+ height: 8px;
10256
+ border-radius: 50%;
10257
+ margin-left: 34px;
10258
+ background-color: @solid-grey;
10259
+
10260
+ &.ncl-status-ready {
10261
+ background-color: @tealish;
10262
+ }
10263
+
10264
+ &.ncl-status-building {
10265
+ background-color: @pale-orange;
10266
+ }
10267
+
10268
+ &.ncl-status-error {
10269
+ background-color: @darkish-pink;
10270
+ }
10271
+
10272
+ .ncl-status-tooltip {
10273
+ position: absolute;
10274
+ left: 22px;
10275
+ top: -10px;
10276
+ z-index: 1;
10277
+ display: none;
10278
+ height: 24px;
10279
+ padding: 4px 12px 22px 10px;
10280
+ border-radius: 2px;
10281
+ background-color: @solid-grey;
10282
+ color: @white;
10283
+
10284
+ &:after {
10285
+ content: "";
10286
+ position: absolute;
10287
+ right: 100%;
10288
+ top: 50%;
10289
+ height: 0;
10290
+ width: 0;
10291
+ margin-top: -5px;
10292
+ border: 5px solid transparent;
10293
+ border-right-color: @solid-grey;
10294
+ pointer-events: none;
10295
+ }
10296
+
10297
+ &.ncl-status-tooltip-ready {
10298
+ padding-left: 10px;
10299
+ background-color: @tealish;
10300
+
10301
+ &:after {
10302
+ border-right-color: @tealish;
10303
+ }
10304
+ }
10305
+
10306
+ &.ncl-status-tooltip-building {
10307
+ padding-left: 10px;
10308
+ background-color: @pale-orange;
10309
+
10310
+ &:after {
10311
+ border-right-color: @pale-orange;
10312
+ }
10313
+ }
10314
+
10315
+ &.ncl-status-tooltip-error {
10316
+ padding-left: 10px;
10317
+ background-color: @darkish-pink;
10318
+
10319
+ &:after {
10320
+ border-right-color: @darkish-pink;
10321
+ }
10322
+ }
10323
+
10324
+ .ncl-status-icon {
10325
+ width: 13px;
10326
+ margin-right: 5px;
10327
+
10328
+ &.ncl-icon-ready {
10329
+ margin-top: 3px;
10330
+ font-size: 10px;
10331
+ }
10165
10332
 
10166
- .no-class-selected {
10167
- line-height: 48px;
10168
- .duskThree(0.64);
10169
- color: @color;
10170
- }
10333
+ &.ncl-icon-building {
10334
+ margin-top: 6px;
10335
+ font-size: 5px;
10336
+ }
10171
10337
 
10172
- .ingresses-wrapper {
10173
- .ingresses-table-headers {
10174
- width: calc(100% - 30px);
10338
+ &.ncl-icon-error {
10339
+ margin-top: 3px;
10340
+ font-size: 10px;
10341
+ }
10342
+ }
10175
10343
 
10176
- .host-header {
10177
- width: 38%;
10178
- padding-left: 16px;
10179
- }
10344
+ .ncl-status-title {
10345
+ font-size: 13px;
10346
+ font-weight: normal;
10347
+ white-space: nowrap;
10180
10348
 
10181
- .paths-header, .secret-header{
10182
- width: 31%;
10183
- padding-left: 16px;
10349
+ &::first-letter {
10350
+ text-transform: capitalize;
10351
+ }
10352
+ }
10353
+ }
10354
+ }
10184
10355
  }
10185
10356
  }
10186
10357
  }
10187
10358
 
10188
- .advanced-section {
10189
- .collapsed-block-title {
10190
- font-size: 15px;
10191
- font-weight: bold;
10192
- margin: 15px 0;
10193
-
10194
- .icon-collapsed {
10195
- color: .duskThree(0.64)[@color];
10196
- font-size: 12px;
10197
- margin: 0 11px 0 4px;
10198
- }
10199
- }
10359
+ .test-pane-actions-wrapper {
10360
+ margin-right: 35px;
10200
10361
  }
10201
10362
  }
10202
10363
 
@@ -10323,273 +10484,112 @@ ncl-breadcrumbs {
10323
10484
  flex-grow: 1;
10324
10485
  }
10325
10486
 
10326
- .input-additional-value {
10327
- flex-grow: 1;
10328
-
10329
- .validating-input-field {
10330
- .input-field {
10331
- &[readonly]:focus, &:not(:focus) {
10332
- border-left: none;
10333
- }
10334
-
10335
- &.invalid {
10336
- border: 1px solid @darkish-pink;
10337
- }
10338
- }
10339
- }
10340
- }
10341
-
10342
- &.only-key-value-input {
10343
- width: 62%;
10344
- }
10345
-
10346
- &.only-key-value-input.use-type {
10347
- width: 58%;
10348
- }
10349
-
10350
- &.only-value-input {
10351
- width: 100%;
10352
- }
10353
-
10354
- &.all-value-types {
10355
- width: 40%;
10356
-
10357
- label {
10358
- width: 65px;
10359
- }
10360
- }
10361
- }
10362
-
10363
- .input-value-key-wrapper {
10364
- width: 29%;
10365
-
10366
- .input-value-key {
10367
- flex-grow: 1;
10368
- }
10369
-
10370
- &:not(.use-type) {
10371
- width: 61%;
10372
- }
10373
- }
10374
-
10375
- .input-type-wrapper {
10376
- width: 13%;
10377
-
10378
- .type-label {
10379
- width: 60px;
10380
- padding-left: 7px;
10381
- }
10382
-
10383
- &.all-value-types {
10384
- width: 20%;
10385
- }
10386
-
10387
- .input-type {
10388
- flex-grow: 1;
10389
-
10390
- .default-dropdown {
10391
- .default-dropdown-field {
10392
- background-color: @white;
10393
- border-radius: 0;
10394
- }
10395
-
10396
- .default-dropdown-container {
10397
- z-index: 100;
10398
- }
10399
- }
10400
- }
10401
- }
10402
- }
10403
- }
10404
- }
10405
-
10406
- .ncl-monaco {
10407
- .ncl-monaco-wrapper {
10408
- padding-top: 20px;
10409
- height: 100%;
10410
- border: 1px solid @pale-grey;
10411
- background-color: @white;
10412
-
10413
- &.no-top-padding {
10414
- padding-top: 0;
10415
- }
10416
-
10417
- .ncl-monaco-top-row {
10418
- display: block;
10419
- }
10420
-
10421
- .ncl-monaco-editor {
10422
- height: 100%;
10423
- }
10424
- }
10425
-
10426
- .ncl-monaco-dark {
10427
- background-color: @vs-dark;
10428
- }
10429
- }
10430
-
10431
-
10432
- ncl-navigation-tabs {
10433
- .ncl-navigation-tabs-color-set();
10434
-
10435
- position: relative;
10436
- z-index: 999;
10437
- background: @navigation-tabs-bg-color;
10438
-
10439
- .ncl-navigation-tabs-wrapper {
10440
- display: flex;
10441
- align-items: center;
10442
- justify-content: space-between;
10443
- border-bottom: 1px solid @mystic-two;
10444
- border-top: none;
10445
-
10446
- .ncl-navigation-tabs {
10447
- background: @navigation-tabs-bg-color;
10448
- height: 54px;
10449
-
10450
- .navigation-tab {
10451
- position: relative;
10452
- float: left;
10453
- height: 32px;
10454
- padding: 20px 40px 0;
10455
- font-family: @font-family-sans-serif;
10456
- color: @navigation-tab-color;
10457
- font-size: 13px;
10458
- text-align: center;
10459
- cursor: pointer;
10460
- border-bottom: @navigation-tab-border-bottom;
10461
- box-sizing: content-box;
10462
-
10463
- &.active, &.active:hover {
10464
- background: none;
10465
- color: @navigation-tab-active-hover-color;
10466
- border-bottom: @navigation-tab-active-hover-border-bottom;
10467
- font-weight: bold;
10468
- }
10469
-
10470
- &.ncl-status-indicator {
10471
- padding-right: 8px;
10472
-
10473
- &:hover {
10474
- .ncl-status-tooltip {
10475
- display: flex;
10476
- }
10477
- }
10478
- }
10479
-
10480
- .ncl-status-light {
10481
- position: relative;
10482
- display: inline-block;
10483
- width: 8px;
10484
- height: 8px;
10485
- border-radius: 50%;
10486
- margin-left: 34px;
10487
- background-color: @solid-grey;
10488
-
10489
- &.ncl-status-ready {
10490
- background-color: @tealish;
10491
- }
10492
-
10493
- &.ncl-status-building {
10494
- background-color: @pale-orange;
10495
- }
10496
-
10497
- &.ncl-status-error {
10498
- background-color: @darkish-pink;
10499
- }
10500
-
10501
- .ncl-status-tooltip {
10502
- position: absolute;
10503
- left: 22px;
10504
- top: -10px;
10505
- z-index: 1;
10506
- display: none;
10507
- height: 24px;
10508
- padding: 4px 12px 22px 10px;
10509
- border-radius: 2px;
10510
- background-color: @solid-grey;
10511
- color: @white;
10512
-
10513
- &:after {
10514
- content: "";
10515
- position: absolute;
10516
- right: 100%;
10517
- top: 50%;
10518
- height: 0;
10519
- width: 0;
10520
- margin-top: -5px;
10521
- border: 5px solid transparent;
10522
- border-right-color: @solid-grey;
10523
- pointer-events: none;
10524
- }
10487
+ .input-additional-value {
10488
+ flex-grow: 1;
10525
10489
 
10526
- &.ncl-status-tooltip-ready {
10527
- padding-left: 10px;
10528
- background-color: @tealish;
10490
+ .validating-input-field {
10491
+ .input-field {
10492
+ &[readonly]:focus, &:not(:focus) {
10493
+ border-left: none;
10494
+ }
10529
10495
 
10530
- &:after {
10531
- border-right-color: @tealish;
10496
+ &.invalid {
10497
+ border: 1px solid @darkish-pink;
10532
10498
  }
10533
10499
  }
10500
+ }
10501
+ }
10534
10502
 
10535
- &.ncl-status-tooltip-building {
10536
- padding-left: 10px;
10537
- background-color: @pale-orange;
10503
+ &.only-key-value-input {
10504
+ width: 62%;
10505
+ }
10538
10506
 
10539
- &:after {
10540
- border-right-color: @pale-orange;
10541
- }
10542
- }
10507
+ &.only-key-value-input.use-type {
10508
+ width: 58%;
10509
+ }
10543
10510
 
10544
- &.ncl-status-tooltip-error {
10545
- padding-left: 10px;
10546
- background-color: @darkish-pink;
10511
+ &.only-value-input {
10512
+ width: 100%;
10513
+ }
10547
10514
 
10548
- &:after {
10549
- border-right-color: @darkish-pink;
10550
- }
10551
- }
10515
+ &.all-value-types {
10516
+ width: 40%;
10552
10517
 
10553
- .ncl-status-icon {
10554
- width: 13px;
10555
- margin-right: 5px;
10518
+ label {
10519
+ width: 65px;
10520
+ }
10521
+ }
10522
+ }
10556
10523
 
10557
- &.ncl-icon-ready {
10558
- margin-top: 3px;
10559
- font-size: 10px;
10560
- }
10524
+ .input-value-key-wrapper {
10525
+ width: 29%;
10561
10526
 
10562
- &.ncl-icon-building {
10563
- margin-top: 6px;
10564
- font-size: 5px;
10565
- }
10527
+ .input-value-key {
10528
+ flex-grow: 1;
10529
+ }
10566
10530
 
10567
- &.ncl-icon-error {
10568
- margin-top: 3px;
10569
- font-size: 10px;
10570
- }
10571
- }
10531
+ &:not(.use-type) {
10532
+ width: 61%;
10533
+ }
10534
+ }
10572
10535
 
10573
- .ncl-status-title {
10574
- font-size: 13px;
10575
- font-weight: normal;
10576
- white-space: nowrap;
10536
+ .input-type-wrapper {
10537
+ width: 13%;
10577
10538
 
10578
- &::first-letter {
10579
- text-transform: capitalize;
10580
- }
10539
+ .type-label {
10540
+ width: 60px;
10541
+ padding-left: 7px;
10542
+ }
10543
+
10544
+ &.all-value-types {
10545
+ width: 20%;
10546
+ }
10547
+
10548
+ .input-type {
10549
+ flex-grow: 1;
10550
+
10551
+ .default-dropdown {
10552
+ .default-dropdown-field {
10553
+ background-color: @white;
10554
+ border-radius: 0;
10555
+ }
10556
+
10557
+ .default-dropdown-container {
10558
+ z-index: 100;
10581
10559
  }
10582
10560
  }
10583
10561
  }
10584
10562
  }
10585
10563
  }
10586
10564
  }
10565
+ }
10587
10566
 
10588
- .test-pane-actions-wrapper {
10589
- margin-right: 35px;
10567
+ .ncl-monaco {
10568
+ .ncl-monaco-wrapper {
10569
+ padding-top: 20px;
10570
+ height: 100%;
10571
+ border: 1px solid @pale-grey;
10572
+ background-color: @white;
10573
+
10574
+ &.no-top-padding {
10575
+ padding-top: 0;
10576
+ }
10577
+
10578
+ .ncl-monaco-top-row {
10579
+ display: block;
10580
+ }
10581
+
10582
+ .ncl-monaco-editor {
10583
+ height: 100%;
10584
+ }
10585
+ }
10586
+
10587
+ .ncl-monaco-dark {
10588
+ background-color: @vs-dark;
10590
10589
  }
10591
10590
  }
10592
10591
 
10592
+
10593
10593
  .ncl-search-input {
10594
10594
  position: relative;
10595
10595
  color: @silver;
@@ -10868,16 +10868,161 @@ ncl-navigation-tabs {
10868
10868
  min-width: 0;
10869
10869
  }
10870
10870
 
10871
- .igz-action-panel {
10872
- &.invocation-tooltip {
10873
- height: 36px;
10874
- width: 56px;
10871
+ .igz-action-panel {
10872
+ &.invocation-tooltip {
10873
+ height: 36px;
10874
+ width: 56px;
10875
+ }
10876
+ }
10877
+ }
10878
+
10879
+ .function-status {
10880
+ min-width: 100px;
10881
+ }
10882
+ }
10883
+ }
10884
+ }
10885
+
10886
+ .function-event-wrapper {
10887
+ width: 600px;
10888
+ margin-bottom: -23px;
10889
+
10890
+ .header {
10891
+ display: flex;
10892
+ justify-content: space-between;
10893
+ border-bottom: 1px solid @pale-grey;
10894
+
10895
+ .title {
10896
+ font-size: 18px;
10897
+ }
10898
+ }
10899
+
10900
+ .content {
10901
+ border-bottom: 1px solid @pale-grey;
10902
+ padding: 16px 0 16px 16px;
10903
+
10904
+ .event-form {
10905
+ width: 88%;
10906
+
10907
+ .field-wrapper {
10908
+ display: flex;
10909
+ align-items: center;
10910
+ margin: 15px 0 0 0;
10911
+
10912
+ .field-label {
10913
+ font-size: 16px;
10914
+ margin-right: 10px;
10915
+ width: 195px;
10916
+ }
10917
+
10918
+ .field-content {
10919
+ width: 100%;
10920
+
10921
+ .ncl-monaco {
10922
+ height: 200px;
10923
+ }
10924
+
10925
+ .event-body {
10926
+ font-size: 13px;
10927
+ outline: none;
10928
+ border: 1px solid @pale-grey;
10929
+ resize: none;
10930
+ width: 100%;
10931
+ height: 100px;
10932
+ padding: 5px 5px 5px 16px;
10933
+ }
10934
+ }
10935
+ }
10936
+ }
10937
+
10938
+ .event-error {
10939
+ display: flex;
10940
+ font-size: 13px;
10941
+ align-items: center;
10942
+ justify-content: center;
10943
+ color: @darkish-pink;
10944
+ }
10945
+ }
10946
+
10947
+ .bottom-bar {
10948
+ height: 64px;
10949
+ display: flex;
10950
+ align-items: center;
10951
+ justify-content: flex-end;
10952
+
10953
+ .igz-button-primary {
10954
+ &.disabled {
10955
+ color: rgba(71, 64, 86, 0.24);
10956
+ border-radius: 2px;
10957
+ border: solid 1px #f3f3f6;
10958
+ background-color: #f3f3f6;
10959
+ cursor: default;
10960
+ display: inline-block;
10961
+
10962
+ &:hover {
10963
+ box-shadow: none;
10964
+ border: none;
10965
+ }
10966
+ }
10967
+ }
10968
+ }
10969
+ }
10970
+
10971
+ .ncl-version-configuration {
10972
+ > .igz-scrollable-container {
10973
+ padding: 24px 25px 22px 41px;
10974
+ }
10975
+
10976
+ .ncl-version-configuration-wrapper {
10977
+ > .row {
10978
+ display: flex;
10979
+ justify-content: space-between;
10980
+ flex-wrap: wrap;
10981
+
10982
+ .configuration-block {
10983
+ padding: 16px 23px 16px;
10984
+ background-color: @white;
10985
+ border: solid 1px @pale-grey;
10986
+ flex-grow: 1;
10987
+ flex-basis: 500px;
10988
+ margin-right: 16px;
10989
+ margin-bottom: 16px;
10990
+
10991
+ &.invisible {
10992
+ visibility: hidden;
10993
+ }
10994
+
10995
+ .title {
10996
+ font-size: 16px;
10997
+ font-weight: bold;
10998
+ font-style: normal;
10999
+ font-stretch: normal;
11000
+ letter-spacing: normal;
11001
+ text-align: left;
11002
+ color: @dusk-three;
11003
+ margin-bottom: 12px;
11004
+ }
11005
+
11006
+ .row {
11007
+ .label {
11008
+ display: block;
11009
+ font-family: Roboto, sans-serif;
11010
+ font-size: 14px;
11011
+ font-weight: 500;
11012
+ font-style: normal;
11013
+ font-stretch: normal;
11014
+ letter-spacing: normal;
11015
+ text-align: left;
11016
+ color: @dusk-three;
11017
+ padding: 0;
10875
11018
  }
10876
11019
  }
10877
- }
10878
11020
 
10879
- .function-status {
10880
- min-width: 100px;
11021
+ .ncl-version-configuration-labels, .ncl-version-configuration-annotations {
11022
+ .more-info-wrapper {
11023
+ height: 20px;
11024
+ }
11025
+ }
10881
11026
  }
10882
11027
  }
10883
11028
  }
@@ -11095,64 +11240,53 @@ ncl-navigation-tabs {
11095
11240
  }
11096
11241
  }
11097
11242
 
11098
- .ncl-version-configuration {
11099
- > .igz-scrollable-container {
11100
- padding: 24px 25px 22px 41px;
11101
- }
11102
-
11103
- .ncl-version-configuration-wrapper {
11104
- > .row {
11105
- display: flex;
11106
- justify-content: space-between;
11107
- flex-wrap: wrap;
11108
-
11109
- .configuration-block {
11110
- padding: 16px 23px 16px;
11111
- background-color: @white;
11112
- border: solid 1px @pale-grey;
11113
- flex-grow: 1;
11114
- flex-basis: 500px;
11115
- margin-right: 16px;
11116
- margin-bottom: 16px;
11243
+ .ncl-version-trigger {
11244
+ padding: 11px 24px;
11117
11245
 
11118
- &.invisible {
11119
- visibility: hidden;
11120
- }
11246
+ .common-table-header {
11247
+ border: none;
11248
+ padding-left: 24px;
11121
11249
 
11122
- .title {
11123
- font-size: 16px;
11124
- font-weight: bold;
11125
- font-style: normal;
11126
- font-stretch: normal;
11127
- letter-spacing: normal;
11128
- text-align: left;
11129
- color: @dusk-three;
11130
- margin-bottom: 12px;
11131
- }
11250
+ .common-table-cell {
11251
+ font-size: 14px;
11252
+ font-weight: bold;
11253
+ letter-spacing: normal;
11254
+ color: @dusk-three;
11255
+ height: 46px;
11256
+ }
11257
+ }
11132
11258
 
11133
- .row {
11134
- .label {
11135
- display: block;
11136
- font-family: Roboto, sans-serif;
11137
- font-size: 14px;
11138
- font-weight: 500;
11139
- font-style: normal;
11140
- font-stretch: normal;
11141
- letter-spacing: normal;
11142
- text-align: left;
11143
- color: @dusk-three;
11144
- padding: 0;
11145
- }
11259
+ .common-table-body {
11260
+ .common-table-row {
11261
+ &:not(.read-only):hover {
11262
+ .common-table-cells-container {
11263
+ background-color: @white;
11146
11264
  }
11147
11265
 
11148
- .ncl-version-configuration-labels, .ncl-version-configuration-annotations {
11149
- .more-info-wrapper {
11150
- height: 20px;
11151
- }
11266
+ .actions-menu {
11267
+ background-color: @white;
11152
11268
  }
11153
11269
  }
11154
11270
  }
11155
11271
  }
11272
+
11273
+ .item-row .item-name, .item-row .item-class, .item-row .item-info {
11274
+ padding-left: 0;
11275
+ }
11276
+
11277
+ .title-field-row .name-field, .item-row .item-name, .header-name {
11278
+ margin-right: 16px;
11279
+ width: 15%;
11280
+ }
11281
+
11282
+ .title-field-row .class-field, .item-row .item-class, .header-class {
11283
+ margin-right: 16px;
11284
+ width: 10%;
11285
+ }
11286
+
11287
+ .title-field-row .class-field {
11288
+ width: auto;
11289
+ }
11156
11290
  }
11157
11291
 
11158
11292
  .ncl-version-monitoring {
@@ -11230,190 +11364,56 @@ ncl-navigation-tabs {
11230
11364
  top: -2px;
11231
11365
  left: 5px;
11232
11366
  }
11233
- }
11234
-
11235
- .monitoring-invocation-field-invalid {
11236
- margin-left: 5px;
11237
- font-family: Roboto;
11238
- }
11239
-
11240
- .monitoring-replicas {
11241
- margin-left: 5px;
11242
- }
11243
- }
11244
-
11245
- .ncl-monitoring-build-logger {
11246
- .monitoring-block-title {
11247
- margin-left: 5px;
11248
- }
11249
-
11250
- .ncl-monitoring-build-logs {
11251
- padding: 0 0 7px 4px;
11252
-
11253
- &.collapsing {
11254
- transition-duration: 150ms;
11255
- }
11256
- }
11257
- }
11258
-
11259
- .ncl-monitoring-error-logger {
11260
- max-height: 335px;
11261
-
11262
- .monitoring-block-title {
11263
- margin-left: 5px;
11264
- }
11265
-
11266
- .ncl-monitoring-error-logs {
11267
- padding: 0 0 7px 4px;
11268
-
11269
- &.collapsing {
11270
- transition-duration: 150ms;
11271
- }
11272
-
11273
- .error-panel {
11274
- .logs-common();
11275
- color: @dusk-three;
11276
- padding: 5px;
11277
- margin-left: 24px;
11278
- max-height: 232px;
11279
- }
11280
- }
11281
- }
11282
- }
11283
- }
11284
- }
11285
-
11286
- .function-event-wrapper {
11287
- width: 600px;
11288
- margin-bottom: -23px;
11289
-
11290
- .header {
11291
- display: flex;
11292
- justify-content: space-between;
11293
- border-bottom: 1px solid @pale-grey;
11294
-
11295
- .title {
11296
- font-size: 18px;
11297
- }
11298
- }
11299
-
11300
- .content {
11301
- border-bottom: 1px solid @pale-grey;
11302
- padding: 16px 0 16px 16px;
11303
-
11304
- .event-form {
11305
- width: 88%;
11306
-
11307
- .field-wrapper {
11308
- display: flex;
11309
- align-items: center;
11310
- margin: 15px 0 0 0;
11311
-
11312
- .field-label {
11313
- font-size: 16px;
11314
- margin-right: 10px;
11315
- width: 195px;
11316
- }
11317
-
11318
- .field-content {
11319
- width: 100%;
11320
-
11321
- .ncl-monaco {
11322
- height: 200px;
11323
- }
11324
-
11325
- .event-body {
11326
- font-size: 13px;
11327
- outline: none;
11328
- border: 1px solid @pale-grey;
11329
- resize: none;
11330
- width: 100%;
11331
- height: 100px;
11332
- padding: 5px 5px 5px 16px;
11333
- }
11334
- }
11335
- }
11336
- }
11337
-
11338
- .event-error {
11339
- display: flex;
11340
- font-size: 13px;
11341
- align-items: center;
11342
- justify-content: center;
11343
- color: @darkish-pink;
11344
- }
11345
- }
11346
-
11347
- .bottom-bar {
11348
- height: 64px;
11349
- display: flex;
11350
- align-items: center;
11351
- justify-content: flex-end;
11352
-
11353
- .igz-button-primary {
11354
- &.disabled {
11355
- color: rgba(71, 64, 86, 0.24);
11356
- border-radius: 2px;
11357
- border: solid 1px #f3f3f6;
11358
- background-color: #f3f3f6;
11359
- cursor: default;
11360
- display: inline-block;
11361
-
11362
- &:hover {
11363
- box-shadow: none;
11364
- border: none;
11365
- }
11366
- }
11367
- }
11368
- }
11369
- }
11370
-
11371
- .ncl-version-trigger {
11372
- padding: 11px 24px;
11367
+ }
11373
11368
 
11374
- .common-table-header {
11375
- border: none;
11376
- padding-left: 24px;
11369
+ .monitoring-invocation-field-invalid {
11370
+ margin-left: 5px;
11371
+ font-family: Roboto;
11372
+ }
11377
11373
 
11378
- .common-table-cell {
11379
- font-size: 14px;
11380
- font-weight: bold;
11381
- letter-spacing: normal;
11382
- color: @dusk-three;
11383
- height: 46px;
11384
- }
11385
- }
11374
+ .monitoring-replicas {
11375
+ margin-left: 5px;
11376
+ }
11377
+ }
11386
11378
 
11387
- .common-table-body {
11388
- .common-table-row {
11389
- &:not(.read-only):hover {
11390
- .common-table-cells-container {
11391
- background-color: @white;
11379
+ .ncl-monitoring-build-logger {
11380
+ .monitoring-block-title {
11381
+ margin-left: 5px;
11392
11382
  }
11393
11383
 
11394
- .actions-menu {
11395
- background-color: @white;
11384
+ .ncl-monitoring-build-logs {
11385
+ padding: 0 0 7px 4px;
11386
+
11387
+ &.collapsing {
11388
+ transition-duration: 150ms;
11389
+ }
11396
11390
  }
11397
11391
  }
11398
- }
11399
- }
11400
11392
 
11401
- .item-row .item-name, .item-row .item-class, .item-row .item-info {
11402
- padding-left: 0;
11403
- }
11393
+ .ncl-monitoring-error-logger {
11394
+ max-height: 335px;
11404
11395
 
11405
- .title-field-row .name-field, .item-row .item-name, .header-name {
11406
- margin-right: 16px;
11407
- width: 15%;
11408
- }
11396
+ .monitoring-block-title {
11397
+ margin-left: 5px;
11398
+ }
11409
11399
 
11410
- .title-field-row .class-field, .item-row .item-class, .header-class {
11411
- margin-right: 16px;
11412
- width: 10%;
11413
- }
11400
+ .ncl-monitoring-error-logs {
11401
+ padding: 0 0 7px 4px;
11414
11402
 
11415
- .title-field-row .class-field {
11416
- width: auto;
11403
+ &.collapsing {
11404
+ transition-duration: 150ms;
11405
+ }
11406
+
11407
+ .error-panel {
11408
+ .logs-common();
11409
+ color: @dusk-three;
11410
+ padding: 5px;
11411
+ margin-left: 24px;
11412
+ max-height: 232px;
11413
+ }
11414
+ }
11415
+ }
11416
+ }
11417
11417
  }
11418
11418
  }
11419
11419
 
@@ -11437,6 +11437,105 @@ ncl-navigation-tabs {
11437
11437
  }
11438
11438
  }
11439
11439
 
11440
+ .function-from-scratch-content {
11441
+ .splash-screen {
11442
+ top: 0;
11443
+ }
11444
+
11445
+ .title-wrapper {
11446
+ margin-left: 50px;
11447
+
11448
+ .title {
11449
+ color: @dusk-three;
11450
+ font-size: 16px;
11451
+ font-weight: bold;
11452
+ }
11453
+ }
11454
+
11455
+ .function-configuration {
11456
+ margin: 28px 0 0 0;
11457
+
11458
+ .configuration-form {
11459
+ display: flex;
11460
+
11461
+ .function-name-wrapper {
11462
+ width: 50%;
11463
+ display: flex;
11464
+ padding: 0 24px 0 74px;
11465
+
11466
+ .projects-drop-down {
11467
+ width: 40%;
11468
+ margin-right: 48px;
11469
+
11470
+ .input-label {
11471
+ font-size: 14px;
11472
+ font-weight: 600;
11473
+ color: @dusk-three;
11474
+ }
11475
+
11476
+ igz-default-dropdown {
11477
+ .default-dropdown {
11478
+ background-color: @white;
11479
+
11480
+ .default-dropdown-field {
11481
+ &:focus {
11482
+ background-color: inherit;
11483
+ }
11484
+ }
11485
+ }
11486
+ }
11487
+ }
11488
+
11489
+ .function-name {
11490
+ width: 100%;
11491
+
11492
+ .input-label {
11493
+ font-size: 14px;
11494
+ font-weight: 600;
11495
+ color: @dusk-three;
11496
+ }
11497
+
11498
+ igz-validating-input-field {
11499
+ margin-left: 2px;
11500
+ }
11501
+ }
11502
+ }
11503
+
11504
+ .function-runtime-wrapper {
11505
+ width: 50%;
11506
+ padding-left: 24px;
11507
+ padding-right: 10%;
11508
+
11509
+ .function-runtime {
11510
+ .input-label {
11511
+ font-size: 14px;
11512
+ font-weight: 600;
11513
+ color: @dusk-three;
11514
+ }
11515
+
11516
+ igz-default-dropdown {
11517
+ .default-dropdown {
11518
+ background-color: @white;
11519
+
11520
+ .default-dropdown-field {
11521
+ &:focus {
11522
+ background-color: inherit;
11523
+ }
11524
+ }
11525
+ }
11526
+ }
11527
+
11528
+ .bottom-bar {
11529
+ display: flex;
11530
+ justify-content: flex-end;
11531
+ margin-top: 48px;
11532
+ }
11533
+ }
11534
+ }
11535
+ }
11536
+ }
11537
+ }
11538
+
11440
11539
  .function-from-template-content {
11441
11540
  .ncl-function-from-template-color-set();
11442
11541
 
@@ -11662,136 +11761,37 @@ ncl-navigation-tabs {
11662
11761
  }
11663
11762
  }
11664
11763
 
11665
- .function-template {
11666
- width: 100%;
11667
- min-height: 169px;
11668
- padding: 24px;
11669
- background-color: @white;
11670
- border-radius: 2px;
11671
- z-index: 1;
11672
-
11673
- .function-template-content {
11674
- color: @dusk-three;
11675
-
11676
- .template-title {
11677
- font-size: 18px;
11678
- font-weight: bold;
11679
- width: 100%;
11680
- margin-bottom: 15px;
11681
- }
11682
-
11683
- .template-description {
11684
- width: 100%;
11685
- max-height: 62px;
11686
- font-size: 14px;
11687
- overflow: hidden;
11688
- }
11689
-
11690
- .template-read-more {
11691
- color: @greyish-purple;
11692
- font-style: italic;
11693
- }
11694
- }
11695
- }
11696
- }
11697
- }
11698
- }
11699
- }
11700
- }
11701
-
11702
- .function-from-scratch-content {
11703
- .splash-screen {
11704
- top: 0;
11705
- }
11706
-
11707
- .title-wrapper {
11708
- margin-left: 50px;
11709
-
11710
- .title {
11711
- color: @dusk-three;
11712
- font-size: 16px;
11713
- font-weight: bold;
11714
- }
11715
- }
11716
-
11717
- .function-configuration {
11718
- margin: 28px 0 0 0;
11719
-
11720
- .configuration-form {
11721
- display: flex;
11722
-
11723
- .function-name-wrapper {
11724
- width: 50%;
11725
- display: flex;
11726
- padding: 0 24px 0 74px;
11727
-
11728
- .projects-drop-down {
11729
- width: 40%;
11730
- margin-right: 48px;
11731
-
11732
- .input-label {
11733
- font-size: 14px;
11734
- font-weight: 600;
11735
- color: @dusk-three;
11736
- }
11737
-
11738
- igz-default-dropdown {
11739
- .default-dropdown {
11740
- background-color: @white;
11741
-
11742
- .default-dropdown-field {
11743
- &:focus {
11744
- background-color: inherit;
11745
- }
11746
- }
11747
- }
11748
- }
11749
- }
11750
-
11751
- .function-name {
11752
- width: 100%;
11753
-
11754
- .input-label {
11755
- font-size: 14px;
11756
- font-weight: 600;
11757
- color: @dusk-three;
11758
- }
11759
-
11760
- igz-validating-input-field {
11761
- margin-left: 2px;
11762
- }
11763
- }
11764
- }
11764
+ .function-template {
11765
+ width: 100%;
11766
+ min-height: 169px;
11767
+ padding: 24px;
11768
+ background-color: @white;
11769
+ border-radius: 2px;
11770
+ z-index: 1;
11765
11771
 
11766
- .function-runtime-wrapper {
11767
- width: 50%;
11768
- padding-left: 24px;
11769
- padding-right: 10%;
11772
+ .function-template-content {
11773
+ color: @dusk-three;
11770
11774
 
11771
- .function-runtime {
11772
- .input-label {
11773
- font-size: 14px;
11774
- font-weight: 600;
11775
- color: @dusk-three;
11776
- }
11775
+ .template-title {
11776
+ font-size: 18px;
11777
+ font-weight: bold;
11778
+ width: 100%;
11779
+ margin-bottom: 15px;
11780
+ }
11777
11781
 
11778
- igz-default-dropdown {
11779
- .default-dropdown {
11780
- background-color: @white;
11782
+ .template-description {
11783
+ width: 100%;
11784
+ max-height: 62px;
11785
+ font-size: 14px;
11786
+ overflow: hidden;
11787
+ }
11781
11788
 
11782
- .default-dropdown-field {
11783
- &:focus {
11784
- background-color: inherit;
11785
- }
11789
+ .template-read-more {
11790
+ color: @greyish-purple;
11791
+ font-style: italic;
11786
11792
  }
11787
11793
  }
11788
11794
  }
11789
-
11790
- .bottom-bar {
11791
- display: flex;
11792
- justify-content: flex-end;
11793
- margin-top: 48px;
11794
- }
11795
11795
  }
11796
11796
  }
11797
11797
  }
@@ -12582,310 +12582,112 @@ ncl-navigation-tabs {
12582
12582
  padding: 0 10px 0 17px;
12583
12583
  }
12584
12584
 
12585
- .input-placeholder {
12586
- left: 18px;
12587
- font-style: italic;
12588
- font-size: 14px;
12589
- }
12590
- }
12591
- }
12592
- }
12593
- }
12594
-
12595
- .ncl-test-events-navigation-tabs {
12596
- display: flex;
12597
- background: #f8f8fb;
12598
- height: 40px;
12599
- border-top: 1px solid @pale-grey;
12600
- border-bottom: 1px solid @pale-grey;
12601
-
12602
- .test-events-navigation-tab {
12603
- .duskThree(0.64);
12604
- position: relative;
12605
- float: left;
12606
- height: 27px;
12607
- padding: 10px 40px 0;
12608
- font-family: @font-family-sans-serif;
12609
- color: @color;
12610
- font-size: 13px;
12611
- text-align: center;
12612
- cursor: pointer;
12613
- border-bottom: none;
12614
- box-sizing: content-box;
12615
-
12616
- &.active, &.active:hover {
12617
- background: none;
12618
- color: @dusk-three;
12619
- border-bottom: 2px solid @dusk-three;
12620
- font-weight: bold;
12621
-
12622
- .badge {
12623
- color: @white;
12624
- background-color: @light-grey-blue;
12625
- }
12626
- }
12627
-
12628
- .badge {
12629
- display: inline-block;
12630
- min-width: 22px;
12631
- padding: 3px 7px;
12632
- font-size: 12px;
12633
- font-weight: 500;
12634
- color: @greyish-purple;
12635
- line-height: 1;
12636
- vertical-align: middle;
12637
- white-space: nowrap;
12638
- text-align: center;
12639
- background-color: @pale-grey;
12640
- border-radius: 7.5px;
12641
- margin-left: 7px;
12642
- margin-top: -4px;
12643
- }
12644
- }
12645
-
12646
- .default-dropdown {
12647
- float: left;
12648
- width: 105px;
12649
-
12650
- .default-dropdown-field:not(:hover) {
12651
- border-color: transparent;
12652
- }
12653
-
12654
- .default-dropdown-container {
12655
- z-index: 3;
12656
- }
12657
- }
12658
- }
12659
-
12660
- .ncl-test-events-logs {
12661
- padding: 6px 17px 25px;
12662
- background-color: @white;
12663
-
12664
- .functional-buttons {
12665
- .duskThree(0.64);
12666
- display: flex;
12667
- justify-content: flex-end;
12668
- color: @color;
12669
- font-size: 16px;
12670
-
12671
- > div {
12672
- margin-right: 24px;
12673
-
12674
- &:hover {
12675
- color: @dusk-three;
12676
- }
12677
- }
12678
- }
12679
-
12680
- .collapsed-row {
12681
- .black(0.2);
12682
- display: flex;
12683
- align-items: center;
12684
- position: relative;
12685
- height: 36px;
12686
- background-color: @white;
12687
- color: @dusk-three;
12688
- box-shadow: 1.7px 1.1px 4px 0 @color;
12689
- border: solid 1px @pale-grey;
12690
- margin-bottom: 10px;
12691
-
12692
- .igz-icon-right {
12693
- .duskThree(0.64);
12694
- font-size: 12px;
12695
- color: @color;
12696
- margin: 0 8px 0 12px;
12697
-
12698
- &::before {
12699
- vertical-align: text-bottom;
12700
- }
12701
- }
12702
-
12703
- .level-icon {
12704
- display: inline-block;
12705
- margin-right: 8px;
12706
- width: 20px;
12707
- text-align: center;
12708
-
12709
- &::before {
12710
- font-size: 16px;
12711
- vertical-align: text-bottom;
12712
- }
12713
-
12714
- &.ncl-icon-debug {
12715
- color: @orangish;
12716
-
12717
- &::before {
12718
- font-size: 18px;
12719
- }
12720
- }
12721
-
12722
- &.igz-icon-info-round {
12723
- color: @orangish;
12724
- }
12725
-
12726
- &.igz-icon-warning {
12727
- color: @orangish;
12728
- }
12729
-
12730
- &.igz-icon-cancel-path {
12731
- color: @orangish;
12732
- }
12733
- }
12734
-
12735
- .date {
12736
- display: inline-block;
12737
- width: 230px;
12738
- font-size: 14px;
12739
- font-weight: bold;
12740
- margin-right: 15px;
12741
- }
12742
-
12743
- .message {
12744
- display: inline-block;
12745
- width: 200px;
12746
- margin-right: 30px;
12747
- }
12748
-
12749
- .ncl-icon-parameters {
12750
- .duskThree(0.64);
12751
- color: @color;
12752
- font-size: 14px;
12753
- position: absolute;
12754
- top: 9px;
12755
- right: 9px;
12756
- }
12757
- }
12758
-
12759
- .expanded-row {
12760
- background-color: @white;
12761
- color: @dusk-three;
12762
- border: solid 1px @pale-grey;
12763
- margin-bottom: 10px;
12764
-
12765
- .header {
12766
- position: relative;
12767
- display: flex;
12768
- align-items: center;
12769
- height: 34px;
12770
-
12771
- .igz-icon-down {
12772
- .duskThree(0.64);
12773
- font-size: 12px;
12774
- color: @color;
12775
- margin: 0 8px 0 12px;
12776
-
12777
- &::before {
12778
- vertical-align: text-bottom;
12585
+ .input-placeholder {
12586
+ left: 18px;
12587
+ font-style: italic;
12588
+ font-size: 14px;
12779
12589
  }
12780
12590
  }
12591
+ }
12592
+ }
12593
+ }
12781
12594
 
12782
- .level-icon {
12783
- display: inline-block;
12784
- margin-right: 8px;
12785
- width: 20px;
12786
- text-align: center;
12595
+ @desktop: 1350px;
12596
+ @desktop-low: 1202px;
12597
+ @desktop-middle: 1550px;
12787
12598
 
12788
- &::before {
12789
- font-size: 16px;
12790
- vertical-align: text-bottom;
12791
- }
12599
+ .ncl-version-configuration-basic-settings {
12600
+ .row {
12601
+ display: flex;
12602
+ justify-content: space-between;
12792
12603
 
12793
- &.ncl-icon-debug {
12794
- color: @orangish;
12604
+ &:not(:last-child) {
12605
+ margin-bottom: 23px;
12606
+ }
12795
12607
 
12796
- &::before {
12797
- font-size: 18px;
12798
- }
12799
- }
12608
+ &:last-child {
12609
+ margin-bottom: 4px;
12610
+ }
12800
12611
 
12801
- &.igz-icon-info-round {
12802
- color: @orangish;
12803
- }
12612
+ &.enable-checkbox {
12613
+ justify-content: flex-start;
12614
+ margin-bottom: 18px;
12615
+ }
12804
12616
 
12805
- &.igz-icon-warning {
12806
- color: @orangish;
12807
- }
12617
+ > div {
12618
+ flex: 1;
12808
12619
 
12809
- &.igz-icon-cancel-path {
12810
- color: @orangish;
12811
- }
12620
+ &:not(:last-child) {
12621
+ margin-right: 46px;
12812
12622
  }
12813
12623
 
12814
- .date {
12815
- display: inline-block;
12816
- width: 230px;
12817
- font-size: 14px;
12818
- font-weight: bold;
12819
- margin-right: 15px;
12624
+ .label {
12625
+ padding: 0;
12626
+ margin-bottom: 5px;
12820
12627
  }
12821
12628
 
12822
- .ncl-icon-parameters {
12823
- .duskThree(0.64);
12824
- position: absolute;
12825
- top: 9px;
12826
- right: 9px;
12827
- color: @color;
12828
- font-size: 14px;
12629
+ &.timeout-block {
12630
+ .label {
12631
+ margin-bottom: 3px;
12632
+ }
12633
+
12634
+ .timeout-values {
12635
+ margin-left: 27px;
12636
+
12637
+ .inputs {
12638
+ display: flex;
12639
+ align-items: center;
12640
+
12641
+ .values-label {
12642
+ .duskThree(0.9);
12643
+ margin: 0 17px 0 8px;
12644
+ font-size: 14px;
12645
+ font-weight: normal;
12646
+ font-style: normal;
12647
+ letter-spacing: normal;
12648
+ text-align: left;
12649
+ color: @color;
12650
+ }
12651
+ }
12652
+ }
12829
12653
  }
12830
12654
  }
12831
12655
 
12832
- .expanded-body {
12833
- font-size: 14px;
12834
- color: @dusk-three;
12656
+ .logger-block {
12657
+ display: flex;
12658
+ margin-top: 3px;
12835
12659
 
12836
- .error {
12837
- width: 71%;
12838
- border-radius: 3px;
12839
- background-color: #fbe5e8;
12840
- border: solid 1px @darkish-pink;
12841
- color: @darkish-pink;
12842
- word-wrap: break-word;
12843
- margin-left: 62px;
12844
- padding: 12px;
12845
- margin-bottom: 16px;
12846
- }
12660
+ .logger-dropdown {
12661
+ .default-dropdown {
12662
+ position: relative;
12663
+ height: 36px;
12847
12664
 
12848
- .message {
12849
- display: inline-block;
12850
- width: 70%;
12851
- word-wrap: break-word;
12852
- margin: 0 0 16px 62px;
12665
+ .dropdown-overlap {
12666
+ z-index: 100;
12667
+ }
12668
+ }
12853
12669
  }
12854
12670
 
12855
- .parameters {
12856
- padding: 0 62px 16px;
12671
+ > div {
12672
+ flex: 1;
12857
12673
 
12858
- .parameters-header {
12859
- font-weight: bold;
12674
+ &:not(:last-child) {
12675
+ margin-right: 16px;
12860
12676
  }
12861
12677
 
12862
- > div {
12863
- display: flex;
12864
- line-height: 2;
12865
-
12866
- .labels {
12867
- color: @greyish-purple;
12868
- font-size: 14px;
12869
- width: 30%;
12870
- }
12678
+ .label {
12679
+ padding: 0;
12680
+ margin-bottom: 5px;
12681
+ }
12871
12682
 
12872
- .values {
12873
- color: @dusk-three;
12874
- font-size: 14px;
12875
- width: 70%;
12876
- }
12683
+ &.logger-input {
12684
+ flex-grow: 1.95;
12877
12685
  }
12878
12686
  }
12879
12687
  }
12880
12688
  }
12881
-
12882
- .no-logs {
12883
- margin: 10px auto 0;
12884
- font-size: 14px;
12885
- color: @pale-grey;
12886
- text-align: center;
12887
- }
12888
12689
  }
12690
+
12889
12691
  .ncl-version-configuration-build {
12890
12692
  &.disabled {
12891
12693
  opacity: .5;
@@ -13094,312 +12896,510 @@ ncl-navigation-tabs {
13094
12896
  }
13095
12897
  }
13096
12898
 
13097
- .configuration-build-title-wrapper {
12899
+ .configuration-build-title-wrapper {
12900
+ display: flex;
12901
+ justify-content: space-between;
12902
+
12903
+ .igz-action-menu {
12904
+ .menu-button {
12905
+ width: 40px;
12906
+ height: 40px;
12907
+ display: flex;
12908
+ justify-content: center;
12909
+ align-items: center;
12910
+ font-size: 22px;
12911
+ margin: -10px -15px 0 0;
12912
+ border-radius: 50%;
12913
+ color: @dusk-three;
12914
+ }
12915
+
12916
+ .active {
12917
+ .black(0.1);
12918
+ background-color: @silver;
12919
+ box-shadow: inset 0px 2px 3px 0 @color;
12920
+ }
12921
+
12922
+ .menu-dropdown {
12923
+ margin-top: 4px;
12924
+ right: -18px;
12925
+ }
12926
+ }
12927
+ }
12928
+ }
12929
+
12930
+ .ncl-version-configuration-logging {
12931
+ .row {
12932
+ display: flex;
12933
+ position: relative;
12934
+
12935
+ .logging-wrapper {
12936
+ width: 100%;
12937
+ }
12938
+ }
12939
+ }
12940
+
12941
+ @desktop-middle: 1550px;
12942
+
12943
+ .ncl-version-configuration-resources {
12944
+ .row {
12945
+ .range-inputs-row {
12946
+ display: flex;
12947
+ align-items: flex-end;
12948
+
12949
+ .row-title {
12950
+ margin-bottom: 8px;
12951
+ }
12952
+ }
12953
+
12954
+ .form-row {
12955
+ padding: 12px 0;
12956
+
12957
+ .row-title, .input-title {
12958
+ font-size: 14px;
12959
+ }
12960
+
12961
+ .row-title {
12962
+ font-weight: 500;
12963
+ }
12964
+
12965
+ .input-wrapper {
12966
+ display: flex;
12967
+ flex-wrap: wrap;
12968
+
12969
+ .input-title {
12970
+ width: 100%;
12971
+ }
12972
+
12973
+ .memory-number-input, .cpu-number-input {
12974
+ width: 50%;
12975
+ }
12976
+
12977
+ .memory-size-dropdown, .cpu-dropdown {
12978
+ width: 35%
12979
+ }
12980
+
12981
+ .gpu-number-input, .replicas-number-input {
12982
+ width: 85%;
12983
+ }
12984
+ }
12985
+ }
12986
+
12987
+ .slider-block {
12988
+ padding-top: 0;
12989
+ margin-bottom: 10px;
12990
+
12991
+ .slider {
12992
+ width: 70%;
12993
+ }
12994
+ }
12995
+ }
12996
+ }
12997
+
12998
+ .ncl-version-configuration-runtime-attributes {
12999
+ .row:not(.info-row) {
13098
13000
  display: flex;
13099
13001
  justify-content: space-between;
13100
13002
 
13101
- .igz-action-menu {
13102
- .menu-button {
13103
- width: 40px;
13104
- height: 40px;
13105
- display: flex;
13106
- justify-content: center;
13107
- align-items: center;
13108
- font-size: 22px;
13109
- margin: -10px -15px 0 0;
13110
- border-radius: 50%;
13111
- color: @dusk-three;
13112
- }
13003
+ &:not(:last-child) {
13004
+ margin-top: 10px;
13005
+ margin-bottom: 25px;
13006
+ }
13113
13007
 
13114
- .active {
13115
- .black(0.1);
13116
- background-color: @silver;
13117
- box-shadow: inset 0px 2px 3px 0 @color;
13008
+ > div {
13009
+ flex: 0.65;
13010
+
13011
+ &:not(:last-child) {
13012
+ margin-right: 16px;
13118
13013
  }
13119
13014
 
13120
- .menu-dropdown {
13121
- margin-top: 4px;
13122
- right: -18px;
13015
+ &.arguments-input {
13016
+ flex-grow: 2;
13123
13017
  }
13124
13018
  }
13125
13019
  }
13126
- }
13127
-
13128
- @desktop: 1350px;
13129
- @desktop-low: 1202px;
13130
- @desktop-middle: 1550px;
13131
13020
 
13132
- .ncl-version-configuration-basic-settings {
13133
13021
  .row {
13134
- display: flex;
13135
- justify-content: space-between;
13136
-
13137
- &:not(:last-child) {
13138
- margin-bottom: 23px;
13022
+ .runtime {
13023
+ height: 36px;
13024
+ border-radius: 2px;
13025
+ padding: 9px 0 0 14px;
13026
+ text-transform: capitalize;
13027
+ font-family: @font-family-sans-serif;
13028
+ font-size: 14px;
13029
+ text-align: left;
13030
+ color: @dusk-three;
13139
13031
  }
13140
13032
 
13141
- &:last-child {
13142
- margin-bottom: 4px;
13033
+ .textarea-field {
13034
+ height: 177px;
13035
+ resize: none;
13036
+ white-space: pre;
13037
+ overflow-x: auto;
13143
13038
  }
13039
+ }
13144
13040
 
13145
- &.enable-checkbox {
13146
- justify-content: flex-start;
13147
- margin-bottom: 18px;
13041
+ .java-attribute {
13042
+ .textarea-field {
13043
+ height: 70px;
13044
+ overflow-y: auto;
13148
13045
  }
13046
+ }
13047
+ }
13149
13048
 
13150
- > div {
13151
- flex: 1;
13049
+ .ncl-version-configuration-volumes {
13050
+ .ncl-version-volume {
13051
+ .common-table-header {
13052
+ border: none;
13053
+ padding-left: 40px;
13054
+ padding-right: 60px;
13152
13055
 
13153
- &:not(:last-child) {
13154
- margin-right: 46px;
13056
+ .common-table-cell {
13057
+ font-size: 14px;
13058
+ font-weight: bold;
13059
+ letter-spacing: normal;
13060
+ color: @dusk-three;
13061
+ height: 46px;
13155
13062
  }
13156
13063
 
13157
- .label {
13158
- padding: 0;
13159
- margin-bottom: 5px;
13160
- }
13064
+ &.item-header {
13065
+ display: flex;
13161
13066
 
13162
- &.timeout-block {
13163
- .label {
13164
- margin-bottom: 3px;
13067
+ .item-name {
13068
+ width: 25%;
13069
+ padding-left: 0;
13165
13070
  }
13166
13071
 
13167
- .timeout-values {
13168
- margin-left: 27px;
13169
-
13170
- .inputs {
13171
- display: flex;
13172
- align-items: center;
13072
+ .item-class {
13073
+ width: 20%;
13074
+ }
13173
13075
 
13174
- .values-label {
13175
- .duskThree(0.9);
13176
- margin: 0 17px 0 8px;
13177
- font-size: 14px;
13178
- font-weight: normal;
13179
- font-style: normal;
13180
- letter-spacing: normal;
13181
- text-align: left;
13182
- color: @color;
13183
- }
13184
- }
13076
+ .item-info {
13077
+ width: 55%;
13185
13078
  }
13186
13079
  }
13187
13080
  }
13188
13081
 
13189
- .logger-block {
13190
- display: flex;
13191
- margin-top: 3px;
13192
-
13193
- .logger-dropdown {
13194
- .default-dropdown {
13195
- position: relative;
13196
- height: 36px;
13197
-
13198
- .dropdown-overlap {
13199
- z-index: 100;
13200
- }
13082
+ .common-table-body {
13083
+ .ncl-collapsing-row .item-row {
13084
+ .item-name {
13085
+ padding-left: 0;
13086
+ width: 25%;
13201
13087
  }
13202
- }
13203
-
13204
- > div {
13205
- flex: 1;
13206
13088
 
13207
- &:not(:last-child) {
13208
- margin-right: 16px;
13089
+ .item-class {
13090
+ width: 20%;
13209
13091
  }
13210
13092
 
13211
- .label {
13212
- padding: 0;
13213
- margin-bottom: 5px;
13093
+ .item-info {
13094
+ width: 55%;
13214
13095
  }
13096
+ }
13215
13097
 
13216
- &.logger-input {
13217
- flex-grow: 1.95;
13098
+ .common-table-row {
13099
+ &:not(.read-only):hover {
13100
+ .common-table-cells-container {
13101
+ background-color: @white;
13102
+ }
13103
+
13104
+ .actions-menu {
13105
+ background-color: @white;
13106
+ }
13218
13107
  }
13219
13108
  }
13220
13109
  }
13221
13110
  }
13222
13111
  }
13223
13112
 
13224
- .ncl-version-configuration-logging {
13225
- .row {
13113
+ .ncl-test-events-logs {
13114
+ padding: 6px 17px 25px;
13115
+ background-color: @white;
13116
+
13117
+ .functional-buttons {
13118
+ .duskThree(0.64);
13226
13119
  display: flex;
13227
- position: relative;
13120
+ justify-content: flex-end;
13121
+ color: @color;
13122
+ font-size: 16px;
13228
13123
 
13229
- .logging-wrapper {
13230
- width: 100%;
13124
+ > div {
13125
+ margin-right: 24px;
13126
+
13127
+ &:hover {
13128
+ color: @dusk-three;
13129
+ }
13231
13130
  }
13232
13131
  }
13233
- }
13234
13132
 
13235
- .ncl-version-configuration-runtime-attributes {
13236
- .row:not(.info-row) {
13133
+ .collapsed-row {
13134
+ .black(0.2);
13237
13135
  display: flex;
13238
- justify-content: space-between;
13136
+ align-items: center;
13137
+ position: relative;
13138
+ height: 36px;
13139
+ background-color: @white;
13140
+ color: @dusk-three;
13141
+ box-shadow: 1.7px 1.1px 4px 0 @color;
13142
+ border: solid 1px @pale-grey;
13143
+ margin-bottom: 10px;
13239
13144
 
13240
- &:not(:last-child) {
13241
- margin-top: 10px;
13242
- margin-bottom: 25px;
13145
+ .igz-icon-right {
13146
+ .duskThree(0.64);
13147
+ font-size: 12px;
13148
+ color: @color;
13149
+ margin: 0 8px 0 12px;
13150
+
13151
+ &::before {
13152
+ vertical-align: text-bottom;
13153
+ }
13243
13154
  }
13244
13155
 
13245
- > div {
13246
- flex: 0.65;
13156
+ .level-icon {
13157
+ display: inline-block;
13158
+ margin-right: 8px;
13159
+ width: 20px;
13160
+ text-align: center;
13247
13161
 
13248
- &:not(:last-child) {
13249
- margin-right: 16px;
13162
+ &::before {
13163
+ font-size: 16px;
13164
+ vertical-align: text-bottom;
13250
13165
  }
13251
13166
 
13252
- &.arguments-input {
13253
- flex-grow: 2;
13167
+ &.ncl-icon-debug {
13168
+ color: @orangish;
13169
+
13170
+ &::before {
13171
+ font-size: 18px;
13172
+ }
13173
+ }
13174
+
13175
+ &.igz-icon-info-round {
13176
+ color: @orangish;
13177
+ }
13178
+
13179
+ &.igz-icon-warning {
13180
+ color: @orangish;
13181
+ }
13182
+
13183
+ &.igz-icon-cancel-path {
13184
+ color: @orangish;
13254
13185
  }
13255
13186
  }
13256
- }
13257
13187
 
13258
- .row {
13259
- .runtime {
13260
- height: 36px;
13261
- border-radius: 2px;
13262
- padding: 9px 0 0 14px;
13263
- text-transform: capitalize;
13264
- font-family: @font-family-sans-serif;
13188
+ .date {
13189
+ display: inline-block;
13190
+ width: 230px;
13265
13191
  font-size: 14px;
13266
- text-align: left;
13267
- color: @dusk-three;
13192
+ font-weight: bold;
13193
+ margin-right: 15px;
13268
13194
  }
13269
13195
 
13270
- .textarea-field {
13271
- height: 177px;
13272
- resize: none;
13273
- white-space: pre;
13274
- overflow-x: auto;
13196
+ .message {
13197
+ display: inline-block;
13198
+ width: 200px;
13199
+ margin-right: 30px;
13275
13200
  }
13276
- }
13277
13201
 
13278
- .java-attribute {
13279
- .textarea-field {
13280
- height: 70px;
13281
- overflow-y: auto;
13202
+ .ncl-icon-parameters {
13203
+ .duskThree(0.64);
13204
+ color: @color;
13205
+ font-size: 14px;
13206
+ position: absolute;
13207
+ top: 9px;
13208
+ right: 9px;
13282
13209
  }
13283
13210
  }
13284
- }
13285
13211
 
13286
- @desktop-middle: 1550px;
13212
+ .expanded-row {
13213
+ background-color: @white;
13214
+ color: @dusk-three;
13215
+ border: solid 1px @pale-grey;
13216
+ margin-bottom: 10px;
13287
13217
 
13288
- .ncl-version-configuration-resources {
13289
- .row {
13290
- .range-inputs-row {
13218
+ .header {
13219
+ position: relative;
13291
13220
  display: flex;
13292
- align-items: flex-end;
13293
-
13294
- .row-title {
13295
- margin-bottom: 8px;
13296
- }
13297
- }
13221
+ align-items: center;
13222
+ height: 34px;
13298
13223
 
13299
- .form-row {
13300
- padding: 12px 0;
13224
+ .igz-icon-down {
13225
+ .duskThree(0.64);
13226
+ font-size: 12px;
13227
+ color: @color;
13228
+ margin: 0 8px 0 12px;
13301
13229
 
13302
- .row-title, .input-title {
13303
- font-size: 14px;
13230
+ &::before {
13231
+ vertical-align: text-bottom;
13232
+ }
13304
13233
  }
13305
13234
 
13306
- .row-title {
13307
- font-weight: 500;
13308
- }
13235
+ .level-icon {
13236
+ display: inline-block;
13237
+ margin-right: 8px;
13238
+ width: 20px;
13239
+ text-align: center;
13309
13240
 
13310
- .input-wrapper {
13311
- display: flex;
13312
- flex-wrap: wrap;
13241
+ &::before {
13242
+ font-size: 16px;
13243
+ vertical-align: text-bottom;
13244
+ }
13313
13245
 
13314
- .input-title {
13315
- width: 100%;
13246
+ &.ncl-icon-debug {
13247
+ color: @orangish;
13248
+
13249
+ &::before {
13250
+ font-size: 18px;
13251
+ }
13316
13252
  }
13317
13253
 
13318
- .memory-number-input, .cpu-number-input {
13319
- width: 50%;
13254
+ &.igz-icon-info-round {
13255
+ color: @orangish;
13320
13256
  }
13321
13257
 
13322
- .memory-size-dropdown, .cpu-dropdown {
13323
- width: 35%
13258
+ &.igz-icon-warning {
13259
+ color: @orangish;
13324
13260
  }
13325
13261
 
13326
- .gpu-number-input, .replicas-number-input {
13327
- width: 85%;
13262
+ &.igz-icon-cancel-path {
13263
+ color: @orangish;
13328
13264
  }
13329
13265
  }
13330
- }
13331
13266
 
13332
- .slider-block {
13333
- padding-top: 0;
13334
- margin-bottom: 10px;
13267
+ .date {
13268
+ display: inline-block;
13269
+ width: 230px;
13270
+ font-size: 14px;
13271
+ font-weight: bold;
13272
+ margin-right: 15px;
13273
+ }
13335
13274
 
13336
- .slider {
13337
- width: 70%;
13275
+ .ncl-icon-parameters {
13276
+ .duskThree(0.64);
13277
+ position: absolute;
13278
+ top: 9px;
13279
+ right: 9px;
13280
+ color: @color;
13281
+ font-size: 14px;
13338
13282
  }
13339
13283
  }
13340
- }
13341
- }
13342
13284
 
13343
- .ncl-version-configuration-volumes {
13344
- .ncl-version-volume {
13345
- .common-table-header {
13346
- border: none;
13347
- padding-left: 40px;
13348
- padding-right: 60px;
13285
+ .expanded-body {
13286
+ font-size: 14px;
13287
+ color: @dusk-three;
13349
13288
 
13350
- .common-table-cell {
13351
- font-size: 14px;
13352
- font-weight: bold;
13353
- letter-spacing: normal;
13354
- color: @dusk-three;
13355
- height: 46px;
13289
+ .error {
13290
+ width: 71%;
13291
+ border-radius: 3px;
13292
+ background-color: #fbe5e8;
13293
+ border: solid 1px @darkish-pink;
13294
+ color: @darkish-pink;
13295
+ word-wrap: break-word;
13296
+ margin-left: 62px;
13297
+ padding: 12px;
13298
+ margin-bottom: 16px;
13356
13299
  }
13357
13300
 
13358
- &.item-header {
13359
- display: flex;
13301
+ .message {
13302
+ display: inline-block;
13303
+ width: 70%;
13304
+ word-wrap: break-word;
13305
+ margin: 0 0 16px 62px;
13306
+ }
13360
13307
 
13361
- .item-name {
13362
- width: 25%;
13363
- padding-left: 0;
13364
- }
13308
+ .parameters {
13309
+ padding: 0 62px 16px;
13365
13310
 
13366
- .item-class {
13367
- width: 20%;
13311
+ .parameters-header {
13312
+ font-weight: bold;
13368
13313
  }
13369
13314
 
13370
- .item-info {
13371
- width: 55%;
13315
+ > div {
13316
+ display: flex;
13317
+ line-height: 2;
13318
+
13319
+ .labels {
13320
+ color: @greyish-purple;
13321
+ font-size: 14px;
13322
+ width: 30%;
13323
+ }
13324
+
13325
+ .values {
13326
+ color: @dusk-three;
13327
+ font-size: 14px;
13328
+ width: 70%;
13329
+ }
13372
13330
  }
13373
13331
  }
13374
13332
  }
13333
+ }
13375
13334
 
13376
- .common-table-body {
13377
- .ncl-collapsing-row .item-row {
13378
- .item-name {
13379
- padding-left: 0;
13380
- width: 25%;
13381
- }
13335
+ .no-logs {
13336
+ margin: 10px auto 0;
13337
+ font-size: 14px;
13338
+ color: @pale-grey;
13339
+ text-align: center;
13340
+ }
13341
+ }
13342
+ .ncl-test-events-navigation-tabs {
13343
+ display: flex;
13344
+ background: #f8f8fb;
13345
+ height: 40px;
13346
+ border-top: 1px solid @pale-grey;
13347
+ border-bottom: 1px solid @pale-grey;
13382
13348
 
13383
- .item-class {
13384
- width: 20%;
13385
- }
13349
+ .test-events-navigation-tab {
13350
+ .duskThree(0.64);
13351
+ position: relative;
13352
+ float: left;
13353
+ height: 27px;
13354
+ padding: 10px 40px 0;
13355
+ font-family: @font-family-sans-serif;
13356
+ color: @color;
13357
+ font-size: 13px;
13358
+ text-align: center;
13359
+ cursor: pointer;
13360
+ border-bottom: none;
13361
+ box-sizing: content-box;
13386
13362
 
13387
- .item-info {
13388
- width: 55%;
13389
- }
13363
+ &.active, &.active:hover {
13364
+ background: none;
13365
+ color: @dusk-three;
13366
+ border-bottom: 2px solid @dusk-three;
13367
+ font-weight: bold;
13368
+
13369
+ .badge {
13370
+ color: @white;
13371
+ background-color: @light-grey-blue;
13390
13372
  }
13373
+ }
13391
13374
 
13392
- .common-table-row {
13393
- &:not(.read-only):hover {
13394
- .common-table-cells-container {
13395
- background-color: @white;
13396
- }
13375
+ .badge {
13376
+ display: inline-block;
13377
+ min-width: 22px;
13378
+ padding: 3px 7px;
13379
+ font-size: 12px;
13380
+ font-weight: 500;
13381
+ color: @greyish-purple;
13382
+ line-height: 1;
13383
+ vertical-align: middle;
13384
+ white-space: nowrap;
13385
+ text-align: center;
13386
+ background-color: @pale-grey;
13387
+ border-radius: 7.5px;
13388
+ margin-left: 7px;
13389
+ margin-top: -4px;
13390
+ }
13391
+ }
13397
13392
 
13398
- .actions-menu {
13399
- background-color: @white;
13400
- }
13401
- }
13402
- }
13393
+ .default-dropdown {
13394
+ float: left;
13395
+ width: 105px;
13396
+
13397
+ .default-dropdown-field:not(:hover) {
13398
+ border-color: transparent;
13399
+ }
13400
+
13401
+ .default-dropdown-container {
13402
+ z-index: 3;
13403
13403
  }
13404
13404
  }
13405
13405
  }