Skip to content

Commit

Permalink
minor fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
tkachuk committed Feb 4, 2024
1 parent b31f7dc commit 2b55851
Show file tree
Hide file tree
Showing 4 changed files with 43 additions and 45 deletions.
80 changes: 40 additions & 40 deletions src/lib/components/Config/code.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,86 +19,86 @@
`.shape {\n` +
` background-color: ${$cssData.shapeBg};\n` +
`}\n .shape .shape-default {\n` +
` box-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
`${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset};\n` +
` box-shadow: ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowDark},\n` +
`${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowLight};\n` +
`}\n .shape .shape-active {\n` +
` box-shadow: inset ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
` inset ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset};\n` +
` box-shadow: inset ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowInsetDark},\n` +
` inset ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInsetLight};\n` +
`}\n .shape .shape-focused {\n` +
` background: linear-gradient(${$cssData.angle}, ${$cssData.gradientFocusedFrom}, ${$cssData.gradientFocusedTo});\n` +
` box-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset};\n` +
` box-shadow: ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowDark},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowLight};\n` +
`}\n .shape .shape-disabled {\n` +
` background: linear-gradient(${$cssData.angle}, ${$cssData.gradientFocusedTo}, ${$cssData.gradientFocusedFrom});\n` +
` box-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset};\n` +
` box-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowDark},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowLight};\n` +
`}\n .text {\n` +
` text-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.textShadowWidth} ${$cssData.boxShadow},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.textShadowWidth} ${$cssData.boxShadowInset};\n` +
` text-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.textShadowWidth} ${$cssData.boxShadowDark},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.textShadowWidth} ${$cssData.boxShadowLight};\n` +
`}\n`,
sass:
`.shape \n` +
` background-color: ${$cssData.shapeBg}\n` +
` &-default \n` +
` box-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
`${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset}\n` +
` box-shadow: ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowDark},\n` +
`${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowLight}\n` +
` &-active \n` +
` box-shadow: inset ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
` inset ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset}\n` +
` box-shadow: inset ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowInsetDark},\n` +
` inset ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInsetLight}\n` +
` &-focused \n` +
` background: linear-gradient(${$cssData.angle}, ${$cssData.gradientFocusedFrom}, ${$cssData.gradientFocusedTo})\n` +
` box-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset}\n` +
` box-shadow: $${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowDark},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowLight}\n` +
` &-disabled \n` +
` background: linear-gradient(${$cssData.angle}, ${$cssData.gradientFocusedTo}, ${$cssData.gradientFocusedFrom})\n` +
` box-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset}\n` +
` box-shadow: ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowDark},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowLight}\n` +
`.text \n` +
` text-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.textShadowWidth} ${$cssData.boxShadow},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.textShadowWidth} ${$cssData.boxShadowInset}\n`,
` text-shadow: ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.textShadowWidth} ${$cssData.boxShadowDark},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.textShadowWidth} ${$cssData.boxShadowLight}\n`,
scss:
`.shape {\n` +
` background-color: ${$cssData.shapeBg};\n` +
` &-default {\n` +
` box-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
`${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset};\n` +
` box-shadow: ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowDark},\n` +
`${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowLight};\n` +
` &-active {\n` +
` box-shadow: inset ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
` inset ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset};\n` +
` box-shadow: inset ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowInsetDark},\n` +
` inset ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInsetLight};\n` +
` &-focused {\n` +
` background: linear-gradient(${$cssData.angle}, ${$cssData.gradientFocusedFrom}, ${$cssData.gradientFocusedTo});\n` +
` box-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset};\n` +
` box-shadow: ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowDark},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowLight};\n` +
` &-disabled {\n` +
` background: linear-gradient(${$cssData.angle}, ${$cssData.gradientFocusedTo}, ${$cssData.gradientFocusedFrom});\n` +
` box-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset};\n` +
` box-shadow: ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowDark},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowLight};\n` +
` }\n` +
`}\n .text {\n` +
` text-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.textShadowWidth} ${$cssData.boxShadow},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.textShadowWidth} ${$cssData.boxShadowInset};\n` +
` text-shadow: ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.textShadowWidth} ${$cssData.boxShadowDark},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.textShadowWidth} ${$cssData.boxShadowLight};\n` +
`}\n`,
less:
`.shape {\n` +
` background-color: ${$cssData.shapeBg};\n` +
` &-default {\n` +
` box-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
`${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset};\n` +
` box-shadow: ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowDark},\n` +
`${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowLight};\n` +
` &-active {\n` +
` box-shadow: inset ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
` inset ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset};\n` +
` box-shadow: inset ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowInsetDark},\n` +
` inset ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInsetLight};\n` +
` &-focused {\n` +
` background: linear-gradient(${$cssData.angle}, ${$cssData.gradientFocusedFrom}, ${$cssData.gradientFocusedTo});\n` +
` box-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset};\n` +
` box-shadow: ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowDark},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowLight};\n` +
` &-disabled {\n` +
` background: linear-gradient(${$cssData.angle}, ${$cssData.gradientFocusedTo}, ${$cssData.gradientFocusedFrom});\n` +
` box-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadow},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowInset};\n` +
` box-shadow: ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.shadowWidth} ${$cssData.boxShadowDark},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.shadowWidth} ${$cssData.boxShadowLight};\n` +
` }\n` +
`}\n .text {\n` +
` text-shadow: ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.textShadowWidth} ${$cssData.boxShadow},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.textShadowWidth} ${$cssData.boxShadowInset};\n` +
` text-shadow: ${$cssData.offsetX} ${$cssData.offsetY} ${$cssData.textShadowWidth} ${$cssData.boxShadowDark},\n` +
` ${$cssData.offsetY} ${$cssData.offsetX} ${$cssData.textShadowWidth} ${$cssData.boxShadowLight};\n` +
`}\n`
};
Expand Down
1 change: 0 additions & 1 deletion src/lib/components/Config/index.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -599,7 +599,6 @@
justify-content: flex-start;
margin-bottom: rem(20);
// switch
.switch {
position: relative;
display: inline-block;
Expand Down
6 changes: 3 additions & 3 deletions src/lib/utils/config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,14 +12,14 @@ export const states = [
];

export const defaults = {
lightColor: '#eceff1',
lightColor: '#cfd8dc',
darkColor: '#546e7a',
angle: 45,
offset: 8,
offset: 6,
coeff: 0,
width: 10,
showIcons: true,
mode: true // true for light, false for dark
mode: true
};

export const data = {
Expand Down
1 change: 0 additions & 1 deletion src/scss/root.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
:root {
// colors
--dark: #263238;
--grey: #cfd8dc;
--light: #eceff1;
Expand Down

0 comments on commit 2b55851

Please sign in to comment.