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

Added hover animations for nav icons #11075

Merged
merged 22 commits into from
Oct 3, 2023
Merged

Added hover animations for nav icons #11075

Changes from all commits
Commits
Show all changes
22 commits
Select commit Hold shift + click to select a range
dab763a
Added hover animations for nav icons
rohan9024 Jul 28, 2023
176aa5f
Removed rotation on translation icon
rohan9024 Aug 1, 2023
37e05c7
Rotated the globe icon to 10 degrees and added the languages text back
rohan9024 Aug 11, 2023
67a3cd6
Tried fixing the merge conflicts in yarn lock file related to lodash.…
rohan9024 Aug 11, 2023
a41da63
Tried another way of fixing the conflict
rohan9024 Aug 12, 2023
e6c49f0
Made the requested changes in previous PR
rohan9024 Aug 26, 2023
a199ecf
Update src/components/Nav/index.tsx
rohan9024 Sep 19, 2023
0c7d993
Update src/components/Nav/index.tsx
rohan9024 Sep 19, 2023
59b5d0a
Apply suggestions from code review
rohan9024 Sep 19, 2023
4f26736
Update src/components/Nav/index.tsx
rohan9024 Sep 19, 2023
edcd953
Update src/components/Nav/index.tsx
rohan9024 Sep 19, 2023
f9eeaa8
Update src/components/Nav/index.tsx
rohan9024 Sep 19, 2023
bbb6094
Made changes according to the suggestions received.
rohan9024 Sep 19, 2023
454130f
Merge branch 'dev' of https://github.com/rohan9024/ethereum-org-websi…
rohan9024 Sep 19, 2023
08ba7bc
Removed the nested buttonlink
rohan9024 Sep 21, 2023
0d6fc25
Update src/components/Nav/index.tsx
rohan9024 Sep 22, 2023
dee0a07
Reverted back the yarn.lock changes, removed some unnecessary comments
rohan9024 Sep 22, 2023
d65bb11
Reverted back the yarn.lock changes, removed some unnecessary comments
rohan9024 Sep 22, 2023
9311542
Removed additional transitions on languages icon
rohan9024 Sep 22, 2023
a2be603
Merge branch 'ethereum:dev' into dev
rohan9024 Sep 30, 2023
cbe201b
cleanup code and add rotate on icon for language
corwintines Oct 3, 2023
51921ae
undo yarn.lock changes
corwintines Oct 3, 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
13 changes: 13 additions & 0 deletions src/components/Nav/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,7 @@ const Nav: FC<IProps> = ({ path }) => {
/>
<HStack spacing={2} hideBelow="lg">
<IconButton
transition="transform 0.5s, color 0.2s"
icon={isDarkTheme ? <MdWbSunny /> : <MdBrightness2 />}
aria-label={
isDarkTheme
Expand All @@ -91,14 +92,26 @@ const Nav: FC<IProps> = ({ path }) => {
variant="ghost"
isSecondary
px={1.5}
_hover={{
transform: "rotate(10deg)",
color: "primary.hover",
}}
onClick={toggleColorMode}
></IconButton>
<ButtonLink
to={`/languages/${fromPageParameter}`}
transition="color 0.2s"
leftIcon={<Icon as={MdLanguage} />}
variant="ghost"
isSecondary
px={1.5}
_hover={{
color: "primary.hover",
"& svg": {
transform: "rotate(10deg)",
transition: "transform 0.5s",
},
}}
>
{t("languages")} {i18n.language.toUpperCase()}
</ButtonLink>
Expand Down
Loading