oreolek/phanpy
1
0
Fork 0
Code Activity

Make "Unfollow" button look dangerous

Browse source 
Also add ellipsis
This commit is contained in:
Lim Chee Aun 2022-12-24 10:05:01 +08:00
parent 55ad4be580
commit b96f263f69
2 changed files with 5 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/components/account.jsx
View file

@ -184,7 +184,7 @@ function Account({ account }) {
{relationshipUIState !== 'loading' && relationship && (
<button
type="button"
class={following ? 'light' : ''}
class={`${following ? 'light danger' : ''}`}
disabled={relationshipUIState === 'loading'}
onClick={() => {
setRelationshipUIState('loading');
@ -210,7 +210,7 @@ function Account({ account }) {
})();
}}
>
{following ? 'Unfollow' : 'Follow'}
{following ? 'Unfollow…' : 'Follow'}
</button>
)}
</p>

3
src/index.css
View file

@ -153,6 +153,9 @@ button,
color: var(--text-color);
border: 1px solid var(--outline-color);
}
:is(button, .button).light.danger:not(:disabled, .disabled) {
color: var(--red-color);
}
:is(button, .button).block {
display: block;