mirror of
https://github.com/excalidraw/excalidraw.git
synced 2025-05-03 10:00:07 -04:00
a8064ba3ee
* build: Welcome ESM and Bye Bye UMD * remove package * create unbundled esm build * update script for example * fix typo * dummy commit * update autorelease script to build esm * revert dummy commit * move react, react-dom and testing library to dev dependencies * remove entry.js, publicPath and yarn install:deps script * fix * upgrade esbuild to fix glob import error for locales * remove webpack chunk names as thats not needed anymore * marking the code sideeffects free * make the library tree-shakeable and move fonts to fonts directory * allow side effects for css, scss files * remove tree-shaking * comment code for tree shaking * move to vite for example * bye bye webpack * ignore ts * separate build and output dir * use esbuild for creating bundle for example * update output dir * lint * create browser dev build with source maps and prod with minification * add dev and prod builds for bundler * lint * update script * remove await * load prod build * create minified build in dist * prod and dev builds using export field * remove import.meta * dummy * define import.meta prod and dev * fix * export types * add types field * typo * lint * Update scripts/buildPackage.js * move types inside export * newline
91 lines
1.6 KiB
SCSS
91 lines
1.6 KiB
SCSS
@import "../css/variables.module.scss";
|
|
|
|
.excalidraw {
|
|
.Checkbox {
|
|
margin: 4px 0.3em;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
cursor: pointer;
|
|
user-select: none;
|
|
|
|
-webkit-tap-highlight-color: transparent;
|
|
|
|
&:hover:not(.is-checked) .Checkbox-box:not(:focus) {
|
|
box-shadow: 0 0 0 2px #{$oc-blue-4};
|
|
}
|
|
|
|
&:hover:not(.is-checked) .Checkbox-box:not(:focus) {
|
|
svg {
|
|
display: block;
|
|
opacity: 0.3;
|
|
}
|
|
}
|
|
|
|
&:active {
|
|
.Checkbox-box {
|
|
box-shadow: 0 0 2px 1px inset #{$oc-blue-7} !important;
|
|
}
|
|
}
|
|
|
|
&:hover {
|
|
.Checkbox-box {
|
|
background-color: fade-out($oc-blue-1, 0.8);
|
|
}
|
|
}
|
|
|
|
&.is-checked {
|
|
.Checkbox-box {
|
|
background-color: #{$oc-blue-1};
|
|
svg {
|
|
display: block;
|
|
}
|
|
}
|
|
&:hover .Checkbox-box {
|
|
background-color: #{$oc-blue-2};
|
|
}
|
|
}
|
|
|
|
.Checkbox-box {
|
|
width: 22px;
|
|
height: 22px;
|
|
padding: 0;
|
|
flex: 0 0 auto;
|
|
|
|
margin: 0 1em;
|
|
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
box-shadow: 0 0 0 2px #{$oc-blue-7};
|
|
background-color: transparent;
|
|
border-radius: 4px;
|
|
|
|
color: #{$oc-blue-7};
|
|
|
|
border: 0;
|
|
|
|
&:focus {
|
|
box-shadow: 0 0 0 3px #{$oc-blue-7};
|
|
}
|
|
|
|
svg {
|
|
display: none;
|
|
width: 16px;
|
|
height: 16px;
|
|
stroke-width: 3px;
|
|
}
|
|
}
|
|
|
|
.Checkbox-label {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.excalidraw-tooltip-icon {
|
|
width: 1em;
|
|
height: 1em;
|
|
}
|
|
}
|
|
}
|