Spacebar/client
1
0
Fork 0
mirror of https://github.com/spacebarchat/client.git synced 2024-11-25 11:42:30 +01:00
Code Issues Releases Activity

minor ui fixes for modals

Browse Source
This commit is contained in:
Puyodead1 2023-08-24 22:41:42 -04:00
parent ada219ee11
commit 351f3eca92
No known key found for this signature in database
GPG Key ID: A4FA4FEC0DD353FC
5 changed files with 16 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/AuthComponents.tsx
View File

@ -86,7 +86,7 @@ export const InputWrapper = styled.div`
// TODO: Fix border hover causing small layout shift
export const Input = styled.input<{ error?: boolean }>`
outline: none;
background: var(--background-secondary);
background: var(--background-secondary-alt);
padding: 10px;
font-size: 16px;
flex: 1;

2
src/components/modals/CreateServerModal.tsx
View File

@ -237,7 +237,7 @@ function CreateServerModal() {
</ModalActionItem>
<ModalActionItem
variant="blank"
variant="link"
size="min"
onClick={() => {
closeModal();

5
src/components/modals/JoinServerModal.tsx
View File

@ -6,7 +6,7 @@ import styled from "styled-components";
import useLogger from "../../hooks/useLogger";
import { useAppStore } from "../../stores/AppStore";
import { messageFromFieldError } from "../../utils/messageFromFieldError";
import { Input, InputErrorText, InputLabel, InputWrapper, LabelWrapper } from "../AuthComponents";
import { Input, InputErrorText, InputLabel, LabelWrapper } from "../AuthComponents";
import { Divider } from "../Divider";
import Icon from "../Icon";
import AddServerModal from "./AddServerModal";
@ -144,6 +144,7 @@ function JoinServerModal() {
required
error={!!errors.code}
disabled={isLoading}
autoFocus
/>
</InviteInputContainer>
</form>
@ -155,7 +156,7 @@ function JoinServerModal() {
</ModalActionItem>
<ModalActionItem
variant="blank"
variant="link"
size="min"
onClick={() => {
closeModal();

2
src/components/modals/LeaveServerModal.tsx
View File

@ -103,7 +103,7 @@ function LeaveServerModal({ guild }: Props) {
}}
>
<CancelButton
variant="blank"
variant="link"
size="med"
onClick={() => {
closeModal();

12
src/components/modals/ModalComponents.tsx
View File

@ -64,7 +64,7 @@ export const ModelContentContainer = styled.div`
`;
export const ModalActionItem = styled.button<{
variant?: "filled" | "blank" | "outlined";
variant?: "filled" | "blank" | "outlined" | "link";
size?: "med" | "min";
}>`
color: var(--text);
@ -77,7 +77,7 @@ export const ModalActionItem = styled.button<{
outline: none;
border-radius: 3px;
font-size: 14px;
font-weight: 500;
font-weight: 400;
padding: 2px 16px;
cursor: pointer;
transition: background-color 0.2s ease-in-out;
@ -95,6 +95,14 @@ export const ModalActionItem = styled.button<{
return `
background: transparent;
`;
} else if (props.variant === "link") {
return `
background: transparent;
&:hover {
text-decoration: underline;
}
`;
} else if (props.variant === "outlined") {
return `
background: transparent;