Mirrors/gomuks
1
0
Fork 1
mirror of https://github.com/tulir/gomuks.git synced 2025-04-20 10:33:41 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

web/css: add shared class for primary color buttons

Browse source
This commit is contained in:
Tulir Asokan 2024-11-18 00:30:29 +02:00
parent 9e795ed3bd
commit 4ee46c8df5
5 changed files with 15 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
web/src/index.css
View file

@ -174,6 +174,15 @@ button, a.button, span.button {
color: var(--secondary-text-color); color: var(--secondary-text-color);
background: none; background: none;
} }
&.primary-color-button:not(:disabled) {
background-color: var(--primary-color);
color: var(--inverted-text-color);
&:hover, &:focus {
background-color: var(--primary-color-dark);
}
}
} }
a { a {

6
web/src/ui/login/LoginScreen.css
View file

@ -55,13 +55,7 @@ main.matrix-login {
} }
button { button {
background-color: var(--primary-color);
color: var(--inverted-text-color);
font-weight: bold; font-weight: bold;
&:hover, &:focus {
background-color: var(--primary-color-dark);
}
} }
div.error { div.error {

4
web/src/ui/login/LoginScreen.tsx
View file

@ -148,12 +148,12 @@ export const LoginScreen = ({ client }: LoginScreenProps) => {
/>} />}
<div className="buttons"> <div className="buttons">
{supportsSSO && <button {supportsSSO && <button
className="mx-login-button" className="mx-login-button primary-color-button"
type={supportsPassword ? "button" : "submit"} type={supportsPassword ? "button" : "submit"}
onClick={supportsPassword ? loginSSO : undefined} onClick={supportsPassword ? loginSSO : undefined}
>Login with SSO</button>} >Login with SSO</button>}
{supportsPassword && <button {supportsPassword && <button
className="mx-login-button" className="mx-login-button primary-color-button"
type="submit" type="submit"
>Login{supportsSSO || beeperDomain ? " with password" : ""}</button>} >Login{supportsSSO || beeperDomain ? " with password" : ""}</button>}
</div> </div>

15
web/src/ui/settings/SettingsView.css
View file

@ -48,26 +48,13 @@ div.settings-view {
> button { > button {
padding: .5rem 1rem; padding: .5rem 1rem;
&.save {
background-color: var(--primary-color);
color: var(--inverted-text-color);
font-weight: bold; font-weight: bold;
&:hover, &:focus { &.delete:hover, &.delete:focus {
background-color: var(--primary-color-dark);
}
}
&.delete {
font-weight: bold;
&:hover, &:focus {
background-color: var(--error-color); background-color: var(--error-color);
color: var(--inverted-text-color); color: var(--inverted-text-color);
} }
} }
} }
} }
}
} }

2
web/src/ui/settings/SettingsView.tsx
View file

@ -171,7 +171,7 @@ const CustomCSSInput = ({ setPref, room }: { setPref: SetPrefFunc, room: RoomSta
<textarea value={text} onChange={onChangeText}/> <textarea value={text} onChange={onChangeText}/>
<div className="buttons"> <div className="buttons">
<button className="delete" onClick={onDelete}>Delete</button> <button className="delete" onClick={onDelete}>Delete</button>
<button className="save" onClick={onSave}>Save</button> <button className="save primary-color-button" onClick={onSave}>Save</button>
</div> </div>
</div> </div>
} }