move all styles into CSS

This commit is contained in:
ZigHolding 2025-01-18 12:23:06 +08:00
parent 2e8ec42a1f
commit 8237e1ab16
2 changed files with 17 additions and 8 deletions

View file

@ -70,8 +70,7 @@ export default class InputPrompt extends Modal {
value?: string value?: string
) { ) {
const textComponent = new TextComponent(container); const textComponent = new TextComponent(container);
(textComponent as any).inputEl.classList.add("input-field");
(textComponent as any).inputEl.style.width = "100%";
(textComponent as any) (textComponent as any)
.setPlaceholder(placeholder ?? "") .setPlaceholder(placeholder ?? "")
.setValue(value ?? "") .setValue(value ?? "")
@ -99,18 +98,15 @@ export default class InputPrompt extends Modal {
buttonBarContainer, buttonBarContainer,
"Ok", "Ok",
this.submitClickCallback this.submitClickCallback
).setCta().buttonEl.style.marginRight = "0"; ).setCta();
this.createButton( this.createButton(
buttonBarContainer, buttonBarContainer,
"Cancel", "Cancel",
this.cancelClickCallback this.cancelClickCallback
); );
buttonBarContainer.style.display = "flex"; buttonBarContainer.classList.add("button-bar");
buttonBarContainer.style.flexDirection = "row-reverse";
buttonBarContainer.style.justifyContent = "flex-start";
buttonBarContainer.style.marginTop = "1rem";
buttonBarContainer.style.gap = "0.5rem";
} }
private submitClickCallback = (evt: MouseEvent) => this.submit(); private submitClickCallback = (evt: MouseEvent) => this.submit();

13
styles.css Normal file
View file

@ -0,0 +1,13 @@
/* 按钮条样式 */
.button-bar {
display: flex;
flex-direction: row-reverse;
justify-content: flex-start;
margin-top: 1rem;
gap: 0.5rem;
}
/* 输入字段样式 */
.input-field {
width: 100%;
}