Modify CSS
Signed-off-by: Charles de Dreuille <charles.dedreuille@gmail.com>
This commit is contained in:
Charles de Dreuille
@@ -1 +1 @@
|
||||
.canon-Button{user-select:none;font-family:var(--canon-font-regular);font-weight:var(--canon-font-weight-bold);cursor:pointer;border-radius:var(--canon-radius-2);justify-content:center;align-items:center;gap:var(--canon-space-1_5);border:none;padding:0;display:inline-flex;&:disabled{cursor:not-allowed}}.canon-Button--variant-primary{background-color:var(--canon-bg-solid);color:var(--canon-fg-solid);transition:background-color .15s,box-shadow .15s;&:hover{background-color:var(--canon-bg-solid-hover)}&:active{background-color:var(--canon-bg-solid-pressed)}&:focus-visible{outline:2px solid var(--canon-ring);outline-offset:2px}&:disabled{background-color:var(--canon-bg-solid-disabled);color:var(--canon-fg-solid-disabled)}}.canon-Button--variant-secondary{background-color:var(--canon-bg-elevated);box-shadow:inset 0 0 0 1px var(--canon-border);color:var(--canon-fg-primary);transition:box-shadow .15s;&:hover{box-shadow:inset 0 0 0 1px var(--canon-border-hover)}&:active{box-shadow:inset 0 0 0 1px var(--canon-border-pressed)}&:focus-visible{box-shadow:inset 0 0 0 2px var(--canon-ring);outline:none;transition:none}&:disabled{box-shadow:inset 0 0 0 1px var(--canon-border-disabled);color:var(--canon-fg-disabled)}}.canon-Button--size-medium{font-size:var(--canon-font-size-4);padding:0 var(--canon-space-3);height:40px}.canon-Button--size-small{font-size:var(--canon-font-size-3);padding:0 var(--canon-space-2);height:32px}.canon-Button--size-small .canon-Button--icon{width:1rem;height:1rem}.canon-Button--size-medium .canon-Button--icon{width:1.5rem;height:1.5rem}
|
||||
.canon-Button{user-select:none;font-family:var(--canon-font-regular);font-weight:var(--canon-font-weight-bold);cursor:pointer;border-radius:var(--canon-radius-2);justify-content:center;align-items:center;gap:var(--canon-space-1_5);border:none;padding:0;display:inline-flex;&:disabled{cursor:not-allowed}}.canon-Button--variant-primary{background-color:var(--canon-bg-solid);color:var(--canon-fg-solid);transition:background-color .15s,box-shadow .15s;&:hover{background-color:var(--canon-bg-solid-hover)}&:active{background-color:var(--canon-bg-solid-pressed)}&:focus-visible{outline:2px solid var(--canon-ring);outline-offset:2px}&:disabled{background-color:var(--canon-bg-solid-disabled);color:var(--canon-fg-solid-disabled)}}.canon-Button--variant-secondary{background-color:var(--canon-bg-surface-1);box-shadow:inset 0 0 0 1px var(--canon-border);color:var(--canon-fg-primary);transition:box-shadow .15s;&:hover{box-shadow:inset 0 0 0 1px var(--canon-border-hover)}&:active{box-shadow:inset 0 0 0 1px var(--canon-border-pressed)}&:focus-visible{box-shadow:inset 0 0 0 2px var(--canon-ring);outline:none;transition:none}&:disabled{box-shadow:inset 0 0 0 1px var(--canon-border-disabled);color:var(--canon-fg-disabled)}}.canon-Button--size-medium{font-size:var(--canon-font-size-4);padding:0 var(--canon-space-3);height:40px}.canon-Button--size-small{font-size:var(--canon-font-size-3);padding:0 var(--canon-space-2);height:32px}.canon-Button--size-small .canon-Button--icon{width:1rem;height:1rem}.canon-Button--size-medium .canon-Button--icon{width:1.5rem;height:1.5rem}
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"sourceRoot":null,"mappings":"AAAA,iRAaE,+BAKF,mJAKE,qDAIA,wDAIA,uEAKA,iGAMF,mLAME,6DAIA,gEAIA,0FAMA,mGAMF,yGAMA,wGAMA,qEAKA","sources":["css/button.css"],"sourcesContent":[".canon-Button {\n user-select: none;\n font-family: var(--canon-font-regular);\n font-weight: var(--canon-font-weight-bold);\n cursor: pointer;\n border-radius: var(--canon-radius-2);\n justify-content: center;\n align-items: center;\n gap: var(--canon-space-1_5);\n border: none;\n padding: 0;\n display: inline-flex;\n\n &:disabled {\n cursor: not-allowed;\n }\n}\n\n.canon-Button--variant-primary {\n background-color: var(--canon-bg-solid);\n color: var(--canon-fg-solid);\n transition: background-color .15s, box-shadow .15s;\n\n &:hover {\n background-color: var(--canon-bg-solid-hover);\n }\n\n &:active {\n background-color: var(--canon-bg-solid-pressed);\n }\n\n &:focus-visible {\n outline: 2px solid var(--canon-ring);\n outline-offset: 2px;\n }\n\n &:disabled {\n background-color: var(--canon-bg-solid-disabled);\n color: var(--canon-fg-solid-disabled);\n }\n}\n\n.canon-Button--variant-secondary {\n background-color: var(--canon-bg-elevated);\n box-shadow: inset 0 0 0 1px var(--canon-border);\n color: var(--canon-fg-primary);\n transition: box-shadow .15s;\n\n &:hover {\n box-shadow: inset 0 0 0 1px var(--canon-border-hover);\n }\n\n &:active {\n box-shadow: inset 0 0 0 1px var(--canon-border-pressed);\n }\n\n &:focus-visible {\n box-shadow: inset 0 0 0 2px var(--canon-ring);\n outline: none;\n transition: none;\n }\n\n &:disabled {\n box-shadow: inset 0 0 0 1px var(--canon-border-disabled);\n color: var(--canon-fg-disabled);\n }\n}\n\n.canon-Button--size-medium {\n font-size: var(--canon-font-size-4);\n padding: 0 var(--canon-space-3);\n height: 40px;\n}\n\n.canon-Button--size-small {\n font-size: var(--canon-font-size-3);\n padding: 0 var(--canon-space-2);\n height: 32px;\n}\n\n.canon-Button--size-small .canon-Button--icon {\n width: 1rem;\n height: 1rem;\n}\n\n.canon-Button--size-medium .canon-Button--icon {\n width: 1.5rem;\n height: 1.5rem;\n}\n"],"names":[]}
|
||||
{"version":3,"sourceRoot":null,"mappings":"AAAA,iRAaE,+BAKF,mJAKE,qDAIA,wDAIA,uEAKA,iGAMF,oLAME,6DAIA,gEAIA,0FAMA,mGAMF,yGAMA,wGAMA,qEAKA","sources":["css/button.css"],"sourcesContent":[".canon-Button {\n user-select: none;\n font-family: var(--canon-font-regular);\n font-weight: var(--canon-font-weight-bold);\n cursor: pointer;\n border-radius: var(--canon-radius-2);\n justify-content: center;\n align-items: center;\n gap: var(--canon-space-1_5);\n border: none;\n padding: 0;\n display: inline-flex;\n\n &:disabled {\n cursor: not-allowed;\n }\n}\n\n.canon-Button--variant-primary {\n background-color: var(--canon-bg-solid);\n color: var(--canon-fg-solid);\n transition: background-color .15s, box-shadow .15s;\n\n &:hover {\n background-color: var(--canon-bg-solid-hover);\n }\n\n &:active {\n background-color: var(--canon-bg-solid-pressed);\n }\n\n &:focus-visible {\n outline: 2px solid var(--canon-ring);\n outline-offset: 2px;\n }\n\n &:disabled {\n background-color: var(--canon-bg-solid-disabled);\n color: var(--canon-fg-solid-disabled);\n }\n}\n\n.canon-Button--variant-secondary {\n background-color: var(--canon-bg-surface-1);\n box-shadow: inset 0 0 0 1px var(--canon-border);\n color: var(--canon-fg-primary);\n transition: box-shadow .15s;\n\n &:hover {\n box-shadow: inset 0 0 0 1px var(--canon-border-hover);\n }\n\n &:active {\n box-shadow: inset 0 0 0 1px var(--canon-border-pressed);\n }\n\n &:focus-visible {\n box-shadow: inset 0 0 0 2px var(--canon-ring);\n outline: none;\n transition: none;\n }\n\n &:disabled {\n box-shadow: inset 0 0 0 1px var(--canon-border-disabled);\n color: var(--canon-fg-disabled);\n }\n}\n\n.canon-Button--size-medium {\n font-size: var(--canon-font-size-4);\n padding: 0 var(--canon-space-3);\n height: 40px;\n}\n\n.canon-Button--size-small {\n font-size: var(--canon-font-size-3);\n padding: 0 var(--canon-space-2);\n height: 32px;\n}\n\n.canon-Button--size-small .canon-Button--icon {\n width: 1rem;\n height: 1rem;\n}\n\n.canon-Button--size-medium .canon-Button--icon {\n width: 1.5rem;\n height: 1.5rem;\n}\n"],"names":[]}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
|
||||
.canon-IconButton{user-select:none;font-family:var(--canon-font-regular);font-weight:var(--canon-font-weight-bold);cursor:pointer;border-radius:var(--canon-radius-2);justify-content:center;align-items:center;gap:var(--canon-space-1_5);border:none;padding:0;display:inline-flex;&:disabled{cursor:not-allowed}}.canon-IconButton--variant-primary{background-color:var(--canon-bg-solid);color:var(--canon-fg-solid);transition:background-color .15s,box-shadow .15s;&:hover{background-color:var(--canon-bg-solid-hover)}&:active{background-color:var(--canon-bg-solid-pressed)}&:focus-visible{outline:2px solid var(--canon-ring);outline-offset:2px}&:disabled{background-color:var(--canon-bg-solid-disabled);color:var(--canon-fg-solid-disabled)}}.canon-IconButton--variant-secondary{background-color:var(--canon-bg-surface-1);box-shadow:inset 0 0 0 1px var(--canon-border);color:var(--canon-fg-primary);transition:box-shadow .15s;&:hover{box-shadow:inset 0 0 0 1px var(--canon-border-hover)}&:active{box-shadow:inset 0 0 0 1px var(--canon-border-pressed)}&:focus-visible{box-shadow:inset 0 0 0 2px var(--canon-ring);outline:none;transition:none}&:disabled{box-shadow:inset 0 0 0 1px var(--canon-border-disabled);color:var(--canon-fg-disabled)}}.canon-IconButton--size-medium{font-size:var(--canon-font-size-4);width:40px;height:40px}.canon-IconButton--size-small{font-size:var(--canon-font-size-3);width:32px;height:32px}.canon-IconButton--size-small .canon-IconButton--icon{width:1rem;height:1rem}.canon-IconButton--size-medium .canon-IconButton--icon{width:1.5rem;height:1.5rem}
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"sourceRoot":null,"mappings":"AAAA,qRAaE,+BAKF,uJAKE,qDAIA,wDAIA,uEAKA,iGAMF,wLAME,6DAIA,gEAIA,0FAMA,mGAMF,yFAMA,wFAMA,6EAKA","sources":["css/iconbutton.css"],"sourcesContent":[".canon-IconButton {\n user-select: none;\n font-family: var(--canon-font-regular);\n font-weight: var(--canon-font-weight-bold);\n cursor: pointer;\n border-radius: var(--canon-radius-2);\n justify-content: center;\n align-items: center;\n gap: var(--canon-space-1_5);\n border: none;\n padding: 0;\n display: inline-flex;\n\n &:disabled {\n cursor: not-allowed;\n }\n}\n\n.canon-IconButton--variant-primary {\n background-color: var(--canon-bg-solid);\n color: var(--canon-fg-solid);\n transition: background-color .15s, box-shadow .15s;\n\n &:hover {\n background-color: var(--canon-bg-solid-hover);\n }\n\n &:active {\n background-color: var(--canon-bg-solid-pressed);\n }\n\n &:focus-visible {\n outline: 2px solid var(--canon-ring);\n outline-offset: 2px;\n }\n\n &:disabled {\n background-color: var(--canon-bg-solid-disabled);\n color: var(--canon-fg-solid-disabled);\n }\n}\n\n.canon-IconButton--variant-secondary {\n background-color: var(--canon-bg-surface-1);\n box-shadow: inset 0 0 0 1px var(--canon-border);\n color: var(--canon-fg-primary);\n transition: box-shadow .15s;\n\n &:hover {\n box-shadow: inset 0 0 0 1px var(--canon-border-hover);\n }\n\n &:active {\n box-shadow: inset 0 0 0 1px var(--canon-border-pressed);\n }\n\n &:focus-visible {\n box-shadow: inset 0 0 0 2px var(--canon-ring);\n outline: none;\n transition: none;\n }\n\n &:disabled {\n box-shadow: inset 0 0 0 1px var(--canon-border-disabled);\n color: var(--canon-fg-disabled);\n }\n}\n\n.canon-IconButton--size-medium {\n font-size: var(--canon-font-size-4);\n width: 40px;\n height: 40px;\n}\n\n.canon-IconButton--size-small {\n font-size: var(--canon-font-size-3);\n width: 32px;\n height: 32px;\n}\n\n.canon-IconButton--size-small .canon-IconButton--icon {\n width: 1rem;\n height: 1rem;\n}\n\n.canon-IconButton--size-medium .canon-IconButton--icon {\n width: 1.5rem;\n height: 1.5rem;\n}\n"],"names":[]}
|
||||
@@ -1 +1 @@
|
||||
.canon-Input{border-radius:var(--canon-radius-3);border:1px solid var(--canon-border);padding:0 var(--canon-space-4);background-color:var(--canon-bg-elevated);font-size:var(--canon-font-size-3);font-family:var(--canon-font-regular);font-weight:var(--canon-font-weight-regular);color:var(--canon-fg-primary);width:100%;transition:border-color .2s ease-in-out,outline-color .2s ease-in-out}.canon-Input::placeholder{color:var(--canon-fg-secondary)}.canon-Input:hover{border-color:var(--canon-border-hover)}.canon-Input:focus-visible{outline-color:var(--canon-border-pressed);border-color:var(--canon-border-pressed);outline-width:0}.canon-Input[data-invalid]{border-color:var(--canon-fg-danger)}.canon-Input--size-sm{height:2rem}.canon-Input--size-md{height:2.5rem}
|
||||
.canon-Input{border-radius:var(--canon-radius-3);border:1px solid var(--canon-border);padding:0 var(--canon-space-4);background-color:var(--canon-bg-surface-1);font-size:var(--canon-font-size-3);font-family:var(--canon-font-regular);font-weight:var(--canon-font-weight-regular);color:var(--canon-fg-primary);width:100%;transition:border-color .2s ease-in-out,outline-color .2s ease-in-out}.canon-Input::placeholder{color:var(--canon-fg-secondary)}.canon-Input:hover{border-color:var(--canon-border-hover)}.canon-Input:focus-visible{outline-color:var(--canon-border-pressed);border-color:var(--canon-border-pressed);outline-width:0}.canon-Input[data-invalid]{border-color:var(--canon-fg-danger)}.canon-Input--size-sm{height:2rem}.canon-Input--size-md{height:2.5rem}
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"sourceRoot":null,"mappings":"AAAA,oYAaA,0DAIA,0DAIA,8HAMA,+DAIA,kCAIA","sources":["css/input.css"],"sourcesContent":[".canon-Input {\n border-radius: var(--canon-radius-3);\n border: 1px solid var(--canon-border);\n padding: 0 var(--canon-space-4);\n background-color: var(--canon-bg-elevated);\n font-size: var(--canon-font-size-3);\n font-family: var(--canon-font-regular);\n font-weight: var(--canon-font-weight-regular);\n color: var(--canon-fg-primary);\n width: 100%;\n transition: border-color .2s ease-in-out, outline-color .2s ease-in-out;\n}\n\n.canon-Input::placeholder {\n color: var(--canon-fg-secondary);\n}\n\n.canon-Input:hover {\n border-color: var(--canon-border-hover);\n}\n\n.canon-Input:focus-visible {\n outline-color: var(--canon-border-pressed);\n border-color: var(--canon-border-pressed);\n outline-width: 0;\n}\n\n.canon-Input[data-invalid] {\n border-color: var(--canon-fg-danger);\n}\n\n.canon-Input--size-sm {\n height: 2rem;\n}\n\n.canon-Input--size-md {\n height: 2.5rem;\n}\n"],"names":[]}
|
||||
{"version":3,"sourceRoot":null,"mappings":"AAAA,qYAaA,0DAIA,0DAIA,8HAMA,+DAIA,kCAIA","sources":["css/input.css"],"sourcesContent":[".canon-Input {\n border-radius: var(--canon-radius-3);\n border: 1px solid var(--canon-border);\n padding: 0 var(--canon-space-4);\n background-color: var(--canon-bg-surface-1);\n font-size: var(--canon-font-size-3);\n font-family: var(--canon-font-regular);\n font-weight: var(--canon-font-weight-regular);\n color: var(--canon-fg-primary);\n width: 100%;\n transition: border-color .2s ease-in-out, outline-color .2s ease-in-out;\n}\n\n.canon-Input::placeholder {\n color: var(--canon-fg-secondary);\n}\n\n.canon-Input:hover {\n border-color: var(--canon-border-hover);\n}\n\n.canon-Input:focus-visible {\n outline-color: var(--canon-border-pressed);\n border-color: var(--canon-border-pressed);\n outline-width: 0;\n}\n\n.canon-Input[data-invalid] {\n border-color: var(--canon-fg-danger);\n}\n\n.canon-Input--size-sm {\n height: 2rem;\n}\n\n.canon-Input--size-md {\n height: 2.5rem;\n}\n"],"names":[]}
|
||||
@@ -0,0 +1 @@
|
||||
.canon-Link{font-family:var(--canon-font-regular);color:var(--canon-fg-link);cursor:pointer;margin:0;padding:0;text-decoration-line:none;&:hover{color:var(--canon-fg-link-hover);text-underline-offset:calc(.025em + 2px);text-decoration-line:underline;text-decoration-style:solid;text-decoration-thickness:min(2px,max(1px,.05em));text-decoration-color:color-mix(in srgb,var(--canon-fg-link-hover)30%,transparent)}}.canon-Link--variant-body{font-size:var(--canon-font-size-3);line-height:140%}.canon-Link--variant-subtitle{font-size:var(--canon-font-size-4);line-height:140%}.canon-Link--variant-caption{font-size:var(--canon-font-size-2);line-height:140%}.canon-Link--variant-label{font-size:var(--canon-font-size-1);line-height:140%}.canon-Link--weight-regular{font-weight:var(--canon-font-weight-regular)}.canon-Link--weight-bold{font-weight:var(--canon-font-weight-bold)}
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"sourceRoot":null,"mappings":"AAAA,yIAQE,mRAUF,8EAKA,kFAKA,iFAKA,+EAKA,yEAIA","sources":["css/link.css"],"sourcesContent":[".canon-Link {\n font-family: var(--canon-font-regular);\n color: var(--canon-fg-link);\n cursor: pointer;\n margin: 0;\n padding: 0;\n text-decoration-line: none;\n\n &:hover {\n color: var(--canon-fg-link-hover);\n text-underline-offset: calc(.025em + 2px);\n text-decoration-line: underline;\n text-decoration-style: solid;\n text-decoration-thickness: min(2px, max(1px, .05em));\n text-decoration-color: color-mix(in srgb, var(--canon-fg-link-hover) 30%, transparent);\n }\n}\n\n.canon-Link--variant-body {\n font-size: var(--canon-font-size-3);\n line-height: 140%;\n}\n\n.canon-Link--variant-subtitle {\n font-size: var(--canon-font-size-4);\n line-height: 140%;\n}\n\n.canon-Link--variant-caption {\n font-size: var(--canon-font-size-2);\n line-height: 140%;\n}\n\n.canon-Link--variant-label {\n font-size: var(--canon-font-size-1);\n line-height: 140%;\n}\n\n.canon-Link--weight-regular {\n font-weight: var(--canon-font-weight-regular);\n}\n\n.canon-Link--weight-bold {\n font-weight: var(--canon-font-weight-bold);\n}\n"],"names":[]}
|
||||
@@ -0,0 +1 @@
|
||||
.canon-MenuTrigger{box-sizing:border-box;border:1px solid var(--color-gray-200);background-color:var(--color-gray-50);height:2.5rem;color:var(--color-gray-900);user-select:none;border-radius:.375rem;outline:0;justify-content:center;align-items:center;gap:.375rem;margin:0;padding:0 .875rem;font-family:inherit;font-size:1rem;font-weight:500;line-height:1.5rem;display:flex;@media (hover:hover){&:hover{background-color:var(--color-gray-100)}}&:active,&[data-popup-open]{background-color:var(--color-gray-100)}&:focus-visible{outline:2px solid var(--color-blue);outline-offset:-1px}}.canon-MenuPositioner{outline:0}.canon-MenuPopup{box-sizing:border-box;background-color:var(--canon-bg-elevated);color:var(--color-fg-primary);transform-origin:var(--transform-origin);border-radius:.375rem;padding-block:.25rem;transition:transform .15s,opacity .15s;&[data-starting-style],&[data-ending-style]{opacity:0;transform:scale(.9)}@media (prefers-color-scheme:light){&{outline:1px solid var(--color-gray-200);box-shadow:0px 10px 15px -3px var(--color-gray-200),0px 4px 6px -4px var(--color-gray-200)}}@media (prefers-color-scheme:dark){&{outline:1px solid var(--color-gray-300);outline-offset:-1px}}}.canon-MenuItem{cursor:default;user-select:none;padding-block:.5rem;outline:0;padding-left:1rem;padding-right:2rem;font-size:.875rem;line-height:1rem;display:flex;&[data-highlighted]{z-index:0;color:var(--color-gray-50);position:relative}&[data-highlighted]:before{content:"";z-index:-1;background-color:var(--color-gray-900);border-radius:.25rem;position:absolute;inset-block:0;inset-inline:.25rem}}.canon-MenuSeparator{background-color:var(--color-gray-200);height:1px;margin:.375rem 1rem}
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"sourceRoot":null,"mappings":"AAAA,qXAoBE,qBACE,gDAKF,mEAIA,yEAMF,gCAIA,0OASE,0EAKA,oCACE,sIAMF,mCACE,gEAOJ,mKAWE,2EAMA,kKAWF","sources":["css/menu.css"],"sourcesContent":[".canon-MenuTrigger {\n box-sizing: border-box;\n border: 1px solid var(--color-gray-200);\n background-color: var(--color-gray-50);\n height: 2.5rem;\n color: var(--color-gray-900);\n user-select: none;\n border-radius: .375rem;\n outline: 0;\n justify-content: center;\n align-items: center;\n gap: .375rem;\n margin: 0;\n padding: 0 .875rem;\n font-family: inherit;\n font-size: 1rem;\n font-weight: 500;\n line-height: 1.5rem;\n display: flex;\n\n @media (hover: hover) {\n &:hover {\n background-color: var(--color-gray-100);\n }\n }\n\n &:active, &[data-popup-open] {\n background-color: var(--color-gray-100);\n }\n\n &:focus-visible {\n outline: 2px solid var(--color-blue);\n outline-offset: -1px;\n }\n}\n\n.canon-MenuPositioner {\n outline: 0;\n}\n\n.canon-MenuPopup {\n box-sizing: border-box;\n background-color: var(--canon-bg-elevated);\n color: var(--color-fg-primary);\n transform-origin: var(--transform-origin);\n border-radius: .375rem;\n padding-block: .25rem;\n transition: transform .15s, opacity .15s;\n\n &[data-starting-style], &[data-ending-style] {\n opacity: 0;\n transform: scale(.9);\n }\n\n @media (prefers-color-scheme: light) {\n & {\n outline: 1px solid var(--color-gray-200);\n box-shadow: 0px 10px 15px -3px var(--color-gray-200), 0px 4px 6px -4px var(--color-gray-200);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n & {\n outline: 1px solid var(--color-gray-300);\n outline-offset: -1px;\n }\n }\n}\n\n.canon-MenuItem {\n cursor: default;\n user-select: none;\n padding-block: .5rem;\n outline: 0;\n padding-left: 1rem;\n padding-right: 2rem;\n font-size: .875rem;\n line-height: 1rem;\n display: flex;\n\n &[data-highlighted] {\n z-index: 0;\n color: var(--color-gray-50);\n position: relative;\n }\n\n &[data-highlighted]:before {\n content: \"\";\n z-index: -1;\n background-color: var(--color-gray-900);\n border-radius: .25rem;\n position: absolute;\n inset-block: 0;\n inset-inline: .25rem;\n }\n}\n\n.canon-MenuSeparator {\n background-color: var(--color-gray-200);\n height: 1px;\n margin: .375rem 1rem;\n}\n"],"names":[]}
|
||||
@@ -0,0 +1 @@
|
||||
.canon-ScrollAreaRoot{box-sizing:border-box;width:24rem;max-width:calc(100vw - 8rem);height:8.5rem}.canon-ScrollAreaViewport{overscroll-behavior:contain;height:100%}.canon-ScrollAreaContent{padding-block:.75rem;flex-direction:column;gap:1rem;padding-left:1rem;padding-right:1.5rem;display:flex}.canon-ScrollAreaScrollbar{background-color:var(--canon-scrollbar);opacity:0;border-radius:.375rem;justify-content:center;width:.25rem;margin:.5rem;transition:opacity .15s .3s;display:flex;&[data-hovering],&[data-scrolling]{opacity:1;transition-duration:75ms;transition-delay:0s}&:before{content:"";width:1.25rem;height:100%;position:absolute}}.canon-ScrollAreaThumb{border-radius:inherit;background-color:var(--canon-scrollbar-thumb);width:100%}
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"sourceRoot":null,"mappings":"AAAA,mGAOA,kEAKA,iIASA,6LAUE,0FAMA,iEAQF","sources":["css/scrollarea.css"],"sourcesContent":[".canon-ScrollAreaRoot {\n box-sizing: border-box;\n width: 24rem;\n max-width: calc(100vw - 8rem);\n height: 8.5rem;\n}\n\n.canon-ScrollAreaViewport {\n overscroll-behavior: contain;\n height: 100%;\n}\n\n.canon-ScrollAreaContent {\n padding-block: .75rem;\n flex-direction: column;\n gap: 1rem;\n padding-left: 1rem;\n padding-right: 1.5rem;\n display: flex;\n}\n\n.canon-ScrollAreaScrollbar {\n background-color: var(--canon-scrollbar);\n opacity: 0;\n border-radius: .375rem;\n justify-content: center;\n width: .25rem;\n margin: .5rem;\n transition: opacity .15s .3s;\n display: flex;\n\n &[data-hovering], &[data-scrolling] {\n opacity: 1;\n transition-duration: 75ms;\n transition-delay: 0s;\n }\n\n &:before {\n content: \"\";\n width: 1.25rem;\n height: 100%;\n position: absolute;\n }\n}\n\n.canon-ScrollAreaThumb {\n border-radius: inherit;\n background-color: var(--canon-scrollbar-thumb);\n width: 100%;\n}\n"],"names":[]}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -1 +1 @@
|
||||
.table{background-color:var(--canon-bg-elevated);border-radius:var(--canon-radius-2);width:100%;padding-bottom:var(--canon-space-0_5);padding-top:var(--canon-space-0_5);font-size:var(--canon-font-size-3);font-family:var(--canon-font-regular);font-weight:var(--canon-font-weight-regular);position:relative;overflow:auto;& table{caption-side:bottom;width:100%;font-size:var(--canon-font-size-sm);border-collapse:collapse}}.table-head{text-align:left;padding:var(--canon-space-3)}.table-body{& tr:last-child{border-bottom:none}}.table-row{transition:color .2s ease-in-out;&:hover td{background-color:var(--canon-bg-tint)}& .table-cell:first-child{border-top-left-radius:var(--canon-radius-2);border-bottom-left-radius:var(--canon-radius-2);box-shadow:inset 4px 2px 0 0 var(--canon-bg-elevated),inset 4px -2px 0 0 var(--canon-bg-elevated);padding-left:var(--canon-space-3)}& .table-cell:last-child{border-top-right-radius:var(--canon-radius-2);border-bottom-right-radius:var(--canon-radius-2);box-shadow:inset -4px 2px 0 0 var(--canon-bg-elevated),inset -4px -2px 0 0 var(--canon-bg-elevated);padding-right:var(--canon-space-3)}}.table-cell{padding:var(--canon-space-3);background-color:var(--canon-bg);box-shadow:inset 0px 2px 0 0 var(--canon-bg-elevated),inset 0px -2px 0 0 var(--canon-bg-elevated)}
|
||||
.table{background-color:var(--canon-bg-surface-1);border-radius:var(--canon-radius-2);width:100%;padding-bottom:var(--canon-space-0_5);padding-top:var(--canon-space-0_5);font-size:var(--canon-font-size-3);font-family:var(--canon-font-regular);font-weight:var(--canon-font-weight-regular);position:relative;overflow:auto;& table{caption-side:bottom;width:100%;font-size:var(--canon-font-size-sm);border-collapse:collapse}}.table-head{text-align:left;padding:var(--canon-space-3)}.table-body{& tr:last-child{border-bottom:none}}.table-row{transition:color .2s ease-in-out;&:hover td{background-color:var(--canon-bg-tint)}& .table-cell:first-child{border-top-left-radius:var(--canon-radius-2);border-bottom-left-radius:var(--canon-radius-2);box-shadow:inset 4px 2px 0 0 var(--canon-bg-surface-1),inset 4px -2px 0 0 var(--canon-bg-surface-1);padding-left:var(--canon-space-3)}& .table-cell:last-child{border-top-right-radius:var(--canon-radius-2);border-bottom-right-radius:var(--canon-radius-2);box-shadow:inset -4px 2px 0 0 var(--canon-bg-surface-1),inset -4px -2px 0 0 var(--canon-bg-surface-1);padding-right:var(--canon-space-3)}}.table-cell{padding:var(--canon-space-3);background-color:var(--canon-bg);box-shadow:inset 0px 2px 0 0 var(--canon-bg-surface-1),inset 0px -2px 0 0 var(--canon-bg-surface-1)}
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"sourceRoot":null,"mappings":"AAAA,+TAYE,qGAQF,yDAKA,YACE,oCAKF,4CAGE,iDAIA,2PAOA,gQAQF","sources":["css/table.css"],"sourcesContent":[".table {\n background-color: var(--canon-bg-elevated);\n border-radius: var(--canon-radius-2);\n width: 100%;\n padding-bottom: var(--canon-space-0_5);\n padding-top: var(--canon-space-0_5);\n font-size: var(--canon-font-size-3);\n font-family: var(--canon-font-regular);\n font-weight: var(--canon-font-weight-regular);\n position: relative;\n overflow: auto;\n\n & table {\n caption-side: bottom;\n width: 100%;\n font-size: var(--canon-font-size-sm);\n border-collapse: collapse;\n }\n}\n\n.table-head {\n text-align: left;\n padding: var(--canon-space-3);\n}\n\n.table-body {\n & tr:last-child {\n border-bottom: none;\n }\n}\n\n.table-row {\n transition: color .2s ease-in-out;\n\n &:hover td {\n background-color: var(--canon-bg-tint);\n }\n\n & .table-cell:first-child {\n border-top-left-radius: var(--canon-radius-2);\n border-bottom-left-radius: var(--canon-radius-2);\n box-shadow: inset 4px 2px 0 0 var(--canon-bg-elevated), inset 4px -2px 0 0 var(--canon-bg-elevated);\n padding-left: var(--canon-space-3);\n }\n\n & .table-cell:last-child {\n border-top-right-radius: var(--canon-radius-2);\n border-bottom-right-radius: var(--canon-radius-2);\n box-shadow: inset -4px 2px 0 0 var(--canon-bg-elevated), inset -4px -2px 0 0 var(--canon-bg-elevated);\n padding-right: var(--canon-space-3);\n }\n}\n\n.table-cell {\n padding: var(--canon-space-3);\n background-color: var(--canon-bg);\n box-shadow: inset 0px 2px 0 0 var(--canon-bg-elevated), inset 0px -2px 0 0 var(--canon-bg-elevated);\n}\n"],"names":[]}
|
||||
{"version":3,"sourceRoot":null,"mappings":"AAAA,gUAYE,qGAQF,yDAKA,YACE,oCAKF,4CAGE,iDAIA,6PAOA,kQAQF","sources":["css/table.css"],"sourcesContent":[".table {\n background-color: var(--canon-bg-surface-1);\n border-radius: var(--canon-radius-2);\n width: 100%;\n padding-bottom: var(--canon-space-0_5);\n padding-top: var(--canon-space-0_5);\n font-size: var(--canon-font-size-3);\n font-family: var(--canon-font-regular);\n font-weight: var(--canon-font-weight-regular);\n position: relative;\n overflow: auto;\n\n & table {\n caption-side: bottom;\n width: 100%;\n font-size: var(--canon-font-size-sm);\n border-collapse: collapse;\n }\n}\n\n.table-head {\n text-align: left;\n padding: var(--canon-space-3);\n}\n\n.table-body {\n & tr:last-child {\n border-bottom: none;\n }\n}\n\n.table-row {\n transition: color .2s ease-in-out;\n\n &:hover td {\n background-color: var(--canon-bg-tint);\n }\n\n & .table-cell:first-child {\n border-top-left-radius: var(--canon-radius-2);\n border-bottom-left-radius: var(--canon-radius-2);\n box-shadow: inset 4px 2px 0 0 var(--canon-bg-surface-1), inset 4px -2px 0 0 var(--canon-bg-surface-1);\n padding-left: var(--canon-space-3);\n }\n\n & .table-cell:last-child {\n border-top-right-radius: var(--canon-radius-2);\n border-bottom-right-radius: var(--canon-radius-2);\n box-shadow: inset -4px 2px 0 0 var(--canon-bg-surface-1), inset -4px -2px 0 0 var(--canon-bg-surface-1);\n padding-right: var(--canon-space-3);\n }\n}\n\n.table-cell {\n padding: var(--canon-space-3);\n background-color: var(--canon-bg);\n box-shadow: inset 0px 2px 0 0 var(--canon-bg-surface-1), inset 0px -2px 0 0 var(--canon-bg-surface-1);\n}\n"],"names":[]}
|
||||
@@ -1 +1 @@
|
||||
.canon-Text{font-family:var(--canon-font-regular);color:var(--canon-fg-primary);margin:0;padding:0}.canon-Text--variant-body{font-size:var(--canon-font-size-3);line-height:140%}.canon-Text--variant-subtitle{font-size:var(--canon-font-size-4);line-height:140%}.canon-Text--variant-caption{font-size:var(--canon-font-size-2);line-height:140%}.canon-Text--variant-label{font-size:var(--canon-font-size-1);line-height:140%}.canon-Text--weight-regular{font-weight:var(--canon-font-weight-regular)}.canon-Text--weight-bold{font-weight:var(--canon-font-weight-bold)}
|
||||
.canon-Text{font-family:var(--canon-font-regular);color:var(--canon-fg-primary);margin:0;padding:0}.canon-Text--variant-body{font-size:var(--canon-font-size-3);line-height:140%}.canon-Text--variant-subtitle{font-size:var(--canon-font-size-4);line-height:140%}.canon-Text--variant-caption{font-size:var(--canon-font-size-2);line-height:140%}.canon-Text--variant-label{font-size:var(--canon-font-size-1);line-height:140%}.canon-Text--weight-regular{font-weight:var(--canon-font-weight-regular)}.canon-Text--weight-bold{font-weight:var(--canon-font-weight-bold)}.canon-Text--color-primary{color:var(--canon-fg-primary)}.canon-Text--color-secondary{color:var(--canon-fg-secondary)}.canon-Text--color-danger{color:var(--canon-fg-danger)}.canon-Text--color-warning{color:var(--canon-fg-warning)}.canon-Text--color-success{color:var(--canon-fg-success)}
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"sourceRoot":null,"mappings":"AAAA,mGAOA,8EAKA,kFAKA,iFAKA,+EAKA,yEAIA","sources":["css/text.css"],"sourcesContent":[".canon-Text {\n font-family: var(--canon-font-regular);\n color: var(--canon-fg-primary);\n margin: 0;\n padding: 0;\n}\n\n.canon-Text--variant-body {\n font-size: var(--canon-font-size-3);\n line-height: 140%;\n}\n\n.canon-Text--variant-subtitle {\n font-size: var(--canon-font-size-4);\n line-height: 140%;\n}\n\n.canon-Text--variant-caption {\n font-size: var(--canon-font-size-2);\n line-height: 140%;\n}\n\n.canon-Text--variant-label {\n font-size: var(--canon-font-size-1);\n line-height: 140%;\n}\n\n.canon-Text--weight-regular {\n font-weight: var(--canon-font-weight-regular);\n}\n\n.canon-Text--weight-bold {\n font-weight: var(--canon-font-weight-bold);\n}\n"],"names":[]}
|
||||
{"version":3,"sourceRoot":null,"mappings":"AAAA,mGAOA,8EAKA,kFAKA,iFAKA,+EAKA,yEAIA,mEAIA,yDAIA,6DAIA,uDAIA,yDAIA","sources":["css/text.css"],"sourcesContent":[".canon-Text {\n font-family: var(--canon-font-regular);\n color: var(--canon-fg-primary);\n margin: 0;\n padding: 0;\n}\n\n.canon-Text--variant-body {\n font-size: var(--canon-font-size-3);\n line-height: 140%;\n}\n\n.canon-Text--variant-subtitle {\n font-size: var(--canon-font-size-4);\n line-height: 140%;\n}\n\n.canon-Text--variant-caption {\n font-size: var(--canon-font-size-2);\n line-height: 140%;\n}\n\n.canon-Text--variant-label {\n font-size: var(--canon-font-size-1);\n line-height: 140%;\n}\n\n.canon-Text--weight-regular {\n font-weight: var(--canon-font-weight-regular);\n}\n\n.canon-Text--weight-bold {\n font-weight: var(--canon-font-weight-bold);\n}\n\n.canon-Text--color-primary {\n color: var(--canon-fg-primary);\n}\n\n.canon-Text--color-secondary {\n color: var(--canon-fg-secondary);\n}\n\n.canon-Text--color-danger {\n color: var(--canon-fg-danger);\n}\n\n.canon-Text--color-warning {\n color: var(--canon-fg-warning);\n}\n\n.canon-Text--color-success {\n color: var(--canon-fg-success);\n}\n"],"names":[]}
|
||||
@@ -0,0 +1 @@
|
||||
.canon-TooltipPopup{box-sizing:border-box;transform-origin:var(--transform-origin);background-color:canvas;background-color:var(--canon-bg-surface-1);color:var(--canon-fg-primary);outline:1px solid var(--canon-border);box-shadow:0 10px 15px -3px var(--canon-border),0 4px 6px -4px var(--canon-border);border-radius:.375rem;flex-direction:column;padding:.25rem .5rem;font-size:.875rem;line-height:1.25rem;transition:transform .15s,opacity .15s;display:flex;&[data-starting-style],&[data-ending-style]{opacity:0;transform:scale(.9)}&[data-instant]{transition-duration:0s}}.canon-TooltipArrow{display:flex;&[data-side=top]{bottom:-8px;rotate:180deg}&[data-side=bottom]{top:-8px;rotate:none}&[data-side=left]{right:-13px;rotate:90deg}&[data-side=right]{left:-13px;rotate:-90deg}}.canon-TooltipArrow-fill{fill:var(--canon-bg-surface-1)}.canon-TooltipArrow-outer-stroke{@media (prefers-color-scheme:light){&{fill:var(--canon-border)}}}
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"sourceRoot":null,"mappings":"AAAA,wcAgBE,0EAKA,wCAKF,iCAGE,2CAKA,yCAKA,2CAKA,6CAMF,wDAIA,iCACE,oCACE","sources":["css/tooltip.css"],"sourcesContent":[".canon-TooltipPopup {\n box-sizing: border-box;\n transform-origin: var(--transform-origin);\n background-color: canvas;\n background-color: var(--canon-bg-surface-1);\n color: var(--canon-fg-primary);\n outline: 1px solid var(--canon-border);\n box-shadow: 0 10px 15px -3px var(--canon-border), 0 4px 6px -4px var(--canon-border);\n border-radius: .375rem;\n flex-direction: column;\n padding: .25rem .5rem;\n font-size: .875rem;\n line-height: 1.25rem;\n transition: transform .15s, opacity .15s;\n display: flex;\n\n &[data-starting-style], &[data-ending-style] {\n opacity: 0;\n transform: scale(.9);\n }\n\n &[data-instant] {\n transition-duration: 0s;\n }\n}\n\n.canon-TooltipArrow {\n display: flex;\n\n &[data-side=\"top\"] {\n bottom: -8px;\n rotate: 180deg;\n }\n\n &[data-side=\"bottom\"] {\n top: -8px;\n rotate: none;\n }\n\n &[data-side=\"left\"] {\n right: -13px;\n rotate: 90deg;\n }\n\n &[data-side=\"right\"] {\n left: -13px;\n rotate: -90deg;\n }\n}\n\n.canon-TooltipArrow-fill {\n fill: var(--canon-bg-surface-1);\n}\n\n.canon-TooltipArrow-outer-stroke {\n @media (prefers-color-scheme: light) {\n & {\n fill: var(--canon-border);\n }\n }\n}\n"],"names":[]}
|
||||
Reference in New Issue
Block a user