Code Refactoring - Added default- in some CSS classes name

This commit is contained in:
Noah Boos 2025-04-25 14:05:15 +02:00
parent b796095e66
commit 8a4d79f42b
2 changed files with 26 additions and 11 deletions

View file

@ -148,7 +148,7 @@ export function AddDropdown(parent: HTMLElement, defaultString: string, classes:
* Pushes into classes all CSS classes that are mandatory for a container.
*/
classes.push(
"ankiIntegrationModal__dropdown--width"
"ankiIntegrationModal__dropdown--default-width"
)
/**
* @type {DropdownComponent} createdEl
@ -225,7 +225,7 @@ export function AddInput(parent: HTMLElement, type: string, placeholder: string
* Pushes into classes all CSS classes that are mandatory for a container.
*/
classes.push(
"ankiIntegrationModal__input--width"
"ankiIntegrationModal__input--default-width"
);
/**
* @type {HTMLInputElement} createdEl
@ -271,9 +271,9 @@ export function AddButton(parent: HTMLElement, text: string = null, icon: string
* Pushes into classes all CSS classes that are mandatory for a container.
*/
classes.push(
"ankiIntegrationModal__button--width",
"ankiIntegrationModal__button--margin",
"ankiIntegrationModal__button--padding"
"ankiIntegrationModal__button--default-width",
"ankiIntegrationModal__button--default-margin",
"ankiIntegrationModal__button--default-padding"
);
/**
* @type {ButtonComponent} createdEl

View file

@ -17,26 +17,41 @@
gap: 8px;
}
.ankiIntegrationModal__input--width {
.ankiIntegrationModal__input--default-width {
width: 100%;
}
.ankiIntegrationModal__dropdown--width {
.ankiIntegrationModal__dropdown--default-width {
width: 100%;
}
.ankiIntegrationModal__button--width {
.ankiIntegrationModal__button--default-width {
width: 40%;
}
.ankiIntegrationModal__button--margin {
.ankiIntegrationModal__button--default-margin {
margin: 16px 30% 0;
}
.ankiIntegrationModal__button--padding {
.ankiIntegrationModal__button--default-padding {
padding: 4px 0;
}
.ankiIntegrationModal__paragraph--text-align {
text-align: center;
}
}
.ankiIntegrationModal__container--flex-row {
display: flex;
flex-direction: row;
}
.ankiIntegrationModal__container--flex-column {
display: flex;
flex-direction: column;
}
/*.ankiIntegrationModal__icon--font-size * {*/
/* width: 48px !important;*/
/* color: red;*/
/*}*/