Skip to content
This repository was archived by the owner on Apr 20, 2023. It is now read-only.

brief dashboard #101

Open
cuteolaf wants to merge 7 commits into
base: imbue-enterprise
Choose a base branch
from
Open

brief dashboard #101

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
0af6781
fix route: /briefs/api
cuteolaf Mar 17, 2023
c97d674
fix style: brief details page
cuteolaf Mar 17, 2023
35322ec
feat: brief dashboard
cuteolaf Mar 17, 2023
ea68a78
style updates: brief dashboard
cuteolaf Mar 18, 2023
0732962
Merge branch 'imbue-enterprise' into cuteolaf/brief-dashboard
samelamin Mar 22, 2023
10ec0d0
fix for test
samelamin Mar 22, 2023
9653e03
Cuteolaf/brief dashboard (#111)
ssani7 Mar 23, 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
239 changes: 239 additions & 0 deletions api/public/brief-dashboard.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,239 @@
@tailwind base;
@tailwind components;
@tailwind utilities;

.text-primary {
color: var(--theme-primary);
}

.text-secondary {
color: var(--theme-secondary);
}

.container {
background: var(--theme-grey-dark);
border: 1px solid var(--theme-white);
border-radius: 20px;
padding: 50px;
}

.brief-info-wrapper {
display: flex;
flex-direction: column;
gap: 20px;
}

.brief-info {
display: flex;
flex-direction: row;
}

.brief-info .description {
display: flex;
flex-direction: column;
gap: 20px;
flex: 1 0 75%;
margin-right: 5%;
}

.brief-title {
display: flex;
flex-direction: row;
gap: 15px;
align-items: center;
}

h1,
h2,
h3 {
font-family: Aeoniktrial, sans-serif;
font-weight: 700;
}

h3{
font-size: 20px;
}

.clickable-text {
color: var(--theme-primary);
cursor: pointer;
}

.text-inactive {
color: rgba(255, 255, 255, 0.5);
}

.brief-info .insights {
display: flex;
flex-direction: column;
gap: 28px;
flex: 1 0 20%;
}

.insight-item {
display: flex;
flex-direction: row;
gap: 28px;
align-items: start;
}

.insight-value {
display: flex;
flex-direction: column;
gap: 8px;
}

.insight-value h3 {
margin: 0;
line-height: 1;
}

.insight-value.milestone {
flex-direction: row;
align-items: center;
gap: 10px;
}

.milestones-complete {
color: var(--theme-primary);
font-weight: 700;
}

.milestone-progress-indicator {
position: relative;
width: 100%;
height: 4px;
background: #1c2608;
border-radius: 8px;
}

.milestone-complete {
position: absolute;
top: 0;
left: 0;
bottom: 0;
background: var(--theme-primary);
border-radius: 8px;
}

.milestone-complete-percentage {
position: absolute;
left: 0;
right: 0;
top: -12px;
font-size: 10px;
line-height: 1;
color: var(--theme-white);
text-align: center;
}

.milestone-circle {
width: 16px;
height: 16px;
background: var(--theme-primary);
border-radius: 16px;
position: absolute;
top: -6px;
bottom: -6px;
}

.freelancer-info {
display: flex;
flex-direction: column;
gap: 20px;
}

.freelancer-profile {
display: flex;
flex-direction: row;
align-items: center;
gap: 32px;
}

.freelancer-profile-pic {
width: 45px;
height: 45px;
}

.primary-btn {
margin: 0;
}

.milestones-container {
display: flex;
flex-direction: column;
gap: 36px;
/* background: var(--theme-white); */
margin-top: 50px;
}

.milestone-item {
display: flex;
flex-direction: column;
}

.milestone-header {
display: flex;
flex-direction: row;
align-items: center;
gap: 16px;
color: var(--theme-white);
line-height: 1;
}

.milestone-no {
font-size: 40px;
margin-right: 10px;
}

.milestone-name {
font-size: 24px;
flex-grow: 1;
}

.milestone-date {
font-size: 14px;
}

.milestone-status {
font-size: 20px;
font-weight: 700;
}

.milestone-details {
display: flex;
flex-direction: column;
margin-top: 10px;
}

.milestone-release-info {
display: flex;
flex-direction: row;
gap: 10px;
font-size: 14px;
line-height: 16px;
font-weight: 700;
color: var(--theme-white);
margin-top: 10px;
}

.milestone-description {
font-size: 14px;
line-height: 16px;
color: var(--theme-white);
margin-top: 16px;
}

.toggle {
width: 32px;
height: 32px;
padding: 0;
}
.primary-btn.in-dark.toggle {
text-align: center;
}

.vote {
margin-top: 20px;
align-self: flex-start;
}
13 changes: 10 additions & 3 deletions api/public/brief-details.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -220,6 +220,11 @@ p {
height: 18%;
}

.brief-insights .insight-item {
margin-left: 20px;
margin-bottom: 25px;
}

.brief-insights-stat {
display: flex;
}
Expand All @@ -236,6 +241,7 @@ p {
.subsection {
margin-left: 20px;
margin-bottom: 25px;
margin-right: 20px;
}
.subsection > ul > li {
list-style: disc;
Expand Down Expand Up @@ -309,10 +315,11 @@ p {
font-size: 14px;
}

.h3, h3 {
.h3,
h3 {
font-size: 1.17em !important;
}

.meet-hiring-team > h3 {
margin-top: 10px
}
margin-top: 10px;
}
10 changes: 7 additions & 3 deletions api/public/common.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -206,12 +206,16 @@ body {
}

.str-chat__message .str-chat__message-bubble,
.str-chat__message-input .str-chat__quoted-message-preview .str-chat__quoted-message-bubble {
.str-chat__message-input
.str-chat__quoted-message-preview
.str-chat__quoted-message-bubble {
background: dimgray !important;
}

.str-chat__message-input,
.str-chat__message-attachment-card--title,
.str-chat__message-input .str-chat__message-textarea-container .str-chat__message-textarea {
.str-chat__message-input
.str-chat__message-textarea-container
.str-chat__message-textarea {
color: var(--theme-ink-color) !important;
}
}
26 changes: 17 additions & 9 deletions api/src/backend/routes/web/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,19 +56,27 @@ router.get("/briefs/:id", (req, res) => {
res.render("brief-details");
});

router.get("/briefs/:id/apply", function (req, res, next) {
passport.authenticate("jwt", {
session: false,
failureRedirect: `/dapp/login?redirect=/dapp/briefs/${req.params.id}/apply`,
})(req, res, next)
}, (req, res) => {
res.render("submit-proposal");
});
router.get(
"/briefs/:id/apply",
function (req, res, next) {
passport.authenticate("jwt", {
session: false,
failureRedirect: `/dapp/login?redirect=/dapp/briefs/${req.params.id}/apply`,
})(req, res, next);
},
(req, res) => {
res.render("submit-proposal");
}
);

router.get("/briefs/:id/applications", (req, res) => {
res.render("brief-applications");
});

router.get("/briefs/:id/dashboard", (req, res) => {
res.render("brief-dashboard");
});

router.get("/briefs/:id/applications/:application_id", (req, res) => {
res.render("application-preview");
});
Expand Down Expand Up @@ -112,4 +120,4 @@ router.use((_req, res, next) => {
res.render("legacy");
});

export default router;
export default router;
4 changes: 4 additions & 0 deletions api/src/backend/views/brief-dashboard.pug
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
extends layout.pug
block content
div(id="brief-dashboard" name="brief-dashboard")
script(src="/public/lib/brief-dashboard.js" type="text/javascript")
2 changes: 1 addition & 1 deletion api/src/frontend/components/briefInsights.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ export const BriefInsights = ({ brief }: BriefInsightsProps) => {
<div className="brief-container brief-info">
<div className="description">
<div className="brief-title">
<h3>{brief.headline }</h3>
<h3>{brief.headline}</h3>
<h3 className="clickable-text" onClick={viewFullBrief}>
View full brief
</h3>
Expand Down
Loading