Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add missing link to Semaphore X account #478

Merged
merged 3 commits into from
Dec 19, 2023
Merged

Add missing link to Semaphore X account #478

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
7d57070
refactor: update colors
0xjei Dec 13, 2023
712d6e1
refactor: add missing X button
0xjei Dec 14, 2023
831a660
refactor: add X link to footer and navbar
0xjei Dec 19, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion apps/website/src/components/ActionCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ export default function ActionCard({ title, description, buttonText, buttonUrl }
href={buttonUrl}
isExternal
variant="buttonlink"
bg="semaphore"
bgGradient="semaphore"
w="fit-content"
lineHeight="24px"
fontSize={{ base: "14px", md: "18px", lg: "20px" }}
Expand Down
5 changes: 1 addition & 4 deletions apps/website/src/components/CodeBlock.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,11 +26,8 @@ export default function CodekBlock({ text }: CodekBlockProps) {
<Flex flex="1" overflow="auto" position="relative" borderRadius="8px" backgroundColor="darkBlue">
<CodeBlock {...copyBlockProps} />
<Button
textColor="alabaster.300"
variant="outline"
fontSize={{ base: "16px", md: "18px" }}
fontWeight="400"
borderColor="alabaster.800"
backgroundColor="darkBlue"
padding="5px 8px"
border="1px"
borderRadius="4px"
Expand Down
58 changes: 35 additions & 23 deletions apps/website/src/components/Footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import NextLink from "next/link"
import IconArrowUpRight from "../icons/IconArrowUpRight"
import IconDiscord from "../icons/IconDiscord"
import IconThumbsUp from "../icons/IconThumbsUp"
import IconX from "@/icons/IconX"

export default function Footer() {
return (
Expand Down Expand Up @@ -56,32 +57,43 @@ export default function Footer() {
</Stack>

<Divider />

<VStack spacing="5">
<Link href="https://semaphore.pse.dev/discord" isExternal>
<HStack>
<IconDiscord boxSize={{ base: "16px", md: "24px" }} />
<Heading fontSize={{ base: "14px", md: "18px" }} fontWeight="normal">
Discord
</Heading>
</HStack>
</Link>
<HStack spacing="5">
<Link href="https://semaphore.pse.dev/discord" isExternal>
<HStack>
<IconDiscord boxSize={{ base: "16px", md: "24px" }} />
<Heading fontSize={{ base: "14px", md: "18px" }} fontWeight="normal">
Discord
</Heading>
</HStack>
</Link>
<Link href="https://x.com/SemaphoreDevs" isExternal>
<HStack>
<IconX boxSize={{ base: "16px", md: "24px" }} />
<Heading fontSize={{ base: "14px", md: "18px" }} fontWeight="normal">
Twitter
</Heading>
</HStack>
</Link>
</HStack>

<Link
href="https://github.com/semaphore-protocol/semaphore/discussions/new?category=website"
isExternal
>
<HStack>
<IconThumbsUp boxSize={{ base: "16px", md: "24px" }} />
<Heading fontSize={{ base: "14px", md: "18px" }} fontWeight="normal">
Give feedback about the website
</Heading>
</HStack>
</Link>
<VStack spacing="8">
<Link
href="https://github.com/semaphore-protocol/semaphore/discussions/new?category=website"
isExternal
>
<HStack>
<IconThumbsUp boxSize={{ base: "16px", md: "24px" }} />
<Heading fontSize={{ base: "14px", md: "18px" }} fontWeight="normal">
Give feedback about the website
</Heading>
</HStack>
</Link>

<Text fontSize={{ base: "12px", md: "14px" }} color="text.500" pt="2">
Copyright © 2023 Ethereum Foundation
</Text>
<Text fontSize={{ base: "12px", md: "14px" }} color="text.500" pt="2">
Copyright © 2023 Ethereum Foundation
</Text>
</VStack>
</VStack>
</VStack>
)
Expand Down
57 changes: 35 additions & 22 deletions apps/website/src/components/Navbar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ import IconDiscord from "../icons/IconDiscord"
import IconMenu from "../icons/IconMenu"
import IconThumbsUp from "../icons/IconThumbsUp"
import NavbarLinks from "./NavbarLinks"
import IconX from "@/icons/IconX"

export default function Navbar() {
const { isOpen, onOpen, onClose } = useDisclosure()
Expand Down Expand Up @@ -69,30 +70,42 @@ export default function Navbar() {
<Divider mb="20" />

<VStack w="full" justify="center" spacing="5">
<Link href="https://semaphore.pse.dev/discord" isExternal>
<HStack>
<IconDiscord boxSize="16px" />
<Heading fontSize="14px" fontWeight="normal">
Discord
</Heading>
</HStack>
</Link>
<HStack spacing="5">
<Link href="https://semaphore.pse.dev/discord" isExternal>
<HStack>
<IconDiscord boxSize={{ base: "16px", md: "24px" }} />
<Heading fontSize={{ base: "14px", md: "18px" }} fontWeight="normal">
Discord
</Heading>
</HStack>
</Link>
<Link href="https://x.com/SemaphoreDevs" isExternal>
<HStack>
<IconX boxSize={{ base: "16px", md: "24px" }} />
<Heading fontSize={{ base: "14px", md: "18px" }} fontWeight="normal">
Twitter
</Heading>
</HStack>
</Link>
</HStack>

<Link
href="https://github.com/semaphore-protocol/semaphore/discussions/categories/website"
isExternal
>
<HStack>
<IconThumbsUp boxSize="16px" />
<Heading fontSize="14px" fontWeight="normal">
Give feedback about the website
</Heading>
</HStack>
</Link>
<VStack spacing="8">
<Link
href="https://github.com/semaphore-protocol/semaphore/discussions/new?category=website"
isExternal
>
<HStack>
<IconThumbsUp boxSize={{ base: "16px", md: "24px" }} />
<Heading fontSize={{ base: "14px", md: "18px" }} fontWeight="normal">
Give feedback about the website
</Heading>
</HStack>
</Link>

<Text fontSize="12px" color="text.500" pt="2">
Copyright © 2023 Ethereum Foundation
</Text>
<Text fontSize={{ base: "12px", md: "14px" }} color="text.500" pt="2">
Copyright © 2023 Ethereum Foundation
</Text>
</VStack>
</VStack>
</DrawerFooter>
</DrawerContent>
Expand Down
3 changes: 0 additions & 3 deletions apps/website/src/components/ProjectsList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,6 @@ export default function ProjectsList(props: any) {
size="lg"
leftIcon={<IconPSE />}
variant={onlyPSE === true ? "solid" : "outline"}
colorScheme={onlyPSE === true ? "primary" : "inherit"}
onClick={() => setOnlyPSE(onlyPSE === true ? null : true)}
>
PSE
Expand All @@ -67,7 +66,6 @@ export default function ProjectsList(props: any) {
size="lg"
leftIcon={<IconCommunity />}
variant={onlyPSE === false ? "solid" : "outline"}
colorScheme={onlyPSE === false ? "primary" : "inherit"}
onClick={() => setOnlyPSE(onlyPSE === false ? null : false)}
>
Community
Expand All @@ -83,7 +81,6 @@ export default function ProjectsList(props: any) {
key={category}
size="sm"
variant={selectedCategories.includes(category) ? "solid" : "outline"}
colorScheme={selectedCategories.includes(category) ? "primary" : "inherit"}
onClick={() => {
const newCategories = selectedCategories.includes(category)
? selectedCategories.filter((c) => c !== category)
Expand Down
4 changes: 2 additions & 2 deletions apps/website/src/components/ToolsCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,10 +51,10 @@ export default function ToolsCard({ icon, title, subtitle, details, url }: Tools
py="10px"
mt="24px"
w="full"
bg="semaphore"
bgGradient="semaphore"
color="white"
fontSize="18px"
_hover={{ bg: "semaphore", opacity: "85%" }}
_hover={{ bgGradient: "semaphore", opacity: "85%" }}
>
Select tool
</Link>
Expand Down
4 changes: 2 additions & 2 deletions apps/website/src/icons/IconDiscord.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,9 @@ import React from "react"

export default function IconDiscord(props: IconProps): JSX.Element {
return (
<Icon viewBox="0 0 287 219" {...props}>
<Icon viewBox="0 0 24 19" {...props}>
<path
d="M242.512 18.6526C224.277 10.2853 204.722 4.12073 184.276 0.590006C183.904 0.521864 183.532 0.692155 183.34 1.03274C180.825 5.50573 178.039 11.3411 176.088 15.9277C154.098 12.6354 132.22 12.6354 110.68 15.9277C108.729 11.2392 105.842 5.50573 103.316 1.03274C103.124 0.703518 102.752 0.533228 102.379 0.590006C81.9449 4.10945 62.3901 10.2741 44.1433 18.6526C43.9854 18.7207 43.85 18.8343 43.7601 18.9818C6.6687 74.3955 -3.49219 128.447 1.4924 181.829C1.51495 182.09 1.66156 182.34 1.86455 182.499C26.3364 200.47 50.0416 211.381 73.3065 218.612C73.6789 218.726 74.0734 218.59 74.3103 218.283C79.8137 210.768 84.7194 202.843 88.9256 194.51C89.1738 194.022 88.9369 193.443 88.4295 193.25C80.6482 190.298 73.2388 186.699 66.1115 182.612C65.5478 182.283 65.5026 181.477 66.0213 181.091C67.5211 179.967 69.0214 178.797 70.4535 177.617C70.7126 177.401 71.0737 177.356 71.3783 177.492C118.202 198.87 168.893 198.87 215.164 177.492C215.469 177.344 215.83 177.39 216.1 177.605C217.533 178.786 219.033 179.967 220.544 181.091C221.062 181.477 221.029 182.283 220.465 182.612C213.338 186.779 205.928 190.298 198.136 193.238C197.628 193.432 197.403 194.022 197.651 194.51C201.947 202.832 206.853 210.756 212.255 218.272C212.48 218.59 212.886 218.726 213.259 218.612C236.636 211.381 260.341 200.47 284.813 182.499C285.028 182.34 285.163 182.101 285.186 181.84C291.151 120.125 275.194 66.5167 242.884 18.9931C242.805 18.8343 242.67 18.7207 242.512 18.6526ZM95.9179 149.325C81.8208 149.325 70.2053 136.383 70.2053 120.489C70.2053 104.594 81.5956 91.6522 95.9179 91.6522C110.353 91.6522 121.856 104.708 121.63 120.489C121.63 136.383 110.24 149.325 95.9179 149.325ZM190.986 149.325C176.889 149.325 165.274 136.383 165.274 120.489C165.274 104.594 176.663 91.6522 190.986 91.6522C205.421 91.6522 216.924 104.708 216.698 120.489C216.698 136.383 205.421 149.325 190.986 149.325Z"
d="M20.242 1.68563C18.7262 0.990122 17.1007 0.4777 15.4012 0.184215C15.3703 0.17855 15.3393 0.192705 15.3234 0.221016C15.1144 0.592826 14.8828 1.07788 14.7206 1.45913C12.8927 1.18547 11.0741 1.18547 9.28367 1.45913C9.12148 1.06941 8.88152 0.592826 8.67153 0.221016C8.65559 0.19365 8.62467 0.179495 8.59372 0.184215C6.89513 0.476762 5.26967 0.989184 3.75294 1.68563C3.73981 1.69129 3.72855 1.70074 3.72108 1.713C0.637926 6.31917 -0.206681 10.8121 0.207655 15.2494C0.20953 15.2711 0.221716 15.2919 0.23859 15.3051C2.27277 16.7989 4.24322 17.7058 6.17708 18.3069C6.20803 18.3164 6.24082 18.3051 6.26052 18.2796C6.71797 17.6549 7.12576 16.9962 7.47539 16.3035C7.49602 16.2629 7.47632 16.2148 7.43415 16.1987C6.78734 15.9534 6.17145 15.6542 5.57901 15.3145C5.53215 15.2871 5.5284 15.2201 5.57151 15.188C5.69618 15.0946 5.82088 14.9974 5.93993 14.8992C5.96147 14.8813 5.99148 14.8775 6.0168 14.8889C9.90891 16.6659 14.1226 16.6659 17.9688 14.8889C17.9941 14.8766 18.0241 14.8804 18.0466 14.8983C18.1656 14.9965 18.2903 15.0946 18.4159 15.188C18.459 15.2201 18.4562 15.2871 18.4094 15.3145C17.8169 15.6608 17.201 15.9534 16.5533 16.1978C16.5111 16.2138 16.4924 16.2629 16.513 16.3035C16.8701 16.9952 17.2779 17.6539 17.7269 18.2786C17.7457 18.3051 17.7794 18.3164 17.8104 18.3069C19.7536 17.7058 21.724 16.7989 23.7582 15.3051C23.776 15.2919 23.7873 15.272 23.7892 15.2503C24.285 10.1204 22.9586 5.66426 20.2729 1.71394C20.2663 1.70074 20.2551 1.69129 20.242 1.68563ZM8.05661 12.5476C6.88482 12.5476 5.9193 11.4718 5.9193 10.1506C5.9193 8.8294 6.86609 7.75361 8.05661 7.75361C9.25647 7.75361 10.2126 8.83884 10.1939 10.1506C10.1939 11.4718 9.24709 12.5476 8.05661 12.5476ZM15.959 12.5476C14.7872 12.5476 13.8217 11.4718 13.8217 10.1506C13.8217 8.8294 14.7684 7.75361 15.959 7.75361C17.1589 7.75361 18.115 8.83884 18.0963 10.1506C18.0963 11.4718 17.1589 12.5476 15.959 12.5476Z"
fill="currentColor"
/>
</Icon>
Expand Down
13 changes: 13 additions & 0 deletions apps/website/src/icons/IconX.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
import { Icon, IconProps } from "@chakra-ui/react"
import React from "react"

export default function IconX(props: IconProps): JSX.Element {
return (
<Icon viewBox="0 0 18 25" {...props}>
<path
d="M6.74309 13.629L0 5.25H5.34101L9.50347 10.4288L13.9504 5.27332H16.8919L10.9257 12.1984L18 21H12.6749L8.16784 15.3994L3.35607 20.9845H0.398583L6.74309 13.629ZM13.4511 19.4475L3.27493 6.80249H4.56424L14.7276 19.4475H13.4511Z"
fill="currentColor"
/>
</Icon>
)
}
5 changes: 1 addition & 4 deletions apps/website/src/styles/colors.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,7 @@ const colors = {
darkBlue: "#0E101B",
darkBlueBg: "#00020D",
ceruleanBlue: "#3555DF",
// TODO: This can be replaced by using the 'bgGradient' Chakra property.
// and the existing primary color scheme.
// The value is: "linear(to-r, primary.500, primary.800)"
semaphore: "linear-gradient(92.32deg, #4771EA -33.31%, #2735A6 112.52%)",
semaphore: "linear(to-r, primary.500, primary.800)",
alabaster: {
300: "#B8B9C1",
400: "#92939E",
Expand Down
45 changes: 21 additions & 24 deletions apps/website/src/styles/components/Button.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import { StyleFunctionProps, SystemStyleObject } from "@chakra-ui/theme-tools"
import { font } from "../styles"
import colors from "../colors"

const Button = {
baseStyle: {
Expand All @@ -13,42 +14,38 @@ const Button = {
paddingRight: "18px !important"
},
defaultProps: {
colorScheme: "white"
colorScheme: "#FFFFFF"
},
variants: {
solid: (props: StyleFunctionProps): SystemStyleObject => {
const { colorScheme: c } = props

if (c === "primary") {
// const bgGradient = "linear(to-r, primary.500, primary.800)"
const bg = `${c}.500`
const color = "white"

return {
bg,
color,
_hover: {
bg: `${c}.800`,
_disabled: {
bg
}
},
_active: { bg: `${c}.800` }
return {
bg: c,
color: colors.darkBlueBg,
_hover: {
color: c,
bgGradient: colors.semaphore,
_disabled: {
bg: c
}
}
}

const bg = c
},
outline: (props: StyleFunctionProps): SystemStyleObject => {
const { colorScheme: c } = props

return {
bg,
color: `darkBlue`,
color: c,
border: `1.2px solid ${c}`,
_hover: {
bg: `${c}.300`,
bg: colors.darkBlueBg,
color: c,
border: `1.2px solid ${colors.primary["600"]}`,
_disabled: {
bg
bg: c
}
},
_active: { bg: `${c}.400` }
}
}
}
}
Expand Down
Loading