Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
9 changes: 9 additions & 0 deletions src/apps/admin/src/admin-app.routes.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,10 @@ const ChallengeManagementPage: LazyLoadedComponent = lazyLoad(
() => import('./challenge-management/ChallengeManagementPage'),
'ChallengeManagementPage',
)
const ChallengeDetailsPage: LazyLoadedComponent = lazyLoad(
() => import('./challenge-management/ChallengeDetailsPage'),
'ChallengeDetailsPage',
)
const ManageUserPage: LazyLoadedComponent = lazyLoad(
() => import('./challenge-management/ManageUserPage'),
'ManageUserPage',
Expand Down Expand Up @@ -193,6 +197,11 @@ export const adminRoutes: ReadonlyArray<PlatformRoute> = [
id: 'challenge-management-page',
route: '',
},
{
element: <ChallengeDetailsPage />,
id: 'challenge-details-page',
route: ':challengeId',
},
{
element: <ManageUserPage />,
id: 'manage-user',
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,87 @@
@import '@libs/ui/styles/includes';

.container {
display: flex;
flex-direction: column;
gap: $sp-6;
}

.headerButtons {
display: flex;
flex-wrap: wrap;
gap: $sp-3;
justify-content: flex-end;
}

.section {
display: flex;
flex-direction: column;
gap: $sp-3;
}

.sectionTitle {
margin: 0;
font-size: 20px;
line-height: 28px;
font-weight: 600;
}

.statusRow {
display: flex;
align-items: flex-end;
flex-wrap: wrap;
gap: $sp-3;
}

.winnersList {
display: flex;
flex-direction: column;
gap: $sp-3;
}

.winnerRow {
display: flex;
align-items: flex-end;
flex-wrap: wrap;
gap: $sp-3;
}

.selectWrapper {
Copy link

Choose a reason for hiding this comment

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

[⚠️ design]
The use of min-width: 360px; for .selectWrapper might cause layout issues on smaller screens. Consider using a responsive approach to ensure better adaptability across different screen sizes.

min-width: 360px;

:global(.input-el) {
margin-bottom: 0;
}
}

.sectionActions {
display: flex;
}

.apiResponse {
margin: 0;
max-height: 480px;
overflow: auto;
padding: $sp-4;
border: 1px solid #ddd;
border-radius: $sp-1;
background-color: #f7f7f7;
font-family: 'Courier New', Courier, monospace;
font-size: 12px;
line-height: 18px;
}

.loadingSpinnerContainer {
position: relative;
height: 100px;
margin-top: -30px;
Copy link

Choose a reason for hiding this comment

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

[⚠️ maintainability]
The negative margin margin-top: -30px; in .loadingSpinnerContainer can lead to unexpected layout shifts, especially if the surrounding elements change. Consider using a different layout strategy to avoid relying on negative margins.


.spinner {
background: none;
}
}

.noData {
margin: 0;
color: #555;
}
Loading
Loading