@openfin/core-web 0.46.64 → 0.46.68
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.
- package/out/api-client.cjs.js +1 -1
- package/out/api-client.esm.js +1 -1
- package/out/main-ce032c8a.js +3 -0
- package/out/main-df8f1ee4.js +1 -0
- package/out/main-e504f5c1.js +1 -0
- package/out/main-e9c74c8d.js +3 -0
- package/out/shared-worker.js +1 -1
- package/out/styles.css +221 -92
- package/package.json +2 -2
- package/out/main-5ff8187d.js +0 -3
- package/out/main-83c0b66b.js +0 -1
- package/out/main-8d103fb5.js +0 -3
- package/out/main-d112f1e3.js +0 -1
package/out/styles.css
CHANGED
|
@@ -324,19 +324,19 @@
|
|
|
324
324
|
/* Colors used for dark theme */
|
|
325
325
|
--of-default-black: black;
|
|
326
326
|
--of-default-charcoal-dark: #111118;
|
|
327
|
-
--of-default-charcoal-light: #
|
|
328
|
-
--of-default-grey-dark: #
|
|
329
|
-
--of-default-grey-dark-opacity: #
|
|
330
|
-
--of-default-grey-light: #
|
|
331
|
-
--of-default-grey-light-opacity: #
|
|
327
|
+
--of-default-charcoal-light: #2a292f;
|
|
328
|
+
--of-default-grey-dark: #a5aebd;
|
|
329
|
+
--of-default-grey-dark-opacity: #a5aebd2e;
|
|
330
|
+
--of-default-grey-light: #f4f5f8;
|
|
331
|
+
--of-default-grey-light-opacity: #f4f5f82e;
|
|
332
332
|
--of-default-white: white;
|
|
333
|
-
--of-dark-theme: #
|
|
334
|
-
--of-light-theme: #
|
|
335
|
-
--of-highlight: #
|
|
336
|
-
--of-highlight-opacity: #
|
|
333
|
+
--of-dark-theme: #7b7bff;
|
|
334
|
+
--of-light-theme: #504cff;
|
|
335
|
+
--of-highlight: #958eff;
|
|
336
|
+
--of-highlight-opacity: #958eff26;
|
|
337
337
|
--of-default-red: red;
|
|
338
|
-
--of-default-red-negative: #
|
|
339
|
-
--of-positive-green: #
|
|
338
|
+
--of-default-red-negative: #f55d5f;
|
|
339
|
+
--of-positive-green: #29af6f;
|
|
340
340
|
|
|
341
341
|
/* Main colors to set from the above list */
|
|
342
342
|
--main-background-color: var(--of-default-charcoal-dark);
|
|
@@ -390,25 +390,35 @@
|
|
|
390
390
|
--body-container-padding-left: 0px;
|
|
391
391
|
|
|
392
392
|
--body-container-width: calc(100% - var(--body-container-padding-left) - var(--body-container-padding-right));
|
|
393
|
-
--body-container-height: calc(
|
|
394
|
-
|
|
393
|
+
--body-container-height: calc(
|
|
394
|
+
100% - var(--title-bar-height) - var(--title-bar-border-bottom-height) - var(--body-container-padding-top) -
|
|
395
|
+
var(--body-container-padding-bottom)
|
|
396
|
+
);
|
|
397
|
+
--body-container-padding: var(--body-container-padding-top) var(--body-container-padding-right)
|
|
398
|
+
var(--body-container-padding-bottom) var(--body-container-padding-left);
|
|
395
399
|
|
|
396
400
|
--layout-container-padding-top: 4px;
|
|
397
401
|
--layout-container-padding-right: 4px;
|
|
398
402
|
--layout-container-padding-bottom: 4px;
|
|
399
403
|
--layout-container-padding-left: 4px;
|
|
400
|
-
--layout-container-from-top: calc(
|
|
404
|
+
--layout-container-from-top: calc(
|
|
405
|
+
var(--title-bar-height) + var(--title-bar-border-bottom-height) + var(--layout-container-padding-top)
|
|
406
|
+
);
|
|
401
407
|
|
|
402
408
|
--layout-container-width: calc(100% - var(--layout-container-padding-left) - var(--layout-container-padding-right));
|
|
403
|
-
--layout-container-height: calc(
|
|
404
|
-
|
|
409
|
+
--layout-container-height: calc(
|
|
410
|
+
100% - var(--header-border-bottom-height) - var(--layout-container-padding-top) -
|
|
411
|
+
var(--layout-container-padding-bottom)
|
|
412
|
+
);
|
|
413
|
+
--layout-container-padding: var(--layout-container-padding-top) var(--layout-container-padding-right)
|
|
414
|
+
var(--layout-container-padding-bottom) var(--layout-container-padding-left);
|
|
405
415
|
|
|
406
416
|
/* Top Bar and Tab Icons */
|
|
407
|
-
--close-button-url: url(
|
|
408
|
-
--minimize-button-url: url(
|
|
409
|
-
--expand-button-url: url(
|
|
410
|
-
--tab-close-button-url: url(
|
|
411
|
-
--new-tab-button-url: url(
|
|
417
|
+
--close-button-url: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IjAyIC0gSUNPTlMvWC9EYXJrIFQuIj4KPHBhdGggaWQ9IkNvbWJpbmVkIFNoYXBlIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTcuNDI2MDEgNi4xNjEwN0M3LjA3MTcgNS45MTU2MyA2LjU4MTg0IDUuOTUwNjkgNi4yNjYyNyA2LjI2NjI3QzUuOTExMjQgNi42MjEyOSA1LjkxMTI0IDcuMTk2ODkgNi4yNjYyNyA3LjU1MTkyTDE0LjcxNDQgMTZMNi4yNjYyNyAyNC40NDgxTDYuMTYxMDcgMjQuNTc0QzUuOTE1NjMgMjQuOTI4MyA1Ljk1MDY5IDI1LjQxODIgNi4yNjYyNyAyNS43MzM3QzYuNjIxMjkgMjYuMDg4OCA3LjE5Njg5IDI2LjA4ODggNy41NTE5MiAyNS43MzM3TDE2IDE3LjI4NTZMMjQuNDQ4MSAyNS43MzM3TDI0LjU3NCAyNS44Mzg5QzI0LjkyODMgMjYuMDg0NCAyNS40MTgyIDI2LjA0OTMgMjUuNzMzNyAyNS43MzM3QzI2LjA4ODggMjUuMzc4NyAyNi4wODg4IDI0LjgwMzEgMjUuNzMzNyAyNC40NDgxTDE3LjI4NTYgMTZMMjUuNzMzNyA3LjU1MTkyTDI1LjgzODkgNy40MjYwMUMyNi4wODQ0IDcuMDcxNyAyNi4wNDkzIDYuNTgxODQgMjUuNzMzNyA2LjI2NjI3QzI1LjM3ODcgNS45MTEyNCAyNC44MDMxIDUuOTExMjQgMjQuNDQ4MSA2LjI2NjI3TDE2IDE0LjcxNDRMNy41NTE5MiA2LjI2NjI3TDcuNDI2MDEgNi4xNjEwN1oiIGZpbGw9IiNGMkY0RjkiLz4KPC9nPgo8L3N2Zz4K');
|
|
418
|
+
--minimize-button-url: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IjAyIC0gSUNPTlMvTWluaW1pemUvV2luZG93L0RhcmsgVC4iPgo8cmVjdCBpZD0iUmVjdGFuZ2xlIiB4PSIzIiB5PSIyNCIgd2lkdGg9IjI2IiBoZWlnaHQ9IjMiIHJ4PSIxLjUiIGZpbGw9IiNGMkY0RjkiLz4KPC9nPgo8L3N2Zz4K');
|
|
419
|
+
--expand-button-url: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IjAyIC0gSUNPTlMvRXhwYW5kL0RhcmsgVC4iPgo8cGF0aCBpZD0iQ29tYmluZWQgU2hhcGUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTYuOTU2NSA1TDI2LjAzNDggNS4wMDAwNEwyNi4wOTE1IDUuMDAxMThMMjYuMTQxMyA1LjAwNDk4TDI2LjIwNDMgNS4wMTM1NEwyNi4yNDE0IDUuMDIwNTFMMjYuMjc1NiA1LjAyODM1TDI2LjMwMzUgNS4wMzU3NkwyNi4zNTc3IDUuMDUyODJMMjYuNDAyOCA1LjA2OTc3TDI2LjQ1NzkgNS4wOTQxOEwyNi41MDkyIDUuMTIwNzNMMjYuNTY0MyA1LjE1NDFMMjYuNjAxMyA1LjE3OTNMMjYuNjMyNiA1LjIwMjhMMjYuNjc0IDUuMjM3MThMMjYuNzEwNSA1LjI3MDkyTDI2Ljc0MTggNS4zMDI4MkwyNi43ODEgNS4zNDczM0wyNi43OTM4IDUuMzYzMjRDMjYuODEzMyA1LjM4Nzg1IDI2LjgzMTYgNS40MTM0MyAyNi44NDg2IDUuNDM5OTFDMjYuODcgNS40NzMwNCAyNi44ODkxIDUuNTA3MjIgMjYuOTA1OSA1LjU0MjIxTDI2LjkyNDMgNS41ODI4OUwyNi45NDA2IDUuNjIzOTdMMjYuOTU2MyA1LjY3MDA1QzI2Ljk2NDkgNS42OTcyNyAyNi45NzIyIDUuNzI0OTcgMjYuOTc4MyA1Ljc1MzEyTDI2Ljk4OTYgNS44MTUxN0MyNi45OTQyIDUuODQ1OTIgMjYuOTk3MyA1Ljg3NzE1IDI2Ljk5ODggNS45MDg3OEwyNyA1Ljk1NjUyVjE1LjA0MzVDMjcgMTUuNTcxOCAyNi41NzE4IDE2IDI2LjA0MzUgMTZDMjUuNTMxMiAxNiAyNS4xMTMgMTUuNTk3MyAyNS4wODgxIDE1LjA5MTJMMjUuMDg3IDE1LjA0MzVWOC4yNjU1N0wxOC40Njk4IDE0Ljg4MjlDMTguMDk2MyAxNS4yNTY0IDE3LjQ5MDcgMTUuMjU2NCAxNy4xMTcxIDE0Ljg4MjlDMTYuNzU2IDE0LjUyMTggMTYuNzQ0IDEzLjk0MzggMTcuMDgxIDEzLjU2ODNMMTcuMTE3MSAxMy41MzAyTDIzLjczNCA2LjkxMzA0SDE2Ljk1NjVDMTYuNDI4MiA2LjkxMzA0IDE2IDYuNDg0NzkgMTYgNS45NTY1MkMxNiA1LjQ0NDI2IDE2LjQwMjcgNS4wMjYwNSAxNi45MDg4IDUuMDAxMTdMMTYuOTU2NSA1WiIgZmlsbD0iI0YyRjRGOSIvPgo8cGF0aCBpZD0iQ29tYmluZWQgU2hhcGUgQ29weSIgZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01Ljk1NjUyIDI3TDUuOTA4NTQgMjYuOTk4OEw1Ljg1ODc0IDI2Ljk5NUw1Ljc5NTcyIDI2Ljk4NjVMNS43NTg1OCAyNi45Nzk1TDUuNzI0NDMgMjYuOTcxNkw1LjY5NjUxIDI2Ljk2NDJMNS42NDIyNyAyNi45NDcyTDUuNTk3MjMgMjYuOTMwMkw1LjU0MjEzIDI2LjkwNThMNS40OTA4NSAyNi44NzkzTDUuNDM1NjkgMjYuODQ1OUw1LjM5ODcyIDI2LjgyMDdMNS4zNjc0NCAyNi43OTcyTDUuMzI2MDQgMjYuNzYyOEw1LjI4OTUyIDI2LjcyOTFMNS4yNTgyMiAyNi42OTcyTDUuMjE5IDI2LjY1MjdMNS4yMDYxNyAyNi42MzY4QzUuMTg2NjkgMjYuNjEyMiA1LjE2ODQgMjYuNTg2NiA1LjE1MTM3IDI2LjU2MDFDNS4xMjk5NyAyNi41MjcgNS4xMTA5MSAyNi40OTI4IDUuMDk0MSAyNi40NTc4TDUuMDc1NzIgMjYuNDE3MUw1LjA1OTQyIDI2LjM3Nkw1LjA0MzcgMjYuMzI5OUM1LjAzNTEzIDI2LjMwMjcgNS4wMjc3NyAyNi4yNzUgNS4wMjE2NyAyNi4yNDY5TDUuMDEwMzcgMjYuMTg0OEM1LjAwNTgyIDI2LjE1NDEgNS4wMDI3MiAyNi4xMjI4IDUuMDAxMTcgMjYuMDkxMkw1IDI2LjA0MzVWMTYuOTU2NUM1IDE2LjQyODIgNS40MjgyNSAxNiA1Ljk1NjUyIDE2QzYuNDY4NzkgMTYgNi44ODcgMTYuNDAyNyA2LjkxMTg3IDE2LjkwODhMNi45MTMwNCAxNi45NTY1VjIzLjczNDRMMTMuNTMwMiAxNy4xMTcxQzEzLjkwMzcgMTYuNzQzNiAxNC41MDkzIDE2Ljc0MzYgMTQuODgyOSAxNy4xMTcxQzE1LjI0NCAxNy40NzgyIDE1LjI1NiAxOC4wNTYyIDE0LjkxOSAxOC40MzE3TDE0Ljg4MjkgMTguNDY5OEw4LjI2NjA0IDI1LjA4N0gxNS4wNDM1QzE1LjU3MTggMjUuMDg3IDE2IDI1LjUxNTIgMTYgMjYuMDQzNUMxNiAyNi41NTU3IDE1LjU5NzMgMjYuOTc0IDE1LjA5MTIgMjYuOTk4OEwxNS4wNDM1IDI3SDUuOTU2NTJaIiBmaWxsPSIjRjJGNEY5Ii8+CjwvZz4KPC9zdmc+Cg==');
|
|
420
|
+
--tab-close-button-url: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IjAyIC0gSUNPTlMvWC9EYXJrIFQuIj4KPHBhdGggaWQ9IkNvbWJpbmVkIFNoYXBlIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTcuNDI2MDEgNi4xNjEwN0M3LjA3MTcgNS45MTU2MyA2LjU4MTg0IDUuOTUwNjkgNi4yNjYyNyA2LjI2NjI3QzUuOTExMjQgNi42MjEyOSA1LjkxMTI0IDcuMTk2ODkgNi4yNjYyNyA3LjU1MTkyTDE0LjcxNDQgMTZMNi4yNjYyNyAyNC40NDgxTDYuMTYxMDcgMjQuNTc0QzUuOTE1NjMgMjQuOTI4MyA1Ljk1MDY5IDI1LjQxODIgNi4yNjYyNyAyNS43MzM3QzYuNjIxMjkgMjYuMDg4OCA3LjE5Njg5IDI2LjA4ODggNy41NTE5MiAyNS43MzM3TDE2IDE3LjI4NTZMMjQuNDQ4MSAyNS43MzM3TDI0LjU3NCAyNS44Mzg5QzI0LjkyODMgMjYuMDg0NCAyNS40MTgyIDI2LjA0OTMgMjUuNzMzNyAyNS43MzM3QzI2LjA4ODggMjUuMzc4NyAyNi4wODg4IDI0LjgwMzEgMjUuNzMzNyAyNC40NDgxTDE3LjI4NTYgMTZMMjUuNzMzNyA3LjU1MTkyTDI1LjgzODkgNy40MjYwMUMyNi4wODQ0IDcuMDcxNyAyNi4wNDkzIDYuNTgxODQgMjUuNzMzNyA2LjI2NjI3QzI1LjM3ODcgNS45MTEyNCAyNC44MDMxIDUuOTExMjQgMjQuNDQ4MSA2LjI2NjI3TDE2IDE0LjcxNDRMNy41NTE5MiA2LjI2NjI3TDcuNDI2MDEgNi4xNjEwN1oiIGZpbGw9IiNGMkY0RjkiLz4KPC9nPgo8L3N2Zz4K');
|
|
421
|
+
--new-tab-button-url: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAEACAMAAABrrFhUAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAJNQTFRFAAAA////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////0TslXgAAADF0Uk5TAA1Zm8rs+utYJp72//WcJAmM+4oIJdTRIzHq6S8KiQ70DFaYx/lVC5kihtLPB+chLkL8Um8AAAM+SURBVHic7d3rVtNQEEDhlJZwO9xB0CAW2iAiou//dOLCpas2OTNBJtNp9n6COZ+t1T8zRUFERERERERE1FujjfFksyy3JuPtkfcsDu3s7qU/7R8ces/Tc0fHJ2mh8vTMe6Y+O3+Xlrq49J6qv95/WH5/StWV91x9dd74/meBgXwGPjZ8/n9/C4bx98Bx2/tTuvaerY92TtoByiF8CXbb35/S2Hs6+z7t5QCmN97zmbeRe39Kt97zmTfOA8y85zNvkgeYe89n3mYeoPKez7wyD1B7z2de/v0pec9nHgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAID3fOYBAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAeM9nHgAAAAAAAAAAAAAAAAAAwIoDvOz/lwZe9V59v2Bh/3/0ut8vWNr/H72O9wua9v9Hr8v9gub9/9HT3y9o2/8fPe39gvb9/9FT3i/I7P+Pnup+QW7/f/RU9wuy+/+jp7hfkN//Hz3F/QJh/3/05PsFwv7/6Mn3C4T9/9GT7xcI+/+jJ98vCP//33zy/YLBA2x5j2ib/BUY/F+Cg/8Z3PYe0bY7EWC07z2jZdPPIkBx4D2kZffy+4vDNf4hrL8oAIpT7zHtetC8vzj66j2nVY/fVADFZeU9qU1P33XvL4qrtRR4+qF9//Nn4MJ72rfvUf3n/6uz6zX7LagflN//vx+C8dR76Ldreq/6/funm9vZvKq9Z//f6mo+u1P8+6+3pIG95zMPAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAwHs+8wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAC85zMPAAAAAAAAAAAAAAAAAABgkADCqk55/3/0hPsF8v7/6An3C+T9/9ET7hfI+/+jJ9wvkPf/Ry9/v0Cz/z962fsFmv3/0cvdL9Dt/49e5n6Bbv9/9NrvF2j3/0ev7X6Bfv9/9JrvF3TZ/x+9pvsF3fb/R2/pfkH3/f/RW7hf8Lr9/9F7uV+wcvv/iYiIiIiIiGjt+wlaXmsfieItGAAAAABJRU5ErkJggg==');
|
|
412
422
|
}
|
|
413
423
|
|
|
414
424
|
body {
|
|
@@ -429,7 +439,12 @@ html {
|
|
|
429
439
|
overflow: hidden;
|
|
430
440
|
}
|
|
431
441
|
|
|
432
|
-
body,
|
|
442
|
+
body,
|
|
443
|
+
select,
|
|
444
|
+
button,
|
|
445
|
+
li,
|
|
446
|
+
span,
|
|
447
|
+
div {
|
|
433
448
|
font-family: 'Akkurat Pro', Arial, Helvetica, sans-serif;
|
|
434
449
|
color: var(--body-font-color);
|
|
435
450
|
}
|
|
@@ -645,7 +660,7 @@ div.placeholder_image img {
|
|
|
645
660
|
.lm_splitter {
|
|
646
661
|
background-color: var(--splitter-color);
|
|
647
662
|
opacity: 0.001;
|
|
648
|
-
|
|
663
|
+
transition: opacity 200ms ease;
|
|
649
664
|
}
|
|
650
665
|
|
|
651
666
|
.lm_splitter:hover,
|
|
@@ -694,7 +709,7 @@ div.placeholder_image img {
|
|
|
694
709
|
|
|
695
710
|
.lm_dropTargetIndicator .lm_inner {
|
|
696
711
|
background: var(--tab-background-color);
|
|
697
|
-
opacity: .2
|
|
712
|
+
opacity: 0.2;
|
|
698
713
|
}
|
|
699
714
|
|
|
700
715
|
.lm_tabdropdown_list {
|
|
@@ -710,7 +725,7 @@ div.placeholder_image img {
|
|
|
710
725
|
}
|
|
711
726
|
|
|
712
727
|
.lm_header .lm_controls .lm_tabdropdown:before {
|
|
713
|
-
color: var(--tab-font-color)
|
|
728
|
+
color: var(--tab-font-color);
|
|
714
729
|
}
|
|
715
730
|
|
|
716
731
|
.lm_controls {
|
|
@@ -723,7 +738,7 @@ div.placeholder_image img {
|
|
|
723
738
|
position: relative;
|
|
724
739
|
background-position: center center;
|
|
725
740
|
background-repeat: no-repeat;
|
|
726
|
-
opacity: .4;
|
|
741
|
+
opacity: 0.4;
|
|
727
742
|
transition: opacity 300ms ease;
|
|
728
743
|
width: 18px;
|
|
729
744
|
height: 100% !important;
|
|
@@ -731,30 +746,30 @@ div.placeholder_image img {
|
|
|
731
746
|
}
|
|
732
747
|
|
|
733
748
|
.lm_controls > *:hover {
|
|
734
|
-
opacity: 1
|
|
749
|
+
opacity: 1;
|
|
735
750
|
}
|
|
736
751
|
|
|
737
752
|
.lm_controls .lm_popout {
|
|
738
|
-
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAPklEQVR4nI2Q0QoAIAwCNfr/X7aXCpGN8snBdgejJOzckpkxs9jR6K6T5JpU0nWl5pSXTk7qwh8SnNT+CAAWCgkKFpuSWsUAAAAASUVORK5CYII=)
|
|
753
|
+
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAPklEQVR4nI2Q0QoAIAwCNfr/X7aXCpGN8snBdgejJOzckpkxs9jR6K6T5JpU0nWl5pSXTk7qwh8SnNT+CAAWCgkKFpuSWsUAAAAASUVORK5CYII=);
|
|
739
754
|
}
|
|
740
755
|
|
|
741
756
|
.lm_controls .lm_maximise {
|
|
742
|
-
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAKElEQVR4nGP8////fwYCgImQAgYGBgYWKM2IR81/okwajIpgvsMbVgAwgQYRVakEKQAAAABJRU5ErkJggg==)
|
|
757
|
+
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAKElEQVR4nGP8////fwYCgImQAgYGBgYWKM2IR81/okwajIpgvsMbVgAwgQYRVakEKQAAAABJRU5ErkJggg==);
|
|
743
758
|
}
|
|
744
759
|
|
|
745
760
|
.lm_controls .lm_close {
|
|
746
|
-
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAQUlEQVR4nHXOQQ4AMAgCQeT/f6aXpsGK3jSTuCVJAAr7iBdoAwCKd0nwfaAdHbYERw5b44+E8JoBjEYGMBq5gAYP3usUDu2IvoUAAAAASUVORK5CYII=)
|
|
761
|
+
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAQUlEQVR4nHXOQQ4AMAgCQeT/f6aXpsGK3jSTuCVJAAr7iBdoAwCKd0nwfaAdHbYERw5b44+E8JoBjEYGMBq5gAYP3usUDu2IvoUAAAAASUVORK5CYII=);
|
|
747
762
|
}
|
|
748
763
|
|
|
749
764
|
.lm_maximised .lm_controls .lm_maximise {
|
|
750
|
-
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAJ0lEQVR4nGP8//8/AzGAiShVI1YhCwMDA8OsWbPwBmZaWhoj0SYCAN1lBxMAX4n0AAAAAElFTkSuQmCC)
|
|
765
|
+
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAJ0lEQVR4nGP8//8/AzGAiShVI1YhCwMDA8OsWbPwBmZaWhoj0SYCAN1lBxMAX4n0AAAAAElFTkSuQmCC);
|
|
751
766
|
}
|
|
752
767
|
|
|
753
|
-
.lm_header
|
|
768
|
+
.lm_header > .lm_tabs > .focused_tab {
|
|
754
769
|
border-color: var(--focused-tab-border-top-color);
|
|
755
770
|
}
|
|
756
771
|
|
|
757
|
-
.lm_header
|
|
772
|
+
.lm_header > .lm_tabs > .focused_tab:hover {
|
|
758
773
|
border-color: var(--focused-tab-border-top-highlight-color);
|
|
759
774
|
}
|
|
760
775
|
|
|
@@ -768,7 +783,7 @@ div.placeholder_image img {
|
|
|
768
783
|
|
|
769
784
|
.lm_header .newTabButton {
|
|
770
785
|
background-image: var(--new-tab-button-url);
|
|
771
|
-
filter: invert(.3);
|
|
786
|
+
filter: invert(0.3);
|
|
772
787
|
background-size: cover;
|
|
773
788
|
width: 12px;
|
|
774
789
|
height: 12px;
|
|
@@ -782,7 +797,7 @@ div.placeholder_image img {
|
|
|
782
797
|
}
|
|
783
798
|
|
|
784
799
|
:root.light-theme .newTabButton {
|
|
785
|
-
filter: invert(.7);
|
|
800
|
+
filter: invert(0.7);
|
|
786
801
|
}
|
|
787
802
|
|
|
788
803
|
:root.light-theme .newTabButton:hover {
|
|
@@ -796,26 +811,26 @@ div.placeholder_image img {
|
|
|
796
811
|
.lm_tabdropdown_list::-webkit-scrollbar-track {
|
|
797
812
|
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
|
|
798
813
|
border-radius: 8px;
|
|
799
|
-
background-color: #
|
|
814
|
+
background-color: #53565f;
|
|
800
815
|
}
|
|
801
816
|
|
|
802
817
|
.lm_tabdropdown_list::-webkit-scrollbar {
|
|
803
818
|
width: 8px;
|
|
804
|
-
background-color: #
|
|
819
|
+
background-color: #53565f;
|
|
805
820
|
}
|
|
806
821
|
|
|
807
822
|
.lm_tabdropdown_list::-webkit-scrollbar-thumb {
|
|
808
823
|
border-radius: 8px;
|
|
809
|
-
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
|
|
810
|
-
background-color: #
|
|
824
|
+
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
|
|
825
|
+
background-color: #ffffff;
|
|
811
826
|
}
|
|
812
827
|
|
|
813
828
|
:root.light-theme .lm_tabdropdown_list::-webkit-scrollbar-track {
|
|
814
|
-
background-color: #
|
|
829
|
+
background-color: #c9cbd2;
|
|
815
830
|
}
|
|
816
831
|
|
|
817
832
|
:root.light-theme .lm_tabdropdown_list::-webkit-scrollbar {
|
|
818
|
-
background-color: #
|
|
833
|
+
background-color: #c9cbd2;
|
|
819
834
|
}
|
|
820
835
|
|
|
821
836
|
:root.light-theme .lm_tabdropdown_list::-webkit-scrollbar-thumb {
|
|
@@ -824,40 +839,31 @@ div.placeholder_image img {
|
|
|
824
839
|
|
|
825
840
|
/**
|
|
826
841
|
* Tab Overflow Scroll Animation System
|
|
827
|
-
*
|
|
828
|
-
*
|
|
829
|
-
*
|
|
830
|
-
*
|
|
831
|
-
*
|
|
832
|
-
*
|
|
833
|
-
*
|
|
834
|
-
*
|
|
835
|
-
*
|
|
836
|
-
*
|
|
837
|
-
|
|
838
|
-
*
|
|
839
|
-
*
|
|
840
|
-
*
|
|
841
|
-
*
|
|
842
|
-
*
|
|
843
|
-
*
|
|
844
|
-
*
|
|
845
|
-
*
|
|
846
|
-
*
|
|
847
|
-
*
|
|
848
|
-
*
|
|
849
|
-
*
|
|
850
|
-
*
|
|
851
|
-
*
|
|
852
|
-
* - As the mask reveals transparency, the shadow background becomes visible through the fade
|
|
853
|
-
* - This creates a visual indicator showing there's more content to scroll
|
|
854
|
-
*
|
|
855
|
-
* 5. DYNAMIC TAB SIZING:
|
|
856
|
-
* - Uses --layout-tab-width and --layout-tab-min-width for flexible tab dimensions
|
|
857
|
-
* - Internal variables provide defaults while allowing user overrides
|
|
858
|
-
* - Possible gotchas when modifying:
|
|
859
|
-
- If a user wants to use container-queries for tab width, `lm_tab.width` must be set to an absolute value for lm_tab to be sized properly with the `container` property. This is why have the --layout-tab-width variable.
|
|
860
|
-
- The tab drop preview has no content so it needs to be initialized to something other than fit-content.
|
|
842
|
+
*
|
|
843
|
+
* 1. @property: --layout-tab-overflow-fade-left/-right are animatable numbers driving the edge fade
|
|
844
|
+
* masks (0 = no fade, 1 = full fade).
|
|
845
|
+
*
|
|
846
|
+
* 2. Fades: view timelines on two sentinels (.lm_tabs::before/::after) pinned over the first and last
|
|
847
|
+
* --layout-tab-overflow-fade-size of the scroll content. Ranges `exit` (left) and `entry` (right)
|
|
848
|
+
* measure pixels of scroll, so fade strength tracks how much content is actually hidden.
|
|
849
|
+
* A scroll timeline can't be used: once finished at 100% it pins a hold time that outlives the
|
|
850
|
+
* timeline (web-animations-1 § 4.5.12), so the left fade stuck on when a header widened or tabs
|
|
851
|
+
* closed. The JS `data-scrollable` gate and the pause/reflow kick existed to hide that.
|
|
852
|
+
*
|
|
853
|
+
* 3. --layout-tabs-overflowing: public [space toggle](https://css-tricks.com/the-css-custom-property-toggle-trick/),
|
|
854
|
+
* empty while overflowing, for environments without if() (ie core-web on safari). Only a scroll
|
|
855
|
+
* timeline reports overflow as such (it is active exactly then), so it keeps --tab-scroll. It must
|
|
856
|
+
* never reach its after phase, hence range end past 100% *and* `none` fill: if an engine clamps
|
|
857
|
+
* the range, `none` costs at most an unset toggle at max scroll, where `both` would stick forever.
|
|
858
|
+
*
|
|
859
|
+
* 4. Mask: unconditional -- both fades are 0 when the strip cannot scroll, making it a no-op.
|
|
860
|
+
*
|
|
861
|
+
* 5. Shadow reveal: .lm_tabs_scroll_shadow's background (--layout-tab-overflow-shadow-color) shows
|
|
862
|
+
* through the mask's transparency, indicating there is more to scroll.
|
|
863
|
+
*
|
|
864
|
+
* 6. Tab sizing: --layout-tab-width / --layout-tab-min-width, with _internal vars supplying defaults.
|
|
865
|
+
* Gotchas: lm_tab.width must be absolute to use lm_tab as a query container; the drop preview has
|
|
866
|
+
* no content, so it cannot be fit-content.
|
|
861
867
|
*/
|
|
862
868
|
|
|
863
869
|
/** Define as global properties so that they can be used in the animation */
|
|
@@ -873,28 +879,33 @@ div.placeholder_image img {
|
|
|
873
879
|
initial-value: 0;
|
|
874
880
|
}
|
|
875
881
|
|
|
876
|
-
@keyframes
|
|
877
|
-
|
|
878
|
-
/* Space toggle. Whitespace can be used as true/false Unused by us directly but should be exposed for environments that don't support if() (ie core-web on safari) */
|
|
879
|
-
--layout-tabs-overflowing: ;
|
|
882
|
+
@keyframes tabOverflowFadeLeft {
|
|
883
|
+
from {
|
|
880
884
|
--layout-tab-overflow-fade-left: 0;
|
|
881
885
|
}
|
|
882
|
-
|
|
886
|
+
to {
|
|
883
887
|
--layout-tab-overflow-fade-left: 1;
|
|
884
888
|
}
|
|
889
|
+
}
|
|
885
890
|
|
|
886
|
-
|
|
891
|
+
@keyframes tabOverflowFadeRight {
|
|
892
|
+
from {
|
|
887
893
|
--layout-tab-overflow-fade-right: 1;
|
|
888
894
|
}
|
|
895
|
+
to {
|
|
896
|
+
--layout-tab-overflow-fade-right: 0;
|
|
897
|
+
}
|
|
898
|
+
}
|
|
889
899
|
|
|
900
|
+
@keyframes tabOverflowToggle {
|
|
901
|
+
/* Space toggle; set at both ends so it holds wherever progress lands. */
|
|
902
|
+
0%,
|
|
890
903
|
100% {
|
|
891
|
-
/* Space toggle. Whitespace can be used as true/false */
|
|
892
904
|
--layout-tabs-overflowing: ;
|
|
893
|
-
--layout-tab-overflow-fade-right: 0;
|
|
894
905
|
}
|
|
895
906
|
}
|
|
896
907
|
|
|
897
|
-
.lm_goldenlayout[data-settings-tab-overflow=
|
|
908
|
+
.lm_goldenlayout[data-settings-tab-overflow='scroll'] {
|
|
898
909
|
/* Defining separate _internal variables because we need defaults but our drop preview needs to know if the user set styles */
|
|
899
910
|
--_internal-tab-width: var(--layout-tab-width, fit-content);
|
|
900
911
|
--_internal-tab-min-width: var(--layout-tab-min-width, var(--_internal-tab-width));
|
|
@@ -902,16 +913,89 @@ div.placeholder_image img {
|
|
|
902
913
|
.lm_tab {
|
|
903
914
|
width: var(--_internal-tab-width);
|
|
904
915
|
min-width: var(--_internal-tab-min-width);
|
|
916
|
+
display: flex;
|
|
917
|
+
flex-direction: row;
|
|
918
|
+
align-items: center;
|
|
919
|
+
gap: 6px;
|
|
920
|
+
float: none;
|
|
921
|
+
height: unset;
|
|
922
|
+
}
|
|
923
|
+
|
|
924
|
+
.lm_tabs {
|
|
925
|
+
display: flex;
|
|
926
|
+
}
|
|
927
|
+
|
|
928
|
+
.lm_header .lm_tabs .lm_tab {
|
|
929
|
+
padding-top: 0;
|
|
930
|
+
padding-bottom: 0;
|
|
931
|
+
}
|
|
932
|
+
|
|
933
|
+
.lm_header .lm_tab .lm_title {
|
|
934
|
+
flex: 1 1 auto;
|
|
935
|
+
min-width: 0;
|
|
936
|
+
display: block;
|
|
937
|
+
margin-right: 0;
|
|
938
|
+
line-height: 1;
|
|
939
|
+
overflow: hidden;
|
|
940
|
+
text-overflow: ellipsis;
|
|
941
|
+
vertical-align: unset;
|
|
942
|
+
}
|
|
943
|
+
|
|
944
|
+
.tab-icon {
|
|
945
|
+
flex: 0 0 auto;
|
|
946
|
+
vertical-align: unset;
|
|
947
|
+
margin-right: 0;
|
|
948
|
+
}
|
|
949
|
+
|
|
950
|
+
.lm_header .lm_tab > .lm_tab_icon {
|
|
951
|
+
flex: 0 0 auto;
|
|
952
|
+
margin-right: 0;
|
|
953
|
+
}
|
|
954
|
+
|
|
955
|
+
.lm_tab_custom_control {
|
|
956
|
+
flex: 0 0 auto;
|
|
957
|
+
display: flex;
|
|
958
|
+
align-items: center;
|
|
959
|
+
justify-content: center;
|
|
960
|
+
width: var(--layout-tab-custom-control-size, 20px);
|
|
961
|
+
height: var(--layout-tab-custom-control-size, 20px);
|
|
962
|
+
/* Beat `.lm_header [class^=lm_] { box-sizing: content-box !important }` in goldenlayout-base.css */
|
|
963
|
+
box-sizing: border-box !important;
|
|
964
|
+
}
|
|
965
|
+
|
|
966
|
+
.lm_header .lm_tab .lm_close_tab {
|
|
967
|
+
flex: 0 0 auto;
|
|
968
|
+
display: flex;
|
|
969
|
+
align-items: center;
|
|
970
|
+
justify-content: center;
|
|
971
|
+
width: 20px;
|
|
972
|
+
height: 20px;
|
|
973
|
+
background-repeat: no-repeat;
|
|
974
|
+
position: static;
|
|
975
|
+
top: auto;
|
|
976
|
+
right: auto;
|
|
977
|
+
margin: 0;
|
|
978
|
+
padding: 0;
|
|
979
|
+
line-height: 0;
|
|
905
980
|
}
|
|
906
981
|
|
|
907
982
|
.lm_tabs_scroll_shadow {
|
|
908
983
|
width: unset;
|
|
984
|
+
height: 100%;
|
|
909
985
|
display: flex;
|
|
910
986
|
position: relative;
|
|
911
987
|
flex: 0 1 auto;
|
|
912
988
|
overflow: hidden;
|
|
913
989
|
background: var(--layout-tab-overflow-shadow-color);
|
|
914
990
|
|
|
991
|
+
/*
|
|
992
|
+
Per-strip scope: the names are declared on pseudo-elements inside .lm_tabs and lookup only
|
|
993
|
+
walks ancestors. Must be an ancestor (on .lm_tabs itself works in Chromium, not WebKit), and
|
|
994
|
+
must not be hoisted higher -- identical names sharing one scope are ambiguous and silently
|
|
995
|
+
kill every strip's timelines.
|
|
996
|
+
*/
|
|
997
|
+
timeline-scope: --tab-fade-start, --tab-fade-end;
|
|
998
|
+
|
|
915
999
|
.lm_tabs {
|
|
916
1000
|
position: unset;
|
|
917
1001
|
--layout-tabs-overflowing: initial;
|
|
@@ -920,21 +1004,64 @@ div.placeholder_image img {
|
|
|
920
1004
|
scrollbar-width: none;
|
|
921
1005
|
-ms-overflow-style: none;
|
|
922
1006
|
scroll-timeline: --tab-scroll x;
|
|
923
|
-
animation: tabScrollFade linear both;
|
|
924
|
-
animation-timeline: --tab-scroll;
|
|
925
1007
|
display: flex;
|
|
926
1008
|
|
|
927
|
-
mask-image: linear-gradient(
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
1009
|
+
mask-image: linear-gradient(
|
|
1010
|
+
to right,
|
|
1011
|
+
rgba(0, 0, 0, calc(1 - var(--layout-tab-overflow-fade-left))) 0,
|
|
1012
|
+
rgba(0, 0, 0, 1) var(--layout-tab-overflow-fade-size),
|
|
1013
|
+
rgba(0, 0, 0, 1) calc(100% - var(--layout-tab-overflow-fade-size)),
|
|
1014
|
+
rgba(0, 0, 0, calc(1 - var(--layout-tab-overflow-fade-right))) 100%
|
|
1015
|
+
);
|
|
932
1016
|
mask-mode: alpha;
|
|
933
1017
|
}
|
|
1018
|
+
|
|
1019
|
+
/*
|
|
1020
|
+
Sentinels. Each is one fade-size wide and cancels that width with a negative margin, so it
|
|
1021
|
+
overlays the edge tab without affecting layout or the scroll range it measures.
|
|
1022
|
+
Pseudo-elements keep them invisible to :nth-child and to GL's tab bookkeeping.
|
|
1023
|
+
*/
|
|
1024
|
+
.lm_tabs::before,
|
|
1025
|
+
.lm_tabs::after {
|
|
1026
|
+
content: '';
|
|
1027
|
+
flex: 0 0 var(--layout-tab-overflow-fade-size);
|
|
1028
|
+
align-self: stretch;
|
|
1029
|
+
pointer-events: none;
|
|
1030
|
+
}
|
|
1031
|
+
|
|
1032
|
+
.lm_tabs::before {
|
|
1033
|
+
view-timeline: --tab-fade-start x;
|
|
1034
|
+
margin-right: calc(-1 * var(--layout-tab-overflow-fade-size));
|
|
1035
|
+
}
|
|
1036
|
+
|
|
1037
|
+
.lm_tabs::after {
|
|
1038
|
+
view-timeline: --tab-fade-end x;
|
|
1039
|
+
margin-left: calc(-1 * var(--layout-tab-overflow-fade-size));
|
|
1040
|
+
}
|
|
1041
|
+
|
|
1042
|
+
/*
|
|
1043
|
+
Guarded: unsupported engines would otherwise run these as 0s animations and fill to a
|
|
1044
|
+
permanent fade. Skipped, the registered initial value of 0 applies and neither edge fades.
|
|
1045
|
+
animation-timeline/-range are reset-only in the `animation` shorthand, so they follow it.
|
|
1046
|
+
*/
|
|
1047
|
+
@supports (animation-timeline: --tab-fade-start) {
|
|
1048
|
+
.lm_tabs {
|
|
1049
|
+
animation:
|
|
1050
|
+
tabOverflowFadeLeft linear both,
|
|
1051
|
+
tabOverflowFadeRight linear both,
|
|
1052
|
+
tabOverflowToggle linear;
|
|
1053
|
+
animation-timeline: --tab-fade-start, --tab-fade-end, --tab-scroll;
|
|
1054
|
+
animation-range:
|
|
1055
|
+
exit 0% exit 100%,
|
|
1056
|
+
entry 0% entry 100%,
|
|
1057
|
+
normal 110%;
|
|
1058
|
+
}
|
|
1059
|
+
}
|
|
934
1060
|
}
|
|
935
1061
|
|
|
936
1062
|
.lm_header {
|
|
937
1063
|
display: flex;
|
|
1064
|
+
align-items: center;
|
|
938
1065
|
}
|
|
939
1066
|
|
|
940
1067
|
.lm_header .lm_controls {
|
|
@@ -953,6 +1080,7 @@ div.placeholder_image img {
|
|
|
953
1080
|
|
|
954
1081
|
.lm_header .newTabButton {
|
|
955
1082
|
flex: 0 0 auto;
|
|
1083
|
+
margin: 0 5px 0 8px;
|
|
956
1084
|
}
|
|
957
1085
|
}
|
|
958
1086
|
|
|
@@ -963,7 +1091,7 @@ div.placeholder_image img {
|
|
|
963
1091
|
* overflow-x:auto. A ResizeObserver in tabs-container.ts moves overflowing tabs
|
|
964
1092
|
* into/out of the dropdown list by checking scrollWidth > clientWidth.
|
|
965
1093
|
*/
|
|
966
|
-
.lm_goldenlayout[data-settings-tab-overflow=
|
|
1094
|
+
.lm_goldenlayout[data-settings-tab-overflow='dropdown'] {
|
|
967
1095
|
--_internal-tab-width: var(--layout-tab-width, fit-content);
|
|
968
1096
|
--_internal-tab-min-width: var(--layout-tab-min-width, var(--_internal-tab-width));
|
|
969
1097
|
|
|
@@ -1001,6 +1129,7 @@ div.placeholder_image img {
|
|
|
1001
1129
|
flex: 0 0 auto;
|
|
1002
1130
|
}
|
|
1003
1131
|
}
|
|
1132
|
+
|
|
1004
1133
|
.lm_close {
|
|
1005
1134
|
display: none;
|
|
1006
1135
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@openfin/core-web",
|
|
3
|
-
"version": "0.46.
|
|
3
|
+
"version": "0.46.68",
|
|
4
4
|
"description": "",
|
|
5
5
|
"private": false,
|
|
6
6
|
"publishConfig": {
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
"tslib": "2.8.1"
|
|
39
39
|
},
|
|
40
40
|
"peerDependencies": {
|
|
41
|
-
"@openfin/core": "46.100.
|
|
41
|
+
"@openfin/core": "46.100.71"
|
|
42
42
|
},
|
|
43
43
|
"scripts": {
|
|
44
44
|
"prebuild": "rimraf out",
|