@olenbetong/synergi-react 1.0.4 → 1.0.6
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/dist/esm/ob.react.js +43 -56
- package/dist/esm/ob.react.min.css.map +1 -1
- package/dist/esm/ob.react.min.js +1 -1
- package/dist/esm/ob.react.min.js.map +3 -3
- package/dist/iife/ob.react.js +46 -59
- package/dist/iife/ob.react.min.css.map +1 -1
- package/dist/iife/ob.react.min.js +1 -1
- package/dist/iife/ob.react.min.js.map +3 -3
- package/dist/styles/styles.css +1 -1
- package/dist/styles/styles.css.map +1 -1
- package/es/Checkbox/index.js +1 -0
- package/es/ColorCard/index.css +1 -1
- package/es/DateNavigator/index.css +1 -1
- package/es/DateNavigator/index.js +1 -1
- package/es/LinkedCardList/index.css +1 -1
- package/es/PageBanner/index.css +1 -1
- package/es/PageBanner/index.js +2 -1
- package/es/Portal/index.js +5 -7
- package/es/Sidebar/index.js +1 -0
- package/es/Spinner/index.d.ts +1 -1
- package/es/SplitContainer/index.d.ts +1 -1
- package/es/SplitContainer/index.js +2 -1
- package/es/ValueToggle/index.js +1 -1
- package/es/index.css +1 -1
- package/es/useTranslation/index.js +2 -1
- package/package.json +5 -5
- package/src/Checkbox/index.tsx +2 -1
- package/src/ColorCard/index.scss +3 -3
- package/src/DateNavigator/index.scss +2 -2
- package/src/DateNavigator/index.tsx +1 -1
- package/src/LinkedCardList/index.scss +4 -4
- package/src/PageBanner/index.scss +8 -8
- package/src/PageBanner/index.tsx +2 -1
- package/src/Portal/index.tsx +8 -7
- package/src/ProgressBar/index.scss +3 -3
- package/src/Sidebar/index.tsx +1 -0
- package/src/Spinner/index.tsx +1 -1
- package/src/SplitContainer/index.tsx +6 -4
- package/src/ValueToggle/index.scss +1 -1
- package/src/ValueToggle/index.tsx +1 -1
- package/src/index.scss +9 -9
- package/src/useTranslation/index.ts +2 -1
package/dist/styles/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ObCheckbox-root{--check-width: 2rem;--bg-color: var(--brand-dark, rgba(42, 65, 50, 0.5));--bg-color-hover: var(--brand-primary, rgba(42, 65, 50, 0.8));--bg-color-selected: var(--brand-light);display:inline-block;height:var(--check-width);margin-bottom:0}.ObCheckbox-root:focus-within .ObCheckbox-box{border:.1rem solid #000}.ObCheckbox-root.Ob-disabled{--bg-color: rgba(150, 150, 150, 0.5);--bg-color-hover: var(--bg-color)}.ObCheckbox-box{position:relative;background:var(--bg-color);transition:background 300ms ease;overflow:hidden;border-radius:calc(var(--check-width)/15);height:var(--check-width);width:var(--check-width)}.ObCheckbox-box:hover{background:var(--bg-color-hover)}.ObCheckbox-label{position:relative;margin-bottom:0;overflow:hidden}.ObCheckbox-label:focus{outline:none}.ObCheckbox-mark{color:#fff;display:inline-block;font-size:calc(var(--check-width)*.4);left:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transition:all 300ms ease-in-out;transition-delay:0ms;transform:translate(-50%, -50%) scale(6)}.ObCheckbox-input{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.ObCheckbox-input:focus{outline:none}.check_Label{margin-bottom:0;flex-grow:1}.ObCheckbox-input:checked:not(:disabled)+.ObCheckbox-label{animation:animOn 800ms 1 forwards}.ObCheckbox-input:checked:not(:disabled)+.ObCheckbox-label .ObCheckbox-box{background:var(--bg-color-selected)}.ObCheckbox-input:checked+.ObCheckbox-label .ObCheckbox-box .ObCheckbox-mark{transform:translate(-50%, -50%) scale(1);transition-delay:200ms;opacity:1}.ObCheckbox-root.Ob-disabled .ObCheckbox-box{cursor:not-allowed}@keyframes animOn{40%{transform:scaleY(0.4) scaleX(2)}50%{transform:scaleY(1.2) scaleX(0.6)}60%{transform:scaleY(0.8) scaleX(1.4)}70%{transform:scaleY(1.1) scaleX(0.9)}100%{transform:scaleY(1) scaleX(1)}}.ObColorCard-root{--bg-color-border: black;--bg-color-main: white;--bg-size: 0.75rem;--card-color: rgb(0, 0, 0);align-items:stretch;background-image:linear-gradient(to right, hsl(186, 72%, 24%), hsl(186, 72%, 24%) 0.75rem, white 0.75rem, white);background-image:linear-gradient(to right, var(--bg-color-border), var(--bg-color-border) var(--bg-size), var(--bg-color-main) var(--bg-size), var(--bg-color-main));border-radius:.25rem;box-shadow:0 1px 12px rgba(0,0,0,.15),0 1px 6px rgba(0,0,0,.25);color:#666;cursor:pointer;display:flex;font-family:"Variable Bahnschrift","Bahnschrift","Open Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;min-height:10rem;overflow:hidden;transition:all ease-in-out 300ms}.ObColorCard-root:nth-of-type(5n + 1){--bg-color-border: rgb(178, 108, 190)}.ObColorCard-root:nth-of-type(5n + 2){--bg-color-border: rgb(79, 164, 61)}.ObColorCard-root:nth-of-type(5n + 3){--bg-color-border: rgb(246, 170, 23)}.ObColorCard-root:nth-of-type(5n + 4){--bg-color-border: rgb(218, 93, 83)}.ObColorCard-root:nth-of-type(5n + 5){--bg-color-border: rgb(23, 162, 184)}.ObColorCard-root:hover,.ObColorCard-root:focus{--bg-color-main: #f5f5f5;box-shadow:0 3px 18px rgba(0,0,0,.15),0 3px 12px rgba(0,0,0,.25);color:#666;text-decoration:none}@media screen and (min-width: 48rem){.ObColorCard-root{font-size:1.2rem}}.ObColorCard-column{display:flex;flex:1 1 100%;flex-direction:column;justify-content:space-between;margin:1rem 0;overflow:hidden;padding:.5rem 1.5rem .5rem 1rem;text-overflow:ellipsis}.ObColorCard-column:first-child{margin-left:.75rem;margin-left:var(--bg-size)}.ObColorCard-column.ObColorCard-minor{border-right:1px solid #e3e3e3;flex:0 0 4rem;transition:margin ease-in-out 300ms}@media screen and (min-width: 48rem){.ObColorCard-column.ObColorCard-minor{flex:0 0 8rem}}.ObColorCard-detailLabel{color:#ccc;font-size:.8rem;text-transform:uppercase}.ObColorCard-detail:not(:last-child){margin-right:1.5rem}.ObColorCard-detail.ObColorCard-primary,.ObColorCard-detail.ObColorCard-primary .ObColorCard-detailValue{font-size:1.25rem;font-weight:300}.ObColorCard-detail.ObColorCard-primary .ObColorCard-detailValue{color:unset}@media screen and (min-width: 48rem){.ObColorCard-detail{font-size:1rem}}.ObColorCard-detailValue{color:#999}.ObColorCard-label{position:relative;padding-left:1.5rem}.ObColorCard-label:not(:last-child){margin-bottom:1rem}.ObColorCard-label:not(:last-child)::after{content:"";position:absolute;width:.2rem;height:calc(100% + 1rem);border-left:.2rem dotted #666;left:.25rem;top:.5rem;z-index:0}.ObColorCard-label::before{background:#fff;border:.2rem solid #116069;border:.2rem solid var(--bg-color-border);border-radius:50%;content:"";display:block;height:.75rem;left:0;position:absolute;top:.3rem;width:.75rem;z-index:1}.ObDateNavigator-icon{display:inline-block}.ObDateNavigator-icon svg{width:.625em;position:relative;top:-1px}.ObDateNavigator-root{background-color:#f3f4f7;background-color:var(--block-header-color-bg);display:flex;font-size:1rem}.ObDateNavigator-arrow{background:none;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;padding:0;-webkit-appearance:button;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;display:flex;align-items:center;flex:0 0 3rem;justify-content:center;height:3rem;cursor:pointer;text-align:center}.ObDateNavigator-arrow::-moz-focus-inner{border:0;padding:0}.ObDateNavigator-arrow:hover{background-color:#e3e3e3;background-color:var(--block-header-button-hover)}.ObDateNavigator-arrowLeft{border-right:1px solid #ddd;order:1}.ObDateNavigator-arrowRight{border-left:1px solid #ddd;order:3}.ObDateNavigator-date{display:flex;flex:1 1 100%;flex-direction:column;justify-content:center;order:2;height:3rem;text-align:center}.ObLinkedList-root{list-style-type:none;margin-left:0;padding-left:0}.ObLinkedList-item{display:flex;align-items:center;flex-direction:row}.ObLinkedList-leftColumn{flex:1 1 4em;font-size:.75em;padding:0 1em;text-align:center}.ObLinkedList-rightColumn{flex:1 1 100%;padding:1em 1em 1em 1.5em}.ObLinkedList-line{display:flex;align-self:stretch;flex:0 0 .2em;background:#fff;position:relative}.ObLinkedList-bullet{background:#fff;border:1px solid rgba(50,50,50,.25);border-radius:.55em;height:.7em;width:.7em;position:absolute;left:0;top:50%;transform:translate(-0.25em, -50%)}.ObLinkedList-card{background:#fff;border:1px solid;border-color:#e5e6e9 #dfe0e4 #d0d1d5;border-radius:.1875em;color:inherit;cursor:pointer;flex:100% 1 1;position:relative}.ObLinkedList-card::before{border-bottom:.5em solid rgba(0,0,0,0);border-right:1em solid #fff;border-top:.5em solid rgba(0,0,0,0);content:" ";filter:drop-shadow(-1px 0px 1px rgba(50, 50, 50, 0.2));height:1em;left:-1em;margin-top:-0.5em;position:absolute;top:50%;width:1em}.ObLinkedList-card:hover{background-color:#edeff3 !important;color:inherit;text-decoration:inherit}.ObLinkedList-card:hover::before{border-right-color:#edeff3 !important}.ObPageBanner-root{background-color:#116069;background-color:var(--brand-dark);box-shadow:0px 8px 8px rgba(0,0,0,.2);color:#fff}.ObPageBanner-root a{color:#b3d5e6}.ObPageBanner-inner{display:flex;align-items:center;flex-direction:column}@media screen and (min-width: 768px){.ObPageBanner-inner{align-items:flex-start;flex-direction:row}}.ObPageBanner-plantTitle{font-size:2rem}@media screen and (min-width: 992px){.ObPageBanner-plantTitle{font-size:3rem}}.ObPageBanner-bannerImage{align-self:stretch;background-color:#ddd;display:inline-block;height:20vh;object-fit:cover;object-position:center center;width:100%}@media screen and (min-width: 576px){.ObPageBanner-bannerImage{align-self:center;margin:0;margin-right:1rem;border:.4rem solid #fff;border-radius:50%;height:150px;width:150px}}@media screen and (min-width: 992px){.ObPageBanner-bannerImage{height:250px;width:250px}}.ObPageBanner-bannerTitle{margin-bottom:1rem;margin-top:1rem;font-size:2rem}@media screen and (min-width: 768px){.ObPageBanner-bannerTitle{margin-top:0}}@media screen and (min-width: 992px){.ObPageBanner-bannerTitle{font-size:3rem}}.ObPageBanner-tabList.sticky{position:-webkit-sticky;position:sticky;top:0;z-index:1000}.ObPageBanner-tabListInner{overflow-x:auto;scrollbar-width:thin;white-space:nowrap}.ObPageBanner-tab{border-bottom:.25rem solid rgba(0,0,0,0);display:inline-block;margin-top:.5rem;min-width:8rem;padding:.5rem 1rem;text-align:center;text-transform:capitalize}.ObPageBanner-tab.active{border-color:#fff}.ObProgressBar-root{height:1.5em;width:100%;appearance:none;-webkit-appearance:none;background-color:#f5f5f5;border:none;border-radius:3px;box-shadow:0 2px 3px rgba(0,0,0,.2) inset;color:#4169e1;position:relative}.ObProgressBar-root::-webkit-progress-bar{background-color:#f5f5f5;border-radius:3px;box-shadow:0 2px 3px rgba(0,0,0,.2) inset}.ObProgressBar-root::-webkit-progress-value{background-image:linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),linear-gradient(left, var(--brand-primary, hsl(186, 72%, 24%)), var(--brand-light, hsl(186, 72%, 37%)));background-image:-webkit-linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),-webkit-linear-gradient(left, var(--brand-primary), hsl(186, 72%, 24%), var(--brand-light, hsl(186, 72%, 37%)));background-size:35px 20px,100% 100%,100% 100%;border-radius:3px;position:relative;transition:width .5s ease-out}.ObProgressBar-root::-webkit-progress-value:after{background-color:#fff;content:"";border-radius:100%;height:5px;position:absolute;right:7px;top:7px;width:5px}.ObProgressBar-root::-moz-progress-bar{background-image:linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),linear-gradient(left, var(--brand-primary), var(--brand-light));background-image:-moz-linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),-moz-linear-gradient(left, var(--brand-primary), var(--brand-light));background-size:35px 20px,100% 100%,100% 100%;border-radius:3px;transition:width .5s ease-out}.ObSidebar-root{position:fixed;bottom:0;left:0;top:0;z-index:2;background-color:#fff;transform:translateX(-100%);transition:transform .2s ease-out;will-change:transform;overflow-y:auto}.ObSidebar-root.Ob-right{left:unset;right:0;transform:translateX(100%)}.ObSidebar-root.Ob-open{transform:translateX(0)}.ObSidebar-root.ObSidebar-shadow{box-shadow:2px 2px 4px rgba(0,0,0,.15)}.ObSidebar-root.ObSidebar-shadow.Ob-right{box-shadow:-2px 2px 4px rgba(0,0,0,.15)}.ObSidebar-overlay{position:fixed;bottom:0;left:0;right:0;top:0;z-index:1;opacity:0;visibility:hidden;transition:opacity .3s ease-out,visibility .3s ease-out;background-color:rgba(0,0,0,.3)}.ObSidebar-overlay.Ob-open{opacity:1;visibility:visible}.😖{display:initial}.ObSplitContainer-root{display:flex;flex-direction:column;height:100%;width:100%}.ObSplitContainer-root.horizontal{flex-direction:row}.ObSplitContainer-panel{overflow:hidden}.ObSplitContainer-divider{flex:0 0 .5rem;background-color:rgba(0,0,0,0);line-height:.75;cursor:ns-resize;display:flex;align-items:center;justify-content:center}.ObSplitContainer-divider:focus{background-color:rgba(0,0,0,.3)}.ObSplitContainer-root.horizontal>.ObSplitContainer-divider{cursor:ew-resize;writing-mode:vertical-lr}.ObSplitContainer-panel.dragging{pointer-events:none}.ObValueToggle-root{display:flex;align-items:center}.ObValueToggle-option{margin-bottom:0}.ObValueToggle-label{cursor:pointer;font-size:.8em;margin:0 .2em;padding:.3em .5em;text-transform:uppercase}.ObValueToggle-label:hover{background:#ccc}.ObValueToggle-input:checked+.ObValueToggle-label{--color-bg: var(--brand-dark);background-color:#666;background-color:var(--color-bg);cursor:default;color:#fff}.ObValueToggle-input:checked:focus-within+.ObValueToggle-label{--color-bg: var(--brand-light)}.ObValueToggle-input:checked:hover+.ObValueToggle-label{background-color:#666;background-color:var(--color-bg)}.ObValueToggle-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}/*# sourceMappingURL=styles.css.map */
|
|
1
|
+
.ObCheckbox-root{--check-width: 2rem;--bg-color: var(--brand-dark, rgba(42, 65, 50, 0.5));--bg-color-hover: var(--brand-primary, rgba(42, 65, 50, 0.8));--bg-color-selected: var(--brand-light);display:inline-block;height:var(--check-width);margin-bottom:0}.ObCheckbox-root:focus-within .ObCheckbox-box{border:.1rem solid #000}.ObCheckbox-root.Ob-disabled{--bg-color: rgba(150, 150, 150, 0.5);--bg-color-hover: var(--bg-color)}.ObCheckbox-box{position:relative;background:var(--bg-color);transition:background 300ms ease;overflow:hidden;border-radius:calc(var(--check-width)/15);height:var(--check-width);width:var(--check-width)}.ObCheckbox-box:hover{background:var(--bg-color-hover)}.ObCheckbox-label{position:relative;margin-bottom:0;overflow:hidden}.ObCheckbox-label:focus{outline:none}.ObCheckbox-mark{color:#fff;display:inline-block;font-size:calc(var(--check-width)*.4);left:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transition:all 300ms ease-in-out;transition-delay:0ms;transform:translate(-50%, -50%) scale(6)}.ObCheckbox-input{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.ObCheckbox-input:focus{outline:none}.check_Label{margin-bottom:0;flex-grow:1}.ObCheckbox-input:checked:not(:disabled)+.ObCheckbox-label{animation:animOn 800ms 1 forwards}.ObCheckbox-input:checked:not(:disabled)+.ObCheckbox-label .ObCheckbox-box{background:var(--bg-color-selected)}.ObCheckbox-input:checked+.ObCheckbox-label .ObCheckbox-box .ObCheckbox-mark{transform:translate(-50%, -50%) scale(1);transition-delay:200ms;opacity:1}.ObCheckbox-root.Ob-disabled .ObCheckbox-box{cursor:not-allowed}@keyframes animOn{40%{transform:scaleY(0.4) scaleX(2)}50%{transform:scaleY(1.2) scaleX(0.6)}60%{transform:scaleY(0.8) scaleX(1.4)}70%{transform:scaleY(1.1) scaleX(0.9)}100%{transform:scaleY(1) scaleX(1)}}.ObColorCard-root{--bg-color-border: black;--bg-color-main: white;--bg-size: 0.75rem;--card-color: rgb(0, 0, 0);align-items:stretch;background-image:linear-gradient(to right, hsl(186, 72%, 24%), hsl(186, 72%, 24%) 0.75rem, white 0.75rem, white);background-image:linear-gradient(to right, var(--bg-color-border), var(--bg-color-border) var(--bg-size), var(--bg-color-main) var(--bg-size), var(--bg-color-main));border-radius:.25rem;box-shadow:0 1px 12px rgba(0,0,0,.15),0 1px 6px rgba(0,0,0,.25);color:#666;cursor:pointer;display:flex;font-family:"Variable Bahnschrift","Bahnschrift","Open Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;min-height:10rem;overflow:hidden;transition:all ease-in-out 300ms}.ObColorCard-root:nth-of-type(5n + 1){--bg-color-border: rgb(178, 108, 190)}.ObColorCard-root:nth-of-type(5n + 2){--bg-color-border: rgb(79, 164, 61)}.ObColorCard-root:nth-of-type(5n + 3){--bg-color-border: rgb(246, 170, 23)}.ObColorCard-root:nth-of-type(5n + 4){--bg-color-border: rgb(218, 93, 83)}.ObColorCard-root:nth-of-type(5n + 5){--bg-color-border: rgb(23, 162, 184)}.ObColorCard-root:hover,.ObColorCard-root:focus{--bg-color-main: #f5f5f5;box-shadow:0 3px 18px rgba(0,0,0,.15),0 3px 12px rgba(0,0,0,.25);color:#666;text-decoration:none}@media screen and (min-width: 48rem){.ObColorCard-root{font-size:1.2rem}}.ObColorCard-column{display:flex;flex:1 1 100%;flex-direction:column;justify-content:space-between;margin:1rem 0;overflow:hidden;padding:.5rem 1.5rem .5rem 1rem;text-overflow:ellipsis}.ObColorCard-column:first-child{margin-left:.75rem;margin-left:var(--bg-size)}.ObColorCard-column.ObColorCard-minor{border-right:1px solid #e3e3e3;flex:0 0 4rem;transition:margin ease-in-out 300ms}@media screen and (min-width: 48rem){.ObColorCard-column.ObColorCard-minor{flex:0 0 8rem}}.ObColorCard-detailLabel{color:#ccc;font-size:.8rem;text-transform:uppercase}.ObColorCard-detail:not(:last-child){margin-right:1.5rem}.ObColorCard-detail.ObColorCard-primary,.ObColorCard-detail.ObColorCard-primary .ObColorCard-detailValue{font-size:1.25rem;font-weight:300}.ObColorCard-detail.ObColorCard-primary .ObColorCard-detailValue{color:unset}@media screen and (min-width: 48rem){.ObColorCard-detail{font-size:1rem}}.ObColorCard-detailValue{color:#999}.ObColorCard-label{position:relative;padding-left:1.5rem}.ObColorCard-label:not(:last-child){margin-bottom:1rem}.ObColorCard-label:not(:last-child)::after{content:"";position:absolute;width:.2rem;height:calc(100% + 1rem);border-left:.2rem dotted #666;left:.25rem;top:.5rem;z-index:0}.ObColorCard-label::before{background:#fff;border:.2rem solid hsl(186,72%,24%);border:.2rem solid var(--bg-color-border);border-radius:50%;content:"";display:block;height:.75rem;left:0;position:absolute;top:.3rem;width:.75rem;z-index:1}.ObDateNavigator-icon{display:inline-block}.ObDateNavigator-icon svg{width:.625em;position:relative;top:-1px}.ObDateNavigator-root{background-color:hsl(220,20%,96%);background-color:var(--block-header-color-bg);display:flex;font-size:1rem}.ObDateNavigator-arrow{background:none;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;padding:0;-webkit-appearance:button;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;display:flex;align-items:center;flex:0 0 3rem;justify-content:center;height:3rem;cursor:pointer;text-align:center}.ObDateNavigator-arrow::-moz-focus-inner{border:0;padding:0}.ObDateNavigator-arrow:hover{background-color:#e3e3e3;background-color:var(--block-header-button-hover)}.ObDateNavigator-arrowLeft{border-right:1px solid #ddd;order:1}.ObDateNavigator-arrowRight{border-left:1px solid #ddd;order:3}.ObDateNavigator-date{display:flex;flex:1 1 100%;flex-direction:column;justify-content:center;order:2;height:3rem;text-align:center}.ObLinkedList-root{list-style-type:none;margin-left:0;padding-left:0}.ObLinkedList-item{display:flex;align-items:center;flex-direction:row}.ObLinkedList-leftColumn{flex:1 1 4em;font-size:.75em;padding:0 1em;text-align:center}.ObLinkedList-rightColumn{flex:1 1 100%;padding:1em 1em 1em 1.5em}.ObLinkedList-line{display:flex;align-self:stretch;flex:0 0 .2em;background:#fff;position:relative}.ObLinkedList-bullet{background:#fff;border:1px solid rgba(50,50,50,.25);border-radius:.55em;height:.7em;width:.7em;position:absolute;left:0;top:50%;transform:translate(-0.25em, -50%)}.ObLinkedList-card{background:#fff;border:1px solid;border-color:#e5e6e9 #dfe0e4 #d0d1d5;border-radius:.1875em;color:inherit;cursor:pointer;flex:100% 1 1;position:relative}.ObLinkedList-card::before{border-bottom:.5em solid rgba(0,0,0,0);border-right:1em solid #fff;border-top:.5em solid rgba(0,0,0,0);content:" ";filter:drop-shadow(-1px 0px 1px rgba(50, 50, 50, 0.2));height:1em;left:-1em;margin-top:-0.5em;position:absolute;top:50%;width:1em}.ObLinkedList-card:hover{background-color:hsl(220,20%,94%) !important;color:inherit;text-decoration:inherit}.ObLinkedList-card:hover::before{border-right-color:hsl(220,20%,94%) !important}.ObPageBanner-root{background-color:hsl(186,72%,24%);background-color:var(--brand-dark);box-shadow:0px 8px 8px rgba(0,0,0,.2);color:#fff}.ObPageBanner-root a{color:hsl(200,50%,80%)}.ObPageBanner-inner{display:flex;align-items:center;flex-direction:column}@media screen and (min-width: 768px){.ObPageBanner-inner{align-items:flex-start;flex-direction:row}}.ObPageBanner-plantTitle{font-size:2rem}@media screen and (min-width: 992px){.ObPageBanner-plantTitle{font-size:3rem}}.ObPageBanner-bannerImage{align-self:stretch;background-color:#ddd;display:inline-block;height:20vh;object-fit:cover;object-position:center center;width:100%}@media screen and (min-width: 576px){.ObPageBanner-bannerImage{align-self:center;margin:0;margin-right:1rem;border:.4rem solid #fff;border-radius:50%;height:150px;width:150px}}@media screen and (min-width: 992px){.ObPageBanner-bannerImage{height:250px;width:250px}}.ObPageBanner-bannerTitle{margin-bottom:1rem;margin-top:1rem;font-size:2rem}@media screen and (min-width: 768px){.ObPageBanner-bannerTitle{margin-top:0}}@media screen and (min-width: 992px){.ObPageBanner-bannerTitle{font-size:3rem}}.ObPageBanner-tabList.sticky{position:-webkit-sticky;position:sticky;top:0;z-index:1000}.ObPageBanner-tabListInner{overflow-x:auto;scrollbar-width:thin;white-space:nowrap}.ObPageBanner-tab{border-bottom:.25rem solid rgba(0,0,0,0);display:inline-block;margin-top:.5rem;min-width:8rem;padding:.5rem 1rem;text-align:center;text-transform:capitalize}.ObPageBanner-tab.active{border-color:#fff}.ObProgressBar-root{height:1.5em;width:100%;appearance:none;-webkit-appearance:none;background-color:#f5f5f5;border:none;border-radius:3px;box-shadow:0 2px 3px rgba(0,0,0,.2) inset;color:#4169e1;position:relative}.ObProgressBar-root::-webkit-progress-bar{background-color:#f5f5f5;border-radius:3px;box-shadow:0 2px 3px rgba(0,0,0,.2) inset}.ObProgressBar-root::-webkit-progress-value{background-image:linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),linear-gradient(left, var(--brand-primary, hsl(186, 72%, 24%)), var(--brand-light, hsl(186, 72%, 37%)));background-image:-webkit-linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),-webkit-linear-gradient(left, var(--brand-primary), hsl(186, 72%, 24%), var(--brand-light, hsl(186, 72%, 37%)));background-size:35px 20px,100% 100%,100% 100%;border-radius:3px;position:relative;transition:width .5s ease-out}.ObProgressBar-root::-webkit-progress-value:after{background-color:#fff;content:"";border-radius:100%;height:5px;position:absolute;right:7px;top:7px;width:5px}.ObProgressBar-root::-moz-progress-bar{background-image:linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),linear-gradient(left, var(--brand-primary), var(--brand-light));background-image:-moz-linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),-moz-linear-gradient(left, var(--brand-primary), var(--brand-light));background-size:35px 20px,100% 100%,100% 100%;border-radius:3px;transition:width .5s ease-out}.ObSidebar-root{position:fixed;bottom:0;left:0;top:0;z-index:2;background-color:#fff;transform:translateX(-100%);transition:transform .2s ease-out;will-change:transform;overflow-y:auto}.ObSidebar-root.Ob-right{left:unset;right:0;transform:translateX(100%)}.ObSidebar-root.Ob-open{transform:translateX(0)}.ObSidebar-root.ObSidebar-shadow{box-shadow:2px 2px 4px rgba(0,0,0,.15)}.ObSidebar-root.ObSidebar-shadow.Ob-right{box-shadow:-2px 2px 4px rgba(0,0,0,.15)}.ObSidebar-overlay{position:fixed;bottom:0;left:0;right:0;top:0;z-index:1;opacity:0;visibility:hidden;transition:opacity .3s ease-out,visibility .3s ease-out;background-color:rgba(0,0,0,.3)}.ObSidebar-overlay.Ob-open{opacity:1;visibility:visible}.😖{display:initial}.ObSplitContainer-root{display:flex;flex-direction:column;height:100%;width:100%}.ObSplitContainer-root.horizontal{flex-direction:row}.ObSplitContainer-panel{overflow:hidden}.ObSplitContainer-divider{flex:0 0 .5rem;background-color:rgba(0,0,0,0);line-height:.75;cursor:ns-resize;display:flex;align-items:center;justify-content:center}.ObSplitContainer-divider:focus{background-color:rgba(0,0,0,.3)}.ObSplitContainer-root.horizontal>.ObSplitContainer-divider{cursor:ew-resize;writing-mode:vertical-lr}.ObSplitContainer-panel.dragging{pointer-events:none}.ObValueToggle-root{display:flex;align-items:center}.ObValueToggle-option{margin-bottom:0}.ObValueToggle-label{cursor:pointer;font-size:.8em;margin:0 .2em;padding:.3em .5em;text-transform:uppercase}.ObValueToggle-label:hover{background:#ccc}.ObValueToggle-input:checked+.ObValueToggle-label{--color-bg: var(--brand-dark);background-color:#666;background-color:var(--color-bg);cursor:default;color:#fff}.ObValueToggle-input:checked:focus-within+.ObValueToggle-label{--color-bg: var(--brand-light)}.ObValueToggle-input:checked:hover+.ObValueToggle-label{background-color:#666;background-color:var(--color-bg)}.ObValueToggle-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}/*# sourceMappingURL=styles.css.map */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sourceRoot":"","sources":["../../src/Checkbox/index.scss","../../src/ColorCard/index.scss","../../src/DateNavigator/index.scss","../../src/styles/_mixins.scss","../../src/LinkedCardList/index.scss","../../src/PageBanner/index.scss","../../src/styles/_variables.scss","../../src/ProgressBar/index.scss","../../src/Sidebar/index.scss","../../src/SplitContainer/index.scss","../../src/ValueToggle/index.scss"],"names":[],"mappings":"CAAA,iBACC,oBACA,qDACA,8DACA,wCAEA,qBACA,0BACA,gBAEA,8CACC,wBAGD,6BACC,qCACA,kCAIF,gBACC,kBAEA,2BACA,iCAEA,gBAEA,0CACA,0BACA,yBAEA,sBACC,iCAIF,kBACC,kBACA,gBACA,gBAEA,wBACC,aAIF,iBACC,WACA,qBACA,sCACA,SACA,UACA,oBACA,kBACA,QACA,iCACA,qBACA,yCAGD,kBACC,mBACA,qBACA,WACA,gBACA,kBACA,mBACA,UAEA,wBACC,aAIF,aACC,gBACA,YAGD,2DACC,kCAGD,2EACC,oCAGD,6EACC,yCACA,uBACA,UAGD,6CACC,mBAGD,kBACC,IACC,gCAGD,IACC,kCAGD,IACC,kCAGD,IACC,kCAGD,KACC,+BClHF,kBACC,yBACA,uBACA,mBACA,2BAEA,oBACA,iHACA,qKAOA,qBACA,WACC,qDAED,WACA,eACA,aACA,YACC,6LAaD,eACA,iBACA,gBACA,iCAEA,sCACC,sCAED,sCACC,oCAED,sCACC,qCAED,sCACC,oCAED,sCACC,qCAGD,gDAGC,yBAEA,WACC,sDAED,WACA,qBAID,qCAtED,kBAuEE,kBAIF,oBACC,aACA,cACA,sBACA,8BACA,cACA,gBACA,gCACA,uBAEA,gCACC,mBACA,2BAGD,sCACC,+BACA,cACA,oCAGD,qCACC,sCACC,eAKH,yBACC,WACA,gBACA,yBAIA,qCACC,oBAGD,yGAEC,kBACA,gBAGD,iEACC,YAGD,qCAfD,oBAgBE,gBAIF,yBACC,WAGD,mBACC,kBACA,oBAGA,oCACC,mBAEA,2CACC,WACA,kBACA,YACA,yBACA,8BACA,YACA,UACA,UAIF,2BACC,gBACA,
|
|
1
|
+
{"version":3,"sourceRoot":"","sources":["../../src/Checkbox/index.scss","../../src/ColorCard/index.scss","../../src/DateNavigator/index.scss","../../src/styles/_mixins.scss","../../src/LinkedCardList/index.scss","../../src/PageBanner/index.scss","../../src/styles/_variables.scss","../../src/ProgressBar/index.scss","../../src/Sidebar/index.scss","../../src/SplitContainer/index.scss","../../src/ValueToggle/index.scss"],"names":[],"mappings":"CAAA,iBACC,oBACA,qDACA,8DACA,wCAEA,qBACA,0BACA,gBAEA,8CACC,wBAGD,6BACC,qCACA,kCAIF,gBACC,kBAEA,2BACA,iCAEA,gBAEA,0CACA,0BACA,yBAEA,sBACC,iCAIF,kBACC,kBACA,gBACA,gBAEA,wBACC,aAIF,iBACC,WACA,qBACA,sCACA,SACA,UACA,oBACA,kBACA,QACA,iCACA,qBACA,yCAGD,kBACC,mBACA,qBACA,WACA,gBACA,kBACA,mBACA,UAEA,wBACC,aAIF,aACC,gBACA,YAGD,2DACC,kCAGD,2EACC,oCAGD,6EACC,yCACA,uBACA,UAGD,6CACC,mBAGD,kBACC,IACC,gCAGD,IACC,kCAGD,IACC,kCAGD,IACC,kCAGD,KACC,+BClHF,kBACC,yBACA,uBACA,mBACA,2BAEA,oBACA,iHACA,qKAOA,qBACA,WACC,qDAED,WACA,eACA,aACA,YACC,6LAaD,eACA,iBACA,gBACA,iCAEA,sCACC,sCAED,sCACC,oCAED,sCACC,qCAED,sCACC,oCAED,sCACC,qCAGD,gDAGC,yBAEA,WACC,sDAED,WACA,qBAID,qCAtED,kBAuEE,kBAIF,oBACC,aACA,cACA,sBACA,8BACA,cACA,gBACA,gCACA,uBAEA,gCACC,mBACA,2BAGD,sCACC,+BACA,cACA,oCAGD,qCACC,sCACC,eAKH,yBACC,WACA,gBACA,yBAIA,qCACC,oBAGD,yGAEC,kBACA,gBAGD,iEACC,YAGD,qCAfD,oBAgBE,gBAIF,yBACC,WAGD,mBACC,kBACA,oBAGA,oCACC,mBAEA,2CACC,WACA,kBACA,YACA,yBACA,8BACA,YACA,UACA,UAIF,2BACC,gBACA,oCACA,0CACA,kBACA,WACA,cACA,cACA,OACA,kBACA,UACA,aACA,UCnKF,sBACC,qBAEA,0BACC,aACA,kBACA,SAIF,sBACC,kCACA,8CACA,aACA,eAGD,uBCpBC,gBACA,SACA,cAEA,aACA,mBACA,iBACA,UACA,0BACA,yBACA,sBACA,qBDWA,aACA,mBACA,cACA,uBAEA,OA1BoB,KA4BpB,eACA,kBCjBA,yCACC,SACA,UDiBD,6BACC,yBACA,kDAIF,2BACC,4BACA,QAGD,4BACC,2BACA,QAGD,sBACC,aACA,cACA,sBACA,uBACA,QAEA,OAtDoB,KAwDpB,kBErDD,mBACC,qBACA,cACA,eAGD,mBACC,aACA,mBACA,mBAGD,yBACC,aACA,gBACA,cACA,kBAGD,0BACC,cACA,0BAGD,mBACC,aACA,mBACA,cACA,gBACA,kBAGD,qBACC,gBAEA,oCACA,oBACA,OAxCa,KAyCb,MAzCa,KA2Cb,kBACA,OACA,QAEA,mCAGD,mBACC,gBACA,iBACA,qCACA,sBACA,cACA,eACA,cACA,kBAGD,2BACC,uCACA,4BACA,oCACA,YACA,uDACA,WACA,UACA,kBACA,kBACA,QACA,UAGD,yBACC,6CACA,cACA,wBAGD,iCACC,+CClFD,mBACC,iBCHe,iBDIf,mCACA,sCACA,WAEA,qBACC,uBAIF,oBACC,aACA,mBACA,sBAEA,qCALD,oBAME,uBACA,oBAIF,yBACC,eAEA,qCAHD,yBAIE,gBAIF,0BACC,mBACA,sBACA,qBACA,YACA,iBACA,8BACA,WAEA,qCATD,0BAUE,kBACA,SACA,kBACA,wBACA,kBACA,aACA,aAGD,qCAnBD,0BAoBE,aACA,aAIF,0BACC,mBACA,gBACA,eAEA,qCALD,0BAME,cAGD,qCATD,0BAUE,gBAKD,6BACC,wBACA,gBACA,MACA,aAIF,2BACC,gBACA,qBACA,mBAGD,kBACC,yCACA,qBACA,iBACA,eACA,mBACA,kBACA,0BAEA,yBACC,kBE9FF,oBACC,aACA,WACA,gBACA,wBACA,yBACA,YACA,kBACA,0CACA,cACA,kBAEA,0CACC,yBACA,kBACA,0CAGD,4CACC,oTAUA,iBACC,2TAUD,gBACC,8BAGD,kBACA,kBACA,8BAGD,kDACC,sBACA,WAEA,mBACA,WAEA,kBACA,UACA,QACA,UAGD,uCACC,4QAUA,iBACC,0QAUD,gBACC,8BAGD,kBACA,8BC3FF,gBACC,eACA,SACA,OACA,MACA,UAEA,sBAEA,4BACA,kCACA,sBAQA,gBANA,yBACC,WACA,QACA,2BAKD,wBACC,wBAGD,iCACC,uCAEA,0CACC,wCAKH,mBACC,eACA,SACA,OACA,QACA,MACA,UAEA,UACA,kBAEA,WACC,6CAED,gCAEA,2BACC,UACA,mBCjDF,IACC,gBAGD,uBACC,aACA,sBACA,YACA,WAEA,kCACC,mBAIF,wBACC,gBAGD,0BACC,eACA,+BACA,gBACA,iBAEA,aACA,mBACA,uBAEA,gCACC,gCAGD,4DACC,iBACA,yBAIF,iCACC,oBCzCD,oBACC,aACA,mBAGD,sBACC,gBAGD,qBACC,eACA,eACA,cACA,kBACA,yBAEA,2BACC,gBAGD,kDACC,8BACA,sBACA,iCACA,eACA,WAGD,+DACC,+BAGD,wDACC,sBACA,iCAIF,qBACC,kBACA,UACA,WACA,UACA,YACA,gBACA,sBACA","file":"styles.css"}
|
package/es/Checkbox/index.js
CHANGED
|
@@ -8,6 +8,7 @@ function Mark(props) {
|
|
|
8
8
|
export const Checkbox = forwardRef(function Checkbox({ className, disabled = false, id, onChange = () => null, title, value, ...other }, ref) {
|
|
9
9
|
const inputId = useId() + (id ?? "");
|
|
10
10
|
const input = useRef(null);
|
|
11
|
+
// biome-ignore lint/correctness/useExhaustiveDependencies: Ref object
|
|
11
12
|
useEffect(() => {
|
|
12
13
|
if (typeof ref === "function") {
|
|
13
14
|
ref(input.current);
|
package/es/ColorCard/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ObColorCard-root{--bg-color-border: black;--bg-color-main: white;--bg-size: 0.75rem;--card-color: rgb(0, 0, 0);align-items:stretch;background-image:linear-gradient(to right, hsl(186, 72%, 24%), hsl(186, 72%, 24%) 0.75rem, white 0.75rem, white);background-image:linear-gradient(to right, var(--bg-color-border), var(--bg-color-border) var(--bg-size), var(--bg-color-main) var(--bg-size), var(--bg-color-main));border-radius:.25rem;box-shadow:0 1px 12px rgba(0,0,0,.15),0 1px 6px rgba(0,0,0,.25);color:#666;cursor:pointer;display:flex;font-family:"Variable Bahnschrift","Bahnschrift","Open Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;min-height:10rem;overflow:hidden;transition:all ease-in-out 300ms}.ObColorCard-root:nth-of-type(5n + 1){--bg-color-border: rgb(178, 108, 190)}.ObColorCard-root:nth-of-type(5n + 2){--bg-color-border: rgb(79, 164, 61)}.ObColorCard-root:nth-of-type(5n + 3){--bg-color-border: rgb(246, 170, 23)}.ObColorCard-root:nth-of-type(5n + 4){--bg-color-border: rgb(218, 93, 83)}.ObColorCard-root:nth-of-type(5n + 5){--bg-color-border: rgb(23, 162, 184)}.ObColorCard-root:hover,.ObColorCard-root:focus{--bg-color-main: #f5f5f5;box-shadow:0 3px 18px rgba(0,0,0,.15),0 3px 12px rgba(0,0,0,.25);color:#666;text-decoration:none}@media screen and (min-width: 48rem){.ObColorCard-root{font-size:1.2rem}}.ObColorCard-column{display:flex;flex:1 1 100%;flex-direction:column;justify-content:space-between;margin:1rem 0;overflow:hidden;padding:.5rem 1.5rem .5rem 1rem;text-overflow:ellipsis}.ObColorCard-column:first-child{margin-left:.75rem;margin-left:var(--bg-size)}.ObColorCard-column.ObColorCard-minor{border-right:1px solid #e3e3e3;flex:0 0 4rem;transition:margin ease-in-out 300ms}@media screen and (min-width: 48rem){.ObColorCard-column.ObColorCard-minor{flex:0 0 8rem}}.ObColorCard-detailLabel{color:#ccc;font-size:.8rem;text-transform:uppercase}.ObColorCard-detail:not(:last-child){margin-right:1.5rem}.ObColorCard-detail.ObColorCard-primary,.ObColorCard-detail.ObColorCard-primary .ObColorCard-detailValue{font-size:1.25rem;font-weight:300}.ObColorCard-detail.ObColorCard-primary .ObColorCard-detailValue{color:unset}@media screen and (min-width: 48rem){.ObColorCard-detail{font-size:1rem}}.ObColorCard-detailValue{color:#999}.ObColorCard-label{position:relative;padding-left:1.5rem}.ObColorCard-label:not(:last-child){margin-bottom:1rem}.ObColorCard-label:not(:last-child)::after{content:"";position:absolute;width:.2rem;height:calc(100% + 1rem);border-left:.2rem dotted #666;left:.25rem;top:.5rem;z-index:0}.ObColorCard-label::before{background:#fff;border:.2rem solid
|
|
1
|
+
.ObColorCard-root{--bg-color-border: black;--bg-color-main: white;--bg-size: 0.75rem;--card-color: rgb(0, 0, 0);align-items:stretch;background-image:linear-gradient(to right, hsl(186, 72%, 24%), hsl(186, 72%, 24%) 0.75rem, white 0.75rem, white);background-image:linear-gradient(to right, var(--bg-color-border), var(--bg-color-border) var(--bg-size), var(--bg-color-main) var(--bg-size), var(--bg-color-main));border-radius:.25rem;box-shadow:0 1px 12px rgba(0,0,0,.15),0 1px 6px rgba(0,0,0,.25);color:#666;cursor:pointer;display:flex;font-family:"Variable Bahnschrift","Bahnschrift","Open Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;min-height:10rem;overflow:hidden;transition:all ease-in-out 300ms}.ObColorCard-root:nth-of-type(5n + 1){--bg-color-border: rgb(178, 108, 190)}.ObColorCard-root:nth-of-type(5n + 2){--bg-color-border: rgb(79, 164, 61)}.ObColorCard-root:nth-of-type(5n + 3){--bg-color-border: rgb(246, 170, 23)}.ObColorCard-root:nth-of-type(5n + 4){--bg-color-border: rgb(218, 93, 83)}.ObColorCard-root:nth-of-type(5n + 5){--bg-color-border: rgb(23, 162, 184)}.ObColorCard-root:hover,.ObColorCard-root:focus{--bg-color-main: #f5f5f5;box-shadow:0 3px 18px rgba(0,0,0,.15),0 3px 12px rgba(0,0,0,.25);color:#666;text-decoration:none}@media screen and (min-width: 48rem){.ObColorCard-root{font-size:1.2rem}}.ObColorCard-column{display:flex;flex:1 1 100%;flex-direction:column;justify-content:space-between;margin:1rem 0;overflow:hidden;padding:.5rem 1.5rem .5rem 1rem;text-overflow:ellipsis}.ObColorCard-column:first-child{margin-left:.75rem;margin-left:var(--bg-size)}.ObColorCard-column.ObColorCard-minor{border-right:1px solid #e3e3e3;flex:0 0 4rem;transition:margin ease-in-out 300ms}@media screen and (min-width: 48rem){.ObColorCard-column.ObColorCard-minor{flex:0 0 8rem}}.ObColorCard-detailLabel{color:#ccc;font-size:.8rem;text-transform:uppercase}.ObColorCard-detail:not(:last-child){margin-right:1.5rem}.ObColorCard-detail.ObColorCard-primary,.ObColorCard-detail.ObColorCard-primary .ObColorCard-detailValue{font-size:1.25rem;font-weight:300}.ObColorCard-detail.ObColorCard-primary .ObColorCard-detailValue{color:unset}@media screen and (min-width: 48rem){.ObColorCard-detail{font-size:1rem}}.ObColorCard-detailValue{color:#999}.ObColorCard-label{position:relative;padding-left:1.5rem}.ObColorCard-label:not(:last-child){margin-bottom:1rem}.ObColorCard-label:not(:last-child)::after{content:"";position:absolute;width:.2rem;height:calc(100% + 1rem);border-left:.2rem dotted #666;left:.25rem;top:.5rem;z-index:0}.ObColorCard-label::before{background:#fff;border:.2rem solid hsl(186,72%,24%);border:.2rem solid var(--bg-color-border);border-radius:50%;content:"";display:block;height:.75rem;left:0;position:absolute;top:.3rem;width:.75rem;z-index:1}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.ObDateNavigator-icon{display:inline-block}.ObDateNavigator-icon svg{width:.625em;position:relative;top:-1px}.ObDateNavigator-root{background-color
|
|
1
|
+
.ObDateNavigator-icon{display:inline-block}.ObDateNavigator-icon svg{width:.625em;position:relative;top:-1px}.ObDateNavigator-root{background-color:hsl(220,20%,96%);background-color:var(--block-header-color-bg);display:flex;font-size:1rem}.ObDateNavigator-arrow{background:none;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;padding:0;-webkit-appearance:button;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;display:flex;align-items:center;flex:0 0 3rem;justify-content:center;height:3rem;cursor:pointer;text-align:center}.ObDateNavigator-arrow::-moz-focus-inner{border:0;padding:0}.ObDateNavigator-arrow:hover{background-color:#e3e3e3;background-color:var(--block-header-button-hover)}.ObDateNavigator-arrowLeft{border-right:1px solid #ddd;order:1}.ObDateNavigator-arrowRight{border-left:1px solid #ddd;order:3}.ObDateNavigator-date{display:flex;flex:1 1 100%;flex-direction:column;justify-content:center;order:2;height:3rem;text-align:center}
|
|
@@ -26,7 +26,7 @@ export function DateNavigator({ date: dateProp, onChange }) {
|
|
|
26
26
|
const dateUtc = Date.UTC(date.getFullYear(), date.getMonth(), date.getDate());
|
|
27
27
|
let dateValue = new Date(dateUtc);
|
|
28
28
|
let text = formatter.format(dateValue);
|
|
29
|
-
let altText;
|
|
29
|
+
let altText = "";
|
|
30
30
|
if (todayUtc === dateUtc) {
|
|
31
31
|
altText = getLocalizedString("Today");
|
|
32
32
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.ObLinkedList-root{list-style-type:none;margin-left:0;padding-left:0}.ObLinkedList-item{display:flex;align-items:center;flex-direction:row}.ObLinkedList-leftColumn{flex:1 1 4em;font-size:.75em;padding:0 1em;text-align:center}.ObLinkedList-rightColumn{flex:1 1 100%;padding:1em 1em 1em 1.5em}.ObLinkedList-line{display:flex;align-self:stretch;flex:0 0 .2em;background:#fff;position:relative}.ObLinkedList-bullet{background:#fff;border:1px solid rgba(50,50,50,.25);border-radius:.55em;height:.7em;width:.7em;position:absolute;left:0;top:50%;transform:translate(-0.25em, -50%)}.ObLinkedList-card{background:#fff;border:1px solid;border-color:#e5e6e9 #dfe0e4 #d0d1d5;border-radius:.1875em;color:inherit;cursor:pointer;flex:100% 1 1;position:relative}.ObLinkedList-card::before{border-bottom:.5em solid rgba(0,0,0,0);border-right:1em solid #fff;border-top:.5em solid rgba(0,0,0,0);content:" ";filter:drop-shadow(-1px 0px 1px rgba(50, 50, 50, 0.2));height:1em;left:-1em;margin-top:-0.5em;position:absolute;top:50%;width:1em}.ObLinkedList-card:hover{background-color
|
|
1
|
+
.ObLinkedList-root{list-style-type:none;margin-left:0;padding-left:0}.ObLinkedList-item{display:flex;align-items:center;flex-direction:row}.ObLinkedList-leftColumn{flex:1 1 4em;font-size:.75em;padding:0 1em;text-align:center}.ObLinkedList-rightColumn{flex:1 1 100%;padding:1em 1em 1em 1.5em}.ObLinkedList-line{display:flex;align-self:stretch;flex:0 0 .2em;background:#fff;position:relative}.ObLinkedList-bullet{background:#fff;border:1px solid rgba(50,50,50,.25);border-radius:.55em;height:.7em;width:.7em;position:absolute;left:0;top:50%;transform:translate(-0.25em, -50%)}.ObLinkedList-card{background:#fff;border:1px solid;border-color:#e5e6e9 #dfe0e4 #d0d1d5;border-radius:.1875em;color:inherit;cursor:pointer;flex:100% 1 1;position:relative}.ObLinkedList-card::before{border-bottom:.5em solid rgba(0,0,0,0);border-right:1em solid #fff;border-top:.5em solid rgba(0,0,0,0);content:" ";filter:drop-shadow(-1px 0px 1px rgba(50, 50, 50, 0.2));height:1em;left:-1em;margin-top:-0.5em;position:absolute;top:50%;width:1em}.ObLinkedList-card:hover{background-color:hsl(220,20%,94%) !important;color:inherit;text-decoration:inherit}.ObLinkedList-card:hover::before{border-right-color:hsl(220,20%,94%) !important}
|
package/es/PageBanner/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ObPageBanner-root{background-color
|
|
1
|
+
.ObPageBanner-root{background-color:hsl(186,72%,24%);background-color:var(--brand-dark);box-shadow:0px 8px 8px rgba(0,0,0,.2);color:#fff}.ObPageBanner-root a{color:hsl(200,50%,80%)}.ObPageBanner-inner{display:flex;align-items:center;flex-direction:column}@media screen and (min-width: 768px){.ObPageBanner-inner{align-items:flex-start;flex-direction:row}}.ObPageBanner-plantTitle{font-size:2rem}@media screen and (min-width: 992px){.ObPageBanner-plantTitle{font-size:3rem}}.ObPageBanner-bannerImage{align-self:stretch;background-color:#ddd;display:inline-block;height:20vh;object-fit:cover;object-position:center center;width:100%}@media screen and (min-width: 576px){.ObPageBanner-bannerImage{align-self:center;margin:0;margin-right:1rem;border:.4rem solid #fff;border-radius:50%;height:150px;width:150px}}@media screen and (min-width: 992px){.ObPageBanner-bannerImage{height:250px;width:250px}}.ObPageBanner-bannerTitle{margin-bottom:1rem;margin-top:1rem;font-size:2rem}@media screen and (min-width: 768px){.ObPageBanner-bannerTitle{margin-top:0}}@media screen and (min-width: 992px){.ObPageBanner-bannerTitle{font-size:3rem}}.ObPageBanner-tabList.sticky{position:-webkit-sticky;position:sticky;top:0;z-index:1000}.ObPageBanner-tabListInner{overflow-x:auto;scrollbar-width:thin;white-space:nowrap}.ObPageBanner-tab{border-bottom:.25rem solid rgba(0,0,0,0);display:inline-block;margin-top:.5rem;min-width:8rem;padding:.5rem 1rem;text-align:center;text-transform:capitalize}.ObPageBanner-tab.active{border-color:#fff}
|
package/es/PageBanner/index.js
CHANGED
|
@@ -8,7 +8,8 @@ export function PageBanner({ as, className, children, ...other }) {
|
|
|
8
8
|
}
|
|
9
9
|
export const BannerImage = React.forwardRef(function BannerImage(props, ref) {
|
|
10
10
|
const { className, ...other } = props;
|
|
11
|
-
|
|
11
|
+
// biome-ignore lint/a11y/useAltText: should be provided by the user
|
|
12
|
+
return _jsx("img", { ref: ref, className: clsx("ObPageBanner-bannerImage", className), alt: "", ...other });
|
|
12
13
|
});
|
|
13
14
|
export function TabList({ as, className, children, sticky, ...other }) {
|
|
14
15
|
const Component = as ? as : "nav";
|
package/es/Portal/index.js
CHANGED
|
@@ -9,24 +9,22 @@ export function Portal({ children, root, type = "div" }) {
|
|
|
9
9
|
const forceUpdate = useForceUpdate();
|
|
10
10
|
const mountNode = useRef(null);
|
|
11
11
|
const portalNode = useRef(null);
|
|
12
|
+
// biome-ignore lint/correctness/useExhaustiveDependencies: because reasons
|
|
12
13
|
useEffect(() => {
|
|
13
14
|
const ownerDocument = mountNode.current?.ownerDocument;
|
|
14
|
-
|
|
15
|
-
if (ownerDocument && portalElem) {
|
|
15
|
+
if (ownerDocument && !portalNode.current) {
|
|
16
16
|
let parent = root ? ownerDocument.querySelector(root) || ownerDocument.body : ownerDocument.body;
|
|
17
17
|
const node = ownerDocument.createElement(type);
|
|
18
|
-
|
|
18
|
+
portalNode.current = node;
|
|
19
19
|
parent.appendChild(node);
|
|
20
20
|
forceUpdate();
|
|
21
21
|
return () => {
|
|
22
22
|
parent.removeChild(node);
|
|
23
23
|
};
|
|
24
24
|
}
|
|
25
|
-
}, []);
|
|
25
|
+
}, [root, type]);
|
|
26
26
|
if (!portalNode.current) {
|
|
27
27
|
return _jsx("div", { ref: mountNode });
|
|
28
28
|
}
|
|
29
|
-
|
|
30
|
-
return createPortal(children, portalNode.current);
|
|
31
|
-
}
|
|
29
|
+
return createPortal(children, portalNode.current);
|
|
32
30
|
}
|
package/es/Sidebar/index.js
CHANGED
|
@@ -23,6 +23,7 @@ export function Sidebar(props) {
|
|
|
23
23
|
element?.addEventListener("transitionend", toggleHiddenContent);
|
|
24
24
|
return () => element?.removeEventListener("transitionend", toggleHiddenContent);
|
|
25
25
|
}, [open]);
|
|
26
|
+
// biome-ignore lint/correctness/useExhaustiveDependencies: TODO
|
|
26
27
|
useEffect(() => {
|
|
27
28
|
function handleCloseSidebar(evt) {
|
|
28
29
|
if (evt.key === "Escape") {
|
package/es/Spinner/index.d.ts
CHANGED
|
@@ -36,7 +36,7 @@ settingsStore.keys().then((keys) => Promise.allSettled(keys
|
|
|
36
36
|
}
|
|
37
37
|
}))));
|
|
38
38
|
const Divider = forwardRef(function Divider(props, ref) {
|
|
39
|
-
return (_jsx("div", {
|
|
39
|
+
return (_jsx("div", { className: clsx("ObSplitContainer-divider", props.className), ref: ref, children: _jsx("span", { children: "\u2022\u2022\u2022" }) }));
|
|
40
40
|
});
|
|
41
41
|
function SplitRoot({ className, direction, ...props }) {
|
|
42
42
|
return _jsx("div", { className: clsx(className, "ObSplitContainer-root", direction), ...props });
|
|
@@ -79,6 +79,7 @@ export function SplitContainer({ className, children, direction = "vertical", fi
|
|
|
79
79
|
}
|
|
80
80
|
}, [id, layoutVersion]);
|
|
81
81
|
let childrenArray = Children.toArray(children);
|
|
82
|
+
// biome-ignore lint/correctness/useExhaustiveDependencies: <explanation>
|
|
82
83
|
useEffect(() => {
|
|
83
84
|
let divider = dividerRef.current;
|
|
84
85
|
if (divider) {
|
package/es/ValueToggle/index.js
CHANGED
|
@@ -4,7 +4,7 @@ import { forwardRef, useImperativeHandle, useRef, useState } from "react";
|
|
|
4
4
|
let valueToggleId = 0;
|
|
5
5
|
function ValueToggleInner({ className, onChange, defaultValue, options, value, ...other }, ref) {
|
|
6
6
|
const wrapperRef = useRef(null);
|
|
7
|
-
const [toggleName] = useState(
|
|
7
|
+
const [toggleName] = useState(`obet-value-toggle-${String(++valueToggleId)}`);
|
|
8
8
|
const isControlled = value !== undefined;
|
|
9
9
|
useImperativeHandle(ref, () => {
|
|
10
10
|
const e = wrapperRef.current?.querySelector("input");
|
package/es/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ObCheckbox-root{--check-width: 2rem;--bg-color: var(--brand-dark, rgba(42, 65, 50, 0.5));--bg-color-hover: var(--brand-primary, rgba(42, 65, 50, 0.8));--bg-color-selected: var(--brand-light);display:inline-block;height:var(--check-width);margin-bottom:0}.ObCheckbox-root:focus-within .ObCheckbox-box{border:.1rem solid #000}.ObCheckbox-root.Ob-disabled{--bg-color: rgba(150, 150, 150, 0.5);--bg-color-hover: var(--bg-color)}.ObCheckbox-box{position:relative;background:var(--bg-color);transition:background 300ms ease;overflow:hidden;border-radius:calc(var(--check-width)/15);height:var(--check-width);width:var(--check-width)}.ObCheckbox-box:hover{background:var(--bg-color-hover)}.ObCheckbox-label{position:relative;margin-bottom:0;overflow:hidden}.ObCheckbox-label:focus{outline:none}.ObCheckbox-mark{color:#fff;display:inline-block;font-size:calc(var(--check-width)*.4);left:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transition:all 300ms ease-in-out;transition-delay:0ms;transform:translate(-50%, -50%) scale(6)}.ObCheckbox-input{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.ObCheckbox-input:focus{outline:none}.check_Label{margin-bottom:0;flex-grow:1}.ObCheckbox-input:checked:not(:disabled)+.ObCheckbox-label{animation:animOn 800ms 1 forwards}.ObCheckbox-input:checked:not(:disabled)+.ObCheckbox-label .ObCheckbox-box{background:var(--bg-color-selected)}.ObCheckbox-input:checked+.ObCheckbox-label .ObCheckbox-box .ObCheckbox-mark{transform:translate(-50%, -50%) scale(1);transition-delay:200ms;opacity:1}.ObCheckbox-root.Ob-disabled .ObCheckbox-box{cursor:not-allowed}@keyframes animOn{40%{transform:scaleY(0.4) scaleX(2)}50%{transform:scaleY(1.2) scaleX(0.6)}60%{transform:scaleY(0.8) scaleX(1.4)}70%{transform:scaleY(1.1) scaleX(0.9)}100%{transform:scaleY(1) scaleX(1)}}.ObColorCard-root{--bg-color-border: black;--bg-color-main: white;--bg-size: 0.75rem;--card-color: rgb(0, 0, 0);align-items:stretch;background-image:linear-gradient(to right, hsl(186, 72%, 24%), hsl(186, 72%, 24%) 0.75rem, white 0.75rem, white);background-image:linear-gradient(to right, var(--bg-color-border), var(--bg-color-border) var(--bg-size), var(--bg-color-main) var(--bg-size), var(--bg-color-main));border-radius:.25rem;box-shadow:0 1px 12px rgba(0,0,0,.15),0 1px 6px rgba(0,0,0,.25);color:#666;cursor:pointer;display:flex;font-family:"Variable Bahnschrift","Bahnschrift","Open Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;min-height:10rem;overflow:hidden;transition:all ease-in-out 300ms}.ObColorCard-root:nth-of-type(5n + 1){--bg-color-border: rgb(178, 108, 190)}.ObColorCard-root:nth-of-type(5n + 2){--bg-color-border: rgb(79, 164, 61)}.ObColorCard-root:nth-of-type(5n + 3){--bg-color-border: rgb(246, 170, 23)}.ObColorCard-root:nth-of-type(5n + 4){--bg-color-border: rgb(218, 93, 83)}.ObColorCard-root:nth-of-type(5n + 5){--bg-color-border: rgb(23, 162, 184)}.ObColorCard-root:hover,.ObColorCard-root:focus{--bg-color-main: #f5f5f5;box-shadow:0 3px 18px rgba(0,0,0,.15),0 3px 12px rgba(0,0,0,.25);color:#666;text-decoration:none}@media screen and (min-width: 48rem){.ObColorCard-root{font-size:1.2rem}}.ObColorCard-column{display:flex;flex:1 1 100%;flex-direction:column;justify-content:space-between;margin:1rem 0;overflow:hidden;padding:.5rem 1.5rem .5rem 1rem;text-overflow:ellipsis}.ObColorCard-column:first-child{margin-left:.75rem;margin-left:var(--bg-size)}.ObColorCard-column.ObColorCard-minor{border-right:1px solid #e3e3e3;flex:0 0 4rem;transition:margin ease-in-out 300ms}@media screen and (min-width: 48rem){.ObColorCard-column.ObColorCard-minor{flex:0 0 8rem}}.ObColorCard-detailLabel{color:#ccc;font-size:.8rem;text-transform:uppercase}.ObColorCard-detail:not(:last-child){margin-right:1.5rem}.ObColorCard-detail.ObColorCard-primary,.ObColorCard-detail.ObColorCard-primary .ObColorCard-detailValue{font-size:1.25rem;font-weight:300}.ObColorCard-detail.ObColorCard-primary .ObColorCard-detailValue{color:unset}@media screen and (min-width: 48rem){.ObColorCard-detail{font-size:1rem}}.ObColorCard-detailValue{color:#999}.ObColorCard-label{position:relative;padding-left:1.5rem}.ObColorCard-label:not(:last-child){margin-bottom:1rem}.ObColorCard-label:not(:last-child)::after{content:"";position:absolute;width:.2rem;height:calc(100% + 1rem);border-left:.2rem dotted #666;left:.25rem;top:.5rem;z-index:0}.ObColorCard-label::before{background:#fff;border:.2rem solid #116069;border:.2rem solid var(--bg-color-border);border-radius:50%;content:"";display:block;height:.75rem;left:0;position:absolute;top:.3rem;width:.75rem;z-index:1}.ObDateNavigator-icon{display:inline-block}.ObDateNavigator-icon svg{width:.625em;position:relative;top:-1px}.ObDateNavigator-root{background-color:#f3f4f7;background-color:var(--block-header-color-bg);display:flex;font-size:1rem}.ObDateNavigator-arrow{background:none;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;padding:0;-webkit-appearance:button;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;display:flex;align-items:center;flex:0 0 3rem;justify-content:center;height:3rem;cursor:pointer;text-align:center}.ObDateNavigator-arrow::-moz-focus-inner{border:0;padding:0}.ObDateNavigator-arrow:hover{background-color:#e3e3e3;background-color:var(--block-header-button-hover)}.ObDateNavigator-arrowLeft{border-right:1px solid #ddd;order:1}.ObDateNavigator-arrowRight{border-left:1px solid #ddd;order:3}.ObDateNavigator-date{display:flex;flex:1 1 100%;flex-direction:column;justify-content:center;order:2;height:3rem;text-align:center}.ObLinkedList-root{list-style-type:none;margin-left:0;padding-left:0}.ObLinkedList-item{display:flex;align-items:center;flex-direction:row}.ObLinkedList-leftColumn{flex:1 1 4em;font-size:.75em;padding:0 1em;text-align:center}.ObLinkedList-rightColumn{flex:1 1 100%;padding:1em 1em 1em 1.5em}.ObLinkedList-line{display:flex;align-self:stretch;flex:0 0 .2em;background:#fff;position:relative}.ObLinkedList-bullet{background:#fff;border:1px solid rgba(50,50,50,.25);border-radius:.55em;height:.7em;width:.7em;position:absolute;left:0;top:50%;transform:translate(-0.25em, -50%)}.ObLinkedList-card{background:#fff;border:1px solid;border-color:#e5e6e9 #dfe0e4 #d0d1d5;border-radius:.1875em;color:inherit;cursor:pointer;flex:100% 1 1;position:relative}.ObLinkedList-card::before{border-bottom:.5em solid rgba(0,0,0,0);border-right:1em solid #fff;border-top:.5em solid rgba(0,0,0,0);content:" ";filter:drop-shadow(-1px 0px 1px rgba(50, 50, 50, 0.2));height:1em;left:-1em;margin-top:-0.5em;position:absolute;top:50%;width:1em}.ObLinkedList-card:hover{background-color:#edeff3 !important;color:inherit;text-decoration:inherit}.ObLinkedList-card:hover::before{border-right-color:#edeff3 !important}.ObPageBanner-root{background-color:#116069;background-color:var(--brand-dark);box-shadow:0px 8px 8px rgba(0,0,0,.2);color:#fff}.ObPageBanner-root a{color:#b3d5e6}.ObPageBanner-inner{display:flex;align-items:center;flex-direction:column}@media screen and (min-width: 768px){.ObPageBanner-inner{align-items:flex-start;flex-direction:row}}.ObPageBanner-plantTitle{font-size:2rem}@media screen and (min-width: 992px){.ObPageBanner-plantTitle{font-size:3rem}}.ObPageBanner-bannerImage{align-self:stretch;background-color:#ddd;display:inline-block;height:20vh;object-fit:cover;object-position:center center;width:100%}@media screen and (min-width: 576px){.ObPageBanner-bannerImage{align-self:center;margin:0;margin-right:1rem;border:.4rem solid #fff;border-radius:50%;height:150px;width:150px}}@media screen and (min-width: 992px){.ObPageBanner-bannerImage{height:250px;width:250px}}.ObPageBanner-bannerTitle{margin-bottom:1rem;margin-top:1rem;font-size:2rem}@media screen and (min-width: 768px){.ObPageBanner-bannerTitle{margin-top:0}}@media screen and (min-width: 992px){.ObPageBanner-bannerTitle{font-size:3rem}}.ObPageBanner-tabList.sticky{position:-webkit-sticky;position:sticky;top:0;z-index:1000}.ObPageBanner-tabListInner{overflow-x:auto;scrollbar-width:thin;white-space:nowrap}.ObPageBanner-tab{border-bottom:.25rem solid rgba(0,0,0,0);display:inline-block;margin-top:.5rem;min-width:8rem;padding:.5rem 1rem;text-align:center;text-transform:capitalize}.ObPageBanner-tab.active{border-color:#fff}.ObProgressBar-root{height:1.5em;width:100%;appearance:none;-webkit-appearance:none;background-color:#f5f5f5;border:none;border-radius:3px;box-shadow:0 2px 3px rgba(0,0,0,.2) inset;color:#4169e1;position:relative}.ObProgressBar-root::-webkit-progress-bar{background-color:#f5f5f5;border-radius:3px;box-shadow:0 2px 3px rgba(0,0,0,.2) inset}.ObProgressBar-root::-webkit-progress-value{background-image:linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),linear-gradient(left, var(--brand-primary, hsl(186, 72%, 24%)), var(--brand-light, hsl(186, 72%, 37%)));background-image:-webkit-linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),-webkit-linear-gradient(left, var(--brand-primary), hsl(186, 72%, 24%), var(--brand-light, hsl(186, 72%, 37%)));background-size:35px 20px,100% 100%,100% 100%;border-radius:3px;position:relative;transition:width .5s ease-out}.ObProgressBar-root::-webkit-progress-value:after{background-color:#fff;content:"";border-radius:100%;height:5px;position:absolute;right:7px;top:7px;width:5px}.ObProgressBar-root::-moz-progress-bar{background-image:linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),linear-gradient(left, var(--brand-primary), var(--brand-light));background-image:-moz-linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),-moz-linear-gradient(left, var(--brand-primary), var(--brand-light));background-size:35px 20px,100% 100%,100% 100%;border-radius:3px;transition:width .5s ease-out}.ObSidebar-root{position:fixed;bottom:0;left:0;top:0;z-index:2;background-color:#fff;transform:translateX(-100%);transition:transform .2s ease-out;will-change:transform;overflow-y:auto}.ObSidebar-root.Ob-right{left:unset;right:0;transform:translateX(100%)}.ObSidebar-root.Ob-open{transform:translateX(0)}.ObSidebar-root.ObSidebar-shadow{box-shadow:2px 2px 4px rgba(0,0,0,.15)}.ObSidebar-root.ObSidebar-shadow.Ob-right{box-shadow:-2px 2px 4px rgba(0,0,0,.15)}.ObSidebar-overlay{position:fixed;bottom:0;left:0;right:0;top:0;z-index:1;opacity:0;visibility:hidden;transition:opacity .3s ease-out,visibility .3s ease-out;background-color:rgba(0,0,0,.3)}.ObSidebar-overlay.Ob-open{opacity:1;visibility:visible}.😖{display:initial}.ObSplitContainer-root{display:flex;flex-direction:column;height:100%;width:100%}.ObSplitContainer-root.horizontal{flex-direction:row}.ObSplitContainer-panel{overflow:hidden}.ObSplitContainer-divider{flex:0 0 .5rem;background-color:rgba(0,0,0,0);line-height:.75;cursor:ns-resize;display:flex;align-items:center;justify-content:center}.ObSplitContainer-divider:focus{background-color:rgba(0,0,0,.3)}.ObSplitContainer-root.horizontal>.ObSplitContainer-divider{cursor:ew-resize;writing-mode:vertical-lr}.ObSplitContainer-panel.dragging{pointer-events:none}.ObValueToggle-root{display:flex;align-items:center}.ObValueToggle-option{margin-bottom:0}.ObValueToggle-label{cursor:pointer;font-size:.8em;margin:0 .2em;padding:.3em .5em;text-transform:uppercase}.ObValueToggle-label:hover{background:#ccc}.ObValueToggle-input:checked+.ObValueToggle-label{--color-bg: var(--brand-dark);background-color:#666;background-color:var(--color-bg);cursor:default;color:#fff}.ObValueToggle-input:checked:focus-within+.ObValueToggle-label{--color-bg: var(--brand-light)}.ObValueToggle-input:checked:hover+.ObValueToggle-label{background-color:#666;background-color:var(--color-bg)}.ObValueToggle-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}
|
|
1
|
+
.ObCheckbox-root{--check-width: 2rem;--bg-color: var(--brand-dark, rgba(42, 65, 50, 0.5));--bg-color-hover: var(--brand-primary, rgba(42, 65, 50, 0.8));--bg-color-selected: var(--brand-light);display:inline-block;height:var(--check-width);margin-bottom:0}.ObCheckbox-root:focus-within .ObCheckbox-box{border:.1rem solid #000}.ObCheckbox-root.Ob-disabled{--bg-color: rgba(150, 150, 150, 0.5);--bg-color-hover: var(--bg-color)}.ObCheckbox-box{position:relative;background:var(--bg-color);transition:background 300ms ease;overflow:hidden;border-radius:calc(var(--check-width)/15);height:var(--check-width);width:var(--check-width)}.ObCheckbox-box:hover{background:var(--bg-color-hover)}.ObCheckbox-label{position:relative;margin-bottom:0;overflow:hidden}.ObCheckbox-label:focus{outline:none}.ObCheckbox-mark{color:#fff;display:inline-block;font-size:calc(var(--check-width)*.4);left:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transition:all 300ms ease-in-out;transition-delay:0ms;transform:translate(-50%, -50%) scale(6)}.ObCheckbox-input{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.ObCheckbox-input:focus{outline:none}.check_Label{margin-bottom:0;flex-grow:1}.ObCheckbox-input:checked:not(:disabled)+.ObCheckbox-label{animation:animOn 800ms 1 forwards}.ObCheckbox-input:checked:not(:disabled)+.ObCheckbox-label .ObCheckbox-box{background:var(--bg-color-selected)}.ObCheckbox-input:checked+.ObCheckbox-label .ObCheckbox-box .ObCheckbox-mark{transform:translate(-50%, -50%) scale(1);transition-delay:200ms;opacity:1}.ObCheckbox-root.Ob-disabled .ObCheckbox-box{cursor:not-allowed}@keyframes animOn{40%{transform:scaleY(0.4) scaleX(2)}50%{transform:scaleY(1.2) scaleX(0.6)}60%{transform:scaleY(0.8) scaleX(1.4)}70%{transform:scaleY(1.1) scaleX(0.9)}100%{transform:scaleY(1) scaleX(1)}}.ObColorCard-root{--bg-color-border: black;--bg-color-main: white;--bg-size: 0.75rem;--card-color: rgb(0, 0, 0);align-items:stretch;background-image:linear-gradient(to right, hsl(186, 72%, 24%), hsl(186, 72%, 24%) 0.75rem, white 0.75rem, white);background-image:linear-gradient(to right, var(--bg-color-border), var(--bg-color-border) var(--bg-size), var(--bg-color-main) var(--bg-size), var(--bg-color-main));border-radius:.25rem;box-shadow:0 1px 12px rgba(0,0,0,.15),0 1px 6px rgba(0,0,0,.25);color:#666;cursor:pointer;display:flex;font-family:"Variable Bahnschrift","Bahnschrift","Open Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;min-height:10rem;overflow:hidden;transition:all ease-in-out 300ms}.ObColorCard-root:nth-of-type(5n + 1){--bg-color-border: rgb(178, 108, 190)}.ObColorCard-root:nth-of-type(5n + 2){--bg-color-border: rgb(79, 164, 61)}.ObColorCard-root:nth-of-type(5n + 3){--bg-color-border: rgb(246, 170, 23)}.ObColorCard-root:nth-of-type(5n + 4){--bg-color-border: rgb(218, 93, 83)}.ObColorCard-root:nth-of-type(5n + 5){--bg-color-border: rgb(23, 162, 184)}.ObColorCard-root:hover,.ObColorCard-root:focus{--bg-color-main: #f5f5f5;box-shadow:0 3px 18px rgba(0,0,0,.15),0 3px 12px rgba(0,0,0,.25);color:#666;text-decoration:none}@media screen and (min-width: 48rem){.ObColorCard-root{font-size:1.2rem}}.ObColorCard-column{display:flex;flex:1 1 100%;flex-direction:column;justify-content:space-between;margin:1rem 0;overflow:hidden;padding:.5rem 1.5rem .5rem 1rem;text-overflow:ellipsis}.ObColorCard-column:first-child{margin-left:.75rem;margin-left:var(--bg-size)}.ObColorCard-column.ObColorCard-minor{border-right:1px solid #e3e3e3;flex:0 0 4rem;transition:margin ease-in-out 300ms}@media screen and (min-width: 48rem){.ObColorCard-column.ObColorCard-minor{flex:0 0 8rem}}.ObColorCard-detailLabel{color:#ccc;font-size:.8rem;text-transform:uppercase}.ObColorCard-detail:not(:last-child){margin-right:1.5rem}.ObColorCard-detail.ObColorCard-primary,.ObColorCard-detail.ObColorCard-primary .ObColorCard-detailValue{font-size:1.25rem;font-weight:300}.ObColorCard-detail.ObColorCard-primary .ObColorCard-detailValue{color:unset}@media screen and (min-width: 48rem){.ObColorCard-detail{font-size:1rem}}.ObColorCard-detailValue{color:#999}.ObColorCard-label{position:relative;padding-left:1.5rem}.ObColorCard-label:not(:last-child){margin-bottom:1rem}.ObColorCard-label:not(:last-child)::after{content:"";position:absolute;width:.2rem;height:calc(100% + 1rem);border-left:.2rem dotted #666;left:.25rem;top:.5rem;z-index:0}.ObColorCard-label::before{background:#fff;border:.2rem solid hsl(186,72%,24%);border:.2rem solid var(--bg-color-border);border-radius:50%;content:"";display:block;height:.75rem;left:0;position:absolute;top:.3rem;width:.75rem;z-index:1}.ObDateNavigator-icon{display:inline-block}.ObDateNavigator-icon svg{width:.625em;position:relative;top:-1px}.ObDateNavigator-root{background-color:hsl(220,20%,96%);background-color:var(--block-header-color-bg);display:flex;font-size:1rem}.ObDateNavigator-arrow{background:none;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;padding:0;-webkit-appearance:button;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;display:flex;align-items:center;flex:0 0 3rem;justify-content:center;height:3rem;cursor:pointer;text-align:center}.ObDateNavigator-arrow::-moz-focus-inner{border:0;padding:0}.ObDateNavigator-arrow:hover{background-color:#e3e3e3;background-color:var(--block-header-button-hover)}.ObDateNavigator-arrowLeft{border-right:1px solid #ddd;order:1}.ObDateNavigator-arrowRight{border-left:1px solid #ddd;order:3}.ObDateNavigator-date{display:flex;flex:1 1 100%;flex-direction:column;justify-content:center;order:2;height:3rem;text-align:center}.ObLinkedList-root{list-style-type:none;margin-left:0;padding-left:0}.ObLinkedList-item{display:flex;align-items:center;flex-direction:row}.ObLinkedList-leftColumn{flex:1 1 4em;font-size:.75em;padding:0 1em;text-align:center}.ObLinkedList-rightColumn{flex:1 1 100%;padding:1em 1em 1em 1.5em}.ObLinkedList-line{display:flex;align-self:stretch;flex:0 0 .2em;background:#fff;position:relative}.ObLinkedList-bullet{background:#fff;border:1px solid rgba(50,50,50,.25);border-radius:.55em;height:.7em;width:.7em;position:absolute;left:0;top:50%;transform:translate(-0.25em, -50%)}.ObLinkedList-card{background:#fff;border:1px solid;border-color:#e5e6e9 #dfe0e4 #d0d1d5;border-radius:.1875em;color:inherit;cursor:pointer;flex:100% 1 1;position:relative}.ObLinkedList-card::before{border-bottom:.5em solid rgba(0,0,0,0);border-right:1em solid #fff;border-top:.5em solid rgba(0,0,0,0);content:" ";filter:drop-shadow(-1px 0px 1px rgba(50, 50, 50, 0.2));height:1em;left:-1em;margin-top:-0.5em;position:absolute;top:50%;width:1em}.ObLinkedList-card:hover{background-color:hsl(220,20%,94%) !important;color:inherit;text-decoration:inherit}.ObLinkedList-card:hover::before{border-right-color:hsl(220,20%,94%) !important}.ObPageBanner-root{background-color:hsl(186,72%,24%);background-color:var(--brand-dark);box-shadow:0px 8px 8px rgba(0,0,0,.2);color:#fff}.ObPageBanner-root a{color:hsl(200,50%,80%)}.ObPageBanner-inner{display:flex;align-items:center;flex-direction:column}@media screen and (min-width: 768px){.ObPageBanner-inner{align-items:flex-start;flex-direction:row}}.ObPageBanner-plantTitle{font-size:2rem}@media screen and (min-width: 992px){.ObPageBanner-plantTitle{font-size:3rem}}.ObPageBanner-bannerImage{align-self:stretch;background-color:#ddd;display:inline-block;height:20vh;object-fit:cover;object-position:center center;width:100%}@media screen and (min-width: 576px){.ObPageBanner-bannerImage{align-self:center;margin:0;margin-right:1rem;border:.4rem solid #fff;border-radius:50%;height:150px;width:150px}}@media screen and (min-width: 992px){.ObPageBanner-bannerImage{height:250px;width:250px}}.ObPageBanner-bannerTitle{margin-bottom:1rem;margin-top:1rem;font-size:2rem}@media screen and (min-width: 768px){.ObPageBanner-bannerTitle{margin-top:0}}@media screen and (min-width: 992px){.ObPageBanner-bannerTitle{font-size:3rem}}.ObPageBanner-tabList.sticky{position:-webkit-sticky;position:sticky;top:0;z-index:1000}.ObPageBanner-tabListInner{overflow-x:auto;scrollbar-width:thin;white-space:nowrap}.ObPageBanner-tab{border-bottom:.25rem solid rgba(0,0,0,0);display:inline-block;margin-top:.5rem;min-width:8rem;padding:.5rem 1rem;text-align:center;text-transform:capitalize}.ObPageBanner-tab.active{border-color:#fff}.ObProgressBar-root{height:1.5em;width:100%;appearance:none;-webkit-appearance:none;background-color:#f5f5f5;border:none;border-radius:3px;box-shadow:0 2px 3px rgba(0,0,0,.2) inset;color:#4169e1;position:relative}.ObProgressBar-root::-webkit-progress-bar{background-color:#f5f5f5;border-radius:3px;box-shadow:0 2px 3px rgba(0,0,0,.2) inset}.ObProgressBar-root::-webkit-progress-value{background-image:linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),linear-gradient(left, var(--brand-primary, hsl(186, 72%, 24%)), var(--brand-light, hsl(186, 72%, 37%)));background-image:-webkit-linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),-webkit-linear-gradient(left, var(--brand-primary), hsl(186, 72%, 24%), var(--brand-light, hsl(186, 72%, 37%)));background-size:35px 20px,100% 100%,100% 100%;border-radius:3px;position:relative;transition:width .5s ease-out}.ObProgressBar-root::-webkit-progress-value:after{background-color:#fff;content:"";border-radius:100%;height:5px;position:absolute;right:7px;top:7px;width:5px}.ObProgressBar-root::-moz-progress-bar{background-image:linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),linear-gradient(left, var(--brand-primary), var(--brand-light));background-image:-moz-linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),-moz-linear-gradient(left, var(--brand-primary), var(--brand-light));background-size:35px 20px,100% 100%,100% 100%;border-radius:3px;transition:width .5s ease-out}.ObSidebar-root{position:fixed;bottom:0;left:0;top:0;z-index:2;background-color:#fff;transform:translateX(-100%);transition:transform .2s ease-out;will-change:transform;overflow-y:auto}.ObSidebar-root.Ob-right{left:unset;right:0;transform:translateX(100%)}.ObSidebar-root.Ob-open{transform:translateX(0)}.ObSidebar-root.ObSidebar-shadow{box-shadow:2px 2px 4px rgba(0,0,0,.15)}.ObSidebar-root.ObSidebar-shadow.Ob-right{box-shadow:-2px 2px 4px rgba(0,0,0,.15)}.ObSidebar-overlay{position:fixed;bottom:0;left:0;right:0;top:0;z-index:1;opacity:0;visibility:hidden;transition:opacity .3s ease-out,visibility .3s ease-out;background-color:rgba(0,0,0,.3)}.ObSidebar-overlay.Ob-open{opacity:1;visibility:visible}.😖{display:initial}.ObSplitContainer-root{display:flex;flex-direction:column;height:100%;width:100%}.ObSplitContainer-root.horizontal{flex-direction:row}.ObSplitContainer-panel{overflow:hidden}.ObSplitContainer-divider{flex:0 0 .5rem;background-color:rgba(0,0,0,0);line-height:.75;cursor:ns-resize;display:flex;align-items:center;justify-content:center}.ObSplitContainer-divider:focus{background-color:rgba(0,0,0,.3)}.ObSplitContainer-root.horizontal>.ObSplitContainer-divider{cursor:ew-resize;writing-mode:vertical-lr}.ObSplitContainer-panel.dragging{pointer-events:none}.ObValueToggle-root{display:flex;align-items:center}.ObValueToggle-option{margin-bottom:0}.ObValueToggle-label{cursor:pointer;font-size:.8em;margin:0 .2em;padding:.3em .5em;text-transform:uppercase}.ObValueToggle-label:hover{background:#ccc}.ObValueToggle-input:checked+.ObValueToggle-label{--color-bg: var(--brand-dark);background-color:#666;background-color:var(--color-bg);cursor:default;color:#fff}.ObValueToggle-input:checked:focus-within+.ObValueToggle-label{--color-bg: var(--brand-light)}.ObValueToggle-input:checked:hover+.ObValueToggle-label{background-color:#666;background-color:var(--color-bg)}.ObValueToggle-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}
|
|
@@ -12,7 +12,7 @@ async function translateText(text, target, apiKey) {
|
|
|
12
12
|
let result = await fetch(url, options);
|
|
13
13
|
let json = await result.json();
|
|
14
14
|
let { data } = json;
|
|
15
|
-
if (data
|
|
15
|
+
if (data?.translations) {
|
|
16
16
|
let [translation] = data.translations;
|
|
17
17
|
return {
|
|
18
18
|
from: translation.detectedSourceLanguage,
|
|
@@ -27,6 +27,7 @@ export function useTranslation(text, targetLanguage, apiKey) {
|
|
|
27
27
|
let [from, setSourceLang] = useState(null);
|
|
28
28
|
let [isTranslating, setIsTranslating] = useState(false);
|
|
29
29
|
let textRef = useRef(text);
|
|
30
|
+
// biome-ignore lint/correctness/useExhaustiveDependencies: this is a way of resetting the state so we don't show outdated translations when the text changes
|
|
30
31
|
useEffect(() => {
|
|
31
32
|
textRef.current = text;
|
|
32
33
|
return () => {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@olenbetong/synergi-react",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.6",
|
|
4
4
|
"description": "Standalone React component for SynergiWeb and Partner Portal",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"types": "./es/index.d.ts",
|
|
@@ -63,12 +63,12 @@
|
|
|
63
63
|
"author": "Bjørnar Vister Hansen <bvh@olenbetong.no>",
|
|
64
64
|
"license": "MIT",
|
|
65
65
|
"peerDependencies": {
|
|
66
|
-
"react": "
|
|
67
|
-
"react-dom": "
|
|
66
|
+
"react": ">=18.2.0",
|
|
67
|
+
"react-dom": ">=18.2.0"
|
|
68
68
|
},
|
|
69
69
|
"sideEffects": false,
|
|
70
70
|
"dependencies": {
|
|
71
|
-
"@olenbetong/appframe-core": "2.11.
|
|
71
|
+
"@olenbetong/appframe-core": "2.11.7",
|
|
72
72
|
"clsx": "^2.1.1",
|
|
73
73
|
"localforage": "^1.10.0",
|
|
74
74
|
"mitt": "^3.0.0"
|
|
@@ -87,5 +87,5 @@
|
|
|
87
87
|
"devDependencies": {
|
|
88
88
|
"replace-in-files": "^3.0.0"
|
|
89
89
|
},
|
|
90
|
-
"gitHead": "
|
|
90
|
+
"gitHead": "bc10814d960b65e6959fb8506259e4d369f094ab"
|
|
91
91
|
}
|
package/src/Checkbox/index.tsx
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import "./index.scss";
|
|
2
2
|
|
|
3
3
|
import clsx from "clsx";
|
|
4
|
-
import { HTMLAttributes, forwardRef, useEffect, useId, useRef } from "react";
|
|
4
|
+
import { type HTMLAttributes, forwardRef, useEffect, useId, useRef } from "react";
|
|
5
5
|
|
|
6
6
|
function Mark(props: HTMLAttributes<SVGElement>) {
|
|
7
7
|
return (
|
|
@@ -26,6 +26,7 @@ export const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(function Che
|
|
|
26
26
|
const inputId = useId() + (id ?? "");
|
|
27
27
|
const input = useRef<HTMLInputElement>(null);
|
|
28
28
|
|
|
29
|
+
// biome-ignore lint/correctness/useExhaustiveDependencies: Ref object
|
|
29
30
|
useEffect(() => {
|
|
30
31
|
if (typeof ref === "function") {
|
|
31
32
|
ref(input.current);
|
package/src/ColorCard/index.scss
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@
|
|
1
|
+
@use "../styles/variables";
|
|
2
2
|
|
|
3
3
|
.ObColorCard-root {
|
|
4
4
|
--bg-color-border: black;
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
--card-color: rgb(0, 0, 0);
|
|
8
8
|
|
|
9
9
|
align-items: stretch;
|
|
10
|
-
background-image: linear-gradient(to right,
|
|
10
|
+
background-image: linear-gradient(to right, variables.$brand-primary, variables.$brand-primary 0.75rem, white 0.75rem, white);
|
|
11
11
|
background-image: linear-gradient(
|
|
12
12
|
to right,
|
|
13
13
|
var(--bg-color-border),
|
|
@@ -155,7 +155,7 @@
|
|
|
155
155
|
|
|
156
156
|
&::before {
|
|
157
157
|
background: white;
|
|
158
|
-
border: 0.2rem solid
|
|
158
|
+
border: 0.2rem solid variables.$brand-primary;
|
|
159
159
|
border: 0.2rem solid var(--bg-color-border);
|
|
160
160
|
border-radius: 50%;
|
|
161
161
|
content: "";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@
|
|
1
|
+
@use "../styles/mixins";
|
|
2
2
|
|
|
3
3
|
$date-select-height: 3rem;
|
|
4
4
|
|
|
@@ -20,7 +20,7 @@ $date-select-height: 3rem;
|
|
|
20
20
|
}
|
|
21
21
|
|
|
22
22
|
.ObDateNavigator-arrow {
|
|
23
|
-
@include btn-reset;
|
|
23
|
+
@include mixins.btn-reset;
|
|
24
24
|
display: flex;
|
|
25
25
|
align-items: center;
|
|
26
26
|
flex: 0 0 $date-select-height;
|
|
@@ -60,7 +60,7 @@ export function DateNavigator({ date: dateProp, onChange }: { date?: Date; onCha
|
|
|
60
60
|
let dateValue = new Date(dateUtc);
|
|
61
61
|
|
|
62
62
|
let text = formatter.format(dateValue);
|
|
63
|
-
let altText;
|
|
63
|
+
let altText = "";
|
|
64
64
|
|
|
65
65
|
if (todayUtc === dateUtc) {
|
|
66
66
|
altText = getLocalizedString("Today");
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@
|
|
1
|
+
@use "../styles/variables";
|
|
2
2
|
|
|
3
3
|
$bullet-size: 0.7em;
|
|
4
4
|
$line-width: 0.2em;
|
|
@@ -53,7 +53,7 @@ $line-width: 0.2em;
|
|
|
53
53
|
.ObLinkedList-card {
|
|
54
54
|
background: white;
|
|
55
55
|
border: 1px solid;
|
|
56
|
-
border-color:
|
|
56
|
+
border-color: variables.$color-border-top variables.$color-border-side variables.$color-border-bottom;
|
|
57
57
|
border-radius: 0.1875em;
|
|
58
58
|
color: inherit;
|
|
59
59
|
cursor: pointer;
|
|
@@ -76,11 +76,11 @@ $line-width: 0.2em;
|
|
|
76
76
|
}
|
|
77
77
|
|
|
78
78
|
.ObLinkedList-card:hover {
|
|
79
|
-
background-color:
|
|
79
|
+
background-color: variables.$block-color-bg-hover !important;
|
|
80
80
|
color: inherit;
|
|
81
81
|
text-decoration: inherit;
|
|
82
82
|
}
|
|
83
83
|
|
|
84
84
|
.ObLinkedList-card:hover::before {
|
|
85
|
-
border-right-color:
|
|
85
|
+
border-right-color: variables.$block-color-bg-hover !important;
|
|
86
86
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
@
|
|
1
|
+
@use "../styles/variables";
|
|
2
2
|
|
|
3
3
|
.ObPageBanner-root {
|
|
4
|
-
background-color:
|
|
4
|
+
background-color: variables.$brand-primary;
|
|
5
5
|
background-color: var(--brand-dark);
|
|
6
6
|
box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.2);
|
|
7
7
|
color: white;
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
align-items: center;
|
|
17
17
|
flex-direction: column;
|
|
18
18
|
|
|
19
|
-
@media screen and (min-width:
|
|
19
|
+
@media screen and (min-width: variables.$screen-md) {
|
|
20
20
|
align-items: flex-start;
|
|
21
21
|
flex-direction: row;
|
|
22
22
|
}
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
.ObPageBanner-plantTitle {
|
|
26
26
|
font-size: 2rem;
|
|
27
27
|
|
|
28
|
-
@media screen and (min-width:
|
|
28
|
+
@media screen and (min-width: variables.$screen-lg) {
|
|
29
29
|
font-size: 3rem;
|
|
30
30
|
}
|
|
31
31
|
}
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
object-position: center center;
|
|
40
40
|
width: 100%;
|
|
41
41
|
|
|
42
|
-
@media screen and (min-width:
|
|
42
|
+
@media screen and (min-width: variables.$screen-sm) {
|
|
43
43
|
align-self: center;
|
|
44
44
|
margin: 0;
|
|
45
45
|
margin-right: 1rem;
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
width: 150px;
|
|
50
50
|
}
|
|
51
51
|
|
|
52
|
-
@media screen and (min-width:
|
|
52
|
+
@media screen and (min-width: variables.$screen-lg) {
|
|
53
53
|
height: 250px;
|
|
54
54
|
width: 250px;
|
|
55
55
|
}
|
|
@@ -60,11 +60,11 @@
|
|
|
60
60
|
margin-top: 1rem;
|
|
61
61
|
font-size: 2rem;
|
|
62
62
|
|
|
63
|
-
@media screen and (min-width:
|
|
63
|
+
@media screen and (min-width: variables.$screen-md) {
|
|
64
64
|
margin-top: 0;
|
|
65
65
|
}
|
|
66
66
|
|
|
67
|
-
@media screen and (min-width:
|
|
67
|
+
@media screen and (min-width: variables.$screen-lg) {
|
|
68
68
|
font-size: 3rem;
|
|
69
69
|
}
|
|
70
70
|
}
|
package/src/PageBanner/index.tsx
CHANGED
|
@@ -26,7 +26,8 @@ export const BannerImage = React.forwardRef<HTMLImageElement, BannerImageProps>(
|
|
|
26
26
|
ref,
|
|
27
27
|
) {
|
|
28
28
|
const { className, ...other } = props;
|
|
29
|
-
|
|
29
|
+
// biome-ignore lint/a11y/useAltText: should be provided by the user
|
|
30
|
+
return <img ref={ref} className={clsx("ObPageBanner-bannerImage", className)} alt="" {...other} />;
|
|
30
31
|
});
|
|
31
32
|
|
|
32
33
|
export type TabListProps = Pick<React.HTMLProps<HTMLDivElement>, "id" | "className" | "children"> & {
|
package/src/Portal/index.tsx
CHANGED
|
@@ -10,15 +10,16 @@ function useForceUpdate() {
|
|
|
10
10
|
export function Portal({ children, root, type = "div" }) {
|
|
11
11
|
const forceUpdate = useForceUpdate();
|
|
12
12
|
const mountNode = useRef<HTMLDivElement>(null);
|
|
13
|
-
const portalNode = useRef<HTMLElement>(null);
|
|
13
|
+
const portalNode = useRef<HTMLElement | null>(null);
|
|
14
14
|
|
|
15
|
+
// biome-ignore lint/correctness/useExhaustiveDependencies: because reasons
|
|
15
16
|
useEffect(() => {
|
|
16
17
|
const ownerDocument = mountNode.current?.ownerDocument;
|
|
17
|
-
|
|
18
|
-
if (ownerDocument && portalElem) {
|
|
18
|
+
if (ownerDocument && !portalNode.current) {
|
|
19
19
|
let parent = root ? ownerDocument.querySelector(root) || ownerDocument.body : ownerDocument.body;
|
|
20
|
+
|
|
20
21
|
const node = ownerDocument.createElement(type);
|
|
21
|
-
|
|
22
|
+
portalNode.current = node;
|
|
22
23
|
parent.appendChild(node);
|
|
23
24
|
forceUpdate();
|
|
24
25
|
|
|
@@ -26,11 +27,11 @@ export function Portal({ children, root, type = "div" }) {
|
|
|
26
27
|
parent.removeChild(node);
|
|
27
28
|
};
|
|
28
29
|
}
|
|
29
|
-
}, []);
|
|
30
|
+
}, [root, type]);
|
|
30
31
|
|
|
31
32
|
if (!portalNode.current) {
|
|
32
33
|
return <div ref={mountNode} />;
|
|
33
|
-
} else {
|
|
34
|
-
return createPortal(children, portalNode.current);
|
|
35
34
|
}
|
|
35
|
+
|
|
36
|
+
return createPortal(children, portalNode.current);
|
|
36
37
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@
|
|
1
|
+
@use "../styles/variables";
|
|
2
2
|
|
|
3
3
|
.ObProgressBar-root {
|
|
4
4
|
height: 1.5em;
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
transparent 66%
|
|
29
29
|
),
|
|
30
30
|
linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
|
|
31
|
-
linear-gradient(left, var(--brand-primary,
|
|
31
|
+
linear-gradient(left, var(--brand-primary, variables.$brand-primary), var(--brand-light, variables.$brand-light));
|
|
32
32
|
background-image:
|
|
33
33
|
-webkit-linear-gradient(
|
|
34
34
|
135deg,
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
transparent 66%
|
|
40
40
|
),
|
|
41
41
|
-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
|
|
42
|
-
-webkit-linear-gradient(left, var(--brand-primary),
|
|
42
|
+
-webkit-linear-gradient(left, var(--brand-primary), variables.$brand-primary, var(--brand-light, variables.$brand-light));
|
|
43
43
|
background-size:
|
|
44
44
|
35px 20px,
|
|
45
45
|
100% 100%,
|
package/src/Sidebar/index.tsx
CHANGED
|
@@ -49,6 +49,7 @@ export function Sidebar(props: SidebarProps) {
|
|
|
49
49
|
return () => element?.removeEventListener("transitionend", toggleHiddenContent);
|
|
50
50
|
}, [open]);
|
|
51
51
|
|
|
52
|
+
// biome-ignore lint/correctness/useExhaustiveDependencies: TODO
|
|
52
53
|
useEffect(() => {
|
|
53
54
|
function handleCloseSidebar(evt) {
|
|
54
55
|
if (evt.key === "Escape") {
|