material-inspired-component-library 1.3.0 → 2.0.1
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/CODE_OF_CONDUCT.md +128 -0
- package/README.md +9 -1
- package/components/badge/README.md +65 -0
- package/components/badge/index.scss +61 -0
- package/components/bottomsheet/README.md +29 -17
- package/components/bottomsheet/index.scss +23 -23
- package/components/bottomsheet/index.ts +25 -24
- package/components/button/README.md +1 -1
- package/components/button/index.scss +10 -12
- package/components/button/index.ts +5 -0
- package/components/card/index.scss +2 -2
- package/components/checkbox/index.scss +1 -1
- package/components/dialog/README.md +9 -9
- package/components/iconbutton/index.scss +2 -2
- package/components/iconbutton/index.ts +5 -0
- package/components/list/index.scss +2 -2
- package/components/navigationrail/README.md +110 -59
- package/components/navigationrail/index.scss +399 -88
- package/components/{checkbox → navigationrail}/index.ts +12 -7
- package/components/radio/index.scss +2 -2
- package/components/sidesheet/README.md +32 -17
- package/components/sidesheet/index.scss +43 -47
- package/components/slider/README.md +5 -5
- package/dist/badge.css +1 -0
- package/dist/badge.js +1 -0
- package/dist/bottomsheet.css +1 -1
- package/dist/button.css +1 -1
- package/dist/card.css +1 -1
- package/dist/checkbox.css +1 -1
- package/dist/components/navigationrail/index.d.ts +5 -0
- package/dist/iconbutton.css +1 -1
- package/dist/list.css +1 -1
- package/dist/micl.css +1 -1
- package/dist/micl.js +1 -1
- package/dist/navigationrail.css +1 -1
- package/dist/radio.css +1 -1
- package/dist/sidesheet.css +1 -1
- package/docs/bottomsheet.html +58 -7
- package/docs/button.html +30 -30
- package/docs/docs.css +2 -1
- package/docs/index.html +35 -4
- package/docs/micl.css +1 -1
- package/docs/micl.js +1 -1
- package/docs/navigationrail.html +48 -42
- package/docs/sidesheet.html +22 -7
- package/micl.ts +20 -27
- package/package.json +4 -1
- package/styles.scss +17 -0
- package/dist/components/checkbox/index.d.ts +0 -5
package/dist/micl.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.micl=t():e.micl=t()}(self,()=>(()=>{"use strict";var e={d:(t,n)=>{for(var o in n)e.o(n,o)&&!e.o(t,o)&&Object.defineProperty(t,o,{enumerable:!0,get:n[o]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};return(()=>{e.r(t),e.d(t,{default:()=>v});const n="dialog.micl-bottomsheet",o=(()=>{var e=0;const t=t=>{let n=parseInt(window.getComputedStyle(t).getPropertyValue("max-height")),o=(t.dataset.snapheights||"").split(",").map(Number).filter(e=>!isNaN(e)&&e>0&&e<=n);return e||(e=t.getBoundingClientRect().height),[...new Set(o.concat([e,n]).sort())]},n=(e,n)=>{let o=e.getBoundingClientRect().height,i=t(e);return i.filter(e=>e>o+4)[0]||i[n?i.length-1:0]},o=(e,t)=>{e.style.setProperty("--md-sys-bottomsheet-height",`${t}px`)};return{initialize:e=>{if(!e.matches("dialog.micl-bottomsheet")||e.dataset.miclinitialized)return;e.dataset.miclinitialized="1";const i=e.querySelector(".micl-bottomsheet__headline");if(!i)return;const r=i.querySelector(".micl-bottomsheet__draghandle");r?.addEventListener("click",()=>{const t=n(e,!1);t>4&&o(e,t)});let l,a,s=!1,c=!1;function m(t){const n=t.clientY;s&&Math.abs(l-n)>4&&(s=!1,c=!0,e.classList.add("micl-bottomsheet--resizing")),c&&o(e,a+l-n)}function d(i){s=!1,e.classList.remove("micl-bottomsheet--resizing"),c&&(c=!1,i.clientY<l?o(e,n(e,!0)):e.getBoundingClientRect().height<48?(e.popover&&e.hidePopover(),o(e,a)):o(e,(e=>{let n=e.getBoundingClientRect().height,o=t(e),i=o.filter(e=>e<n-4);return i[i.length-1]||o[0]})(e)),document.removeEventListener("mousemove",m),document.removeEventListener("mouseup",d))}i.addEventListener("mousedown",t=>{t.eventPhase===Event.AT_TARGET&&(s=!0,t.preventDefault(),l=t.clientY,a=e.getBoundingClientRect().height,document.addEventListener("mousemove",m),document.addEventListener("mouseup",d))})},cleanup:e=>{e.matches("dialog.micl-bottomsheet")&&delete e.dataset.miclinitialized}}})(),i="button[popovertarget],button.micl-button--toggle",r=(()=>{const e=e=>{e.target&&e.target instanceof HTMLButtonElement&&(e.target.popoverTargetElement instanceof HTMLDialogElement&&(e.target.popoverTargetElement.open?e.target.popoverTargetElement.close():e.target.popoverTargetElement.showModal()),e.target.classList.contains("micl-button--toggle")&&e.target.classList.toggle("micl-button--selected"))};return{initialize:t=>{t.matches("button[popovertarget],button.micl-button--toggle")&&!t.dataset.miclinitialized&&(t.dataset.miclinitialized="1",(t.popoverTargetElement instanceof HTMLDialogElement&&!t.popoverTargetElement.hasAttribute("popover")||t.classList.contains("micl-button--toggle"))&&t.addEventListener("click",e))},cleanup:t=>{t.matches("button[popovertarget],button.micl-button--toggle")&&(document.removeEventListener("click",e),delete t.dataset.miclinitialized)}}})(),l=".micl-checkbox",a={keydown:e=>{if(e.target.matches(l)&&e instanceof KeyboardEvent&&e.target instanceof HTMLInputElement&&!e.target.disabled)switch(e.key){case"Enter":case" ":e.target.checked=!e.target.checked,e.preventDefault()}}},s=".micl-list-item-one,.micl-list-item-two,.micl-list-item-three",c=(()=>{const e=e=>!!e&&e.classList.contains("micl-list-item--disabled");return{keydown:t=>{if(!(t instanceof KeyboardEvent&&t.target instanceof Element&&t.target.matches(".micl-list-item-one,.micl-list-item-two,.micl-list-item-three")))return;const n=t.target.parentElement;if(!n)return;let o=[];if(n instanceof HTMLDetailsElement?o=Array.from(n.parentElement?.children||[]).map(t=>{let n=t.querySelector(":scope > summary");return e(n)?null:n}).filter(e=>!!e):n instanceof HTMLUListElement&&(o=Array.from(n.children).map(t=>t instanceof HTMLLIElement&&!e(t)?t:null).filter(e=>!!e)),0===o.length)return;let i=o.findIndex(e=>(e=>!!e&&e.matches(":has(input[type=checkbox]:checked)"))(e)),r=o.findIndex(e=>0===e.tabIndex),l=r;switch(t.key){case"ArrowDown":l=(r+1)%o.length,t.preventDefault();break;case"ArrowUp":l=(r-1+o.length)%o.length,t.preventDefault();break;case"Tab":-1===i?0!==r&&(o[r].tabIndex=-1,o[0].tabIndex=0):i!==r&&(o[r].tabIndex=-1,o[i].tabIndex=0);break;case"Enter":case" ":const e=t.target.querySelector("input[type=checkbox]");e instanceof HTMLInputElement&&(e.checked=!e.checked)}if(l!==r){o[r].tabIndex=-1,o[l].tabIndex=0,o[l].focus();const e=o[l].querySelector(":scope > button");e?.dispatchEvent(new MouseEvent("mouseenter",{bubbles:!0,cancelable:!0,view:window}))}}}})(),m=".micl-menu[popover]",d=(()=>{const e=(e,t)=>{const n=e.getBoundingClientRect(),o=t.getBoundingClientRect();return(n.x>o.x?"right ":"left ")+(n.y>o.y?"bottom":"top")};return{initialize:t=>{if(!t.matches(".micl-menu[popover]")||t.dataset.miclinitialized)return;t.dataset.miclinitialized="1";const n=document.querySelector(`[popovertarget="${t.id}"]`);n&&t.addEventListener("beforetoggle",o=>{"open"===o.oldState&&(t.style.transformOrigin=e(n,t))}),n&&t.addEventListener("toggle",o=>{"closed"===o.oldState&&(t.style.transformOrigin=e(n,t))}),t.querySelectorAll(":scope > ul.micl-list > li > button[popovertarget]").forEach(e=>{if(e.popoverTargetElement?.matches(".micl-menu[popover]")){let t,n=`--${e.popoverTargetElement.id}`;e.popoverTargetElement instanceof HTMLElement&&(e.style.setProperty("anchor-name",n),e.popoverTargetElement.style.insetBlockStart=`anchor(${n} start)`,e.popoverTargetElement.style.insetInlineStart=`anchor(${n} end)`),e.addEventListener("mouseenter",()=>{e.popoverTargetElement instanceof HTMLElement&&e.popoverTargetElement.showPopover()}),e.addEventListener("mouseleave",()=>{t=setTimeout(()=>{e.popoverTargetElement instanceof HTMLElement&&!e.popoverTargetElement.matches(":hover")&&e.popoverTargetElement.hidePopover()},100)}),e.popoverTargetElement.addEventListener("mouseenter",()=>{clearTimeout(t)}),e.popoverTargetElement.addEventListener("mouseleave",()=>{e.popoverTargetElement instanceof HTMLElement&&e.popoverTargetElement.hidePopover()})}})}}})(),p="input[type=range].micl-slider-xs,input[type=range].micl-slider-s,input[type=range].micl-slider-m,input[type=range].micl-slider-l,input[type=range].micl-slider-xl",u=(()=>{const e=String.fromCharCode(8226),t=String.fromCharCode(8201),n=e=>e.parentElement?.classList.contains("micl-slider__container")?e.parentElement:null,o=(e,t)=>{e.dataset.miclsliderticks=t},i=e=>{let t=JSON.stringify(e.value+""),o=n(e);o&&(o.style.setProperty("--md-sys-slider-value",e.value),o.style.setProperty("--md-sys-slider-tip",t)),e.style.setProperty("--md-sys-slider-value",e.value),e.style.setProperty("--md-sys-slider-tip",t)};return{initialize:r=>{if(!r.matches(p))return;(e=>{let t=e.max||"100";n(e)?.style.setProperty("--md-sys-slider-max",t),e.style.setProperty("--md-sys-slider-max",t)})(r),(e=>{let t=e.min||"0";n(e)?.style.setProperty("--md-sys-slider-min",t),e.style.setProperty("--md-sys-slider-min",t)})(r),i(r),(e=>{let t=n(e);if(t){const n=window.getComputedStyle(e);["--md-sys-slider-handle-height","--md-sys-slider-track-height"].forEach(e=>{t.style.setProperty(e,n.getPropertyValue(e))})}})(r);const l=parseFloat(r.max),a=parseFloat(r.min),s=r.getBoundingClientRect(),c=((e,t,n)=>{const o=[];return e.list&&t>n&&e.list.querySelectorAll("option[value]").forEach(e=>{let i=parseFloat(e.value);!isNaN(i)&&i>=n&&i<=t&&o.push(i)}),o})(r,l,a).sort((e,t)=>e-t).map(e=>Math.round(100*(e-a)/(l-a)));if(c.length>0){const n=document.createElement("canvas"),i=n.getContext("2d");if(i){i.font=window.getComputedStyle(r).getPropertyValue("font");let n=i.measureText(t).width,l=i.measureText(e).width,a=s.width-10,m=0,d="";c.forEach(o=>{let i=a*o/100,r=Math.round((i-m)/n)-1;for(let e=0;e<r;e++)d+=t,m+=n;d+=e,m+=l}),o(r,d)}n.remove()}else o(r,e)},input:e=>{e.target.matches(p)&&e.target instanceof HTMLInputElement&&!e.target.disabled&&i(e.target)}}})(),g=".micl-textfield-outlined > input,.micl-textfield-filled > input",f=".micl-textfield-outlined > select,.micl-textfield-filled > select",y=".micl-textfield-outlined > textarea,.micl-textfield-filled > textarea",h=(()=>{const e=".micl-textfield__character-counter";return{initialize:t=>{if(t.dataset.miclinitialized)return;if(t.dataset.miclinitialized="1",t.value&&(t.dataset.miclvalue="1"),t instanceof HTMLSelectElement||!t.maxLength)return;const n=t.parentElement?.querySelector(e);n&&(n.textContent=`${t.value.length}/${t.maxLength}`)},input:t=>{if(!t.target.matches(`${g},${f},${y}`)||!(t.target instanceof HTMLInputElement||t.target instanceof HTMLSelectElement||t.target instanceof HTMLTextAreaElement)||!t.target.dataset.miclinitialized||t.target.disabled)return;if(t.target.value?t.target.dataset.miclvalue="1":delete t.target.dataset.miclvalue,t.target instanceof HTMLSelectElement||!t.target.maxLength)return;const n=t.target.parentElement?.querySelector(e);n&&(n.textContent=`${t.target.value.length}/${t.target.maxLength}`)}}})(),v=(()=>{const e={[n]:{component:o,type:HTMLDialogElement},[i]:{component:r,type:HTMLButtonElement},[l]:{component:a,type:HTMLInputElement},[s]:{component:c,type:HTMLElement},[m]:{component:d,type:HTMLElement},[f]:{component:h,type:HTMLSelectElement},[p]:{component:u,type:HTMLInputElement},[y]:{component:h,type:HTMLTextAreaElement},[g]:{component:h,type:HTMLInputElement}},t=Object.keys(e).join(","),v=t=>{for(const[n,{component:o,type:i}]of Object.entries(e))if(t.matches(n)&&t instanceof i&&"function"==typeof o.initialize)return void o.initialize(t)},E=e=>{e.querySelectorAll(t).forEach(v),e.querySelectorAll('[class*="micl-"]').forEach(e=>{e.parentElement&&!window.getComputedStyle(e.parentElement).getPropertyValue("--miclripple")&&window.getComputedStyle(e).getPropertyValue("--miclripple")&&e.addEventListener("pointerdown",t=>{if(t.currentTarget.classList.contains("micl-card--nonactionable"))return;let n=e.getBoundingClientRect(),o=0,i="",r="";for(;(i=e.style.item(o++))&&i;)"--x"!=i&&"--y"!=i&&(r+=`${i}:${e.style.getPropertyValue(i)};`);e.style.cssText=r+`--x:${t.clientX-n.left}px;--y:${t.clientY-n.top}px`})})},b=t=>{for(const[n,{component:o,type:i}]of Object.entries(e))if(t.matches(n)&&t instanceof i&&"function"==typeof o.cleanup)return void o.cleanup(t)},L=e=>{e.querySelectorAll(t).forEach(b)},T=()=>{new MutationObserver(e=>{e.forEach(e=>{"childList"===e.type&&(e.addedNodes.forEach(e=>{e instanceof HTMLElement&&(e.matches(t)&&v(e),e.querySelectorAll(t).forEach(v))}),e.removedNodes.forEach(e=>{e instanceof HTMLElement&&(e.matches(t)&&b(e),L(e))}))})}).observe(document.body,{childList:!0,subtree:!0}),E(document),document.addEventListener("input",t=>{for(const[n,{component:o,type:i}]of Object.entries(e))if(t.target.matches(n)&&t.target instanceof i&&"function"==typeof o.input)return void o.input(t)}),document.addEventListener("keydown",t=>{for(const[n,{component:o,type:i}]of Object.entries(e))if(t.target.matches(n)&&t.target instanceof i&&"function"==typeof o.keydown)return void o.keydown(t)})},x=()=>{document.removeEventListener("DOMContentLoaded",x),T()};return"loading"!==document.readyState?T():document.addEventListener("DOMContentLoaded",x),{initialize:()=>E(document),cleanup:()=>L(document)}})()})(),t})());
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.micl=t():e.micl=t()}(self,()=>(()=>{"use strict";var e={d:(t,n)=>{for(var i in n)e.o(n,i)&&!e.o(t,i)&&Object.defineProperty(t,i,{enumerable:!0,get:n[i]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};return(()=>{e.r(t),e.d(t,{default:()=>v});const n="dialog.micl-bottomsheet",i=(()=>{const e=e=>{let t=parseInt(e.dataset.miclfitheight||"0",10),n=parseInt(window.getComputedStyle(e).getPropertyValue("max-block-size"),10),i=(e.dataset.miclsnapheights||"").split(",").map(Number).filter(e=>!isNaN(e)&&e>=0&&e<=n);return t<1&&(t=Math.min(e.getBoundingClientRect().height,n),e.dataset.miclfitheight=`${t}`),[...new Set(i.concat([t]).sort())]},t=(t,n)=>{let i=t.getBoundingClientRect().height,o=e(t);return o.filter(e=>e>i+4)[0]||o[n?o.length-1:0]},i=(e,t)=>{t<1?(delete e.dataset.miclfitheight,e.style.removeProperty("--md-sys-bottomsheet-height"),e[e.popover?"hidePopover":"close"]()):e.style.setProperty("--md-sys-bottomsheet-height",`${t}px`)};return{initialize:o=>{if(!o.matches(n)||o.dataset.miclinitialized)return;o.dataset.miclinitialized="1";const r=o.querySelector(".micl-bottomsheet__headline");if(!r)return;const l=r.querySelector(".micl-bottomsheet__draghandle");l?.addEventListener("click",()=>{i(o,t(o,!1))});let a,s,c=!1,m=!1;function d(e){const t=e.clientY;c&&Math.abs(a-t)>4&&(c=!1,m=!0,o.classList.add("micl-bottomsheet--resizing")),m&&i(o,s+a-t)}function p(n){c=!1,o.classList.remove("micl-bottomsheet--resizing"),m&&(m=!1,n.clientY<a?i(o,t(o,!0)):o.getBoundingClientRect().height<48?i(o,0):i(o,(t=>{let n=t.getBoundingClientRect().height,i=e(t),o=i.filter(e=>e<n-4);return o[o.length-1]||i[0]})(o)),document.removeEventListener("mousemove",d),document.removeEventListener("mouseup",p))}r.addEventListener("mousedown",e=>{e.eventPhase===Event.AT_TARGET&&(c=!0,e.preventDefault(),a=e.clientY,s=o.getBoundingClientRect().height,document.addEventListener("mousemove",d),document.addEventListener("mouseup",p))})},cleanup:e=>{e.matches(n)&&(e.classList.remove("micl-bottomsheet--resizing"),delete e.dataset.miclinitialized,delete e.dataset.miclfitheight)}}})(),o="button[popovertarget],button.micl-button--toggle",r=(()=>{const e=e=>{e.target&&e.target instanceof HTMLButtonElement&&(e.target.popoverTargetElement instanceof HTMLDialogElement&&(e.target.popoverTargetElement.open?e.target.popoverTargetElement.close():e.target.popoverTargetElement.showModal()),e.target.classList.contains("micl-button--toggle")&&(e.target.classList.add("micl-button--toggled"),e.target.classList.toggle("micl-button--selected"),e.target.dataset.miclalt&&([e.target.textContent,e.target.dataset.miclalt]=[e.target.dataset.miclalt,e.target.textContent])))};return{initialize:t=>{t.matches("button[popovertarget],button.micl-button--toggle")&&!t.dataset.miclinitialized&&(t.dataset.miclinitialized="1",(t.popoverTargetElement instanceof HTMLDialogElement&&!t.popoverTargetElement.hasAttribute("popover")||t.classList.contains("micl-button--toggle"))&&t.addEventListener("click",e))},cleanup:t=>{t.matches("button[popovertarget],button.micl-button--toggle")&&(document.removeEventListener("click",e),delete t.dataset.miclinitialized)}}})(),l=".micl-list-item-one,.micl-list-item-two,.micl-list-item-three",a=(()=>{const e=e=>!!e&&e.classList.contains("micl-list-item--disabled");return{keydown:t=>{if(!(t instanceof KeyboardEvent&&t.target instanceof Element&&t.target.matches(".micl-list-item-one,.micl-list-item-two,.micl-list-item-three")))return;const n=t.target.parentElement;if(!n)return;let i=[];if(n instanceof HTMLDetailsElement?i=Array.from(n.parentElement?.children||[]).map(t=>{let n=t.querySelector(":scope > summary");return e(n)?null:n}).filter(e=>!!e):n instanceof HTMLUListElement&&(i=Array.from(n.children).map(t=>t instanceof HTMLLIElement&&!e(t)?t:null).filter(e=>!!e)),0===i.length)return;let o=i.findIndex(e=>(e=>!!e&&e.matches(":has(input[type=checkbox]:checked)"))(e)),r=i.findIndex(e=>0===e.tabIndex),l=r;switch(t.key){case"ArrowDown":l=(r+1)%i.length,t.preventDefault();break;case"ArrowUp":l=(r-1+i.length)%i.length,t.preventDefault();break;case"Tab":-1===o?0!==r&&(i[r].tabIndex=-1,i[0].tabIndex=0):o!==r&&(i[r].tabIndex=-1,i[o].tabIndex=0);break;case"Enter":case" ":const e=t.target.querySelector("input[type=checkbox]");e instanceof HTMLInputElement&&(e.checked=!e.checked)}if(l!==r){i[r].tabIndex=-1,i[l].tabIndex=0,i[l].focus();const e=i[l].querySelector(":scope > button");e?.dispatchEvent(new MouseEvent("mouseenter",{bubbles:!0,cancelable:!0,view:window}))}}}})(),s=".micl-menu[popover]",c=(()=>{const e=(e,t)=>{const n=e.getBoundingClientRect(),i=t.getBoundingClientRect();return(n.x>i.x?"right ":"left ")+(n.y>i.y?"bottom":"top")};return{initialize:t=>{if(!t.matches(".micl-menu[popover]")||t.dataset.miclinitialized)return;t.dataset.miclinitialized="1";const n=document.querySelector(`[popovertarget="${t.id}"]`);n&&t.addEventListener("beforetoggle",i=>{"open"===i.oldState&&(t.style.transformOrigin=e(n,t))}),n&&t.addEventListener("toggle",i=>{"closed"===i.oldState&&(t.style.transformOrigin=e(n,t))}),t.querySelectorAll(":scope > ul.micl-list > li > button[popovertarget]").forEach(e=>{if(e.popoverTargetElement?.matches(".micl-menu[popover]")){let t,n=`--${e.popoverTargetElement.id}`;e.popoverTargetElement instanceof HTMLElement&&(e.style.setProperty("anchor-name",n),e.popoverTargetElement.style.insetBlockStart=`anchor(${n} start)`,e.popoverTargetElement.style.insetInlineStart=`anchor(${n} end)`),e.addEventListener("mouseenter",()=>{e.popoverTargetElement instanceof HTMLElement&&e.popoverTargetElement.showPopover()}),e.addEventListener("mouseleave",()=>{t=setTimeout(()=>{e.popoverTargetElement instanceof HTMLElement&&!e.popoverTargetElement.matches(":hover")&&e.popoverTargetElement.hidePopover()},100)}),e.popoverTargetElement.addEventListener("mouseenter",()=>{clearTimeout(t)}),e.popoverTargetElement.addEventListener("mouseleave",()=>{e.popoverTargetElement instanceof HTMLElement&&e.popoverTargetElement.hidePopover()})}})}}})(),m=".micl-navigationrail__item[for]:not(.micl-navigationrail__item--disabled)",d={keydown:e=>{if(!(e instanceof KeyboardEvent&&e.target instanceof HTMLLabelElement&&e.target.matches(m)))return;const t=document.getElementById(e.target.htmlFor);if(t)switch(e.key){case"Enter":case" ":e.preventDefault(),t.checked||(t.checked=!t.checked)}}},p="input[type=range].micl-slider-xs,input[type=range].micl-slider-s,input[type=range].micl-slider-m,input[type=range].micl-slider-l,input[type=range].micl-slider-xl",u=(()=>{const e=String.fromCharCode(8226),t=String.fromCharCode(8201),n=e=>e.parentElement?.classList.contains("micl-slider__container")?e.parentElement:null,i=(e,t)=>{e.dataset.miclsliderticks=t},o=e=>{let t=JSON.stringify(e.value+""),i=n(e);i&&(i.style.setProperty("--md-sys-slider-value",e.value),i.style.setProperty("--md-sys-slider-tip",t)),e.style.setProperty("--md-sys-slider-value",e.value),e.style.setProperty("--md-sys-slider-tip",t)};return{initialize:r=>{if(!r.matches(p))return;(e=>{let t=e.max||"100";n(e)?.style.setProperty("--md-sys-slider-max",t),e.style.setProperty("--md-sys-slider-max",t)})(r),(e=>{let t=e.min||"0";n(e)?.style.setProperty("--md-sys-slider-min",t),e.style.setProperty("--md-sys-slider-min",t)})(r),o(r),(e=>{let t=n(e);if(t){const n=window.getComputedStyle(e);["--md-sys-slider-handle-height","--md-sys-slider-track-height"].forEach(e=>{t.style.setProperty(e,n.getPropertyValue(e))})}})(r);const l=parseFloat(r.max),a=parseFloat(r.min),s=r.getBoundingClientRect(),c=((e,t,n)=>{const i=[];return e.list&&t>n&&e.list.querySelectorAll("option[value]").forEach(e=>{let o=parseFloat(e.value);!isNaN(o)&&o>=n&&o<=t&&i.push(o)}),i})(r,l,a).sort((e,t)=>e-t).map(e=>Math.round(100*(e-a)/(l-a)));if(c.length>0){const n=document.createElement("canvas"),o=n.getContext("2d");if(o){o.font=window.getComputedStyle(r).getPropertyValue("font");let n=o.measureText(t).width,l=o.measureText(e).width,a=s.width-10,m=0,d="";c.forEach(i=>{let o=a*i/100,r=Math.round((o-m)/n)-1;for(let e=0;e<r;e++)d+=t,m+=n;d+=e,m+=l}),i(r,d)}n.remove()}else i(r,e)},input:e=>{e.target.matches(p)&&e.target instanceof HTMLInputElement&&!e.target.disabled&&o(e.target)}}})(),g=".micl-textfield-outlined > input,.micl-textfield-filled > input",f=".micl-textfield-outlined > select,.micl-textfield-filled > select",h=".micl-textfield-outlined > textarea,.micl-textfield-filled > textarea",y=(()=>{const e=".micl-textfield__character-counter";return{initialize:t=>{if(t.dataset.miclinitialized)return;if(t.dataset.miclinitialized="1",t.value&&(t.dataset.miclvalue="1"),t instanceof HTMLSelectElement||!t.maxLength)return;const n=t.parentElement?.querySelector(e);n&&(n.textContent=`${t.value.length}/${t.maxLength}`)},input:t=>{if(!t.target.matches(`${g},${f},${h}`)||!(t.target instanceof HTMLInputElement||t.target instanceof HTMLSelectElement||t.target instanceof HTMLTextAreaElement)||!t.target.dataset.miclinitialized||t.target.disabled)return;if(t.target.value?t.target.dataset.miclvalue="1":delete t.target.dataset.miclvalue,t.target instanceof HTMLSelectElement||!t.target.maxLength)return;const n=t.target.parentElement?.querySelector(e);n&&(n.textContent=`${t.target.value.length}/${t.target.maxLength}`)}}})(),v=(()=>{const e={[n]:{component:i,type:HTMLDialogElement},[o]:{component:r,type:HTMLButtonElement},[l]:{component:a,type:HTMLElement},[s]:{component:c,type:HTMLElement},[m]:{component:d,type:HTMLLabelElement},[f]:{component:y,type:HTMLSelectElement},[p]:{component:u,type:HTMLInputElement},[h]:{component:y,type:HTMLTextAreaElement},[g]:{component:y,type:HTMLInputElement}},t=Object.keys(e).join(","),v=t=>{for(const[n,{component:i,type:o}]of Object.entries(e))if(t.matches(n)&&t instanceof o&&"function"==typeof i.initialize)return void i.initialize(t)},E=e=>{e.querySelectorAll(t).forEach(v),e.querySelectorAll('[class*="micl-"]').forEach(e=>{"1"===window.getComputedStyle(e).getPropertyValue("--micl-ripple")&&e.addEventListener("pointerdown",t=>{if(t.currentTarget.classList.contains("micl-card--nonactionable"))return;t.stopPropagation();let n=e.getBoundingClientRect();e.style.setProperty("--micl-x",t.clientX-n.left+"px"),e.style.setProperty("--micl-y",t.clientY-n.top+"px")})})},b=t=>{for(const[n,{component:i,type:o}]of Object.entries(e))if(t.matches(n)&&t instanceof o&&"function"==typeof i.cleanup)return void i.cleanup(t)},L=e=>{e.querySelectorAll(t).forEach(b)},T=()=>{new MutationObserver(e=>{e.forEach(e=>{"childList"===e.type&&(e.addedNodes.forEach(e=>{e instanceof HTMLElement&&(e.matches(t)&&v(e),e.querySelectorAll(t).forEach(v))}),e.removedNodes.forEach(e=>{e instanceof HTMLElement&&(e.matches(t)&&b(e),L(e))}))})}).observe(document.body,{childList:!0,subtree:!0}),E(document),document.addEventListener("input",t=>{for(const[n,{component:i,type:o}]of Object.entries(e))if(t.target.matches(n)&&t.target instanceof o&&"function"==typeof i.input)return void i.input(t)}),document.addEventListener("keydown",t=>{for(const[n,{component:i,type:o}]of Object.entries(e))if(t.target.matches(n)&&t.target instanceof o&&"function"==typeof i.keydown)return void i.keydown(t)})},x=()=>{document.removeEventListener("DOMContentLoaded",x),T()};return"loading"!==document.readyState?T():document.addEventListener("DOMContentLoaded",x),{initialize:()=>E(document),cleanup:()=>L(document)}})()})(),t})());
|
package/dist/navigationrail.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--md-sys-elevation-level0: rgba(0, 0, 0, 0.2) 0px 0px 0px 0px, rgba(0, 0, 0, 0.14) 0px 0px 0px 0px, rgba(0, 0, 0, 0.12) 0px 0px 0px 0px;--md-sys-elevation-level1: rgba(0, 0, 0, 0.2) 0px 2px 1px -1px, rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 1px 3px 0px;--md-sys-elevation-level2: rgba(0, 0, 0, 0.2) 0px 3px 3px -2px, rgba(0, 0, 0, 0.14) 0px 3px 4px 0px, rgba(0, 0, 0, 0.12) 0px 1px 8px 0px;--md-sys-elevation-level3: rgba(0, 0, 0, 0.2) 0px 3px 5px -1px, rgba(0, 0, 0, 0.14) 0px 6px 10px 0px, rgba(0, 0, 0, 0.12) 0px 1px 18px 0px;--md-sys-elevation-level4: rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px;--md-sys-elevation-level5: rgba(0, 0, 0, 0.2) 0px 7px 8px -4px, rgba(0, 0, 0, 0.14) 0px 12px 17px 2px, rgba(0, 0, 0, 0.12) 0px 5px 22px 4px}:root{--md-sys-motion-duration-short1: 50ms;--md-sys-motion-duration-short2: 100ms;--md-sys-motion-duration-short3: 150ms;--md-sys-motion-duration-short4: 200ms;--md-sys-motion-duration-medium1: 250ms;--md-sys-motion-duration-medium2: 300ms;--md-sys-motion-duration-medium3: 350ms;--md-sys-motion-duration-medium4: 400ms;--md-sys-motion-duration-long1: 450ms;--md-sys-motion-duration-long2: 500ms;--md-sys-motion-duration-long3: 550ms;--md-sys-motion-duration-long4: 600ms;--md-sys-motion-duration-extra-long1: 700ms;--md-sys-motion-duration-extra-long2: 800ms;--md-sys-motion-duration-extra-long3: 900ms;--md-sys-motion-duration-extra-long4: 1000ms}:root{--md-sys-target-size: 48px;--md-sys-shape-corner-none: 0px;--md-sys-shape-corner-extra-small: 4px;--md-sys-shape-corner-small: 8px;--md-sys-shape-corner-medium: 12px;--md-sys-shape-corner-large: 16px;--md-sys-shape-corner-large-increased: 20px;--md-sys-shape-corner-extra-large: 28px;--md-sys-shape-corner-extra-large-increased: 32px;--md-sys-shape-corner-extra-extra-large: 48px;--md-sys-shape-corner-full: 50%}:root{--md-ref-typeface-plain: Roboto, system-ui, sans-serif;--md-ref-typeface-brand: Roboto, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700;--md-sys-typescale-display-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-large-size: 3.5625rem;--md-sys-typescale-display-large-line-height: 4rem;--md-sys-typescale-display-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-large-tracking: -0.015625rem;--md-sys-typescale-display-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-medium-size: 2.8125rem;--md-sys-typescale-display-medium-line-height: 3.25rem;--md-sys-typescale-display-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-medium-tracking: 0;--md-sys-typescale-display-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-small-size: 2.25rem;--md-sys-typescale-display-small-line-height: 2.75rem;--md-sys-typescale-display-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-small-tracking: 0;--md-sys-typescale-headline-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-large-size: 2rem;--md-sys-typescale-headline-large-line-height: 2.5rem;--md-sys-typescale-headline-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-large-tracking: 0;--md-sys-typescale-headline-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-medium-size: 1.75rem;--md-sys-typescale-headline-medium-line-height: 2.25rem;--md-sys-typescale-headline-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-medium-tracking: 0;--md-sys-typescale-headline-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-small-size: 1.5rem;--md-sys-typescale-headline-small-line-height: 2rem;--md-sys-typescale-headline-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-small-tracking: 0;--md-sys-typescale-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-title-large-size: 1.375rem;--md-sys-typescale-title-large-line-height: 1.75rem;--md-sys-typescale-title-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-title-large-tracking: 0;--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0,009375rem;--md-sys-typescale-title-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-small-size: 0.875rem;--md-sys-typescale-title-small-line-height: 1.25rem;--md-sys-typescale-title-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-small-tracking: 0.00625rem;--md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-large-size: 1rem;--md-sys-typescale-body-large-line-height: 1.5rem;--md-sys-typescale-body-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-large-tracking: 0.03125rem;--md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-medium-size: 0.875rem;--md-sys-typescale-body-medium-line-height: 1.25rem;--md-sys-typescale-body-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-medium-tracking: 0.015625rem;--md-sys-typescale-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-small-size: 0.75rem;--md-sys-typescale-body-small-line-height: 1rem;--md-sys-typescale-body-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-small-tracking: 0.025rem;--md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-large-size: 0.875rem;--md-sys-typescale-label-large-line-height: 1.25rem;--md-sys-typescale-label-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-large-tracking: 0.00625rem;--md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-medium-size: 0.75rem;--md-sys-typescale-label-medium-line-height: 1rem;--md-sys-typescale-label-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-medium-tracking: 0.03125rem;--md-sys-typescale-label-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-small-size: 0.6875rem;--md-sys-typescale-label-small-line-height: 1rem;--md-sys-typescale-label-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-small-tracking: 0.03125rem;--md-sys-typescale-emphasized-display-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-display-large-size: 3.5625rem;--md-sys-typescale-emphasized-display-large-line-height: 4rem;--md-sys-typescale-emphasized-display-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-display-large-tracking: -0.015625rem;--md-sys-typescale-emphasized-display-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-display-medium-size: 2.8125rem;--md-sys-typescale-emphasized-display-medium-line-height: 3.25rem;--md-sys-typescale-emphasized-display-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-display-medium-tracking: 0;--md-sys-typescale-emphasized-display-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-display-small-size: 2.25rem;--md-sys-typescale-emphasized-display-small-line-height: 2.75rem;--md-sys-typescale-emphasized-display-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-display-small-tracking: 0;--md-sys-typescale-emphasized-headline-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-headline-large-size: 2rem;--md-sys-typescale-emphasized-headline-large-line-height: 2.5rem;--md-sys-typescale-emphasized-headline-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-headline-large-tracking: 0;--md-sys-typescale-emphasized-headline-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-headline-medium-size: 1.75rem;--md-sys-typescale-emphasized-headline-medium-line-height: 2.25rem;--md-sys-typescale-emphasized-headline-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-headline-medium-tracking: 0;--md-sys-typescale-emphasized-headline-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-headline-small-size: 1.5rem;--md-sys-typescale-emphasized-headline-small-line-height: 2rem;--md-sys-typescale-emphasized-headline-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-headline-small-tracking: 0;--md-sys-typescale-emphasized-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-title-large-size: 1.375rem;--md-sys-typescale-emphasized-title-large-line-height: 1.75rem;--md-sys-typescale-emphasized-title-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-title-large-tracking: 0;--md-sys-typescale-emphasized-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-title-medium-size: 1rem;--md-sys-typescale-emphasized-title-medium-line-height: 1.5rem;--md-sys-typescale-emphasized-title-medium-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-title-medium-tracking: 0,009375rem;--md-sys-typescale-emphasized-title-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-title-small-size: 0.875rem;--md-sys-typescale-emphasized-title-small-line-height: 1.25rem;--md-sys-typescale-emphasized-title-small-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-title-small-tracking: 0.00625rem;--md-sys-typescale-emphasized-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-body-large-size: 1rem;--md-sys-typescale-emphasized-body-large-line-height: 1.5rem;--md-sys-typescale-emphasized-body-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-body-large-tracking: 0.03125rem;--md-sys-typescale-emphasized-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-body-medium-size: 0.875rem;--md-sys-typescale-emphasized-body-medium-line-height: 1.25rem;--md-sys-typescale-emphasized-body-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-body-medium-tracking: 0.015625rem;--md-sys-typescale-emphasized-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-body-small-size: 0.75rem;--md-sys-typescale-emphasized-body-small-line-height: 1rem;--md-sys-typescale-emphasized-body-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-body-small-tracking: 0.025rem;--md-sys-typescale-emphasized-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-label-large-size: 0.875rem;--md-sys-typescale-emphasized-label-large-line-height: 1.25rem;--md-sys-typescale-emphasized-label-large-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-label-large-tracking: 0.00625rem;--md-sys-typescale-emphasized-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-label-medium-size: 0.75rem;--md-sys-typescale-emphasized-label-medium-line-height: 1rem;--md-sys-typescale-emphasized-label-medium-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-label-medium-tracking: 0.03125rem;--md-sys-typescale-emphasized-label-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-label-small-size: 0.6875rem;--md-sys-typescale-emphasized-label-small-line-height: 1rem;--md-sys-typescale-emphasized-label-small-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-label-small-tracking: 0.03125rem}.md-sys-typescale-display-large{font-family:var(--md-sys-typescale-display-large-font);font-size:var(--md-sys-typescale-display-large-size);line-height:var(--md-sys-typescale-display-large-line-height);font-weight:var(--md-sys-typescale-display-large-weight);letter-spacing:var(--md-sys-typescale-display-large-tracking)}.md-sys-typescale-display-medium{font-family:var(--md-sys-typescale-display-medium-font);font-size:var(--md-sys-typescale-display-medium-size);line-height:var(--md-sys-typescale-display-medium-line-height);font-weight:var(--md-sys-typescale-display-medium-weight);letter-spacing:var(--md-sys-typescale-display-medium-tracking)}.md-sys-typescale-display-small{font-family:var(--md-sys-typescale-display-small-font);font-size:var(--md-sys-typescale-display-small-size);line-height:var(--md-sys-typescale-display-small-line-height);font-weight:var(--md-sys-typescale-display-small-weight);letter-spacing:var(--md-sys-typescale-display-small-tracking)}.md-sys-typescale-headline-large{font-family:var(--md-sys-typescale-headline-large-font);font-size:var(--md-sys-typescale-headline-large-size);line-height:var(--md-sys-typescale-headline-large-line-height);font-weight:var(--md-sys-typescale-headline-large-weight);letter-spacing:var(--md-sys-typescale-headline-large-tracking)}.md-sys-typescale-headline-medium{font-family:var(--md-sys-typescale-headline-medium-font);font-size:var(--md-sys-typescale-headline-medium-size);line-height:var(--md-sys-typescale-headline-medium-line-height);font-weight:var(--md-sys-typescale-headline-medium-weight);letter-spacing:var(--md-sys-typescale-headline-medium-tracking)}.md-sys-typescale-headline-small{font-family:var(--md-sys-typescale-headline-small-font);font-size:var(--md-sys-typescale-headline-small-size);line-height:var(--md-sys-typescale-headline-small-line-height);font-weight:var(--md-sys-typescale-headline-small-weight);letter-spacing:var(--md-sys-typescale-headline-small-tracking)}.md-sys-typescale-title-large{font-family:var(--md-sys-typescale-title-large-font);font-size:var(--md-sys-typescale-title-large-size);line-height:var(--md-sys-typescale-title-large-line-height);font-weight:var(--md-sys-typescale-title-large-weight);letter-spacing:var(--md-sys-typescale-title-large-tracking)}.md-sys-typescale-title-medium{font-family:var(--md-sys-typescale-title-medium-font);font-size:var(--md-sys-typescale-title-medium-size);line-height:var(--md-sys-typescale-title-medium-line-height);font-weight:var(--md-sys-typescale-title-medium-weight);letter-spacing:var(--md-sys-typescale-title-medium-tracking)}.md-sys-typescale-title-small{font-family:var(--md-sys-typescale-title-small-font);font-size:var(--md-sys-typescale-title-small-size);line-height:var(--md-sys-typescale-title-small-line-height);font-weight:var(--md-sys-typescale-title-small-weight);letter-spacing:var(--md-sys-typescale-title-small-tracking)}.md-sys-typescale-body-large{font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking)}.md-sys-typescale-body-medium{font-family:var(--md-sys-typescale-body-medium-font);font-size:var(--md-sys-typescale-body-medium-size);line-height:var(--md-sys-typescale-body-medium-line-height);font-weight:var(--md-sys-typescale-body-medium-weight);letter-spacing:var(--md-sys-typescale-body-medium-tracking)}.md-sys-typescale-body-small{font-family:var(--md-sys-typescale-body-small-font);font-size:var(--md-sys-typescale-body-small-size);line-height:var(--md-sys-typescale-body-small-line-height);font-weight:var(--md-sys-typescale-body-small-weight);letter-spacing:var(--md-sys-typescale-body-small-tracking)}.md-sys-typescale-label-large{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking)}.md-sys-typescale-label-medium{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking)}.md-sys-typescale-label-small{font-family:var(--md-sys-typescale-label-small-font);font-size:var(--md-sys-typescale-label-small-size);line-height:var(--md-sys-typescale-label-small-line-height);font-weight:var(--md-sys-typescale-label-small-weight);letter-spacing:var(--md-sys-typescale-label-small-tracking)}.md-sys-typescale-emphasized-display-large{font-family:var(--md-sys-typescale-emphasized-display-large-font);font-size:var(--md-sys-typescale-emphasized-display-large-size);line-height:var(--md-sys-typescale-emphasized-display-large-line-height);font-weight:var(--md-sys-typescale-emphasized-display-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-display-large-tracking)}.md-sys-typescale-emphasized-display-medium{font-family:var(--md-sys-typescale-emphasized-display-medium-font);font-size:var(--md-sys-typescale-emphasized-display-medium-size);line-height:var(--md-sys-typescale-emphasized-display-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-display-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-display-medium-tracking)}.md-sys-typescale-emphasized-display-small{font-family:var(--md-sys-typescale-emphasized-display-small-font);font-size:var(--md-sys-typescale-emphasized-display-small-size);line-height:var(--md-sys-typescale-emphasized-display-small-line-height);font-weight:var(--md-sys-typescale-emphasized-display-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-display-small-tracking)}.md-sys-typescale-emphasized-headline-large{font-family:var(--md-sys-typescale-emphasized-headline-large-font);font-size:var(--md-sys-typescale-emphasized-headline-large-size);line-height:var(--md-sys-typescale-emphasized-headline-large-line-height);font-weight:var(--md-sys-typescale-emphasized-headline-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-headline-large-tracking)}.md-sys-typescale-emphasized-headline-medium{font-family:var(--md-sys-typescale-emphasized-headline-medium-font);font-size:var(--md-sys-typescale-emphasized-headline-medium-size);line-height:var(--md-sys-typescale-emphasized-headline-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-headline-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-headline-medium-tracking)}.md-sys-typescale-emphasized-headline-small{font-family:var(--md-sys-typescale-emphasized-headline-small-font);font-size:var(--md-sys-typescale-emphasized-headline-small-size);line-height:var(--md-sys-typescale-emphasized-headline-small-line-height);font-weight:var(--md-sys-typescale-emphasized-headline-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-headline-small-tracking)}.md-sys-typescale-emphasized-title-large{font-family:var(--md-sys-typescale-emphasized-title-large-font);font-size:var(--md-sys-typescale-emphasized-title-large-size);line-height:var(--md-sys-typescale-emphasized-title-large-line-height);font-weight:var(--md-sys-typescale-emphasized-title-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-title-large-tracking)}.md-sys-typescale-emphasized-title-medium{font-family:var(--md-sys-typescale-emphasized-title-medium-font);font-size:var(--md-sys-typescale-emphasized-title-medium-size);line-height:var(--md-sys-typescale-emphasized-title-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-title-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-title-medium-tracking)}.md-sys-typescale-emphasized-title-small{font-family:var(--md-sys-typescale-emphasized-title-small-font);font-size:var(--md-sys-typescale-emphasized-title-small-size);line-height:var(--md-sys-typescale-emphasized-title-small-line-height);font-weight:var(--md-sys-typescale-emphasized-title-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-title-small-tracking)}.md-sys-typescale-emphasized-body-large{font-family:var(--md-sys-typescale-emphasized-body-large-font);font-size:var(--md-sys-typescale-emphasized-body-large-size);line-height:var(--md-sys-typescale-emphasized-body-large-line-height);font-weight:var(--md-sys-typescale-emphasized-body-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-body-large-tracking)}.md-sys-typescale-emphasized-body-medium{font-family:var(--md-sys-typescale-emphasized-body-medium-font);font-size:var(--md-sys-typescale-emphasized-body-medium-size);line-height:var(--md-sys-typescale-emphasized-body-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-body-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-body-medium-tracking)}.md-sys-typescale-emphasized-body-small{font-family:var(--md-sys-typescale-emphasized-body-small-font);font-size:var(--md-sys-typescale-emphasized-body-small-size);line-height:var(--md-sys-typescale-emphasized-body-small-line-height);font-weight:var(--md-sys-typescale-emphasized-body-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-body-small-tracking)}.md-sys-typescale-emphasized-label-large{font-family:var(--md-sys-typescale-emphasized-label-large-font);font-size:var(--md-sys-typescale-emphasized-label-large-size);line-height:var(--md-sys-typescale-emphasized-label-large-line-height);font-weight:var(--md-sys-typescale-emphasized-label-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-label-large-tracking)}.md-sys-typescale-emphasized-label-medium{font-family:var(--md-sys-typescale-emphasized-label-medium-font);font-size:var(--md-sys-typescale-emphasized-label-medium-size);line-height:var(--md-sys-typescale-emphasized-label-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-label-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-label-medium-tracking)}.md-sys-typescale-emphasized-label-small{font-family:var(--md-sys-typescale-emphasized-label-small-font);font-size:var(--md-sys-typescale-emphasized-label-small-size);line-height:var(--md-sys-typescale-emphasized-label-small-line-height);font-weight:var(--md-sys-typescale-emphasized-label-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-label-small-tracking)}dialog.micl-navigationrail{--md-sys-navigationrail-width: 256px;--md-sys-navigationrail-maxwidth: 400px;--md-sys-navigationrail-spring-buffer: 200px;--md-sys-navigationrail-padding-standard: 24px;--md-sys-navigationrail-padding-modal: 16px;--md-sys-navigationrail-motion-spatial: cubic-bezier(0.39, 1.29, 0.35, 0.98);--md-sys-navigationrail-motion-duration: 650ms;--md-sys-navigationrail-motion-duration-reverse: 500ms;box-sizing:border-box;display:none;flex-direction:column;justify-content:space-between;min-width:calc(var(--md-sys-navigationrail-width) + var(--md-sys-navigationrail-spring-buffer));max-width:calc(var(--md-sys-navigationrail-maxwidth) + var(--md-sys-navigationrail-spring-buffer));height:100%;min-height:100%;margin-block:0;margin-inline-start:calc(-1*(var(--md-sys-navigationrail-maxwidth) + var(--md-sys-navigationrail-spring-buffer)));margin-inline-end:auto;padding-block-start:10px;padding-block-end:var(--md-sys-navigationrail-padding-standard);padding-inline-start:var(--md-sys-navigationrail-spring-buffer);padding-inline-end:0;background-color:var(--md-sys-color-surface);border:none;box-shadow:var(--md-sys-elevation-level0);opacity:0;overflow:hidden;transition:opacity var(--md-sys-navigationrail-motion-duration-reverse) linear,margin-inline-start var(--md-sys-navigationrail-motion-duration-reverse) var(--md-sys-navigationrail-motion-spatial),overlay var(--md-sys-navigationrail-motion-duration-reverse) linear allow-discrete,display var(--md-sys-navigationrail-motion-duration-reverse) linear allow-discrete}dialog.micl-navigationrail .micl-navigationrail__headline{display:flex;align-items:center;padding-inline-start:12px;padding-inline-end:24px;column-gap:8px;color:var(--md-sys-color-on-surface-variant)}dialog.micl-navigationrail .micl-navigationrail__headline h1,dialog.micl-navigationrail .micl-navigationrail__headline h2,dialog.micl-navigationrail .micl-navigationrail__headline h3,dialog.micl-navigationrail .micl-navigationrail__headline h4,dialog.micl-navigationrail .micl-navigationrail__headline h5,dialog.micl-navigationrail .micl-navigationrail__headline h6,dialog.micl-navigationrail .micl-navigationrail__headline .micl-heading{font-family:var(--md-sys-typescale-title-large-font);font-size:var(--md-sys-typescale-title-large-size);line-height:var(--md-sys-typescale-title-large-line-height);font-weight:var(--md-sys-typescale-title-large-weight);letter-spacing:var(--md-sys-typescale-title-large-tracking);flex:1 2 fit-content;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:none}dialog.micl-navigationrail .micl-navigationrail__content{box-sizing:border-box;display:flex;flex-direction:column;flex:1 1 auto;align-items:flex-start;row-gap:8px;width:100%;max-width:100%;padding-inline:var(--md-sys-navigationrail-padding-standard);overflow:hidden auto}dialog.micl-navigationrail .micl-navigationrail__actions{box-sizing:border-box;display:flex;align-items:center;justify-content:start;width:100%;max-width:100%;height:calc(72px - var(--md-sys-navigationrail-padding-standard));margin:auto 0 0 0;padding-block-start:16px;overflow:hidden;border-block-start:var(--md-sys-divider-thickness) solid var(--md-sys-divider-color)}dialog.micl-navigationrail .micl-navigationrail__actions button:active,dialog.micl-navigationrail .micl-navigationrail__actions button:focus-visible,dialog.micl-navigationrail .micl-navigationrail__actions button:hover{color:var(--md-sys-color-primary)}dialog.micl-navigationrail::backdrop{background-color:rgba(0,0,0,0);transition:background-color var(--md-sys-navigationrail-motion-duration) linear,overlay var(--md-sys-navigationrail-motion-duration) linear allow-discrete,display var(--md-sys-navigationrail-motion-duration) linear allow-discrete}dialog.micl-navigationrail[open]{background-color:var(--md-sys-color-surface-container-low);border-start-end-radius:var(--md-sys-shape-corner-large);border-end-end-radius:var(--md-sys-shape-corner-large);box-shadow:var(--md-sys-elevation-level1)}dialog.micl-navigationrail[open] .micl-navigationrail__headline{padding-inline-end:4px}dialog.micl-navigationrail:popover-open{border-inline-end:var(--md-sys-divider-thickness) solid var(--md-sys-divider-color)}dialog.micl-navigationrail:popover-open,dialog.micl-navigationrail[open]{display:flex;margin-inline-start:calc(-1*var(--md-sys-navigationrail-spring-buffer));opacity:1;transition:opacity var(--md-sys-navigationrail-motion-duration) linear,margin-inline-start var(--md-sys-navigationrail-motion-duration) var(--md-sys-navigationrail-motion-spatial),overlay var(--md-sys-navigationrail-motion-duration) linear allow-discrete,display var(--md-sys-navigationrail-motion-duration) linear allow-discrete}@starting-style{dialog.micl-navigationrail:popover-open,dialog.micl-navigationrail[open]{margin-inline-start:calc(-1*(var(--md-sys-navigationrail-maxwidth) + var(--md-sys-navigationrail-spring-buffer)));opacity:0}}dialog.micl-navigationrail[open]::backdrop{background-color:rgba(0,0,0,.2)}@starting-style{dialog.micl-navigationrail[open]::backdrop{background-color:rgba(0,0,0,0)}}
|
|
1
|
+
:root{--md-sys-elevation-level0: rgba(0, 0, 0, 0.2) 0px 0px 0px 0px, rgba(0, 0, 0, 0.14) 0px 0px 0px 0px, rgba(0, 0, 0, 0.12) 0px 0px 0px 0px;--md-sys-elevation-level1: rgba(0, 0, 0, 0.2) 0px 2px 1px -1px, rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 1px 3px 0px;--md-sys-elevation-level2: rgba(0, 0, 0, 0.2) 0px 3px 3px -2px, rgba(0, 0, 0, 0.14) 0px 3px 4px 0px, rgba(0, 0, 0, 0.12) 0px 1px 8px 0px;--md-sys-elevation-level3: rgba(0, 0, 0, 0.2) 0px 3px 5px -1px, rgba(0, 0, 0, 0.14) 0px 6px 10px 0px, rgba(0, 0, 0, 0.12) 0px 1px 18px 0px;--md-sys-elevation-level4: rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px;--md-sys-elevation-level5: rgba(0, 0, 0, 0.2) 0px 7px 8px -4px, rgba(0, 0, 0, 0.14) 0px 12px 17px 2px, rgba(0, 0, 0, 0.12) 0px 5px 22px 4px}:root{--md-sys-motion-duration-short1: 50ms;--md-sys-motion-duration-short2: 100ms;--md-sys-motion-duration-short3: 150ms;--md-sys-motion-duration-short4: 200ms;--md-sys-motion-duration-medium1: 250ms;--md-sys-motion-duration-medium2: 300ms;--md-sys-motion-duration-medium3: 350ms;--md-sys-motion-duration-medium4: 400ms;--md-sys-motion-duration-long1: 450ms;--md-sys-motion-duration-long2: 500ms;--md-sys-motion-duration-long3: 550ms;--md-sys-motion-duration-long4: 600ms;--md-sys-motion-duration-extra-long1: 700ms;--md-sys-motion-duration-extra-long2: 800ms;--md-sys-motion-duration-extra-long3: 900ms;--md-sys-motion-duration-extra-long4: 1000ms}:root{--md-sys-target-size: 48px;--md-sys-shape-corner-none: 0px;--md-sys-shape-corner-extra-small: 4px;--md-sys-shape-corner-small: 8px;--md-sys-shape-corner-medium: 12px;--md-sys-shape-corner-large: 16px;--md-sys-shape-corner-large-increased: 20px;--md-sys-shape-corner-extra-large: 28px;--md-sys-shape-corner-extra-large-increased: 32px;--md-sys-shape-corner-extra-extra-large: 48px;--md-sys-shape-corner-full: 50%}:root{--md-sys-state-layer-size: 40px;--md-sys-state-hover-state-layer-opacity: 8%;--md-sys-state-focus-state-layer-opacity: 10%;--md-sys-state-pressed-state-layer-opacity: 10%;--md-sys-state-dragged-state-layer-opacity: 16%;--md-sys-state-focus-indicator-inner-offset: -3px;--md-sys-state-focus-indicator-outer-offset: 2px;--md-sys-state-focus-indicator-thickness: 3px}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-ref-typeface-plain: Roboto, system-ui, sans-serif;--md-ref-typeface-brand: Roboto, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700;--md-sys-typescale-display-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-large-size: 3.5625rem;--md-sys-typescale-display-large-line-height: 4rem;--md-sys-typescale-display-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-large-tracking: -0.015625rem;--md-sys-typescale-display-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-medium-size: 2.8125rem;--md-sys-typescale-display-medium-line-height: 3.25rem;--md-sys-typescale-display-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-medium-tracking: 0;--md-sys-typescale-display-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-small-size: 2.25rem;--md-sys-typescale-display-small-line-height: 2.75rem;--md-sys-typescale-display-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-small-tracking: 0;--md-sys-typescale-headline-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-large-size: 2rem;--md-sys-typescale-headline-large-line-height: 2.5rem;--md-sys-typescale-headline-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-large-tracking: 0;--md-sys-typescale-headline-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-medium-size: 1.75rem;--md-sys-typescale-headline-medium-line-height: 2.25rem;--md-sys-typescale-headline-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-medium-tracking: 0;--md-sys-typescale-headline-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-small-size: 1.5rem;--md-sys-typescale-headline-small-line-height: 2rem;--md-sys-typescale-headline-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-small-tracking: 0;--md-sys-typescale-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-title-large-size: 1.375rem;--md-sys-typescale-title-large-line-height: 1.75rem;--md-sys-typescale-title-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-title-large-tracking: 0;--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0,009375rem;--md-sys-typescale-title-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-small-size: 0.875rem;--md-sys-typescale-title-small-line-height: 1.25rem;--md-sys-typescale-title-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-small-tracking: 0.00625rem;--md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-large-size: 1rem;--md-sys-typescale-body-large-line-height: 1.5rem;--md-sys-typescale-body-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-large-tracking: 0.03125rem;--md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-medium-size: 0.875rem;--md-sys-typescale-body-medium-line-height: 1.25rem;--md-sys-typescale-body-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-medium-tracking: 0.015625rem;--md-sys-typescale-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-small-size: 0.75rem;--md-sys-typescale-body-small-line-height: 1rem;--md-sys-typescale-body-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-small-tracking: 0.025rem;--md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-large-size: 0.875rem;--md-sys-typescale-label-large-line-height: 1.25rem;--md-sys-typescale-label-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-large-tracking: 0.00625rem;--md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-medium-size: 0.75rem;--md-sys-typescale-label-medium-line-height: 1rem;--md-sys-typescale-label-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-medium-tracking: 0.03125rem;--md-sys-typescale-label-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-small-size: 0.6875rem;--md-sys-typescale-label-small-line-height: 1rem;--md-sys-typescale-label-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-small-tracking: 0.03125rem;--md-sys-typescale-emphasized-display-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-display-large-size: 3.5625rem;--md-sys-typescale-emphasized-display-large-line-height: 4rem;--md-sys-typescale-emphasized-display-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-display-large-tracking: -0.015625rem;--md-sys-typescale-emphasized-display-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-display-medium-size: 2.8125rem;--md-sys-typescale-emphasized-display-medium-line-height: 3.25rem;--md-sys-typescale-emphasized-display-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-display-medium-tracking: 0;--md-sys-typescale-emphasized-display-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-display-small-size: 2.25rem;--md-sys-typescale-emphasized-display-small-line-height: 2.75rem;--md-sys-typescale-emphasized-display-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-display-small-tracking: 0;--md-sys-typescale-emphasized-headline-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-headline-large-size: 2rem;--md-sys-typescale-emphasized-headline-large-line-height: 2.5rem;--md-sys-typescale-emphasized-headline-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-headline-large-tracking: 0;--md-sys-typescale-emphasized-headline-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-headline-medium-size: 1.75rem;--md-sys-typescale-emphasized-headline-medium-line-height: 2.25rem;--md-sys-typescale-emphasized-headline-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-headline-medium-tracking: 0;--md-sys-typescale-emphasized-headline-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-headline-small-size: 1.5rem;--md-sys-typescale-emphasized-headline-small-line-height: 2rem;--md-sys-typescale-emphasized-headline-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-headline-small-tracking: 0;--md-sys-typescale-emphasized-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-title-large-size: 1.375rem;--md-sys-typescale-emphasized-title-large-line-height: 1.75rem;--md-sys-typescale-emphasized-title-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-title-large-tracking: 0;--md-sys-typescale-emphasized-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-title-medium-size: 1rem;--md-sys-typescale-emphasized-title-medium-line-height: 1.5rem;--md-sys-typescale-emphasized-title-medium-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-title-medium-tracking: 0,009375rem;--md-sys-typescale-emphasized-title-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-title-small-size: 0.875rem;--md-sys-typescale-emphasized-title-small-line-height: 1.25rem;--md-sys-typescale-emphasized-title-small-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-title-small-tracking: 0.00625rem;--md-sys-typescale-emphasized-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-body-large-size: 1rem;--md-sys-typescale-emphasized-body-large-line-height: 1.5rem;--md-sys-typescale-emphasized-body-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-body-large-tracking: 0.03125rem;--md-sys-typescale-emphasized-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-body-medium-size: 0.875rem;--md-sys-typescale-emphasized-body-medium-line-height: 1.25rem;--md-sys-typescale-emphasized-body-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-body-medium-tracking: 0.015625rem;--md-sys-typescale-emphasized-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-body-small-size: 0.75rem;--md-sys-typescale-emphasized-body-small-line-height: 1rem;--md-sys-typescale-emphasized-body-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-body-small-tracking: 0.025rem;--md-sys-typescale-emphasized-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-label-large-size: 0.875rem;--md-sys-typescale-emphasized-label-large-line-height: 1.25rem;--md-sys-typescale-emphasized-label-large-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-label-large-tracking: 0.00625rem;--md-sys-typescale-emphasized-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-label-medium-size: 0.75rem;--md-sys-typescale-emphasized-label-medium-line-height: 1rem;--md-sys-typescale-emphasized-label-medium-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-label-medium-tracking: 0.03125rem;--md-sys-typescale-emphasized-label-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-label-small-size: 0.6875rem;--md-sys-typescale-emphasized-label-small-line-height: 1rem;--md-sys-typescale-emphasized-label-small-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-label-small-tracking: 0.03125rem}.md-sys-typescale-display-large{font-family:var(--md-sys-typescale-display-large-font);font-size:var(--md-sys-typescale-display-large-size);line-height:var(--md-sys-typescale-display-large-line-height);font-weight:var(--md-sys-typescale-display-large-weight);letter-spacing:var(--md-sys-typescale-display-large-tracking)}.md-sys-typescale-display-medium{font-family:var(--md-sys-typescale-display-medium-font);font-size:var(--md-sys-typescale-display-medium-size);line-height:var(--md-sys-typescale-display-medium-line-height);font-weight:var(--md-sys-typescale-display-medium-weight);letter-spacing:var(--md-sys-typescale-display-medium-tracking)}.md-sys-typescale-display-small{font-family:var(--md-sys-typescale-display-small-font);font-size:var(--md-sys-typescale-display-small-size);line-height:var(--md-sys-typescale-display-small-line-height);font-weight:var(--md-sys-typescale-display-small-weight);letter-spacing:var(--md-sys-typescale-display-small-tracking)}.md-sys-typescale-headline-large{font-family:var(--md-sys-typescale-headline-large-font);font-size:var(--md-sys-typescale-headline-large-size);line-height:var(--md-sys-typescale-headline-large-line-height);font-weight:var(--md-sys-typescale-headline-large-weight);letter-spacing:var(--md-sys-typescale-headline-large-tracking)}.md-sys-typescale-headline-medium{font-family:var(--md-sys-typescale-headline-medium-font);font-size:var(--md-sys-typescale-headline-medium-size);line-height:var(--md-sys-typescale-headline-medium-line-height);font-weight:var(--md-sys-typescale-headline-medium-weight);letter-spacing:var(--md-sys-typescale-headline-medium-tracking)}.md-sys-typescale-headline-small{font-family:var(--md-sys-typescale-headline-small-font);font-size:var(--md-sys-typescale-headline-small-size);line-height:var(--md-sys-typescale-headline-small-line-height);font-weight:var(--md-sys-typescale-headline-small-weight);letter-spacing:var(--md-sys-typescale-headline-small-tracking)}.md-sys-typescale-title-large{font-family:var(--md-sys-typescale-title-large-font);font-size:var(--md-sys-typescale-title-large-size);line-height:var(--md-sys-typescale-title-large-line-height);font-weight:var(--md-sys-typescale-title-large-weight);letter-spacing:var(--md-sys-typescale-title-large-tracking)}.md-sys-typescale-title-medium{font-family:var(--md-sys-typescale-title-medium-font);font-size:var(--md-sys-typescale-title-medium-size);line-height:var(--md-sys-typescale-title-medium-line-height);font-weight:var(--md-sys-typescale-title-medium-weight);letter-spacing:var(--md-sys-typescale-title-medium-tracking)}.md-sys-typescale-title-small{font-family:var(--md-sys-typescale-title-small-font);font-size:var(--md-sys-typescale-title-small-size);line-height:var(--md-sys-typescale-title-small-line-height);font-weight:var(--md-sys-typescale-title-small-weight);letter-spacing:var(--md-sys-typescale-title-small-tracking)}.md-sys-typescale-body-large{font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking)}.md-sys-typescale-body-medium{font-family:var(--md-sys-typescale-body-medium-font);font-size:var(--md-sys-typescale-body-medium-size);line-height:var(--md-sys-typescale-body-medium-line-height);font-weight:var(--md-sys-typescale-body-medium-weight);letter-spacing:var(--md-sys-typescale-body-medium-tracking)}.md-sys-typescale-body-small{font-family:var(--md-sys-typescale-body-small-font);font-size:var(--md-sys-typescale-body-small-size);line-height:var(--md-sys-typescale-body-small-line-height);font-weight:var(--md-sys-typescale-body-small-weight);letter-spacing:var(--md-sys-typescale-body-small-tracking)}.md-sys-typescale-label-large{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking)}.md-sys-typescale-label-medium{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking)}.md-sys-typescale-label-small{font-family:var(--md-sys-typescale-label-small-font);font-size:var(--md-sys-typescale-label-small-size);line-height:var(--md-sys-typescale-label-small-line-height);font-weight:var(--md-sys-typescale-label-small-weight);letter-spacing:var(--md-sys-typescale-label-small-tracking)}.md-sys-typescale-emphasized-display-large{font-family:var(--md-sys-typescale-emphasized-display-large-font);font-size:var(--md-sys-typescale-emphasized-display-large-size);line-height:var(--md-sys-typescale-emphasized-display-large-line-height);font-weight:var(--md-sys-typescale-emphasized-display-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-display-large-tracking)}.md-sys-typescale-emphasized-display-medium{font-family:var(--md-sys-typescale-emphasized-display-medium-font);font-size:var(--md-sys-typescale-emphasized-display-medium-size);line-height:var(--md-sys-typescale-emphasized-display-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-display-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-display-medium-tracking)}.md-sys-typescale-emphasized-display-small{font-family:var(--md-sys-typescale-emphasized-display-small-font);font-size:var(--md-sys-typescale-emphasized-display-small-size);line-height:var(--md-sys-typescale-emphasized-display-small-line-height);font-weight:var(--md-sys-typescale-emphasized-display-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-display-small-tracking)}.md-sys-typescale-emphasized-headline-large{font-family:var(--md-sys-typescale-emphasized-headline-large-font);font-size:var(--md-sys-typescale-emphasized-headline-large-size);line-height:var(--md-sys-typescale-emphasized-headline-large-line-height);font-weight:var(--md-sys-typescale-emphasized-headline-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-headline-large-tracking)}.md-sys-typescale-emphasized-headline-medium{font-family:var(--md-sys-typescale-emphasized-headline-medium-font);font-size:var(--md-sys-typescale-emphasized-headline-medium-size);line-height:var(--md-sys-typescale-emphasized-headline-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-headline-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-headline-medium-tracking)}.md-sys-typescale-emphasized-headline-small{font-family:var(--md-sys-typescale-emphasized-headline-small-font);font-size:var(--md-sys-typescale-emphasized-headline-small-size);line-height:var(--md-sys-typescale-emphasized-headline-small-line-height);font-weight:var(--md-sys-typescale-emphasized-headline-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-headline-small-tracking)}.md-sys-typescale-emphasized-title-large{font-family:var(--md-sys-typescale-emphasized-title-large-font);font-size:var(--md-sys-typescale-emphasized-title-large-size);line-height:var(--md-sys-typescale-emphasized-title-large-line-height);font-weight:var(--md-sys-typescale-emphasized-title-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-title-large-tracking)}.md-sys-typescale-emphasized-title-medium{font-family:var(--md-sys-typescale-emphasized-title-medium-font);font-size:var(--md-sys-typescale-emphasized-title-medium-size);line-height:var(--md-sys-typescale-emphasized-title-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-title-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-title-medium-tracking)}.md-sys-typescale-emphasized-title-small{font-family:var(--md-sys-typescale-emphasized-title-small-font);font-size:var(--md-sys-typescale-emphasized-title-small-size);line-height:var(--md-sys-typescale-emphasized-title-small-line-height);font-weight:var(--md-sys-typescale-emphasized-title-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-title-small-tracking)}.md-sys-typescale-emphasized-body-large{font-family:var(--md-sys-typescale-emphasized-body-large-font);font-size:var(--md-sys-typescale-emphasized-body-large-size);line-height:var(--md-sys-typescale-emphasized-body-large-line-height);font-weight:var(--md-sys-typescale-emphasized-body-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-body-large-tracking)}.md-sys-typescale-emphasized-body-medium{font-family:var(--md-sys-typescale-emphasized-body-medium-font);font-size:var(--md-sys-typescale-emphasized-body-medium-size);line-height:var(--md-sys-typescale-emphasized-body-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-body-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-body-medium-tracking)}.md-sys-typescale-emphasized-body-small{font-family:var(--md-sys-typescale-emphasized-body-small-font);font-size:var(--md-sys-typescale-emphasized-body-small-size);line-height:var(--md-sys-typescale-emphasized-body-small-line-height);font-weight:var(--md-sys-typescale-emphasized-body-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-body-small-tracking)}.md-sys-typescale-emphasized-label-large{font-family:var(--md-sys-typescale-emphasized-label-large-font);font-size:var(--md-sys-typescale-emphasized-label-large-size);line-height:var(--md-sys-typescale-emphasized-label-large-line-height);font-weight:var(--md-sys-typescale-emphasized-label-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-label-large-tracking)}.md-sys-typescale-emphasized-label-medium{font-family:var(--md-sys-typescale-emphasized-label-medium-font);font-size:var(--md-sys-typescale-emphasized-label-medium-size);line-height:var(--md-sys-typescale-emphasized-label-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-label-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-label-medium-tracking)}.md-sys-typescale-emphasized-label-small{font-family:var(--md-sys-typescale-emphasized-label-small-font);font-size:var(--md-sys-typescale-emphasized-label-small-size);line-height:var(--md-sys-typescale-emphasized-label-small-line-height);font-weight:var(--md-sys-typescale-emphasized-label-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-label-small-tracking)}:root{--md-sys-navigationrail-collapsed-width: 96px;--md-sys-navigationrail-expanded-maxwidth: 360px;--md-sys-navigationrail-expanded-minwidth: 220px}.micl-navigationrail{--md-sys-navigationrail-spring-buffer: 200px;--md-sys-navigationrail-header-space: 40px;--md-sys-navigationrail-top-space: 44px;--md-sys-navigationrail-item-space: 6px;--md-sys-navigationrail-item-height: 56px;--md-sys-divider-thickness: 0px;--md-sys-navigationrail-motion-spatial: cubic-bezier(0.39, 1.29, 0.35, 0.98);--md-sys-navigationrail-motion-duration: 650ms;--md-sys-navigationrail-motion-duration-reverse: 500ms;--md-sys-navigationrail-morph-duration: 350ms;--md-sys-navigationrail-morph-duration-reverse: 350ms;box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;min-inline-size:var(--md-sys-navigationrail-collapsed-width);max-inline-size:var(--md-sys-navigationrail-collapsed-width);block-size:100vh;min-block-size:100%;margin-block:0;margin-inline:0 auto;padding-block:var(--md-sys-navigationrail-top-space) 0;padding-inline:0;background-color:var(--md-sys-color-surface);border:none;box-shadow:var(--md-sys-elevation-level0);opacity:100%;overflow:hidden;interpolate-size:allow-keywords}.micl-navigationrail>.micl-navigationrail__headline{padding-inline-start:24px}.micl-navigationrail>.micl-navigationrail__content{box-sizing:border-box;display:flex;flex-direction:column;flex:1 1 auto;align-items:flex-start;row-gap:var(--md-sys-navigationrail-item-space);inline-size:100%;padding-block:var(--md-sys-navigationrail-header-space) 0;padding-inline:20px 0;overflow:hidden auto;transition:row-gap var(--md-sys-navigationrail-morph-duration-reverse) linear}.micl-navigationrail>.micl-navigationrail__content>input[type=radio]{appearance:none;display:none;margin:0}.micl-navigationrail>.micl-navigationrail__content>label.micl-navigationrail__item{--micl-ripple: 1;--statelayer-color: var(--md-sys-color-on-secondary-container);box-sizing:border-box;display:flex;flex-direction:column;align-items:center;block-size:var(--md-sys-navigationrail-item-height);inline-size:var(--md-sys-navigationrail-item-height);row-gap:4px;padding-block:12px;border-radius:calc(var(--md-sys-navigationrail-item-height)/2);outline:none;background-color:rgba(0,0,0,0);background-image:radial-gradient(circle at var(--micl-x, center) var(--micl-y, center), transparent 0%, rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)) 10%, transparent 10%),linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-size:10000%,100%;cursor:pointer;transition:inline-size calc(var(--md-sys-navigationrail-morph-duration-reverse)/2) linear,background-color calc(var(--md-sys-navigationrail-morph-duration-reverse)/2) linear,background-size 3000ms,--statelayer-opacity var(--md-sys-navigationrail-motion-duration) linear}.micl-navigationrail>.micl-navigationrail__content>label.micl-navigationrail__item>.micl-navigationrail__icon{--micl-ripple: 1;font-size:24px;inline-size:24px;margin:0;padding-block:4px;padding-inline:16px;border-radius:16px;color:var(--md-sys-color-on-surface-variant);background-color:rgba(0,0,0,0);background-image:radial-gradient(circle at var(--micl-x, center) var(--micl-y, center), transparent 0%, rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)) 10%, transparent 10%),linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-size:10000%,100%;font-variation-settings:"FILL" 0;transition:background-size 3000ms,background-color var(--md-sys-navigationrail-morph-duration-reverse) linear,font-variation-settings var(--md-sys-navigationrail-morph-duration-reverse) linear,--statelayer-opacity var(--md-sys-navigationrail-motion-duration) linear}.micl-navigationrail>.micl-navigationrail__content>label.micl-navigationrail__item>.micl-navigationrail__text{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking);min-block-size:var(--md-sys-typescale-label-medium-line-height);margin-block-start:0;margin-inline-start:0px;padding-inline-end:0px;color:var(--md-sys-color-on-surface-variant);opacity:100%;overflow:hidden}.micl-navigationrail>.micl-navigationrail__content>input[type=radio]:checked+label.micl-navigationrail__item>.micl-navigationrail__icon{background-color:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container);font-variation-settings:"FILL" 1;transition:background-size 3000ms,background-color var(--md-sys-navigationrail-morph-duration) linear,font-variation-settings var(--md-sys-navigationrail-morph-duration) linear,--statelayer-opacity var(--md-sys-navigationrail-motion-duration) linear}.micl-navigationrail>.micl-navigationrail__content>input[type=radio]:checked+label.micl-navigationrail__item>.micl-navigationrail__text{color:var(--md-sys-color-secondary)}dialog.micl-navigationrail,div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--selected){max-inline-size:var(--md-sys-navigationrail-expanded-maxwidth);min-inline-size:var(--md-sys-navigationrail-expanded-minwidth)}dialog.micl-navigationrail>.micl-navigationrail__content,div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--selected)>.micl-navigationrail__content{row-gap:0px}dialog.micl-navigationrail>.micl-navigationrail__content>label.micl-navigationrail__item,div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--selected)>.micl-navigationrail__content>label.micl-navigationrail__item{position:relative;flex-direction:row;inline-size:fit-content}dialog.micl-navigationrail>.micl-navigationrail__content>label.micl-navigationrail__item::before,div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--selected)>.micl-navigationrail__content>label.micl-navigationrail__item::before{content:"";position:absolute;inset:0px;inset-inline-end:calc(-1*(var(--md-sys-navigationrail-expanded-maxwidth) - 20px - 100%));background-color:rgba(0,0,0,0)}dialog.micl-navigationrail>.micl-navigationrail__content>label.micl-navigationrail__item:hover,div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--selected)>.micl-navigationrail__content>label.micl-navigationrail__item:hover{--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity)}dialog.micl-navigationrail>.micl-navigationrail__content>label.micl-navigationrail__item:focus-visible,div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--selected)>.micl-navigationrail__content>label.micl-navigationrail__item:focus-visible{--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity)}dialog.micl-navigationrail>.micl-navigationrail__content>label.micl-navigationrail__item:active,div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--selected)>.micl-navigationrail__content>label.micl-navigationrail__item:active{background-size:0%,100%;transition:background-size 0ms;--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity)}dialog.micl-navigationrail>.micl-navigationrail__content>label.micl-navigationrail__item>.micl-navigationrail__text,div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--selected)>.micl-navigationrail__content>label.micl-navigationrail__item>.micl-navigationrail__text{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking);margin-inline-start:-8px;padding-inline-end:16px}dialog.micl-navigationrail>.micl-navigationrail__content>input[type=radio]:checked+label.micl-navigationrail__item,div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--selected)>.micl-navigationrail__content>input[type=radio]:checked+label.micl-navigationrail__item{background-color:var(--md-sys-color-secondary-container)}dialog.micl-navigationrail>.micl-navigationrail__content>input[type=radio]:checked+label.micl-navigationrail__item>.micl-navigationrail__icon,div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--selected)>.micl-navigationrail__content>input[type=radio]:checked+label.micl-navigationrail__item>.micl-navigationrail__icon{background-color:rgba(0,0,0,0)}div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--selected)>.micl-navigationrail__content{transition:row-gap var(--md-sys-navigationrail-morph-duration) linear}div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--selected)>.micl-navigationrail__content>label.micl-navigationrail__item{transition:inline-size calc(var(--md-sys-navigationrail-morph-duration)/2) calc(var(--md-sys-navigationrail-morph-duration)/2) linear,background-color calc(var(--md-sys-navigationrail-morph-duration)/2) calc(var(--md-sys-navigationrail-morph-duration)/2) linear,background-size 3000ms,--statelayer-opacity var(--md-sys-navigationrail-motion-duration) linear}div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--selected)>.micl-navigationrail__content>input[type=radio]:checked+label.micl-navigationrail__item>.micl-navigationrail__icon{transition:background-size 3000ms,background-color calc(var(--md-sys-navigationrail-morph-duration)/2) linear,font-variation-settings calc(var(--md-sys-navigationrail-morph-duration)/2) linear,--statelayer-opacity var(--md-sys-navigationrail-motion-duration) linear}div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--toggled.micl-button--selected){animation:var(--md-sys-navigationrail-morph-duration) linear forwards navigationrail-to-expanded}div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--toggled.micl-button--selected)>.micl-navigationrail__content>label.micl-navigationrail__item{animation:calc(var(--md-sys-navigationrail-morph-duration)/2) linear forwards navigationrail-item-to-expanded}div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--toggled.micl-button--selected)>.micl-navigationrail__content>label.micl-navigationrail__item>.micl-navigationrail__text{animation:var(--md-sys-navigationrail-morph-duration) linear forwards navigationrail-text-to-expanded}div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--toggled:not(.micl-button--selected)){animation:var(--md-sys-navigationrail-morph-duration-reverse) linear forwards navigationrail-to-collapsed}div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--toggled:not(.micl-button--selected))>.micl-navigationrail__content>label.micl-navigationrail__item{animation:calc(var(--md-sys-navigationrail-morph-duration-reverse)/2) linear forwards navigationrail-item-to-collapsed}div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--toggled:not(.micl-button--selected))>.micl-navigationrail__content>label.micl-navigationrail__item>.micl-navigationrail__text{animation:var(--md-sys-navigationrail-morph-duration-reverse) linear forwards navigationrail-text-to-collapsed}div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle.micl-button--toggled:not(.micl-button--selected))>.micl-navigationrail__content>input[type=radio]:checked+label.micl-navigationrail__item>.micl-navigationrail__icon{transition:background-size 3000ms,background-color calc(var(--md-sys-navigationrail-morph-duration-reverse)/2) calc(var(--md-sys-navigationrail-morph-duration-reverse)/2) linear,font-variation-settings calc(var(--md-sys-navigationrail-morph-duration-reverse)/2) calc(var(--md-sys-navigationrail-morph-duration-reverse)/2) linear,--statelayer-opacity var(--md-sys-navigationrail-motion-duration) linear}div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle:not(.micl-button--selected))>.micl-navigationrail__content>label.micl-navigationrail__item:hover>.micl-navigationrail__icon{--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity)}div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle:not(.micl-button--selected))>.micl-navigationrail__content>label.micl-navigationrail__item:focus-visible>.micl-navigationrail__icon{--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity)}div.micl-navigationrail:has(>.micl-navigationrail__headline .micl-button--toggle:not(.micl-button--selected))>.micl-navigationrail__content>label.micl-navigationrail__item:active>.micl-navigationrail__icon{--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity);background-size:0%,100%;transition:background-size 0ms,background-color calc(var(--md-sys-navigationrail-morph-duration-reverse)/2) calc(var(--md-sys-navigationrail-morph-duration-reverse)/2) linear,font-variation-settings calc(var(--md-sys-navigationrail-morph-duration-reverse)/2) calc(var(--md-sys-navigationrail-morph-duration-reverse)/2) linear,--statelayer-opacity var(--md-sys-navigationrail-motion-duration) linear}dialog.micl-navigationrail{display:none;min-inline-size:calc(var(--md-sys-navigationrail-expanded-minwidth) + var(--md-sys-navigationrail-spring-buffer));max-inline-size:calc(var(--md-sys-navigationrail-expanded-maxwidth) + var(--md-sys-navigationrail-spring-buffer));margin-inline-start:calc(-1*(var(--md-sys-navigationrail-expanded-maxwidth) + var(--md-sys-navigationrail-spring-buffer)));padding-inline:var(--md-sys-navigationrail-spring-buffer) 0;opacity:0%;transition:opacity var(--md-sys-navigationrail-motion-duration-reverse) linear,margin-inline-start var(--md-sys-navigationrail-motion-duration-reverse) var(--md-sys-navigationrail-motion-spatial),overlay var(--md-sys-navigationrail-motion-duration-reverse) linear allow-discrete,display var(--md-sys-navigationrail-motion-duration-reverse) linear allow-discrete}dialog.micl-navigationrail[open]{display:flex;margin-inline-start:calc(-1*var(--md-sys-navigationrail-spring-buffer));opacity:100%}@starting-style{dialog.micl-navigationrail[open]{margin-inline-start:calc(-1*(var(--md-sys-navigationrail-expanded-maxwidth) + var(--md-sys-navigationrail-spring-buffer)));opacity:0%}}div.micl-navigationrail{position:sticky;float:inline-start;inset:unset;inset-block-start:0;inset-inline-start:0;border-inline-end:var(--md-sys-divider-thickness) solid var(--md-sys-divider-color)}div.micl-navigationrail[popover]{position:fixed}.micl-navigationrail[open],.micl-navigationrail:popover-open{border-start-end-radius:var(--md-sys-shape-corner-large);border-end-end-radius:var(--md-sys-shape-corner-large);box-shadow:var(--md-sys-elevation-level2);background-color:var(--md-sys-color-surface-container);transition:opacity var(--md-sys-navigationrail-motion-duration) linear,margin-inline-start var(--md-sys-navigationrail-motion-duration) var(--md-sys-navigationrail-motion-spatial),overlay var(--md-sys-navigationrail-motion-duration) linear allow-discrete,display var(--md-sys-navigationrail-motion-duration) linear allow-discrete}.micl-navigationrail[open]::backdrop,.micl-navigationrail:popover-open::backdrop{background-color:rgba(0,0,0,.2)}@starting-style{.micl-navigationrail[open]::backdrop,.micl-navigationrail:popover-open::backdrop{background-color:rgba(0,0,0,0)}}.micl-navigationrail::backdrop{background-color:rgba(0,0,0,0);transition:background-color var(--md-sys-navigationrail-motion-duration) linear,overlay var(--md-sys-navigationrail-motion-duration) linear allow-discrete,display var(--md-sys-navigationrail-motion-duration) linear allow-discrete}body:has(div.micl-navigationrail[popover]){margin-inline-start:var(--md-sys-navigationrail-collapsed-width)}@keyframes navigationrail-to-expanded{from{max-inline-size:var(--md-sys-navigationrail-collapsed-width);min-inline-size:var(--md-sys-navigationrail-collapsed-width)}to{max-inline-size:var(--md-sys-navigationrail-expanded-maxwidth);min-inline-size:var(--md-sys-navigationrail-expanded-minwidth)}}@keyframes navigationrail-to-collapsed{from{max-inline-size:var(--md-sys-navigationrail-expanded-maxwidth);min-inline-size:var(--md-sys-navigationrail-expanded-minwidth)}to{max-inline-size:var(--md-sys-navigationrail-collapsed-width);min-inline-size:var(--md-sys-navigationrail-collapsed-width)}}@keyframes navigationrail-item-to-expanded{0%{flex-direction:column}99%{flex-direction:column}100%{flex-direction:row}}@keyframes navigationrail-item-to-collapsed{0%{flex-direction:row}99%{flex-direction:row}100%{flex-direction:column}}@keyframes navigationrail-text-to-collapsed{0%{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking);margin-block-start:0;margin-inline-start:-8px;padding-inline-end:16px;opacity:100%}49.9%{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking);margin-block-start:0;margin-inline-start:-8px;padding-inline-end:16px;opacity:0%}50.1%{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking);min-block-size:var(--md-sys-typescale-label-medium-line-height);margin-block-start:-16px;margin-inline-start:0px;padding-inline-end:0px;opacity:0%}100%{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking);min-block-size:var(--md-sys-typescale-label-medium-line-height);margin-block-start:0;margin-inline-start:0px;padding-inline-end:0px;opacity:100%}}@keyframes navigationrail-text-to-expanded{0%{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking);min-block-size:var(--md-sys-typescale-label-medium-line-height);margin-block-start:0;margin-inline-start:0px;padding-inline-end:0px;opacity:100%}49.9%{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking);min-block-size:var(--md-sys-typescale-label-medium-line-height);margin-block-start:-16px;margin-inline-start:0px;padding-inline-end:0px;opacity:0%}50.1%{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking);margin-block-start:0px;margin-inline-start:-8px;padding-inline-end:16px;opacity:0%}100%{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking);margin-block-start:0px;margin-inline-start:-8px;padding-inline-end:16px;opacity:100%}}
|
package/dist/radio.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--md-sys-motion-duration-short1: 50ms;--md-sys-motion-duration-short2: 100ms;--md-sys-motion-duration-short3: 150ms;--md-sys-motion-duration-short4: 200ms;--md-sys-motion-duration-medium1: 250ms;--md-sys-motion-duration-medium2: 300ms;--md-sys-motion-duration-medium3: 350ms;--md-sys-motion-duration-medium4: 400ms;--md-sys-motion-duration-long1: 450ms;--md-sys-motion-duration-long2: 500ms;--md-sys-motion-duration-long3: 550ms;--md-sys-motion-duration-long4: 600ms;--md-sys-motion-duration-extra-long1: 700ms;--md-sys-motion-duration-extra-long2: 800ms;--md-sys-motion-duration-extra-long3: 900ms;--md-sys-motion-duration-extra-long4: 1000ms}:root{--md-sys-target-size: 48px;--md-sys-shape-corner-none: 0px;--md-sys-shape-corner-extra-small: 4px;--md-sys-shape-corner-small: 8px;--md-sys-shape-corner-medium: 12px;--md-sys-shape-corner-large: 16px;--md-sys-shape-corner-large-increased: 20px;--md-sys-shape-corner-extra-large: 28px;--md-sys-shape-corner-extra-large-increased: 32px;--md-sys-shape-corner-extra-extra-large: 48px;--md-sys-shape-corner-full: 50%}:root{--md-sys-state-layer-size: 40px;--md-sys-state-hover-state-layer-opacity: 8%;--md-sys-state-focus-state-layer-opacity: 10%;--md-sys-state-pressed-state-layer-opacity: 10%;--md-sys-state-dragged-state-layer-opacity: 16%;--md-sys-state-focus-indicator-inner-offset: -3px;--md-sys-state-focus-indicator-outer-offset: 2px;--md-sys-state-focus-indicator-thickness: 3px}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-radio-border-width: 2px;--md-sys-radio-container-size: 20px;--md-sys-radio-state-layer-size: 40px}input[type=radio].micl-radio{--md-sys-radio-motion-effects: cubic-bezier(0.34, 0.88, 0.34, 1);--md-sys-radio-motion-duration: 300ms;--md-sys-radio-motion-duration-reverse: 200ms;appearance:none;box-sizing:border-box;position:relative;width:var(--md-sys-target-size);height:var(--md-sys-target-size);margin:0;border:calc((var(--md-sys-target-size) - var(--md-sys-radio-state-layer-size))/2) solid rgba(0,0,0,0);background-clip:content-box;background-color:rgba(0,0,0,0);border-radius:var(--md-sys-shape-corner-full);outline-offset:-7px}input[type=radio].micl-radio::after{content:"";box-sizing:border-box;position:absolute;width:var(--md-sys-radio-container-size);height:var(--md-sys-radio-container-size);inset:0;margin:auto;padding:calc(var(--md-sys-radio-container-size)/2 - var(--md-sys-radio-border-width));border:var(--md-sys-radio-border-width) solid var(--md-sys-color-on-surface-variant);background-color:var(--md-sys-color-primary);background-clip:content-box;border-radius:var(--md-sys-shape-corner-full);transition:padding var(--md-sys-radio-motion-duration-reverse) var(--md-sys-radio-motion-effects),border-color var(--md-sys-radio-motion-duration-reverse) cubic-bezier(0.2, 0, 0, 1)}input[type=radio].micl-radio:checked::after{border-color:var(--md-sys-color-primary);padding:3px;transition:padding var(--md-sys-radio-motion-duration) var(--md-sys-radio-motion-effects),border-color var(--md-sys-radio-motion-duration) cubic-bezier(0.2, 0, 0, 1)}input[type=radio].micl-radio:not(:disabled){--
|
|
1
|
+
:root{--md-sys-motion-duration-short1: 50ms;--md-sys-motion-duration-short2: 100ms;--md-sys-motion-duration-short3: 150ms;--md-sys-motion-duration-short4: 200ms;--md-sys-motion-duration-medium1: 250ms;--md-sys-motion-duration-medium2: 300ms;--md-sys-motion-duration-medium3: 350ms;--md-sys-motion-duration-medium4: 400ms;--md-sys-motion-duration-long1: 450ms;--md-sys-motion-duration-long2: 500ms;--md-sys-motion-duration-long3: 550ms;--md-sys-motion-duration-long4: 600ms;--md-sys-motion-duration-extra-long1: 700ms;--md-sys-motion-duration-extra-long2: 800ms;--md-sys-motion-duration-extra-long3: 900ms;--md-sys-motion-duration-extra-long4: 1000ms}:root{--md-sys-target-size: 48px;--md-sys-shape-corner-none: 0px;--md-sys-shape-corner-extra-small: 4px;--md-sys-shape-corner-small: 8px;--md-sys-shape-corner-medium: 12px;--md-sys-shape-corner-large: 16px;--md-sys-shape-corner-large-increased: 20px;--md-sys-shape-corner-extra-large: 28px;--md-sys-shape-corner-extra-large-increased: 32px;--md-sys-shape-corner-extra-extra-large: 48px;--md-sys-shape-corner-full: 50%}:root{--md-sys-state-layer-size: 40px;--md-sys-state-hover-state-layer-opacity: 8%;--md-sys-state-focus-state-layer-opacity: 10%;--md-sys-state-pressed-state-layer-opacity: 10%;--md-sys-state-dragged-state-layer-opacity: 16%;--md-sys-state-focus-indicator-inner-offset: -3px;--md-sys-state-focus-indicator-outer-offset: 2px;--md-sys-state-focus-indicator-thickness: 3px}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-radio-border-width: 2px;--md-sys-radio-container-size: 20px;--md-sys-radio-state-layer-size: 40px}input[type=radio].micl-radio{--md-sys-radio-motion-effects: cubic-bezier(0.34, 0.88, 0.34, 1);--md-sys-radio-motion-duration: 300ms;--md-sys-radio-motion-duration-reverse: 200ms;appearance:none;box-sizing:border-box;position:relative;width:var(--md-sys-target-size);height:var(--md-sys-target-size);margin:0;border:calc((var(--md-sys-target-size) - var(--md-sys-radio-state-layer-size))/2) solid rgba(0,0,0,0);background-clip:content-box;background-color:rgba(0,0,0,0);border-radius:var(--md-sys-shape-corner-full);outline-offset:-7px}input[type=radio].micl-radio::after{content:"";box-sizing:border-box;position:absolute;width:var(--md-sys-radio-container-size);height:var(--md-sys-radio-container-size);inset:0;margin:auto;padding:calc(var(--md-sys-radio-container-size)/2 - var(--md-sys-radio-border-width));border:var(--md-sys-radio-border-width) solid var(--md-sys-color-on-surface-variant);background-color:var(--md-sys-color-primary);background-clip:content-box;border-radius:var(--md-sys-shape-corner-full);transition:padding var(--md-sys-radio-motion-duration-reverse) var(--md-sys-radio-motion-effects),border-color var(--md-sys-radio-motion-duration-reverse) cubic-bezier(0.2, 0, 0, 1)}input[type=radio].micl-radio:checked::after{border-color:var(--md-sys-color-primary);padding:3px;transition:padding var(--md-sys-radio-motion-duration) var(--md-sys-radio-motion-effects),border-color var(--md-sys-radio-motion-duration) cubic-bezier(0.2, 0, 0, 1)}input[type=radio].micl-radio:not(:disabled){--micl-ripple: 1;background-image:radial-gradient(circle at var(--micl-x, center) var(--micl-y, center), transparent 0%, rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)) 10%, transparent 10%),linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-size:10000%,100%;cursor:pointer;transition:background-size 3000ms,--statelayer-opacity var(--md-sys-radio-motion-duration) linear}input[type=radio].micl-radio:not(:disabled):hover{--statelayer-color: var(--md-sys-color-on-surface);--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity)}input[type=radio].micl-radio:not(:disabled):hover:checked{--statelayer-color: var(--md-sys-color-primary)}input[type=radio].micl-radio:not(:disabled):hover::after{border-color:var(--md-sys-color-on-surface)}input[type=radio].micl-radio:not(:disabled):hover:checked::after{border-color:var(--md-sys-color-primary)}input[type=radio].micl-radio:not(:disabled):focus-visible{--statelayer-color: var(--md-sys-color-on-surface);--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity);outline:var(--md-sys-state-focus-indicator-thickness) solid var(--md-sys-color-secondary)}input[type=radio].micl-radio:not(:disabled):focus-visible:checked{--statelayer-color: var(--md-sys-color-primary)}input[type=radio].micl-radio:not(:disabled):focus-visible::after{border-color:var(--md-sys-color-on-surface)}input[type=radio].micl-radio:not(:disabled):focus-visible:checked::after{border-color:var(--md-sys-color-primary)}input[type=radio].micl-radio:not(:disabled):active{--statelayer-color: var(--md-sys-color-on-surface);--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity);background-size:0%,100%;transition:background-size 0ms}input[type=radio].micl-radio:not(:disabled):active:checked{--statelayer-color: var(--md-sys-color-primary)}input[type=radio].micl-radio:not(:disabled):active::after{border-color:var(--md-sys-color-on-surface)}input[type=radio].micl-radio:not(:disabled):active:checked::after{border-color:var(--md-sys-color-primary)}input[type=radio].micl-radio:disabled{opacity:38%}input[type=radio].micl-radio:disabled::after{border-color:var(--md-sys-color-on-surface)}input[type=radio].micl-radio:disabled:checked::after{background-color:var(--md-sys-color-on-surface)}input[type=radio].micl-radio:not(:disabled)+label,label:has(+input[type=radio].micl-radio:not(:disabled)){cursor:pointer}input[type=radio].micl-radio+label,label+input[type=radio].micl-radio{color:var(--md-sys-color-on-surface)}
|
package/dist/sidesheet.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--md-sys-elevation-level0: rgba(0, 0, 0, 0.2) 0px 0px 0px 0px, rgba(0, 0, 0, 0.14) 0px 0px 0px 0px, rgba(0, 0, 0, 0.12) 0px 0px 0px 0px;--md-sys-elevation-level1: rgba(0, 0, 0, 0.2) 0px 2px 1px -1px, rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 1px 3px 0px;--md-sys-elevation-level2: rgba(0, 0, 0, 0.2) 0px 3px 3px -2px, rgba(0, 0, 0, 0.14) 0px 3px 4px 0px, rgba(0, 0, 0, 0.12) 0px 1px 8px 0px;--md-sys-elevation-level3: rgba(0, 0, 0, 0.2) 0px 3px 5px -1px, rgba(0, 0, 0, 0.14) 0px 6px 10px 0px, rgba(0, 0, 0, 0.12) 0px 1px 18px 0px;--md-sys-elevation-level4: rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px;--md-sys-elevation-level5: rgba(0, 0, 0, 0.2) 0px 7px 8px -4px, rgba(0, 0, 0, 0.14) 0px 12px 17px 2px, rgba(0, 0, 0, 0.12) 0px 5px 22px 4px}:root{--md-sys-motion-duration-short1: 50ms;--md-sys-motion-duration-short2: 100ms;--md-sys-motion-duration-short3: 150ms;--md-sys-motion-duration-short4: 200ms;--md-sys-motion-duration-medium1: 250ms;--md-sys-motion-duration-medium2: 300ms;--md-sys-motion-duration-medium3: 350ms;--md-sys-motion-duration-medium4: 400ms;--md-sys-motion-duration-long1: 450ms;--md-sys-motion-duration-long2: 500ms;--md-sys-motion-duration-long3: 550ms;--md-sys-motion-duration-long4: 600ms;--md-sys-motion-duration-extra-long1: 700ms;--md-sys-motion-duration-extra-long2: 800ms;--md-sys-motion-duration-extra-long3: 900ms;--md-sys-motion-duration-extra-long4: 1000ms}:root{--md-sys-target-size: 48px;--md-sys-shape-corner-none: 0px;--md-sys-shape-corner-extra-small: 4px;--md-sys-shape-corner-small: 8px;--md-sys-shape-corner-medium: 12px;--md-sys-shape-corner-large: 16px;--md-sys-shape-corner-large-increased: 20px;--md-sys-shape-corner-extra-large: 28px;--md-sys-shape-corner-extra-large-increased: 32px;--md-sys-shape-corner-extra-extra-large: 48px;--md-sys-shape-corner-full: 50%}:root{--md-ref-typeface-plain: Roboto, system-ui, sans-serif;--md-ref-typeface-brand: Roboto, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700;--md-sys-typescale-display-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-large-size: 3.5625rem;--md-sys-typescale-display-large-line-height: 4rem;--md-sys-typescale-display-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-large-tracking: -0.015625rem;--md-sys-typescale-display-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-medium-size: 2.8125rem;--md-sys-typescale-display-medium-line-height: 3.25rem;--md-sys-typescale-display-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-medium-tracking: 0;--md-sys-typescale-display-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-small-size: 2.25rem;--md-sys-typescale-display-small-line-height: 2.75rem;--md-sys-typescale-display-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-small-tracking: 0;--md-sys-typescale-headline-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-large-size: 2rem;--md-sys-typescale-headline-large-line-height: 2.5rem;--md-sys-typescale-headline-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-large-tracking: 0;--md-sys-typescale-headline-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-medium-size: 1.75rem;--md-sys-typescale-headline-medium-line-height: 2.25rem;--md-sys-typescale-headline-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-medium-tracking: 0;--md-sys-typescale-headline-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-small-size: 1.5rem;--md-sys-typescale-headline-small-line-height: 2rem;--md-sys-typescale-headline-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-small-tracking: 0;--md-sys-typescale-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-title-large-size: 1.375rem;--md-sys-typescale-title-large-line-height: 1.75rem;--md-sys-typescale-title-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-title-large-tracking: 0;--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0,009375rem;--md-sys-typescale-title-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-small-size: 0.875rem;--md-sys-typescale-title-small-line-height: 1.25rem;--md-sys-typescale-title-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-small-tracking: 0.00625rem;--md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-large-size: 1rem;--md-sys-typescale-body-large-line-height: 1.5rem;--md-sys-typescale-body-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-large-tracking: 0.03125rem;--md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-medium-size: 0.875rem;--md-sys-typescale-body-medium-line-height: 1.25rem;--md-sys-typescale-body-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-medium-tracking: 0.015625rem;--md-sys-typescale-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-small-size: 0.75rem;--md-sys-typescale-body-small-line-height: 1rem;--md-sys-typescale-body-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-small-tracking: 0.025rem;--md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-large-size: 0.875rem;--md-sys-typescale-label-large-line-height: 1.25rem;--md-sys-typescale-label-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-large-tracking: 0.00625rem;--md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-medium-size: 0.75rem;--md-sys-typescale-label-medium-line-height: 1rem;--md-sys-typescale-label-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-medium-tracking: 0.03125rem;--md-sys-typescale-label-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-small-size: 0.6875rem;--md-sys-typescale-label-small-line-height: 1rem;--md-sys-typescale-label-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-small-tracking: 0.03125rem;--md-sys-typescale-emphasized-display-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-display-large-size: 3.5625rem;--md-sys-typescale-emphasized-display-large-line-height: 4rem;--md-sys-typescale-emphasized-display-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-display-large-tracking: -0.015625rem;--md-sys-typescale-emphasized-display-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-display-medium-size: 2.8125rem;--md-sys-typescale-emphasized-display-medium-line-height: 3.25rem;--md-sys-typescale-emphasized-display-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-display-medium-tracking: 0;--md-sys-typescale-emphasized-display-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-display-small-size: 2.25rem;--md-sys-typescale-emphasized-display-small-line-height: 2.75rem;--md-sys-typescale-emphasized-display-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-display-small-tracking: 0;--md-sys-typescale-emphasized-headline-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-headline-large-size: 2rem;--md-sys-typescale-emphasized-headline-large-line-height: 2.5rem;--md-sys-typescale-emphasized-headline-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-headline-large-tracking: 0;--md-sys-typescale-emphasized-headline-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-headline-medium-size: 1.75rem;--md-sys-typescale-emphasized-headline-medium-line-height: 2.25rem;--md-sys-typescale-emphasized-headline-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-headline-medium-tracking: 0;--md-sys-typescale-emphasized-headline-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-headline-small-size: 1.5rem;--md-sys-typescale-emphasized-headline-small-line-height: 2rem;--md-sys-typescale-emphasized-headline-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-headline-small-tracking: 0;--md-sys-typescale-emphasized-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-title-large-size: 1.375rem;--md-sys-typescale-emphasized-title-large-line-height: 1.75rem;--md-sys-typescale-emphasized-title-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-title-large-tracking: 0;--md-sys-typescale-emphasized-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-title-medium-size: 1rem;--md-sys-typescale-emphasized-title-medium-line-height: 1.5rem;--md-sys-typescale-emphasized-title-medium-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-title-medium-tracking: 0,009375rem;--md-sys-typescale-emphasized-title-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-title-small-size: 0.875rem;--md-sys-typescale-emphasized-title-small-line-height: 1.25rem;--md-sys-typescale-emphasized-title-small-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-title-small-tracking: 0.00625rem;--md-sys-typescale-emphasized-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-body-large-size: 1rem;--md-sys-typescale-emphasized-body-large-line-height: 1.5rem;--md-sys-typescale-emphasized-body-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-body-large-tracking: 0.03125rem;--md-sys-typescale-emphasized-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-body-medium-size: 0.875rem;--md-sys-typescale-emphasized-body-medium-line-height: 1.25rem;--md-sys-typescale-emphasized-body-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-body-medium-tracking: 0.015625rem;--md-sys-typescale-emphasized-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-body-small-size: 0.75rem;--md-sys-typescale-emphasized-body-small-line-height: 1rem;--md-sys-typescale-emphasized-body-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-body-small-tracking: 0.025rem;--md-sys-typescale-emphasized-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-label-large-size: 0.875rem;--md-sys-typescale-emphasized-label-large-line-height: 1.25rem;--md-sys-typescale-emphasized-label-large-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-label-large-tracking: 0.00625rem;--md-sys-typescale-emphasized-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-label-medium-size: 0.75rem;--md-sys-typescale-emphasized-label-medium-line-height: 1rem;--md-sys-typescale-emphasized-label-medium-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-label-medium-tracking: 0.03125rem;--md-sys-typescale-emphasized-label-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-label-small-size: 0.6875rem;--md-sys-typescale-emphasized-label-small-line-height: 1rem;--md-sys-typescale-emphasized-label-small-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-label-small-tracking: 0.03125rem}.md-sys-typescale-display-large{font-family:var(--md-sys-typescale-display-large-font);font-size:var(--md-sys-typescale-display-large-size);line-height:var(--md-sys-typescale-display-large-line-height);font-weight:var(--md-sys-typescale-display-large-weight);letter-spacing:var(--md-sys-typescale-display-large-tracking)}.md-sys-typescale-display-medium{font-family:var(--md-sys-typescale-display-medium-font);font-size:var(--md-sys-typescale-display-medium-size);line-height:var(--md-sys-typescale-display-medium-line-height);font-weight:var(--md-sys-typescale-display-medium-weight);letter-spacing:var(--md-sys-typescale-display-medium-tracking)}.md-sys-typescale-display-small{font-family:var(--md-sys-typescale-display-small-font);font-size:var(--md-sys-typescale-display-small-size);line-height:var(--md-sys-typescale-display-small-line-height);font-weight:var(--md-sys-typescale-display-small-weight);letter-spacing:var(--md-sys-typescale-display-small-tracking)}.md-sys-typescale-headline-large{font-family:var(--md-sys-typescale-headline-large-font);font-size:var(--md-sys-typescale-headline-large-size);line-height:var(--md-sys-typescale-headline-large-line-height);font-weight:var(--md-sys-typescale-headline-large-weight);letter-spacing:var(--md-sys-typescale-headline-large-tracking)}.md-sys-typescale-headline-medium{font-family:var(--md-sys-typescale-headline-medium-font);font-size:var(--md-sys-typescale-headline-medium-size);line-height:var(--md-sys-typescale-headline-medium-line-height);font-weight:var(--md-sys-typescale-headline-medium-weight);letter-spacing:var(--md-sys-typescale-headline-medium-tracking)}.md-sys-typescale-headline-small{font-family:var(--md-sys-typescale-headline-small-font);font-size:var(--md-sys-typescale-headline-small-size);line-height:var(--md-sys-typescale-headline-small-line-height);font-weight:var(--md-sys-typescale-headline-small-weight);letter-spacing:var(--md-sys-typescale-headline-small-tracking)}.md-sys-typescale-title-large{font-family:var(--md-sys-typescale-title-large-font);font-size:var(--md-sys-typescale-title-large-size);line-height:var(--md-sys-typescale-title-large-line-height);font-weight:var(--md-sys-typescale-title-large-weight);letter-spacing:var(--md-sys-typescale-title-large-tracking)}.md-sys-typescale-title-medium{font-family:var(--md-sys-typescale-title-medium-font);font-size:var(--md-sys-typescale-title-medium-size);line-height:var(--md-sys-typescale-title-medium-line-height);font-weight:var(--md-sys-typescale-title-medium-weight);letter-spacing:var(--md-sys-typescale-title-medium-tracking)}.md-sys-typescale-title-small{font-family:var(--md-sys-typescale-title-small-font);font-size:var(--md-sys-typescale-title-small-size);line-height:var(--md-sys-typescale-title-small-line-height);font-weight:var(--md-sys-typescale-title-small-weight);letter-spacing:var(--md-sys-typescale-title-small-tracking)}.md-sys-typescale-body-large{font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking)}.md-sys-typescale-body-medium{font-family:var(--md-sys-typescale-body-medium-font);font-size:var(--md-sys-typescale-body-medium-size);line-height:var(--md-sys-typescale-body-medium-line-height);font-weight:var(--md-sys-typescale-body-medium-weight);letter-spacing:var(--md-sys-typescale-body-medium-tracking)}.md-sys-typescale-body-small{font-family:var(--md-sys-typescale-body-small-font);font-size:var(--md-sys-typescale-body-small-size);line-height:var(--md-sys-typescale-body-small-line-height);font-weight:var(--md-sys-typescale-body-small-weight);letter-spacing:var(--md-sys-typescale-body-small-tracking)}.md-sys-typescale-label-large{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking)}.md-sys-typescale-label-medium{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking)}.md-sys-typescale-label-small{font-family:var(--md-sys-typescale-label-small-font);font-size:var(--md-sys-typescale-label-small-size);line-height:var(--md-sys-typescale-label-small-line-height);font-weight:var(--md-sys-typescale-label-small-weight);letter-spacing:var(--md-sys-typescale-label-small-tracking)}.md-sys-typescale-emphasized-display-large{font-family:var(--md-sys-typescale-emphasized-display-large-font);font-size:var(--md-sys-typescale-emphasized-display-large-size);line-height:var(--md-sys-typescale-emphasized-display-large-line-height);font-weight:var(--md-sys-typescale-emphasized-display-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-display-large-tracking)}.md-sys-typescale-emphasized-display-medium{font-family:var(--md-sys-typescale-emphasized-display-medium-font);font-size:var(--md-sys-typescale-emphasized-display-medium-size);line-height:var(--md-sys-typescale-emphasized-display-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-display-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-display-medium-tracking)}.md-sys-typescale-emphasized-display-small{font-family:var(--md-sys-typescale-emphasized-display-small-font);font-size:var(--md-sys-typescale-emphasized-display-small-size);line-height:var(--md-sys-typescale-emphasized-display-small-line-height);font-weight:var(--md-sys-typescale-emphasized-display-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-display-small-tracking)}.md-sys-typescale-emphasized-headline-large{font-family:var(--md-sys-typescale-emphasized-headline-large-font);font-size:var(--md-sys-typescale-emphasized-headline-large-size);line-height:var(--md-sys-typescale-emphasized-headline-large-line-height);font-weight:var(--md-sys-typescale-emphasized-headline-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-headline-large-tracking)}.md-sys-typescale-emphasized-headline-medium{font-family:var(--md-sys-typescale-emphasized-headline-medium-font);font-size:var(--md-sys-typescale-emphasized-headline-medium-size);line-height:var(--md-sys-typescale-emphasized-headline-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-headline-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-headline-medium-tracking)}.md-sys-typescale-emphasized-headline-small{font-family:var(--md-sys-typescale-emphasized-headline-small-font);font-size:var(--md-sys-typescale-emphasized-headline-small-size);line-height:var(--md-sys-typescale-emphasized-headline-small-line-height);font-weight:var(--md-sys-typescale-emphasized-headline-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-headline-small-tracking)}.md-sys-typescale-emphasized-title-large{font-family:var(--md-sys-typescale-emphasized-title-large-font);font-size:var(--md-sys-typescale-emphasized-title-large-size);line-height:var(--md-sys-typescale-emphasized-title-large-line-height);font-weight:var(--md-sys-typescale-emphasized-title-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-title-large-tracking)}.md-sys-typescale-emphasized-title-medium{font-family:var(--md-sys-typescale-emphasized-title-medium-font);font-size:var(--md-sys-typescale-emphasized-title-medium-size);line-height:var(--md-sys-typescale-emphasized-title-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-title-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-title-medium-tracking)}.md-sys-typescale-emphasized-title-small{font-family:var(--md-sys-typescale-emphasized-title-small-font);font-size:var(--md-sys-typescale-emphasized-title-small-size);line-height:var(--md-sys-typescale-emphasized-title-small-line-height);font-weight:var(--md-sys-typescale-emphasized-title-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-title-small-tracking)}.md-sys-typescale-emphasized-body-large{font-family:var(--md-sys-typescale-emphasized-body-large-font);font-size:var(--md-sys-typescale-emphasized-body-large-size);line-height:var(--md-sys-typescale-emphasized-body-large-line-height);font-weight:var(--md-sys-typescale-emphasized-body-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-body-large-tracking)}.md-sys-typescale-emphasized-body-medium{font-family:var(--md-sys-typescale-emphasized-body-medium-font);font-size:var(--md-sys-typescale-emphasized-body-medium-size);line-height:var(--md-sys-typescale-emphasized-body-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-body-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-body-medium-tracking)}.md-sys-typescale-emphasized-body-small{font-family:var(--md-sys-typescale-emphasized-body-small-font);font-size:var(--md-sys-typescale-emphasized-body-small-size);line-height:var(--md-sys-typescale-emphasized-body-small-line-height);font-weight:var(--md-sys-typescale-emphasized-body-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-body-small-tracking)}.md-sys-typescale-emphasized-label-large{font-family:var(--md-sys-typescale-emphasized-label-large-font);font-size:var(--md-sys-typescale-emphasized-label-large-size);line-height:var(--md-sys-typescale-emphasized-label-large-line-height);font-weight:var(--md-sys-typescale-emphasized-label-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-label-large-tracking)}.md-sys-typescale-emphasized-label-medium{font-family:var(--md-sys-typescale-emphasized-label-medium-font);font-size:var(--md-sys-typescale-emphasized-label-medium-size);line-height:var(--md-sys-typescale-emphasized-label-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-label-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-label-medium-tracking)}.md-sys-typescale-emphasized-label-small{font-family:var(--md-sys-typescale-emphasized-label-small-font);font-size:var(--md-sys-typescale-emphasized-label-small-size);line-height:var(--md-sys-typescale-emphasized-label-small-line-height);font-weight:var(--md-sys-typescale-emphasized-label-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-label-small-tracking)}dialog.micl-sidesheet{--md-sys-sidesheet-width: 256px;--md-sys-sidesheet-maxwidth: 400px;--md-sys-sidesheet-spring-buffer: 200px;--md-sys-sidesheet-padding-standard: 24px;--md-sys-sidesheet-padding-modal: 16px;--md-sys-sidesheet-motion-spatial: cubic-bezier(0.39, 1.29, 0.35, 0.98);--md-sys-sidesheet-motion-duration: 650ms;--md-sys-sidesheet-motion-duration-reverse: 500ms;box-sizing:border-box;display:none;flex-direction:column;justify-content:space-between;min-width:calc(var(--md-sys-sidesheet-width) + var(--md-sys-sidesheet-spring-buffer));max-width:calc(var(--md-sys-sidesheet-maxwidth) + var(--md-sys-sidesheet-spring-buffer));height:100%;min-height:100%;margin-top:0;margin-bottom:0;margin-inline-start:auto;margin-inline-end:calc(-1*(var(--md-sys-sidesheet-maxwidth) + var(--md-sys-sidesheet-spring-buffer)));padding-top:10px;padding-bottom:var(--md-sys-sidesheet-padding-standard);padding-inline-start:0;padding-inline-end:var(--md-sys-sidesheet-spring-buffer);background-color:var(--md-sys-color-surface);border:none;box-shadow:var(--md-sys-elevation-level0);opacity:0;overflow:hidden;transition:opacity var(--md-sys-sidesheet-motion-duration-reverse) linear,margin-inline-end var(--md-sys-sidesheet-motion-duration-reverse) var(--md-sys-sidesheet-motion-spatial),overlay var(--md-sys-sidesheet-motion-duration-reverse) linear allow-discrete,display var(--md-sys-sidesheet-motion-duration-reverse) linear allow-discrete}dialog.micl-sidesheet .micl-sidesheet__headline{display:flex;align-items:center;padding-inline-start:24px;padding-inline-end:12px;column-gap:8px;color:var(--md-sys-color-on-surface-variant)}dialog.micl-sidesheet .micl-sidesheet__headline h1,dialog.micl-sidesheet .micl-sidesheet__headline h2,dialog.micl-sidesheet .micl-sidesheet__headline h3,dialog.micl-sidesheet .micl-sidesheet__headline h4,dialog.micl-sidesheet .micl-sidesheet__headline h5,dialog.micl-sidesheet .micl-sidesheet__headline h6,dialog.micl-sidesheet .micl-sidesheet__headline .micl-heading{font-family:var(--md-sys-typescale-title-large-font);font-size:var(--md-sys-typescale-title-large-size);line-height:var(--md-sys-typescale-title-large-line-height);font-weight:var(--md-sys-typescale-title-large-weight);letter-spacing:var(--md-sys-typescale-title-large-tracking);flex:1 2 fit-content;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:none}dialog.micl-sidesheet .micl-sidesheet__content{box-sizing:border-box;flex:1 1 auto;width:100%;max-width:100%;padding-inline-start:var(--md-sys-sidesheet-padding-standard);padding-inline-end:var(--md-sys-sidesheet-padding-standard);overflow:hidden auto}dialog.micl-sidesheet .micl-sidesheet__actions{box-sizing:border-box;display:flex;align-items:center;justify-content:start;width:100%;max-width:100%;height:calc(72px - var(--md-sys-sidesheet-padding-standard));margin:auto 0 0 0;padding-top:16px;overflow:hidden;border-top:var(--md-sys-divider-thickness) solid var(--md-sys-divider-color)}dialog.micl-sidesheet .micl-sidesheet__actions button:active,dialog.micl-sidesheet .micl-sidesheet__actions button:focus-visible,dialog.micl-sidesheet .micl-sidesheet__actions button:hover{color:var(--md-sys-color-primary)}dialog.micl-sidesheet::backdrop{background-color:rgba(0,0,0,0);transition:background-color var(--md-sys-sidesheet-motion-duration) linear,overlay var(--md-sys-sidesheet-motion-duration) linear allow-discrete,display var(--md-sys-sidesheet-motion-duration) linear allow-discrete}dialog.micl-sidesheet[open]{background-color:var(--md-sys-color-surface-container-low);border-start-start-radius:var(--md-sys-shape-corner-large);border-end-start-radius:var(--md-sys-shape-corner-large);box-shadow:var(--md-sys-elevation-level1)}dialog.micl-sidesheet[open] .micl-sidesheet__headline{padding-inline-start:4px}dialog.micl-sidesheet:popover-open{border-inline-start:var(--md-sys-divider-thickness) solid var(--md-sys-divider-color)}dialog.micl-sidesheet:popover-open,dialog.micl-sidesheet[open]{display:flex;margin-inline-end:calc(-1*var(--md-sys-sidesheet-spring-buffer));opacity:1;transition:opacity var(--md-sys-sidesheet-motion-duration) linear,margin-inline-end var(--md-sys-sidesheet-motion-duration) var(--md-sys-sidesheet-motion-spatial),overlay var(--md-sys-sidesheet-motion-duration) linear allow-discrete,display var(--md-sys-sidesheet-motion-duration) linear allow-discrete}@starting-style{dialog.micl-sidesheet:popover-open,dialog.micl-sidesheet[open]{margin-inline-end:calc(-1*(var(--md-sys-sidesheet-maxwidth) + var(--md-sys-sidesheet-spring-buffer)));opacity:0}}dialog.micl-sidesheet[open]::backdrop{background-color:rgba(0,0,0,.2)}@starting-style{dialog.micl-sidesheet[open]::backdrop{background-color:rgba(0,0,0,0)}}body:has(dialog.micl-sidesheet[popover]){box-sizing:border-box;max-width:100%;margin:0;transition:max-width var(--md-sys-sidesheet-motion-duration-reverse)}body:has(dialog.micl-sidesheet:popover-open){max-width:calc(100vw - 400px);transition:max-width var(--md-sys-sidesheet-motion-duration) var(--md-sys-sidesheet-motion-spatial)}
|
|
1
|
+
:root{--md-sys-elevation-level0: rgba(0, 0, 0, 0.2) 0px 0px 0px 0px, rgba(0, 0, 0, 0.14) 0px 0px 0px 0px, rgba(0, 0, 0, 0.12) 0px 0px 0px 0px;--md-sys-elevation-level1: rgba(0, 0, 0, 0.2) 0px 2px 1px -1px, rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 1px 3px 0px;--md-sys-elevation-level2: rgba(0, 0, 0, 0.2) 0px 3px 3px -2px, rgba(0, 0, 0, 0.14) 0px 3px 4px 0px, rgba(0, 0, 0, 0.12) 0px 1px 8px 0px;--md-sys-elevation-level3: rgba(0, 0, 0, 0.2) 0px 3px 5px -1px, rgba(0, 0, 0, 0.14) 0px 6px 10px 0px, rgba(0, 0, 0, 0.12) 0px 1px 18px 0px;--md-sys-elevation-level4: rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px;--md-sys-elevation-level5: rgba(0, 0, 0, 0.2) 0px 7px 8px -4px, rgba(0, 0, 0, 0.14) 0px 12px 17px 2px, rgba(0, 0, 0, 0.12) 0px 5px 22px 4px}:root{--md-sys-motion-duration-short1: 50ms;--md-sys-motion-duration-short2: 100ms;--md-sys-motion-duration-short3: 150ms;--md-sys-motion-duration-short4: 200ms;--md-sys-motion-duration-medium1: 250ms;--md-sys-motion-duration-medium2: 300ms;--md-sys-motion-duration-medium3: 350ms;--md-sys-motion-duration-medium4: 400ms;--md-sys-motion-duration-long1: 450ms;--md-sys-motion-duration-long2: 500ms;--md-sys-motion-duration-long3: 550ms;--md-sys-motion-duration-long4: 600ms;--md-sys-motion-duration-extra-long1: 700ms;--md-sys-motion-duration-extra-long2: 800ms;--md-sys-motion-duration-extra-long3: 900ms;--md-sys-motion-duration-extra-long4: 1000ms}:root{--md-sys-target-size: 48px;--md-sys-shape-corner-none: 0px;--md-sys-shape-corner-extra-small: 4px;--md-sys-shape-corner-small: 8px;--md-sys-shape-corner-medium: 12px;--md-sys-shape-corner-large: 16px;--md-sys-shape-corner-large-increased: 20px;--md-sys-shape-corner-extra-large: 28px;--md-sys-shape-corner-extra-large-increased: 32px;--md-sys-shape-corner-extra-extra-large: 48px;--md-sys-shape-corner-full: 50%}:root{--md-ref-typeface-plain: Roboto, system-ui, sans-serif;--md-ref-typeface-brand: Roboto, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700;--md-sys-typescale-display-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-large-size: 3.5625rem;--md-sys-typescale-display-large-line-height: 4rem;--md-sys-typescale-display-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-large-tracking: -0.015625rem;--md-sys-typescale-display-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-medium-size: 2.8125rem;--md-sys-typescale-display-medium-line-height: 3.25rem;--md-sys-typescale-display-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-medium-tracking: 0;--md-sys-typescale-display-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-small-size: 2.25rem;--md-sys-typescale-display-small-line-height: 2.75rem;--md-sys-typescale-display-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-small-tracking: 0;--md-sys-typescale-headline-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-large-size: 2rem;--md-sys-typescale-headline-large-line-height: 2.5rem;--md-sys-typescale-headline-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-large-tracking: 0;--md-sys-typescale-headline-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-medium-size: 1.75rem;--md-sys-typescale-headline-medium-line-height: 2.25rem;--md-sys-typescale-headline-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-medium-tracking: 0;--md-sys-typescale-headline-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-small-size: 1.5rem;--md-sys-typescale-headline-small-line-height: 2rem;--md-sys-typescale-headline-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-small-tracking: 0;--md-sys-typescale-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-title-large-size: 1.375rem;--md-sys-typescale-title-large-line-height: 1.75rem;--md-sys-typescale-title-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-title-large-tracking: 0;--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0,009375rem;--md-sys-typescale-title-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-small-size: 0.875rem;--md-sys-typescale-title-small-line-height: 1.25rem;--md-sys-typescale-title-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-small-tracking: 0.00625rem;--md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-large-size: 1rem;--md-sys-typescale-body-large-line-height: 1.5rem;--md-sys-typescale-body-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-large-tracking: 0.03125rem;--md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-medium-size: 0.875rem;--md-sys-typescale-body-medium-line-height: 1.25rem;--md-sys-typescale-body-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-medium-tracking: 0.015625rem;--md-sys-typescale-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-small-size: 0.75rem;--md-sys-typescale-body-small-line-height: 1rem;--md-sys-typescale-body-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-small-tracking: 0.025rem;--md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-large-size: 0.875rem;--md-sys-typescale-label-large-line-height: 1.25rem;--md-sys-typescale-label-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-large-tracking: 0.00625rem;--md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-medium-size: 0.75rem;--md-sys-typescale-label-medium-line-height: 1rem;--md-sys-typescale-label-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-medium-tracking: 0.03125rem;--md-sys-typescale-label-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-small-size: 0.6875rem;--md-sys-typescale-label-small-line-height: 1rem;--md-sys-typescale-label-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-small-tracking: 0.03125rem;--md-sys-typescale-emphasized-display-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-display-large-size: 3.5625rem;--md-sys-typescale-emphasized-display-large-line-height: 4rem;--md-sys-typescale-emphasized-display-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-display-large-tracking: -0.015625rem;--md-sys-typescale-emphasized-display-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-display-medium-size: 2.8125rem;--md-sys-typescale-emphasized-display-medium-line-height: 3.25rem;--md-sys-typescale-emphasized-display-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-display-medium-tracking: 0;--md-sys-typescale-emphasized-display-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-display-small-size: 2.25rem;--md-sys-typescale-emphasized-display-small-line-height: 2.75rem;--md-sys-typescale-emphasized-display-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-display-small-tracking: 0;--md-sys-typescale-emphasized-headline-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-headline-large-size: 2rem;--md-sys-typescale-emphasized-headline-large-line-height: 2.5rem;--md-sys-typescale-emphasized-headline-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-headline-large-tracking: 0;--md-sys-typescale-emphasized-headline-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-headline-medium-size: 1.75rem;--md-sys-typescale-emphasized-headline-medium-line-height: 2.25rem;--md-sys-typescale-emphasized-headline-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-headline-medium-tracking: 0;--md-sys-typescale-emphasized-headline-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-headline-small-size: 1.5rem;--md-sys-typescale-emphasized-headline-small-line-height: 2rem;--md-sys-typescale-emphasized-headline-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-headline-small-tracking: 0;--md-sys-typescale-emphasized-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-emphasized-title-large-size: 1.375rem;--md-sys-typescale-emphasized-title-large-line-height: 1.75rem;--md-sys-typescale-emphasized-title-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-title-large-tracking: 0;--md-sys-typescale-emphasized-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-title-medium-size: 1rem;--md-sys-typescale-emphasized-title-medium-line-height: 1.5rem;--md-sys-typescale-emphasized-title-medium-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-title-medium-tracking: 0,009375rem;--md-sys-typescale-emphasized-title-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-title-small-size: 0.875rem;--md-sys-typescale-emphasized-title-small-line-height: 1.25rem;--md-sys-typescale-emphasized-title-small-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-title-small-tracking: 0.00625rem;--md-sys-typescale-emphasized-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-body-large-size: 1rem;--md-sys-typescale-emphasized-body-large-line-height: 1.5rem;--md-sys-typescale-emphasized-body-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-body-large-tracking: 0.03125rem;--md-sys-typescale-emphasized-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-body-medium-size: 0.875rem;--md-sys-typescale-emphasized-body-medium-line-height: 1.25rem;--md-sys-typescale-emphasized-body-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-body-medium-tracking: 0.015625rem;--md-sys-typescale-emphasized-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-body-small-size: 0.75rem;--md-sys-typescale-emphasized-body-small-line-height: 1rem;--md-sys-typescale-emphasized-body-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-emphasized-body-small-tracking: 0.025rem;--md-sys-typescale-emphasized-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-label-large-size: 0.875rem;--md-sys-typescale-emphasized-label-large-line-height: 1.25rem;--md-sys-typescale-emphasized-label-large-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-label-large-tracking: 0.00625rem;--md-sys-typescale-emphasized-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-label-medium-size: 0.75rem;--md-sys-typescale-emphasized-label-medium-line-height: 1rem;--md-sys-typescale-emphasized-label-medium-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-label-medium-tracking: 0.03125rem;--md-sys-typescale-emphasized-label-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-emphasized-label-small-size: 0.6875rem;--md-sys-typescale-emphasized-label-small-line-height: 1rem;--md-sys-typescale-emphasized-label-small-weight: var(--md-ref-typeface-weight-bold);--md-sys-typescale-emphasized-label-small-tracking: 0.03125rem}.md-sys-typescale-display-large{font-family:var(--md-sys-typescale-display-large-font);font-size:var(--md-sys-typescale-display-large-size);line-height:var(--md-sys-typescale-display-large-line-height);font-weight:var(--md-sys-typescale-display-large-weight);letter-spacing:var(--md-sys-typescale-display-large-tracking)}.md-sys-typescale-display-medium{font-family:var(--md-sys-typescale-display-medium-font);font-size:var(--md-sys-typescale-display-medium-size);line-height:var(--md-sys-typescale-display-medium-line-height);font-weight:var(--md-sys-typescale-display-medium-weight);letter-spacing:var(--md-sys-typescale-display-medium-tracking)}.md-sys-typescale-display-small{font-family:var(--md-sys-typescale-display-small-font);font-size:var(--md-sys-typescale-display-small-size);line-height:var(--md-sys-typescale-display-small-line-height);font-weight:var(--md-sys-typescale-display-small-weight);letter-spacing:var(--md-sys-typescale-display-small-tracking)}.md-sys-typescale-headline-large{font-family:var(--md-sys-typescale-headline-large-font);font-size:var(--md-sys-typescale-headline-large-size);line-height:var(--md-sys-typescale-headline-large-line-height);font-weight:var(--md-sys-typescale-headline-large-weight);letter-spacing:var(--md-sys-typescale-headline-large-tracking)}.md-sys-typescale-headline-medium{font-family:var(--md-sys-typescale-headline-medium-font);font-size:var(--md-sys-typescale-headline-medium-size);line-height:var(--md-sys-typescale-headline-medium-line-height);font-weight:var(--md-sys-typescale-headline-medium-weight);letter-spacing:var(--md-sys-typescale-headline-medium-tracking)}.md-sys-typescale-headline-small{font-family:var(--md-sys-typescale-headline-small-font);font-size:var(--md-sys-typescale-headline-small-size);line-height:var(--md-sys-typescale-headline-small-line-height);font-weight:var(--md-sys-typescale-headline-small-weight);letter-spacing:var(--md-sys-typescale-headline-small-tracking)}.md-sys-typescale-title-large{font-family:var(--md-sys-typescale-title-large-font);font-size:var(--md-sys-typescale-title-large-size);line-height:var(--md-sys-typescale-title-large-line-height);font-weight:var(--md-sys-typescale-title-large-weight);letter-spacing:var(--md-sys-typescale-title-large-tracking)}.md-sys-typescale-title-medium{font-family:var(--md-sys-typescale-title-medium-font);font-size:var(--md-sys-typescale-title-medium-size);line-height:var(--md-sys-typescale-title-medium-line-height);font-weight:var(--md-sys-typescale-title-medium-weight);letter-spacing:var(--md-sys-typescale-title-medium-tracking)}.md-sys-typescale-title-small{font-family:var(--md-sys-typescale-title-small-font);font-size:var(--md-sys-typescale-title-small-size);line-height:var(--md-sys-typescale-title-small-line-height);font-weight:var(--md-sys-typescale-title-small-weight);letter-spacing:var(--md-sys-typescale-title-small-tracking)}.md-sys-typescale-body-large{font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking)}.md-sys-typescale-body-medium{font-family:var(--md-sys-typescale-body-medium-font);font-size:var(--md-sys-typescale-body-medium-size);line-height:var(--md-sys-typescale-body-medium-line-height);font-weight:var(--md-sys-typescale-body-medium-weight);letter-spacing:var(--md-sys-typescale-body-medium-tracking)}.md-sys-typescale-body-small{font-family:var(--md-sys-typescale-body-small-font);font-size:var(--md-sys-typescale-body-small-size);line-height:var(--md-sys-typescale-body-small-line-height);font-weight:var(--md-sys-typescale-body-small-weight);letter-spacing:var(--md-sys-typescale-body-small-tracking)}.md-sys-typescale-label-large{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking)}.md-sys-typescale-label-medium{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking)}.md-sys-typescale-label-small{font-family:var(--md-sys-typescale-label-small-font);font-size:var(--md-sys-typescale-label-small-size);line-height:var(--md-sys-typescale-label-small-line-height);font-weight:var(--md-sys-typescale-label-small-weight);letter-spacing:var(--md-sys-typescale-label-small-tracking)}.md-sys-typescale-emphasized-display-large{font-family:var(--md-sys-typescale-emphasized-display-large-font);font-size:var(--md-sys-typescale-emphasized-display-large-size);line-height:var(--md-sys-typescale-emphasized-display-large-line-height);font-weight:var(--md-sys-typescale-emphasized-display-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-display-large-tracking)}.md-sys-typescale-emphasized-display-medium{font-family:var(--md-sys-typescale-emphasized-display-medium-font);font-size:var(--md-sys-typescale-emphasized-display-medium-size);line-height:var(--md-sys-typescale-emphasized-display-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-display-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-display-medium-tracking)}.md-sys-typescale-emphasized-display-small{font-family:var(--md-sys-typescale-emphasized-display-small-font);font-size:var(--md-sys-typescale-emphasized-display-small-size);line-height:var(--md-sys-typescale-emphasized-display-small-line-height);font-weight:var(--md-sys-typescale-emphasized-display-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-display-small-tracking)}.md-sys-typescale-emphasized-headline-large{font-family:var(--md-sys-typescale-emphasized-headline-large-font);font-size:var(--md-sys-typescale-emphasized-headline-large-size);line-height:var(--md-sys-typescale-emphasized-headline-large-line-height);font-weight:var(--md-sys-typescale-emphasized-headline-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-headline-large-tracking)}.md-sys-typescale-emphasized-headline-medium{font-family:var(--md-sys-typescale-emphasized-headline-medium-font);font-size:var(--md-sys-typescale-emphasized-headline-medium-size);line-height:var(--md-sys-typescale-emphasized-headline-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-headline-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-headline-medium-tracking)}.md-sys-typescale-emphasized-headline-small{font-family:var(--md-sys-typescale-emphasized-headline-small-font);font-size:var(--md-sys-typescale-emphasized-headline-small-size);line-height:var(--md-sys-typescale-emphasized-headline-small-line-height);font-weight:var(--md-sys-typescale-emphasized-headline-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-headline-small-tracking)}.md-sys-typescale-emphasized-title-large{font-family:var(--md-sys-typescale-emphasized-title-large-font);font-size:var(--md-sys-typescale-emphasized-title-large-size);line-height:var(--md-sys-typescale-emphasized-title-large-line-height);font-weight:var(--md-sys-typescale-emphasized-title-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-title-large-tracking)}.md-sys-typescale-emphasized-title-medium{font-family:var(--md-sys-typescale-emphasized-title-medium-font);font-size:var(--md-sys-typescale-emphasized-title-medium-size);line-height:var(--md-sys-typescale-emphasized-title-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-title-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-title-medium-tracking)}.md-sys-typescale-emphasized-title-small{font-family:var(--md-sys-typescale-emphasized-title-small-font);font-size:var(--md-sys-typescale-emphasized-title-small-size);line-height:var(--md-sys-typescale-emphasized-title-small-line-height);font-weight:var(--md-sys-typescale-emphasized-title-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-title-small-tracking)}.md-sys-typescale-emphasized-body-large{font-family:var(--md-sys-typescale-emphasized-body-large-font);font-size:var(--md-sys-typescale-emphasized-body-large-size);line-height:var(--md-sys-typescale-emphasized-body-large-line-height);font-weight:var(--md-sys-typescale-emphasized-body-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-body-large-tracking)}.md-sys-typescale-emphasized-body-medium{font-family:var(--md-sys-typescale-emphasized-body-medium-font);font-size:var(--md-sys-typescale-emphasized-body-medium-size);line-height:var(--md-sys-typescale-emphasized-body-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-body-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-body-medium-tracking)}.md-sys-typescale-emphasized-body-small{font-family:var(--md-sys-typescale-emphasized-body-small-font);font-size:var(--md-sys-typescale-emphasized-body-small-size);line-height:var(--md-sys-typescale-emphasized-body-small-line-height);font-weight:var(--md-sys-typescale-emphasized-body-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-body-small-tracking)}.md-sys-typescale-emphasized-label-large{font-family:var(--md-sys-typescale-emphasized-label-large-font);font-size:var(--md-sys-typescale-emphasized-label-large-size);line-height:var(--md-sys-typescale-emphasized-label-large-line-height);font-weight:var(--md-sys-typescale-emphasized-label-large-weight);letter-spacing:var(--md-sys-typescale-emphasized-label-large-tracking)}.md-sys-typescale-emphasized-label-medium{font-family:var(--md-sys-typescale-emphasized-label-medium-font);font-size:var(--md-sys-typescale-emphasized-label-medium-size);line-height:var(--md-sys-typescale-emphasized-label-medium-line-height);font-weight:var(--md-sys-typescale-emphasized-label-medium-weight);letter-spacing:var(--md-sys-typescale-emphasized-label-medium-tracking)}.md-sys-typescale-emphasized-label-small{font-family:var(--md-sys-typescale-emphasized-label-small-font);font-size:var(--md-sys-typescale-emphasized-label-small-size);line-height:var(--md-sys-typescale-emphasized-label-small-line-height);font-weight:var(--md-sys-typescale-emphasized-label-small-weight);letter-spacing:var(--md-sys-typescale-emphasized-label-small-tracking)}:root{--md-sys-sidesheet-width: 256px;--md-sys-sidesheet-maxwidth: 400px;--md-sys-sidesheet-spring-buffer: 200px;--md-sys-sidesheet-padding-standard: 24px;--md-sys-sidesheet-motion-spatial: cubic-bezier(0.39, 1.29, 0.35, 0.98);--md-sys-sidesheet-motion-duration: 650ms;--md-sys-sidesheet-motion-duration-reverse: 500ms}dialog.micl-sidesheet{box-sizing:border-box;display:none;flex-direction:column;justify-content:space-between;min-inline-size:calc(var(--md-sys-sidesheet-width) + var(--md-sys-sidesheet-spring-buffer));max-inline-size:calc(var(--md-sys-sidesheet-maxwidth) + var(--md-sys-sidesheet-spring-buffer));block-size:100vh;max-block-size:100%;min-block-size:100%;margin-block:0;margin-inline-start:auto;margin-inline-end:calc(-1*(var(--md-sys-sidesheet-maxwidth) + var(--md-sys-sidesheet-spring-buffer)));padding-block:14px 0;padding-inline:0 var(--md-sys-sidesheet-spring-buffer);background-color:var(--md-sys-color-surface);border:none;border-radius:var(--md-sys-shape-corner-none);box-shadow:var(--md-sys-elevation-level0);opacity:0;overflow:hidden;transition:opacity var(--md-sys-sidesheet-motion-duration-reverse) linear,margin-inline-end var(--md-sys-sidesheet-motion-duration-reverse) var(--md-sys-sidesheet-motion-spatial),overlay var(--md-sys-sidesheet-motion-duration-reverse) linear allow-discrete,display var(--md-sys-sidesheet-motion-duration-reverse) linear allow-discrete}dialog.micl-sidesheet .micl-sidesheet__headline{display:flex;align-items:center;padding-inline:var(--md-sys-sidesheet-padding-standard);column-gap:12px;color:var(--md-sys-color-on-surface-variant)}dialog.micl-sidesheet .micl-sidesheet__headline h1,dialog.micl-sidesheet .micl-sidesheet__headline h2,dialog.micl-sidesheet .micl-sidesheet__headline h3,dialog.micl-sidesheet .micl-sidesheet__headline h4,dialog.micl-sidesheet .micl-sidesheet__headline h5,dialog.micl-sidesheet .micl-sidesheet__headline h6,dialog.micl-sidesheet .micl-sidesheet__headline .micl-heading{font-family:var(--md-sys-typescale-title-large-font);font-size:var(--md-sys-typescale-title-large-size);line-height:var(--md-sys-typescale-title-large-line-height);font-weight:var(--md-sys-typescale-title-large-weight);letter-spacing:var(--md-sys-typescale-title-large-tracking);flex:1 2 fit-content;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:none}dialog.micl-sidesheet .micl-sidesheet__headline button{margin-inline:-12px}dialog.micl-sidesheet .micl-sidesheet__headline button:first-child{margin-inline-start:-20px}dialog.micl-sidesheet .micl-sidesheet__content{box-sizing:border-box;flex:1 1 auto;inline-size:100%;max-inline-size:100%;padding-inline:var(--md-sys-sidesheet-padding-standard);overflow:hidden auto}dialog.micl-sidesheet .micl-sidesheet__actions{box-sizing:border-box;display:flex;flex-shrink:0;align-items:center;justify-content:start;inline-size:100%;max-inline-size:100%;padding-block:16px 24px;padding-inline:var(--md-sys-sidesheet-padding-standard);overflow:hidden;border-block-start:var(--md-sys-divider-thickness) solid var(--md-sys-divider-color)}dialog.micl-sidesheet[open]{background-color:var(--md-sys-color-surface-container-low);border-start-start-radius:var(--md-sys-shape-corner-large);border-end-start-radius:var(--md-sys-shape-corner-large);box-shadow:var(--md-sys-elevation-level1)}dialog.micl-sidesheet:popover-open{--md-sys-divider-color: var(--md-sys-color-outline);border-inline-start:var(--md-sys-divider-thickness) solid var(--md-sys-divider-color)}dialog.micl-sidesheet:popover-open,dialog.micl-sidesheet[open]{display:flex;margin-inline-end:calc(-1*var(--md-sys-sidesheet-spring-buffer));opacity:100%;transition:opacity var(--md-sys-sidesheet-motion-duration) linear,margin-inline-end var(--md-sys-sidesheet-motion-duration) var(--md-sys-sidesheet-motion-spatial),overlay var(--md-sys-sidesheet-motion-duration) linear allow-discrete,display var(--md-sys-sidesheet-motion-duration) linear allow-discrete}@starting-style{dialog.micl-sidesheet:popover-open,dialog.micl-sidesheet[open]{margin-inline-end:calc(-1*(var(--md-sys-sidesheet-maxwidth) + var(--md-sys-sidesheet-spring-buffer)));opacity:0}}dialog.micl-sidesheet::backdrop{background-color:rgba(0,0,0,0);transition:background-color var(--md-sys-sidesheet-motion-duration) linear,overlay var(--md-sys-sidesheet-motion-duration) linear allow-discrete,display var(--md-sys-sidesheet-motion-duration) linear allow-discrete}dialog.micl-sidesheet[open]::backdrop{background-color:rgba(0,0,0,.2)}@starting-style{dialog.micl-sidesheet[open]::backdrop{background-color:rgba(0,0,0,0)}}body:has(dialog.micl-sidesheet[popover]){box-sizing:border-box;max-inline-size:100%;margin:0;transition:max-inline-size var(--md-sys-sidesheet-motion-duration-reverse)}body:has(dialog.micl-sidesheet:popover-open){max-inline-size:calc(100vw - var(--md-sys-sidesheet-maxwidth));transition:max-inline-size var(--md-sys-sidesheet-motion-duration) var(--md-sys-sidesheet-motion-spatial)}
|
package/docs/bottomsheet.html
CHANGED
|
@@ -3,9 +3,10 @@
|
|
|
3
3
|
<head>
|
|
4
4
|
<meta charset="UTF-8">
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<meta name="description" content="Demonstrating MICL Bottom Sheets">
|
|
6
7
|
<title>MICL Bottom Sheets</title>
|
|
7
8
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap">
|
|
8
|
-
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:FILL@0..1&icon_names=dark_mode,edit,link,share&display=block">
|
|
9
|
+
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:FILL@0..1&icon_names=close,dark_mode,edit,link,pause,share,skip_next&display=block">
|
|
9
10
|
<link rel="stylesheet" href="themes/airblue/theme.css" id="theme-link">
|
|
10
11
|
<link rel="stylesheet" href="micl.css">
|
|
11
12
|
<link rel="stylesheet" href="docs.css">
|
|
@@ -36,6 +37,24 @@
|
|
|
36
37
|
border-radius: 50%;
|
|
37
38
|
object-fit: cover;
|
|
38
39
|
}
|
|
40
|
+
.player {
|
|
41
|
+
display: flex;
|
|
42
|
+
align-items: center;
|
|
43
|
+
column-gap: 16px;
|
|
44
|
+
padding-block-start: 24px;
|
|
45
|
+
}
|
|
46
|
+
.cover {
|
|
47
|
+
border-radius: 0;
|
|
48
|
+
}
|
|
49
|
+
.actions {
|
|
50
|
+
display: flex;
|
|
51
|
+
column-gap: 16px;
|
|
52
|
+
}
|
|
53
|
+
p {
|
|
54
|
+
display: flex;
|
|
55
|
+
flex: 1 1 100%;
|
|
56
|
+
flex-direction: column;
|
|
57
|
+
}
|
|
39
58
|
.micl-list {
|
|
40
59
|
--md-sys-list-item-container-color: var(--md-sys-color-surface-container-low);
|
|
41
60
|
}
|
|
@@ -48,9 +67,9 @@
|
|
|
48
67
|
</div>
|
|
49
68
|
|
|
50
69
|
<div class="cards">
|
|
51
|
-
<div class="micl-card-filled">
|
|
70
|
+
<div class="micl-card-filled" style="height:400px">
|
|
52
71
|
<div class="micl-card__content">
|
|
53
|
-
<dialog id="mybottomsheet1" class="micl-bottomsheet"
|
|
72
|
+
<dialog id="mybottomsheet1" class="micl-bottomsheet" popover>
|
|
54
73
|
<div class="micl-bottomsheet__content">
|
|
55
74
|
<h3 class="md-sys-typescale-title-large">Send</h3>
|
|
56
75
|
<div class="figures">
|
|
@@ -75,7 +94,24 @@
|
|
|
75
94
|
</dialog>
|
|
76
95
|
<button type="button" class="micl-button-filled-m" popovertarget="mybottomsheet1">Open Sheet</button>
|
|
77
96
|
|
|
78
|
-
<dialog id="mybottomsheet2" class="micl-bottomsheet"
|
|
97
|
+
<dialog id="mybottomsheet2" class="micl-bottomsheet" popover="manual">
|
|
98
|
+
<div class="micl-bottomsheet__content">
|
|
99
|
+
<div class="player">
|
|
100
|
+
<img alt="City Album" src="card-city.webp" class="cover">
|
|
101
|
+
<p>
|
|
102
|
+
<span class="md-sys-typescale-body-large">City Sleepers</span>
|
|
103
|
+
<span class="md-sys-typescale-body-small">Various artists</span>
|
|
104
|
+
</p>
|
|
105
|
+
<div class="actions">
|
|
106
|
+
<span class="material-symbols-outlined micl-list-item__icon">pause</span>
|
|
107
|
+
<span class="material-symbols-outlined micl-list-item__icon">skip_next</span>
|
|
108
|
+
</div>
|
|
109
|
+
</div>
|
|
110
|
+
</div>
|
|
111
|
+
</dialog>
|
|
112
|
+
<button type="button" class="micl-button-filled-m" popovertarget="mybottomsheet2">Open Co-Existing Sheet</button>
|
|
113
|
+
|
|
114
|
+
<dialog id="mybottomsheet3" class="micl-bottomsheet" popover data-miclsnapheights="0,400">
|
|
79
115
|
<div class="micl-bottomsheet__headline">
|
|
80
116
|
<button type="button" class="micl-bottomsheet__draghandle" aria-label="Drag handle"></button>
|
|
81
117
|
</div>
|
|
@@ -102,9 +138,9 @@
|
|
|
102
138
|
</ul>
|
|
103
139
|
</div>
|
|
104
140
|
</dialog>
|
|
105
|
-
<button type="button" class="micl-button-filled-m" popovertarget="
|
|
141
|
+
<button type="button" class="micl-button-filled-m" popovertarget="mybottomsheet3">Open Resizable Sheet</button>
|
|
106
142
|
|
|
107
|
-
<dialog id="
|
|
143
|
+
<dialog id="mybottomsheet4" class="micl-bottomsheet" closedby="any">
|
|
108
144
|
<div class="micl-bottomsheet__headline">
|
|
109
145
|
<button type="button" class="micl-bottomsheet__draghandle" aria-label="Drag handle"></button>
|
|
110
146
|
</div>
|
|
@@ -128,6 +164,9 @@
|
|
|
128
164
|
<span class="micl-list-item__headline">Edit name</span>
|
|
129
165
|
</span>
|
|
130
166
|
</li>
|
|
167
|
+
<li class="micl-list-item-one" tabindex="0">
|
|
168
|
+
<button type="button" class="micl-iconbutton-standard-m material-symbols-outlined" popovertarget="mybottomsheet4">close</button>
|
|
169
|
+
</li>
|
|
131
170
|
</ul>
|
|
132
171
|
<hr class="micl-divider">
|
|
133
172
|
<h3 class="md-sys-typescale-title-large">Send</h3>
|
|
@@ -151,9 +190,21 @@
|
|
|
151
190
|
</div>
|
|
152
191
|
</div>
|
|
153
192
|
</dialog>
|
|
154
|
-
<button type="button" class="micl-button-filled-m" popovertarget="
|
|
193
|
+
<button type="button" class="micl-button-filled-m" popovertarget="mybottomsheet4">Open Modal Sheet</button>
|
|
155
194
|
</div>
|
|
156
195
|
</div>
|
|
196
|
+
|
|
197
|
+
<div class="micl-card-filled" style="height:400px"></div>
|
|
198
|
+
<div class="micl-card-filled" style="height:400px"></div>
|
|
199
|
+
<div class="micl-card-filled" style="height:400px"></div>
|
|
200
|
+
<div class="micl-card-filled" style="height:400px"></div>
|
|
201
|
+
<div class="micl-card-filled" style="height:400px"></div>
|
|
202
|
+
<div class="micl-card-filled" style="height:400px"></div>
|
|
203
|
+
<div class="micl-card-filled" style="height:400px"></div>
|
|
204
|
+
<div class="micl-card-filled" style="height:400px"></div>
|
|
205
|
+
<div class="micl-card-filled" style="height:400px"></div>
|
|
206
|
+
<div class="micl-card-filled" style="height:400px"></div>
|
|
207
|
+
<div class="micl-card-filled" style="height:400px"></div>
|
|
157
208
|
</div>
|
|
158
209
|
|
|
159
210
|
<script src="micl.js"></script>
|