Skip to content

UI/UX Updates for Voting Window #85

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

Merged
jmanhart merged 8 commits into from
Aug 24, 2025
Merged

UI/UX Updates for Voting Window #85

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
6a36634
Commenting out the submit your demo here bit
jmanhart Aug 24, 2025
a10fb2a
Adding in the my votes tab on the project list
jmanhart Aug 24, 2025
ace3cc7
Adding in more vote indicators to the project list
jmanhart Aug 24, 2025
05a4401
Adding in the new project slector tab styles
jmanhart Aug 24, 2025
7349797
Adding in some final touches to the region bar
jmanhart Aug 24, 2025
b7834eb
adding in a fix so past years work with the new region selector
jmanhart Aug 24, 2025
c102285
Adding in the seer fix...thanks bro
jmanhart Aug 24, 2025
08a2236
Adding in an empty state for no votes cast
jmanhart Aug 24, 2025
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 src/components/MicroCountdownTimer/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ const MicroCountdownTimer = () => {
}, []);

if (timeLeft.days === 0) {
return <h3 className="micro-countdown">HACK NOW!!</h3>;
return <h3 className="micro-countdown">VOTE NOW!!</h3>;
}

return <h3 className="micro-countdown">{timeLeft.days} days away</h3>;
Expand Down
4 changes: 2 additions & 2 deletions src/components/PageHeader/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const PageHeader = ({
{title && <h2 className="page-header-title no-forced-lowercase">{title}</h2>}
{currentYear && <h2 className="page-header-title">{currentYear}</h2>}
</div>
<div className="page-header-action">
{/* <div className="page-header-action">
{showAddProjectButton && (
<Link to="/new-project">
<Button priority="primary" size="sm">
Expand All @@ -41,7 +41,7 @@ const PageHeader = ({
</Button>
</>
)}
</div>
</div> */}
</div>
);

Expand Down
2 changes: 1 addition & 1 deletion src/components/header/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ const Header = ({onLogin, onLogout, isAuthenticated, user, showMicroTimer = true
<div className="header-title-logo-container">
<img src={logoSentry} alt="Sentry Logo" className="header-logo" />
<h3 className="header-title">
<Link to="/">#HACKWEEK</Link>
<Link to="/projects?show=projects">#HACKWEEK</Link>
</h3>
</div>
{showMicroTimer && (
Expand Down
4 changes: 2 additions & 2 deletions src/components/header/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,8 +73,8 @@
}

.avatar-container-image {
max-width: 42px;
max-height: 42px;
max-width: 20px;
max-height: 20px;
}

.avatar-button {
Expand Down
52 changes: 52 additions & 0 deletions src/pages/ProjectList.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -383,6 +383,50 @@
color: var(--color-gray100);
}

.RegionToggle {
display: inline-flex;
background: var(--color-gray400);
border-radius: 10px;
padding: 2px;
}
.RegionToggle button {
appearance: none;
border: 0;
background: transparent;
padding: 0.6rem 0.8rem;
border-radius: 8px;
color: var(--color-gray300);
font-weight: 600;
cursor: pointer;
font-size: 14px;
}
.RegionToggle button:hover {
background: var(--color-gray200);
color: var(--color-gray300);
}
.RegionToggle button.active {
background: var(--color-blurple);
color: white;
}
.RegionToggle button .count {
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 1.25rem;
width: max-content;
padding: 0 0.25em;
min-width: 1.5em;
height: 1.5em;
border-radius: 0.75em;
background: var(--color-gray300);
color: #ffffff;
margin-left: 0.5em;
}
.RegionToggle button.active .count {
background: white;
color: var(--color-blurple);
}

@media (max-width: 639px) {
.Project-controls-right {
display: none;
Expand Down Expand Up @@ -495,6 +539,14 @@
background: #e9d8fd; /* lavender tint */
border: 1px solid #d2bfff;
}
.Tag--vote {
color: #1d1127; /* gray-100 */
background: #d1f2ff; /* light blue tint */
border: 1px solid #b5e6ff;
}
.Tag--vote .vote-label {
font-weight: 400; /* regular weight for "You Voted" */
}
.Tag--help {
color: #1d1127;
background: #ffd1ea; /* pink tint */
Expand Down
Loading