Penpot/penpot-plugins
0
Fork 0
mirror of https://github.com/penpot/penpot-plugins.git synced 2025-01-06 14:50:21 -05:00
Code Issues Activity

fix: t#7933 review

Browse source
This commit is contained in:
Juanfran 2024-05-29 09:04:01 +02:00
parent 8f4080c2a9
commit ab4aa8b252
2 changed files with 29 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
apps/lorem-ipsum-plugin/src/app/app.component.ts
View file

@ -93,7 +93,7 @@ export class AppComponent {
num: new FormControl<number>(1, { nonNullable: true }),
type: new FormControl<GenerationTypes>('paragraphs', { nonNullable: true }),
startWith: new FormControl(true, { nonNullable: true }),
autoClose: new FormControl(true, { nonNullable: true }),
autoClose: new FormControl(false, { nonNullable: true }),
});
constructor() {

62
libs/plugins-styles/src/lib/components/button.css
View file

@ -1,5 +1,5 @@
button {
border: 1px solid transparent;
border: 2px solid transparent;
font-weight: 500;
font-size: 12px;
border-radius: 8px;
@ -19,58 +19,53 @@ button {
[data-theme='dark'] {
[data-appearance='primary']:is(button) {
background-color: var(--da-primary);
border: 1px solid var(--da-primary);
outline: 2px solid transparent;
border: 2px solid transparent;
color: var(--db-secondary);
&:hover:not(:disabled) {
background-color: var(--da-tertiary);
border: 1px solid var(--da-tertiary);
border: 2px solid var(--da-tertiary);
}
&:focus:not(:disabled),
&:focus-visible:not(:disabled) {
border: 1px solid var(--db-primary);
outline: 2px solid var(--da-primary);
border: 2px solid var(--da-primary);
background-color: var(--db-tertiary);
color: var(--df-secondary);
}
&:active:not(:disabled) {
border: 1px solid var(--da-primary);
outline: 2px solid var(--da-tertiary);
border: 2px solid var(--da-tertiary);
}
&:disabled {
background-color: transparent;
border: 1px solid var(--db-quaternary);
border: 2px solid var(--db-quaternary);
color: var(--df-secondary);
}
&[data-variant='destructive'] {
background-color: var(--error-500);
border: 1px solid var(--error-500);
outline: 2px solid transparent;
border: 2px solid transparent;
&:hover:not(:disabled) {
background-color: var(--error-700);
border: 1px solid var(--error-700);
border: 2px solid var(--error-700);
}
&:focus:not(:disabled),
&:focus-visible:not(:disabled) {
border: 1px solid var(--db-primary);
outline: 2px solid var(--error-500);
border: 2px solid var(--error-500);
}
&:active:not(:disabled) {
background-color: var(--app-red);
border: 1px solid var(--app-red);
outline: 2px solid var(--error-700);
border: 2px solid var(--error-700);
}
&:disabled {
background-color: transparent;
border: 1px solid var(--error-950);
color: var(--df-secondary);
border: var(--df-secondary);
}
}
}
@ -86,17 +81,17 @@ button {
&:focus:not(:disabled),
&:focus-visible:not(:disabled) {
border: 1px solid var(--da-primary);
border: 2px solid var(--da-primary);
}
&:active:not(:disabled) {
color: var(--da-primary);
outline: 2px solid var(--db-quaternary);
border: 2px solid var(--db-quaternary);
}
&:disabled {
background-color: transparent;
border: 1px solid var(--db-quaternary);
border: 2px solid var(--db-quaternary);
}
}
}
@ -112,45 +107,44 @@ button {
&:focus:not(:disabled),
&:focus-visible:not(:disabled) {
border: 1px solid var(--lb-primary);
outline: 2px solid var(--la-primary);
color: var(--lf-secondary);
background-color: var(--lb-tertiary);
border: 2px solid var(--la-primary);
}
&:active:not(:disabled) {
border: 1px solid var(--la-primary);
outline: 2px solid var(--la-tertiary);
border: 2px solid var(--la-tertiary);
}
&:disabled {
background-color: transparent;
border: 1px solid var(--lb-quaternary);
border: 2px solid var(--lb-quaternary);
color: var(--lf-secondary);
}
&[data-variant='destructive'] {
background-color: transparent;
border: 1px solid var(--error-200);
border: 2px solid var(--error-200);
color: var(--lf-secondary);
&:hover:not(:disabled) {
background-color: var(--error-500);
color: var(--lb-secondary);
border: 1px solid var(--lb-primary);
outline: 2px solid var(--error-500);
border: 2px solid var(--error-500);
}
&:focus:not(:disabled),
&:focus-visible:not(:disabled) {
background-color: var(--error-700);
border: 1px solid var(--error-700);
border: 2px solid var(--error-700);
color: var(--lb-secondary);
outline: 2px solid var(--error-700);
border: 2px solid var(--error-700);
}
&:active:not(:disabled) {
background-color: var(--app-red);
color: var(--lb-primary);
outline: 2px solid var(--error-700);
border: 2px solid var(--error-700);
}
&:disabled {
@ -172,7 +166,7 @@ button {
&:focus:not(:disabled),
&:focus-visible:not(:disabled) {
background-color: var(--lb-tertiary);
border: 1px solid var(--la-primary);
border: 2px solid var(--la-primary);
color: var(--lf-secondary);
}
@ -184,7 +178,7 @@ button {
&:disabled {
background-color: transparent;
border: 1px solid var(--lb-quaternary);
border: 2px solid var(--lb-quaternary);
}
}
}