Skip to content

Commit 4269a5c

Browse files
jaybuidljaybuidl
authored
Merge pull request #1803 from kleros/dev
Release v2-testnet-4.0.3
2 parents 4bb9c1d + 6ccef13 commit 4269a5c

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

54 files changed

+220
-213
lines changed

‎web-devtools/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@
4848
},
4949
"dependencies": {
5050
"@kleros/kleros-sdk": "workspace:^",
51-
"@kleros/ui-components-library": "^2.15.0",
51+
"@kleros/ui-components-library": "^2.19.0",
5252
"@tanstack/react-query": "^5.61.0",
5353
"@wagmi/connectors": "^5.5.0",
5454
"@wagmi/core": "^2.15.0",

‎web-devtools/src/app/(main)/(homepage)/page.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import Tools from "./Tools";
1212
const Container = styled.div`
1313
width: 100%;
1414
background-color: ${({ theme }) => theme.klerosUIComponentsLightBackground};
15-
padding: ${responsiveSize(32, 72)} ${responsiveSize(24, 132)} ${responsiveSize(76, 96)};
15+
padding: ${responsiveSize(32, 72)} ${responsiveSize(8, 132)} ${responsiveSize(76, 96)};
1616
max-width: 1780px;
1717
margin: 0 auto;
1818
`;

‎web/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,7 @@
8181
"@kleros/kleros-app": "^2.0.1",
8282
"@kleros/kleros-sdk": "workspace:^",
8383
"@kleros/kleros-v2-contracts": "workspace:^",
84-
"@kleros/ui-components-library": "^2.18.0",
84+
"@kleros/ui-components-library": "^2.19.0",
8585
"@lifi/wallet-management": "^3.4.6",
8686
"@lifi/widget": "^3.12.3",
8787
"@sentry/react": "^7.120.0",

‎web/src/assets/svgs/hero/hero-darkmode-desktop.svg

+41-42
Loading

‎web/src/assets/svgs/hero/hero-darkmode-mobile.svg

+4-4
Loading

‎web/src/components/CasesDisplay/index.tsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -22,10 +22,11 @@ const TitleContainer = styled.div`
2222

2323
const StyledTitle = styled.h1`
2424
margin: 0px;
25+
font-size: ${responsiveSize(20, 24)};
2526
`;
2627

2728
const StyledLabel = styled.label`
28-
font-size: 16px;
29+
font-size: ${responsiveSize(14, 16)};
2930
`;
3031

3132
interface ICasesDisplay extends ICasesGrid {

‎web/src/components/DisputePreview/DisputeContext.tsx

+25-15
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,8 @@ import { ExternalLink } from "../ExternalLink";
1919
const StyledH1 = styled.h1`
2020
margin: 0;
2121
word-wrap: break-word;
22+
font-size: ${responsiveSize(18, 24)};
23+
line-height: 24px;
2224
`;
2325

2426
const ReactMarkdownWrapper = styled.div`
@@ -36,17 +38,25 @@ const VotingOptions = styled.div`
3638
const AnswersContainer = styled.div`
3739
display: flex;
3840
flex-direction: column;
41+
gap: ${responsiveSize(4, 2)};
3942
`;
4043

41-
const AnswersHeader = styled.h3`
44+
const AnswersHeader = styled.small`
4245
margin: 0;
4346
`;
4447

45-
const Answer = styled.div`
46-
margin: 0px;
47-
display: flex;
48-
flex-wrap: wrap;
49-
gap: 6px;
48+
export const AnswerTitleAndDescription = styled.div`
49+
display: block;
50+
`;
51+
52+
export const AnswerTitle = styled.small`
53+
display: inline;
54+
`;
55+
56+
export const AnswerDescription = styled.small`
57+
display: inline;
58+
font-weight: 400;
59+
color: ${({ theme }) => theme.secondaryText};
5060
`;
5161

5262
const AliasesContainer = styled.div`
@@ -62,11 +72,12 @@ interface IDisputeContext {
6272

6373
export const DisputeContext: React.FC<IDisputeContext> = ({ disputeDetails, isRpcError = false }) => {
6474
const errMsg = isRpcError ? RPC_ERROR : INVALID_DISPUTE_DATA_ERROR;
75+
6576
return (
6677
<>
6778
<StyledH1>{isUndefined(disputeDetails) ? <StyledSkeleton /> : (disputeDetails?.title ?? errMsg)}</StyledH1>
68-
{!isUndefined(disputeDetails) ? (
69-
<>
79+
{disputeDetails?.question?.trim() || disputeDetails?.description?.trim() ? (
80+
<div>
7081
{disputeDetails?.question?.trim() ? (
7182
<ReactMarkdownWrapper>
7283
<ReactMarkdown>{disputeDetails.question}</ReactMarkdown>
@@ -77,7 +88,7 @@ export const DisputeContext: React.FC<IDisputeContext> = ({ disputeDetails, isRp
7788
<ReactMarkdown>{disputeDetails.description}</ReactMarkdown>
7889
</ReactMarkdownWrapper>
7990
) : null}
80-
</>
91+
</div>
8192
) : null}
8293

8394
{isUndefined(disputeDetails?.frontendUrl) ? null : (
@@ -89,12 +100,11 @@ export const DisputeContext: React.FC<IDisputeContext> = ({ disputeDetails, isRp
89100
{isUndefined(disputeDetails) ? null : <AnswersHeader>Voting Options</AnswersHeader>}
90101
<AnswersContainer>
91102
{disputeDetails?.answers?.map((answer: IAnswer, i: number) => (
92-
<Answer key={answer.title}>
93-
<small>
94-
<label>{i + 1}.</label> {answer.title}
95-
{answer.description.trim() ? ` - ${answer.description}` : null}
96-
</small>
97-
</Answer>
103+
<AnswerTitleAndDescription key={answer.title}>
104+
<label>{i + 1}. </label>
105+
<AnswerTitle>{answer.title}</AnswerTitle>
106+
<AnswerDescription>{answer.description.trim() ? ` - ${answer.description}` : null}</AnswerDescription>
107+
</AnswerTitleAndDescription>
98108
))}
99109
</AnswersContainer>
100110
</VotingOptions>

‎web/src/components/DisputePreview/Policies.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ const Container = styled.div`
1818
flex-direction: row;
1919
flex-wrap: wrap;
2020
gap: 8px 16px;
21-
padding: ${responsiveSize(16, 20)} ${responsiveSize(16, 32)};
21+
padding: ${responsiveSize(12, 20)} ${responsiveSize(8, 32)};
2222
background-color: ${({ theme }) => theme.mediumBlue};
2323
`;
2424

‎web/src/components/DisputeView/DisputeCardView.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ const StyledCard = styled(Card)`
2525

2626
const CardContainer = styled.div`
2727
height: calc(100% - 45px);
28-
padding: ${responsiveSize(20, 24)};
28+
padding: ${responsiveSize(20, 24)} ${responsiveSize(8, 24)};
2929
display: flex;
3030
flex-direction: column;
3131
justify-content: space-between;

‎web/src/components/DisputeView/PeriodBanner.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ const Container = styled.div<IContainer>`
2020
align-items: center;
2121
gap: 8px;
2222
justify-content: space-between;
23-
padding: 0 ${({ isCard }) => (isCard ? "24px" : responsiveSize(8, 24, 900))};
23+
padding: 0 ${({ isCard }) => (isCard ? responsiveSize(8, 24) : responsiveSize(8, 24, 900))};
2424
flex-shrink: 0;
2525
${({ frontColor, backgroundColor, isCard }) => {
2626
return `

‎web/src/components/EvidenceCard.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -30,8 +30,8 @@ const StyledCard = styled(Card)`
3030
const TopContent = styled.div`
3131
display: flex;
3232
flex-direction: column;
33-
padding: ${responsiveSize(8, 24)};
34-
gap: ${responsiveSize(4, 8)};
33+
padding: ${responsiveSize(8, 20)} ${responsiveSize(8, 24)};
34+
gap: 4px;
3535
overflow-wrap: break-word;
3636
3737
> * {

‎web/src/components/FavoriteCases.tsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -14,11 +14,12 @@ import DisputeView from "components/DisputeView";
1414
import { SkeletonDisputeCard } from "components/StyledSkeleton";
1515

1616
const Container = styled.div`
17-
margin-top: ${responsiveSize(48, 80)};
17+
margin-top: ${responsiveSize(24, 48)};
1818
`;
1919

2020
const Title = styled.h1`
2121
margin-bottom: 4px;
22+
font-size: ${responsiveSize(20, 24)};
2223
`;
2324

2425
const DisputeContainer = styled.div`

‎web/src/components/LatestCases.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ const Container = styled.div`
1818

1919
const Title = styled.h1`
2020
margin-bottom: ${responsiveSize(12, 24)};
21+
font-size: ${responsiveSize(20, 24)};
2122
`;
2223

2324
const DisputeContainer = styled.div`

‎web/src/components/OverlayPortal.tsx

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import React from "react";
2+
import ReactDOM from "react-dom";
3+
import styled from "styled-components";
4+
5+
const PortalContainer = styled.div`
6+
position: fixed;
7+
top: 0;
8+
left: 0;
9+
z-index: 9999;
10+
width: 100%;
11+
height: 100%;
12+
`;
13+
14+
const OverlayPortal: React.FC<{ children: React.ReactNode }> = ({ children }) => {
15+
return ReactDOM.createPortal(<PortalContainer>{children}</PortalContainer>, document.body);
16+
};
17+
18+
export default OverlayPortal;

‎web/src/components/Verdict/Answer.tsx

+6-7
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ import styled from "styled-components";
33

44
import { Answer } from "@kleros/kleros-sdk/src/dataMappings/utils/disputeDetailsTypes";
55

6+
import { AnswerDescription, AnswerTitle, AnswerTitleAndDescription } from "../DisputePreview/DisputeContext";
7+
68
const Container = styled.div`
79
display: flex;
810
flex-direction: row;
@@ -20,13 +22,10 @@ const AnswerDisplay: React.FC<IAnswer> = ({ answer, currentRuling }) => {
2022
return (
2123
<>
2224
{answer ? (
23-
<Container>
24-
<small>
25-
{answer.title}
26-
{answer.description.trim() ? " -" : null}
27-
</small>
28-
<small>{answer.description.trim()}</small>
29-
</Container>
25+
<AnswerTitleAndDescription>
26+
<AnswerTitle>{answer.title}</AnswerTitle>
27+
<AnswerDescription>{answer.description.trim() ? ` - ${answer.description}` : null}</AnswerDescription>
28+
</AnswerTitleAndDescription>
3029
) : (
3130
<Container>
3231
{currentRuling !== 0 ? <small>Answer 0x{currentRuling}</small> : <small>Refuse to Arbitrate</small>}

‎web/src/components/Verdict/FinalDecision.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,6 @@ const VerdictContainer = styled.div`
5353

5454
const JuryDecisionTag = styled.small`
5555
font-weight: 400;
56-
line-height: 19px;
5756
color: ${({ theme }) => theme.secondaryText};
5857
`;
5958

‎web/src/components/Verdict/index.tsx

+3-1
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,15 @@
11
import React from "react";
22
import styled from "styled-components";
33

4+
import { responsiveSize } from "styles/responsiveSize";
5+
46
import DisputeTimeline from "./DisputeTimeline";
57
import FinalDecision from "./FinalDecision";
68

79
const Container = styled.div`
810
display: flex;
911
flex-wrap: wrap;
10-
gap: 24px;
12+
gap: ${responsiveSize(16, 24)};
1113
`;
1214

1315
interface IVerdict {

‎web/src/layout/Footer/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import { ExternalLink } from "components/ExternalLink";
1414
const Container = styled.div`
1515
height: 122px;
1616
width: 100%;
17-
background-color: ${({ theme }) => theme.primaryPurple};
17+
background-color: ${({ theme }) => (theme.name === "dark" ? theme.lightBlue : theme.primaryPurple)};
1818
display: flex;
1919
flex-direction: column;
2020
justify-content: center;

0 commit comments

Comments
 (0)