Merge pull request #1049 from notmd/cleanup

Various website cleanup
This commit is contained in:
Keith Stevens
2023-02-01 21:07:55 +09:00
committed by GitHub
14 changed files with 20 additions and 228 deletions
+4 -1
View File
@@ -1,6 +1,6 @@
/** @type {import('next').NextConfig} */
const { i18n } = require("./next-i18next.config");
/** @type {import('next').NextConfig} */
const nextConfig = {
output: "standalone",
reactStrictMode: true,
@@ -19,6 +19,9 @@ const nextConfig = {
// scrollRestoration: true,
},
i18n,
eslint: {
ignoreDuringBuilds: true,
},
};
module.exports = nextConfig;
-53
View File
@@ -15,8 +15,6 @@
"@dnd-kit/utilities": "^3.2.1",
"@emotion/react": "^11.10.5",
"@emotion/styled": "^11.10.5",
"@headlessui/react": "^1.7.7",
"@heroicons/react": "^2.0.13",
"@marsidev/react-turnstile": "^0.0.7",
"@next-auth/prisma-adapter": "^1.0.5",
"@next/font": "^13.1.0",
@@ -33,7 +31,6 @@
"eslint-plugin-simple-import-sort": "^8.0.0",
"focus-visible": "^5.2.0",
"framer-motion": "^6.5.1",
"install": "^0.13.0",
"lucide-react": "^0.105.0",
"next": "13.0.6",
"next-auth": "^4.18.6",
@@ -3680,29 +3677,6 @@
"integrity": "sha512-k2Ty1JcVojjJFwrg/ThKi2ujJ7XNLYaFGNB/bWT9wGR+oSMJHMa5w+CUq6p/pVrKeNNgA7pCqEcjSnHVoqJQFw==",
"dev": true
},
"node_modules/@headlessui/react": {
"version": "1.7.7",
"resolved": "https://registry.npmjs.org/@headlessui/react/-/react-1.7.7.tgz",
"integrity": "sha512-BqDOd/tB9u2tA0T3Z0fn18ktw+KbVwMnkxxsGPIH2hzssrQhKB5n/6StZOyvLYP/FsYtvuXfi9I0YowKPv2c1w==",
"dependencies": {
"client-only": "^0.0.1"
},
"engines": {
"node": ">=10"
},
"peerDependencies": {
"react": "^16 || ^17 || ^18",
"react-dom": "^16 || ^17 || ^18"
}
},
"node_modules/@heroicons/react": {
"version": "2.0.13",
"resolved": "https://registry.npmjs.org/@heroicons/react/-/react-2.0.13.tgz",
"integrity": "sha512-iSN5XwmagrnirWlYEWNPdCDj9aRYVD/lnK3JlsC9/+fqGF80k8C7rl+1HCvBX0dBoagKqOFBs6fMhJJ1hOg1EQ==",
"peerDependencies": {
"react": ">= 16"
}
},
"node_modules/@humanwhocodes/config-array": {
"version": "0.11.8",
"resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.8.tgz",
@@ -22048,14 +22022,6 @@
"node": ">=8"
}
},
"node_modules/install": {
"version": "0.13.0",
"resolved": "https://registry.npmjs.org/install/-/install-0.13.0.tgz",
"integrity": "sha512-zDml/jzr2PKU9I8J/xyZBQn8rPCAY//UOYNmR01XwNwyfhEWObo2SWfSl1+0tm1u6PhxLwDnfsT/6jB7OUxqFA==",
"engines": {
"node": ">= 0.10"
}
},
"node_modules/internal-slot": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.4.tgz",
@@ -40882,20 +40848,6 @@
"integrity": "sha512-k2Ty1JcVojjJFwrg/ThKi2ujJ7XNLYaFGNB/bWT9wGR+oSMJHMa5w+CUq6p/pVrKeNNgA7pCqEcjSnHVoqJQFw==",
"dev": true
},
"@headlessui/react": {
"version": "1.7.7",
"resolved": "https://registry.npmjs.org/@headlessui/react/-/react-1.7.7.tgz",
"integrity": "sha512-BqDOd/tB9u2tA0T3Z0fn18ktw+KbVwMnkxxsGPIH2hzssrQhKB5n/6StZOyvLYP/FsYtvuXfi9I0YowKPv2c1w==",
"requires": {
"client-only": "^0.0.1"
}
},
"@heroicons/react": {
"version": "2.0.13",
"resolved": "https://registry.npmjs.org/@heroicons/react/-/react-2.0.13.tgz",
"integrity": "sha512-iSN5XwmagrnirWlYEWNPdCDj9aRYVD/lnK3JlsC9/+fqGF80k8C7rl+1HCvBX0dBoagKqOFBs6fMhJJ1hOg1EQ==",
"requires": {}
},
"@humanwhocodes/config-array": {
"version": "0.11.8",
"resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.8.tgz",
@@ -55076,11 +55028,6 @@
}
}
},
"install": {
"version": "0.13.0",
"resolved": "https://registry.npmjs.org/install/-/install-0.13.0.tgz",
"integrity": "sha512-zDml/jzr2PKU9I8J/xyZBQn8rPCAY//UOYNmR01XwNwyfhEWObo2SWfSl1+0tm1u6PhxLwDnfsT/6jB7OUxqFA=="
},
"internal-slot": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.4.tgz",
-3
View File
@@ -32,8 +32,6 @@
"@dnd-kit/utilities": "^3.2.1",
"@emotion/react": "^11.10.5",
"@emotion/styled": "^11.10.5",
"@headlessui/react": "^1.7.7",
"@heroicons/react": "^2.0.13",
"@marsidev/react-turnstile": "^0.0.7",
"@next-auth/prisma-adapter": "^1.0.5",
"@next/font": "^13.1.0",
@@ -50,7 +48,6 @@
"eslint-plugin-simple-import-sort": "^8.0.0",
"focus-visible": "^5.2.0",
"framer-motion": "^6.5.1",
"install": "^0.13.0",
"lucide-react": "^0.105.0",
"next": "13.0.6",
"next-auth": "^4.18.6",
+2 -7
View File
@@ -8,7 +8,7 @@ import {
PopoverTrigger,
Text,
} from "@chakra-ui/react";
import { InformationCircleIcon } from "@heroicons/react/20/solid";
import { Info } from "lucide-react";
interface ExplainProps {
explanation: string[];
@@ -18,12 +18,7 @@ export const Explain = ({ explanation }: ExplainProps) => {
return (
<Popover>
<PopoverTrigger>
<IconButton
aria-label="explanation"
variant="link"
size="xs"
icon={<InformationCircleIcon className="h-4 w-4" />}
></IconButton>
<IconButton aria-label="explanation" variant="link" size="xs" icon={<Info size="16" />}></IconButton>
</PopoverTrigger>
<PopoverContent>
<PopoverArrow />
@@ -23,8 +23,8 @@ import { LabelMessagePopup } from "src/components/Messages/LabelPopup";
import { getEmojiIcon, MessageEmojiButton } from "src/components/Messages/MessageEmojiButton";
import { ReportPopup } from "src/components/Messages/ReportPopup";
import { post } from "src/lib/api";
import { colors } from "src/styles/Theme/colors";
import { Message, MessageEmojis } from "src/types/Conversation";
import { colors } from "styles/Theme/colors";
import useSWRMutation from "swr/mutation";
interface MessageTableEntryProps {
@@ -66,7 +66,7 @@ export function MessageTableEntry({ message, enabled, highlight }: MessageTableE
),
[borderColor, inlineAvatar, message.is_assistant]
);
const highlightColor = useColorModeValue(colors.light.highlight, colors.dark.highlight);
const highlightColor = useColorModeValue(colors.light.active, colors.dark.active);
const { trigger: sendEmojiChange } = useSWRMutation(`/api/messages/${message.id}/emoji`, post, {
onSuccess: setEmojis,
+3 -7
View File
@@ -1,8 +1,7 @@
import { Box, Button, Text, Tooltip, useColorMode } from "@chakra-ui/react";
import { Button, Card, Text, Tooltip, useColorMode } from "@chakra-ui/react";
import { LucideIcon, Sun } from "lucide-react";
import Link from "next/link";
import { useRouter } from "next/router";
import { colors } from "styles/Theme/colors";
export interface MenuButtonOption {
label: string;
@@ -21,11 +20,8 @@ export function SideMenu(props: SideMenuProps) {
return (
<main className="sticky top-0 sm:h-full">
<Box
<Card
width={["100%", "100%", "100px", "280px"]}
backgroundColor={colorMode === "light" ? colors.light.div : colors.dark.div}
boxShadow="base"
borderRadius="xl"
className="grid grid-cols-4 gap-2 sm:flex sm:flex-col sm:justify-between p-4 h-full"
>
<nav className="grid grid-cols-3 col-span-3 sm:flex sm:flex-col gap-2">
@@ -69,7 +65,7 @@ export function SideMenu(props: SideMenuProps) {
</Button>
</Tooltip>
</div>
</Box>
</Card>
</main>
);
}
+2 -2
View File
@@ -1,6 +1,6 @@
import { Box, useColorMode } from "@chakra-ui/react";
import { MenuButtonOption, SideMenu } from "src/components/SideMenu";
import { colors } from "styles/Theme/colors";
import { colors } from "src/styles/Theme/colors";
interface SideMenuLayoutProps {
menuButtonOptions: MenuButtonOption[];
@@ -11,7 +11,7 @@ export const SideMenuLayout = (props: SideMenuLayoutProps) => {
const { colorMode } = useColorMode();
return (
<Box backgroundColor={colorMode === "light" ? colors.light.bg : colors.dark.bg} className="sm:overflow-hidden">
<Box backgroundColor={colorMode === "light" ? "gray.100" : colors.dark.bg} className="sm:overflow-hidden">
<Box display="flex" flexDirection={["column", "row"]} h="full" gap={["0", "0", "0", "6"]}>
<Box p={["3", "3", "3", "6"]} pr={["3", "3", "3", "0"]}>
<SideMenu buttonOptions={props.menuButtonOptions} />
@@ -211,7 +211,7 @@ export const LabelLikertGroup = ({ labelIDs, onChange, isEditable = true }: Labe
}}
alignItems="center"
>
<Text as="div">
<Text as="div" display="flex" alignItems="center">
{textA}
{descriptionA.length > 0 ? <Explain explanation={descriptionA} /> : null}
</Text>
@@ -229,7 +229,7 @@ export const LabelLikertGroup = ({ labelIDs, onChange, isEditable = true }: Labe
/>
</GridItem>
<GridItem>
<Text textAlign="right" as="div">
<Text as="div" display="flex" alignItems="center" justifyContent="end">
{textB}
{descriptionB.length > 0 ? <Explain explanation={descriptionB} /> : null}
</Text>
+3 -3
View File
@@ -1,4 +1,4 @@
import { Box, Text, useColorModeValue } from "@chakra-ui/react";
import { Box, Card, Text, useColorModeValue } from "@chakra-ui/react";
import Head from "next/head";
import { useTranslation } from "next-i18next";
import { serverSideTranslations } from "next-i18next/serverSideTranslations";
@@ -36,9 +36,9 @@ const MessageDetail = ({ id }: { id: string }) => {
<Text fontWeight="bold" fontSize="xl" pb="2">
{t("parent")}
</Text>
<Box bg={backgroundColor} padding="4" borderRadius="xl" boxShadow="base" width="fit-content">
<Card bg={backgroundColor} padding="4" width="fit-content">
<MessageTableEntry enabled message={parent} />
</Box>
</Card>
</Box>
</>
)}
+2
View File
@@ -2,10 +2,12 @@ export const colors = {
light: {
bg: "rgb(250,250,250)",
text: "black",
active: "blue.400",
},
dark: {
bg: "gray.900",
text: "white",
active: "blue.500",
},
"dark-blue-btn": {
200: "rgb(29,78,216)",
-41
View File
@@ -1,41 +0,0 @@
.App {
text-align: center;
}
.App-logo {
height: 40vmin;
pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
.App-logo {
animation: App-logo-spin infinite 20s linear;
}
}
.AppHeader {
background: linear-gradient(217deg, rgba(255, 0, 0, 0.8), rgba(255, 0, 0, 0) 70.71%),
linear-gradient(127deg, rgba(0, 255, 0, 0.8), rgba(0, 255, 0, 0) 70.71%),
linear-gradient(336deg, rgba(0, 0, 255, 0.8), rgba(0, 0, 255, 0) 70.71%);
background: black;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
}
.AppLink {
color: #61dafb;
}
@keyframes App-logo-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@@ -1,25 +0,0 @@
import {
color,
defineStyle,
defineStyleConfig,
// transition,
} from "@chakra-ui/styled-system";
import { colors } from "../colors";
const baseStyle = defineStyle(({ colorMode }) => ({
minWidth: "100%",
bg: colorMode === "light" ? colors.light.bg : colors.dark.bg,
// transition: "background-color 300ms cubic-bezier(0.4, 0, 1, 1)",
color: colorMode === "light" ? colors.light.text : colors.dark.text,
}));
const variants = {
"no-padding": {
padding: 0,
},
};
export const containerTheme = defineStyleConfig({
baseStyle,
variants,
});
-18
View File
@@ -1,18 +0,0 @@
export const colors = {
light: {
bg: "gray.100",
btn: "gray.50",
div: "white",
text: "black",
highlight: "blue.400",
active: "blue.400",
},
dark: {
bg: "gray.900",
btn: "gray.600",
div: "gray.700",
text: "gray.200",
highlight: "blue.500",
active: "blue.500",
},
};
-64
View File
@@ -1,64 +0,0 @@
import { type ThemeConfig, extendTheme, usePrefersReducedMotion } from "@chakra-ui/react";
import { containerTheme } from "./Components/Container";
import { StyleFunctionProps, Styles } from "@chakra-ui/theme-tools";
const config: ThemeConfig = {
initialColorMode: "system",
useSystemColorMode: false,
disableTransitionOnChange: true,
};
const components = {
Container: containerTheme,
Box: (props: StyleFunctionProps) => ({
backgroundColor: props.colorMode === "light" ? "white" : "gray.800",
}),
Button: {
baseStyle: {
fontWeight: "normal",
},
sizes: {
lg: {
fontSize: "md",
paddingY: "7",
},
},
variants: {
solid: (props: StyleFunctionProps) => ({
bg: props.colorMode === "light" ? "gray.100" : "gray.600",
_hover: {
bg: props.colorMode === "light" ? "gray.200" : "#3D4A60",
},
_active: {
bg: props.colorMode === "light" ? "gray.300" : "#374254",
},
borderRadius: "lg",
}),
// gradient: (props: StyleFunctionProps) => ({
// bg: `linear-gradient(${white}, ${bgColor}) padding-box,
// linear-gradient(135deg, ${lgFrom}, ${lgTo}) border-box`,
// }),
},
},
};
const breakpoints = {
sm: "640px",
md: "768px",
lg: "1024px",
xl: "1280px",
"2xl": "1536px",
};
const styles = {
global: (props) => ({
main: {
fontFamily: "Inter",
},
header: {
fontFamily: "Inter",
},
}),
};
export const theme = extendTheme({ config, styles, components, breakpoints });