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.

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

feat(web): style my courts (in dashboard) for desktop version #1305

Merged
merged 33 commits into from
Nov 7, 2023

Conversation

kemuru
Copy link
Contributor

@kemuru kemuru commented Oct 27, 2023

Ended up doing more V2 things in this PR:

  • Added all the Mini Guides (linked them in their corresponding components), including the Onboarding one in the Help component in Navbar)
  • Created a new query for fetching jurors' stakes, redid structure of CourtCard and made Header
  • Touched styling across different places
  • Added Skeletons in EvidenceCards
  • Styled Dashboard JurorInfo
  • Few more things probably

PR-Codex overview

Focus of this PR:

This PR focuses on making various styling changes and adding new components to the codebase.

Detailed summary:

  • Updated the width of several elements to 86vw instead of 82%.
  • Added a new component CourtBranch to display the court name.
  • Updated the width of the Popup component to 86vw.
  • Updated the padding and width of the StyledTabs component.
  • Updated the margin-top and justify-content of the StatsAndFilters component.
  • Updated the display and margin properties of the HelpIcon component.
  • Updated the display, color, and gap properties of the Container component.
  • Added a new component Stake to display the stake value.
  • Added a new component StyledSkeletonEvidenceCard to display a skeleton card.
  • Updated the margin property of the SeparatorLabel component.
  • Updated the color property of the StyledLabel component.
  • Updated the gap property of the MobileCard component.
  • Updated the gap property of the HeaderRewardsAndRewards component.
  • Updated the gap property of the HeaderCoherencyAndCoherency component.
  • Added a new component CourtCard to display court information.
  • Removed the Debug component from the NavBar component.
  • Added a new component Stake to display the stake value.
  • Added a new component HowItWorks to display a mini guide.
  • Added a new component LockedStake to display the locked stake value.
  • Added a new component CourtBranch to display the court branch.
  • Added a new hook useJurorStakeDetailsQuery to fetch juror stake details.
  • Updated the margin property of the StyledTitle component.
  • Added a new component VotingModule to display a mini guide.
  • Added a new component CrowdfundAppeal to display a mini guide.
  • Updated the import statement of the HowItWorks component.
  • Updated the import statement of the HowItWorks component.
  • Added a new component JurorLevels to display a mini guide.

The following files were skipped due to too many changes: web/src/pages/Home/TopJurors/Header/index.tsx, web/src/components/Popup/MiniGuides/Staking/Notifications.tsx, web/src/components/Popup/MiniGuides/Onboarding/PnkLogoAndTitle.tsx, web/src/components/Popup/MiniGuides/Staking/StakingSection.tsx, web/src/pages/Dashboard/Courts/Header/index.tsx, web/src/components/Popup/MiniGuides/Appeal/StageTwo.tsx, web/src/pages/Cases/CaseDetails/Appeal/Classic/index.tsx, web/src/pages/Cases/CaseDetails/Appeal/AppealHistory.tsx, web/src/pages/Dashboard/Courts/Header/LockedStake.tsx, web/src/pages/Dashboard/Courts/CourtCard/DesktopCard.tsx, web/src/components/Popup/MiniGuides/Staking/JurorRewards.tsx, web/src/pages/Cases/CaseDetails/Appeal/index.tsx, web/src/pages/Home/TopJurors/Header/HowItWorks.tsx, web/src/components/Popup/MiniGuides/BinaryVoting/index.tsx, web/src/components/Popup/MiniGuides/Appeal/StageOne.tsx, web/src/components/Popup/MiniGuides/RankedVoting/index.tsx, web/src/components/Popup/MiniGuides/RankedVoting/VotingModule.tsx, web/src/components/Popup/MiniGuides/Onboarding/WhatDoINeed.tsx, web/src/components/Popup/MiniGuides/Appeal/PayoffSimulator.tsx, web/src/pages/Dashboard/Courts/CourtCard/MobileCard.tsx, web/src/components/CasesDisplay/Search.tsx, web/src/components/Popup/MiniGuides/Appeal/index.tsx, web/src/pages/Cases/CaseDetails/Evidence/index.tsx, web/src/layout/Header/navbar/Menu/Help.tsx, web/src/assets/svgs/styled/pnk.svg, web/src/pages/Dashboard/Courts/index.tsx, web/src/components/Popup/MiniGuides/Staking/CourtHeader.tsx, web/src/components/Popup/MiniGuides/Staking/index.tsx, web/src/pages/Dashboard/JurorInfo/Header.tsx, web/src/components/Popup/MiniGuides/PageContentsTemplate.tsx, web/src/pages/Courts/CourtDetails/index.tsx, web/src/components/Popup/MiniGuides/Onboarding/index.tsx, web/src/components/Popup/MiniGuides/Template.tsx, web/src/components/Popup/MiniGuides/Level.tsx, web/src/assets/svgs/mini-guides/binary-voting/voting-module.svg, web/src/assets/svgs/mini-guides/onboarding/how-it-works.svg, web/src/assets/svgs/mini-guides/staking/juror-rewards.svg, web/src/assets/svgs/mini-guides/staking/staking-section.svg, web/src/assets/svgs/mini-guides/ranked-voting/voting-module.svg, web/src/assets/svgs/mini-guides/staking/notifications.svg, web/src/assets/svgs/mini-guides/appeal/stage-two.svg, web/src/assets/svgs/mini-guides/appeal/stage-one.svg, web/src/assets/svgs/mini-guides/appeal/crowdfund-appeal.svg, web/src/assets/svgs/mini-guides/appeal/payoff-simulator.svg, web/src/assets/svgs/mini-guides/onboarding/what-do-i-need.svg, web/src/assets/svgs/mini-guides/staking/court-header.svg

✨ Ask PR-Codex anything about this PR by commenting with /codex {your question}

@netlify
Copy link

netlify bot commented Oct 27, 2023

Deploy Preview for kleros-v2 ready!

Name Link
🔨 Latest commit 25c969b
🔍 Latest deploy log https://app.netlify.com/sites/kleros-v2/deploys/654a5076779a8a000896c002
😎 Deploy Preview https://deploy-preview-1305--kleros-v2.netlify.app/
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@kemuru kemuru changed the title feat(web): style my courts dashboard for desktop version feat(web): style my courts (in dashboard) for desktop version Oct 27, 2023
@kemuru kemuru marked this pull request as ready for review November 1, 2023 00:49
@kemuru kemuru requested a review from alcercu November 1, 2023 00:49
@jaybuidl jaybuidl added this to the testnet-2.1 milestone Nov 1, 2023
Copy link

codeclimate bot commented Nov 7, 2023

Code Climate has analyzed commit 25c969b and detected 47 issues on this pull request.

Here's the issue category breakdown:

Category Count
Complexity 1
Duplication 38
Style 8

View more on Code Climate.

Copy link

sonarqubecloud bot commented Nov 7, 2023

Kudos, SonarCloud Quality Gate passed!    Quality Gate passed

Bug A 0 Bugs
Vulnerability A 0 Vulnerabilities
Security Hotspot A 0 Security Hotspots
Code Smell A 3 Code Smells

No Coverage information No Coverage information
0.0% 0.0% Duplication

Copy link
Contributor

@alcercu alcercu left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm

@alcercu alcercu added this pull request to the merge queue Nov 7, 2023
Merged via the queue into dev with commit fd9862b Nov 7, 2023
@jaybuidl jaybuidl deleted the feat(web)/mobile-version-my-courts-dashboard branch December 12, 2023 23:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add debug information in Desktop layout Mini-guide: Staking onboarding
3 participants