@@ -5392,6 +5392,9 @@ html[dir="rtl"] .oj-menu-item-end-icon {
5392
5392
.oj-hicontrast .oj-menu-item.oj-focus.oj-disabled > a {
5393
5393
outline: dotted 1px; }
5394
5394
5395
+ .oj-hicontrast .oj-menu-item.oj-disabled > a {
5396
+ border: dotted 1px; }
5397
+
5395
5398
.oj-menu-option-defaults {
5396
5399
font-family: '{"animation":{"dropdown":{"open":{"effect":"zoomIn","transformOrigin":"#myPosition","duration":"0.25s"},"close":{"effect":"none"}},"sheet":{"open":{"effect":"slideIn","direction":"top","duration":"0.25s"},"close":{"effect":"slideOut","direction":"bottom","duration":"0.25s"}},"submenu":{"open":{"effect":"zoomIn","transformOrigin":"#myPosition","duration":"0.25s"},"close":{"effect":"none"}}}}'; }
5397
5400
@@ -10781,8 +10784,11 @@ oj-list-view:not(.oj-complete) {
10781
10784
10782
10785
/* Styling for item when display mode is card */
10783
10786
.oj-listview-card {
10784
- margin-top: 8px;
10785
- margin-right: 8px; }
10787
+ margin-top: 8px; }
10788
+ html[dir="rtl"] .oj-listview-card {
10789
+ margin-left: 8px; }
10790
+ html:not([dir="rtl"]) .oj-listview-card {
10791
+ margin-right: 8px; }
10786
10792
10787
10793
/* Styling for group item when display mode is card */
10788
10794
.oj-listview-card-group {
@@ -10968,39 +10974,45 @@ oj-list-item-layout:not(.oj-complete) {
10968
10974
display: flex;
10969
10975
box-sizing: border-box;
10970
10976
align-items: center;
10971
- min-height: 2.9375rem;
10972
- padding: 0 0.5rem; }
10977
+ min-height: 2.9375rem; }
10978
+ html:not([dir="rtl"]) .oj-listitemlayout {
10979
+ padding-right: 0.5rem; }
10980
+ html[dir="rtl"] .oj-listitemlayout {
10981
+ padding-left: 0.5rem; }
10973
10982
10974
10983
.oj-listitemlayout-selector,
10975
- .oj-listitemlayout-avatar {
10984
+ .oj-listitemlayout-image {
10976
10985
display: flex;
10977
10986
align-items: center;
10978
10987
justify-content: center; }
10979
10988
10980
- .oj-listitemlayout-content {
10981
- padding: 0.5rem 0;
10989
+ .oj-listitemlayout-textslots {
10990
+ flex: auto; }
10991
+
10992
+ .oj-listitemlayout-allslots {
10982
10993
display: flex;
10983
10994
flex: auto;
10984
10995
align-items: center; }
10985
10996
10986
- .oj-listitemlayout-textslots {
10987
- display: flex;
10988
- flex: auto; }
10989
-
10990
- html:not([dir="rtl"]) .oj-listitemlayout-leading {
10991
- padding-right: 0.5rem; }
10997
+ .oj-listitemlayout-vertical-padding {
10998
+ padding-top: 0.5rem;
10999
+ padding-bottom: 0.5rem; }
10992
11000
10993
- html[dir="rtl"] .oj-listitemlayout-leading {
11001
+ html:not( [dir="rtl"]) .oj-listitemlayout-horizontal-padding {
10994
11002
padding-left: 0.5rem; }
10995
11003
10996
- .oj-listitemlayout-main {
10997
- flex: auto ; }
11004
+ html[dir="rtl"] .oj-listitemlayout-horizontal-padding {
11005
+ padding-right: 0.5rem ; }
10998
11006
10999
- .oj-listitemlayout-meta {
11000
- justify-self: flex-end;
11001
- align-self: baseline; }
11007
+ .oj-listitemlayout-action {
11008
+ padding-top: 4px;
11009
+ padding-bottom: 4px; }
11010
+ html[dir="rtl"] .oj-listitemlayout-action {
11011
+ padding-right: 0.5rem; }
11012
+ html:not([dir="rtl"]) .oj-listitemlayout-action {
11013
+ padding-left: 0.5rem; }
11002
11014
11003
- .oj-listitemlayout-tertiary-padding {
11015
+ .oj-listitemlayout-tertiary {
11004
11016
padding-top: 2px; }
11005
11017
11006
11018
oj-indexer:not(.oj-complete) {
@@ -11674,6 +11686,10 @@ html .oj-form-control {
11674
11686
.oj-text-field.oj-warning .oj-text-field-container {
11675
11687
border-color: #f8ca75; }
11676
11688
11689
+ .oj-text-field.oj-disabled .oj-text-field-container {
11690
+ background-color: transparent;
11691
+ border-color: #b1b3b4; }
11692
+
11677
11693
.oj-text-field-label-inside.oj-text-field .oj-text-field-container {
11678
11694
min-height: 2.75rem; }
11679
11695
@@ -11737,6 +11753,51 @@ html .oj-form-control {
11737
11753
.oj-text-field-label-inside .oj-text-field-middle {
11738
11754
height: 100%; }
11739
11755
11756
+ .oj-text-field.oj-text-field-label-inside .oj-text-field-start,
11757
+ .oj-text-field.oj-text-field-label-inside .oj-text-field-end {
11758
+ display: flex;
11759
+ justify-content: center;
11760
+ align-items: center; }
11761
+
11762
+ html:not([dir="rtl"]) .oj-text-field .oj-text-field-start .oj-text-field-start-end-icon {
11763
+ margin-left: 0; }
11764
+
11765
+ html[dir="rtl"] .oj-text-field .oj-text-field-start .oj-text-field-start-end-icon {
11766
+ margin-right: 0; }
11767
+
11768
+ html:not([dir="rtl"]) .oj-text-field .oj-text-field-end .oj-text-field-start-end-icon {
11769
+ margin-right: 0; }
11770
+
11771
+ html[dir="rtl"] .oj-text-field .oj-text-field-end .oj-text-field-start-end-icon {
11772
+ margin-left: 0; }
11773
+
11774
+ .oj-text-field .oj-text-field-start .oj-button,
11775
+ .oj-text-field .oj-text-field-end .oj-button {
11776
+ margin-bottom: 0; }
11777
+
11778
+ html:not([dir="rtl"]) .oj-text-field.oj-read-only .oj-text-field-start .oj-text-field-start-end-icon {
11779
+ margin-left: 0;
11780
+ margin-right: 0; }
11781
+
11782
+ html[dir="rtl"] .oj-text-field.oj-read-only .oj-text-field-start .oj-text-field-start-end-icon {
11783
+ margin-right: 0;
11784
+ margin-left: 0; }
11785
+
11786
+ html:not([dir="rtl"]) .oj-text-field .oj-text-field-end .oj-text-field-start-end-icon {
11787
+ margin-right: 0;
11788
+ margin-left: 0; }
11789
+
11790
+ html[dir="rtl"] .oj-text-field .oj-text-field-end .oj-text-field-start-end-icon {
11791
+ margin-left: 0;
11792
+ margin-right: 0; }
11793
+
11794
+ .oj-text-field.oj-read-only:not(.oj-text-field-label-inline) .oj-text-field-start,
11795
+ .oj-text-field.oj-read-only:not(.oj-text-field-label-inline) .oj-text-field-end {
11796
+ min-height: 1.75rem; }
11797
+
11798
+ .oj-text-field.oj-disabled .oj-text-field-start .oj-text-field-start-end-icon {
11799
+ color: #cbcccd; }
11800
+
11740
11801
.oj-text-field-counter {
11741
11802
align-items: center;
11742
11803
justify-content: center;
@@ -13626,16 +13687,6 @@ oj-text-area:not(.oj-complete) {
13626
13687
.oj-form-control-full-width .oj-textarea-nocomp {
13627
13688
max-width: 100%; }
13628
13689
13629
- .oj-inputtext-start,
13630
- .oj-inputtext-end {
13631
- min-height: 2.75rem;
13632
- min-width: 2.75rem;
13633
- margin: unset; }
13634
-
13635
- .oj-inputtext .oj-text-field-middle {
13636
- width: 100%;
13637
- flex: auto; }
13638
-
13639
13690
.oj-inputtext .oj-inputtext-clear-icon-btn {
13640
13691
display: inline-flex;
13641
13692
align-items: center;
@@ -14108,6 +14159,20 @@ html[dir="rtl"] .oj-buttonset-multi.oj-button-full-chrome .oj-inputnumber-button
14108
14159
border-width: 0 0 2px 0;
14109
14160
padding-bottom: 0; }
14110
14161
14162
+ /* highlight-text */
14163
+ /* --------------------------------------------------------------- */
14164
+ oj-highlight-text:not(.oj-complete) {
14165
+ visibility: hidden; }
14166
+
14167
+ .oj-highlighttext {
14168
+ display: inline; }
14169
+
14170
+ /*
14171
+ * Applied to the matching text
14172
+ */
14173
+ .oj-highlighttext-highlighter, .oj-listbox-highlighter {
14174
+ font-weight: bold; }
14175
+
14111
14176
/* listbox */
14112
14177
/* --------------------------------------------------------------- */
14113
14178
/*
@@ -14179,7 +14244,6 @@ html[dir="rtl"] .oj-buttonset-multi.oj-button-full-chrome .oj-inputnumber-button
14179
14244
.oj-listbox-result-label {
14180
14245
line-height: 2rem;
14181
14246
margin: 0;
14182
- cursor: pointer;
14183
14247
min-height: 2rem;
14184
14248
word-wrap: break-word;
14185
14249
-webkit-touch-callout: none;
@@ -14473,9 +14537,6 @@ html[dir="rtl"] .oj-listbox-no-results {
14473
14537
/*
14474
14538
* Applied to the matching text in the dropdown options
14475
14539
*/
14476
- .oj-listbox-highlighter {
14477
- font-weight: bold; }
14478
-
14479
14540
.oj-form-control-inherit:not(.oj-form-control-default) .oj-listbox-input {
14480
14541
color: inherit;
14481
14542
height: 100%;
@@ -15990,7 +16051,8 @@ oj-select:not(.oj-complete) {
15990
16051
padding-right: 0; }
15991
16052
15992
16053
.oj-select-choice .oj-text-field-middle {
15993
- height: auto; }
16054
+ height: auto;
16055
+ min-width: 0; }
15994
16056
15995
16057
/* Styling for readonly mode */
15996
16058
.oj-select.oj-read-only .oj-select-choice,
@@ -17419,6 +17481,10 @@ oj-color-palette:not(.oj-complete) {
17419
17481
background-clip: padding-box;
17420
17482
-webkit-print-color-adjust: exact; }
17421
17483
17484
+ .oj-colorpalette-listview-full {
17485
+ width: 100%;
17486
+ height: 100%; }
17487
+
17422
17488
.oj-colorpalette-swatch-none-icon {
17423
17489
/* Color Hardcoded because this value is not related to theming and regardless of theme the swatch for none will be white */
17424
17490
background-color: #ffffff;
@@ -25156,3 +25222,85 @@ oj-module:not(.oj-complete) {
25156
25222
25157
25223
oj-module {
25158
25224
display: block; }
25225
+
25226
+ oj-action-card:not(.oj-complete) {
25227
+ visibility: hidden; }
25228
+
25229
+ /* Styling for card entrance animation during initial load */
25230
+ .oj-actioncard-initial-entrance-animation {
25231
+ animation-name: actioncard-initial-fade-in;
25232
+ animation-duration: 0.3s;
25233
+ animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
25234
+ animation-iteration-count: 1;
25235
+ animation-fill-mode: forwards; }
25236
+
25237
+ @keyframes actioncard-initial-fade-in {
25238
+ 0% {
25239
+ visibility: visible;
25240
+ opacity: 0;
25241
+ transform: translateY(300px); }
25242
+ 100% {
25243
+ visibility: visible;
25244
+ opacity: 1;
25245
+ transform: translateY(0); } }
25246
+
25247
+ /* Styling for card exit animation when data changed */
25248
+ .oj-actioncard-initial-exit-animation {
25249
+ animation-name: actioncard-initial-fade-out;
25250
+ animation-duration: 0.3s;
25251
+ animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
25252
+ animation-iteration-count: 1;
25253
+ animation-fill-mode: forwards; }
25254
+
25255
+ @keyframes actioncard-initial-fade-out {
25256
+ 0% {
25257
+ visibility: visible;
25258
+ opacity: 1;
25259
+ transform: translateY(0px); }
25260
+ 100% {
25261
+ visibility: visible;
25262
+ opacity: 0;
25263
+ transform: translateY(300px); } }
25264
+
25265
+ /* Styling for card entrance animation during load more */
25266
+ .oj-actioncard-loadmore-entrance-animation {
25267
+ animation-name: actioncard-loadmore-fade-in;
25268
+ animation-duration: 0.15s;
25269
+ animation-iteration-count: 1;
25270
+ animation-fill-mode: forwards; }
25271
+
25272
+ @keyframes actioncard-loadmore-fade-in {
25273
+ 0% {
25274
+ visibility: visible;
25275
+ opacity: 0; }
25276
+ 100% {
25277
+ visibility: visible;
25278
+ opacity: 1; } }
25279
+
25280
+ .oj-actioncard {
25281
+ display: inline-flex;
25282
+ cursor: pointer;
25283
+ transform: scale(1);
25284
+ transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);
25285
+ box-shadow: 1px 1px 5px 0 hsla(0, 0%, 0%,0.4);
25286
+ background-color: #ffffff;
25287
+ border: 1px solid #e0e1e1;
25288
+ border-radius: 2px;
25289
+ box-sizing: border-box;
25290
+ overflow: hidden;
25291
+ position: relative; }
25292
+
25293
+ .oj-actioncard:hover,
25294
+ .oj-actioncard.oj-active {
25295
+ transform: scale(1.02);
25296
+ transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1); }
25297
+
25298
+ .oj-actioncard.oj-active {
25299
+ box-shadow: 0 0 5px 0 hsla(0, 0%, 0%,0.2); }
25300
+
25301
+ .oj-actioncard:hover:not(.oj-active),
25302
+ .oj-actioncard:focus:not(.oj-active) {
25303
+ box-shadow: 1px 1px 10px 0 hsla(0, 0%, 0%,0.45); }
25304
+
25305
+ .oj-actioncard:not(.oj-focus-highlight):focus {
25306
+ outline: none; }
0 commit comments