Compare commits
3 Commits
14bc1c30a0
...
dev
| Author | SHA1 | Date | |
|---|---|---|---|
 Corey Blais
|
18fd76dc1f | ||
|
Corey Blais
|
f627157a14 | ||
|
Corey Blais
|
35bd87b8b5 |
@@ -7,6 +7,7 @@ RUN npm ci
|
||||
COPY tsconfig*.json ./
|
||||
COPY vite.config.ts ./
|
||||
COPY index.html ./
|
||||
COPY public ./public
|
||||
COPY src ./src
|
||||
RUN npm run build
|
||||
|
||||
|
||||
@@ -5,6 +5,7 @@ RUN npm install
|
||||
COPY tsconfig*.json ./
|
||||
COPY vite.config.ts ./
|
||||
COPY index.html ./
|
||||
COPY public ./public
|
||||
COPY src ./src
|
||||
EXPOSE 3000
|
||||
CMD ["npm", "run", "dev", "--", "--host"]
|
||||
|
||||
@@ -8,7 +8,6 @@
|
||||
type="image/svg+xml"
|
||||
href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cdefs%3E%3ClinearGradient id='featherFill' x1='0%25' y1='0%25' x2='100%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%23cb3a35'/%3E%3Cstop offset='30%25' stop-color='%23f0b63f'/%3E%3Cstop offset='58%25' stop-color='%23238a5a'/%3E%3Cstop offset='100%25' stop-color='%232769b3'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M50.8 10.4C37.9 10.3 27 18.5 22.7 31.1c-3.1 9.1-2.1 18.5-8.6 24.8c-1.5 1.5-0.2 4 1.9 3.6c8.4-1.5 14.6-6.7 18.6-13.7c1 0.5 2.2 0.8 3.4 0.8c3.5 0 6.5-2.3 7.5-5.4c1.9-0.4 3.7-1.3 5.1-2.7c2-2 3-4.6 3.1-7.2c3.3-5.8 4.9-12.9 1.4-20.2c-0.7-1.3-2-0.7-4.3-0.7Z' fill='url(%23featherFill)'/%3E%3Cpath d='M18 56c8.5-3.4 14.2-9.8 18.1-17.8M26.9 48.9c6.9-7.2 13.5-14.8 20.3-22.1M31.8 41.2c6.4-1.3 12.1-4.6 16.5-9.4M36.8 33.8c4.9-0.9 9.2-3.4 12.6-7.1' fill='none' stroke='%23fff8ef' stroke-linecap='round' stroke-width='2.6'/%3E%3Cpath d='M18 56c8.5-3.4 14.2-9.8 18.1-17.8' fill='none' stroke='%2363562d' stroke-linecap='round' stroke-width='2.2'/%3E%3C/svg%3E"
|
||||
/>
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=egg,manage_accounts,map,move,move_location,sticky_note_2,timeline" />
|
||||
<title>FlockPal</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
+24
-24
@@ -1290,24 +1290,23 @@ const getBirdTimelineGraphLabel = (event: BirdTimelineEvent) => {
|
||||
return event.locationLabel || 'Added to flock';
|
||||
};
|
||||
|
||||
const getBirdTimelineGraphIcon = (item: BirdTimelineGraphItem) => {
|
||||
if (item.eventType === 'hatch_date') {
|
||||
return 'egg';
|
||||
}
|
||||
const renderBirdTimelineGraphIcon = (item: BirdTimelineGraphItem) => {
|
||||
const iconPath =
|
||||
item.eventType === 'hatch_date'
|
||||
? "M480-120q-117 0-198.5-81.5T200-400q0-77 25.5-155t66-141.5Q332-760 382-800t98-40q49 0 98.5 40t90 103.5Q709-633 734.5-555T760-400q0 117-81.5 198.5T480-120Zm0-80q83 0 141.5-58.5T680-400q0-57-19.5-120t-49-116.5Q582-690 547-725t-67-35q-31 0-66.5 35t-65 88.5Q319-583 299.5-520T280-400q0 83 58.5 141.5T480-200Zm40-40q17 0 28.5-11.5T560-280q0-17-11.5-28.5T520-320q-50 0-85-35t-35-85q0-17-11.5-28.5T360-480q-17 0-28.5 11.5T320-440q0 83 58.5 141.5T520-240Zm-40-240Z"
|
||||
: item.eventType === 'owner_changed'
|
||||
? "m770-120-56-56 63-64H610v-80h167l-63-64 56-56 160 160-160 160ZM400-360q56 0 101-27.5t71-72.5q-35-29-79-44.5T400-520q-49 0-93 15.5T228-460q26 45 71 72.5T400-360Zm0-200q33 0 56.5-23.5T480-640q0-33-23.5-56.5T400-720q-33 0-56.5 23.5T320-640q0 33 23.5 56.5T400-560Zm0 67Zm0 413Q239-217 159.5-334.5T80-552q0-150 96.5-239T400-880q127 0 223.5 89T720-552q0 9-.5 18.5T717-514h-81q2-10 3-19.5t1-18.5q0-109-69.5-178.5T400-800q-101 0-170.5 69.5T160-552q0 71 59 162.5T400-186q23-20 42.5-40t37.5-39l9 9 19.5 19.5q10.5 10.5 19 19.5l8.5 9q-29 31-63 63t-73 65Z"
|
||||
: item.eventType === 'manual_note'
|
||||
? "M200-200h360v-200h200v-360H200v560Zm0 80q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v400L600-120H200Zm80-280v-80h200v80H280Zm0-160v-80h400v80H280Zm-80 360v-560 560Z"
|
||||
: item.eventType === 'profile_created'
|
||||
? "m600-120-240-84-186 72q-20 8-37-4.5T120-170v-560q0-13 7.5-23t20.5-15l212-72 240 84 186-72q20-8 37 4.5t17 33.5v560q0 13-7.5 23T812-192l-212 72Zm-40-98v-468l-160-56v468l160 56Zm80 0 120-40v-474l-120 46v468Zm-440-10 120-46v-468l-120 40v474Zm440-458v468-468Zm-320-56v468-468Z"
|
||||
: "M440-280q-7 0-12-4t-7-10q-14-42-34-70t-40-54q-20-26-33.5-54T300-540q0-58 41-99t99-41q58 0 99 41t41 99q0 40-13.5 68T533-418q-20 26-40 54t-34 70q-2 6-7 10t-12 4Zm0-112q9-14 18-26t17-23q23-30 34-50t11-49q0-33-23.5-56.5T440-620q-33 0-56.5 23.5T360-540q0 29 11 49t34 50q8 11 17 23t18 26Zm0-98q21 0 35.5-14.5T490-540q0-21-14.5-35.5T440-590q-21 0-35.5 14.5T390-540q0 21 14.5 35.5T440-490Zm0 370q-150 0-255-105T80-480q0-75 28.5-140.5t77-114q48.5-48.5 114-77T440-840q75 0 140.5 28.5t114 77q48.5 48.5 77 114T800-480v8l53-54 57 56-150 150-150-150 57-56 53 53v-7q0-116-82-198t-198-82q-116 0-198 82t-82 198q1 116 82.5 198T440-200q57 0 107-21.5t88-58.5l57 57q-49 48-113.5 75.5T440-120Zm0-420Z";
|
||||
|
||||
if (item.eventType === 'owner_changed') {
|
||||
return 'manage_accounts';
|
||||
}
|
||||
|
||||
if (item.eventType === 'transferred') {
|
||||
return 'move';
|
||||
}
|
||||
|
||||
if (item.eventType === 'manual_note') {
|
||||
return 'sticky_note_2';
|
||||
}
|
||||
|
||||
return 'map';
|
||||
return (
|
||||
<svg className="bird-timeline-graph-icon" viewBox="0 -960 960 960" aria-hidden="true" focusable="false">
|
||||
<path d={iconPath} />
|
||||
</svg>
|
||||
);
|
||||
};
|
||||
|
||||
const compactTimelineLocationPartMap: Record<string, string> = {
|
||||
@@ -7513,9 +7512,7 @@ function App() {
|
||||
aria-label="Timeline"
|
||||
title="Timeline"
|
||||
>
|
||||
<span className="material-symbols-outlined timeline-tab-icon" aria-hidden="true">
|
||||
timeline
|
||||
</span>
|
||||
<svg className="timeline-tab-icon" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M21 6a2 2 0 0 0-1.93 2.51l-3.55 3.56A2.15 2.15 0 0 0 15 12c-.18 0-.36.02-.52.07l-2.55-2.55c.05-.16.07-.34.07-.52a2 2 0 1 0-4 0c0 .18.02.36.07.52l-4.56 4.55A2.03 2.03 0 0 0 3 14a2 2 0 1 0 1.93 1.49l4.55-4.56c.16.05.34.07.52.07s.36-.02.52-.07l2.55 2.55c-.05.16-.07.34-.07.52a2 2 0 1 0 4 0c0-.18-.02-.36-.07-.52l3.56-3.55A2 2 0 1 0 21 6Z" /></svg>
|
||||
</button>
|
||||
<button
|
||||
className={`bird-detail-tab ${selectedBirdTab === 'audit' ? 'active' : ''}`}
|
||||
@@ -8202,7 +8199,12 @@ function App() {
|
||||
|
||||
return timelineGraphItems.length ? (
|
||||
<div className="bird-timeline-graph-card">
|
||||
<div className="bird-timeline-graph" role="img" aria-label={`${selectedBird.name} location and owner timeline`}>
|
||||
<div
|
||||
className="bird-timeline-graph"
|
||||
role="img"
|
||||
aria-label={`${selectedBird.name} location and owner timeline`}
|
||||
style={{ '--timeline-color': selectedBird.chartColor } as CSSProperties}
|
||||
>
|
||||
<div className="bird-timeline-graph-line" />
|
||||
<div className="bird-timeline-graph-scale" aria-hidden="true">
|
||||
{timelineGraphTicks.map((tick) => {
|
||||
@@ -8239,9 +8241,7 @@ function App() {
|
||||
>
|
||||
<div className="bird-timeline-graph-connector" />
|
||||
<div className="bird-timeline-graph-dot">
|
||||
<span className="material-symbols-outlined bird-timeline-graph-icon">
|
||||
{getBirdTimelineGraphIcon(timelineItem)}
|
||||
</span>
|
||||
{renderBirdTimelineGraphIcon(timelineItem)}
|
||||
</div>
|
||||
<div className="bird-timeline-graph-copy">
|
||||
<strong>{timelineItem.label}</strong>
|
||||
|
||||
+12
-47
@@ -1,3 +1,4 @@
|
||||
|
||||
:root {
|
||||
--ink: #1f2a2a;
|
||||
--muted: #5d5f59;
|
||||
@@ -1352,7 +1353,7 @@ textarea {
|
||||
top: 50%;
|
||||
height: 4px;
|
||||
border-radius: 999px;
|
||||
background: linear-gradient(90deg, rgba(39, 105, 179, 0.42), rgba(35, 138, 90, 0.88));
|
||||
background: var(--timeline-color, var(--accent-green));
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
@@ -1409,11 +1410,11 @@ textarea {
|
||||
z-index: 2;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
border: 4px solid var(--accent-green);
|
||||
border-radius: 50%;
|
||||
background: #fffdf9;
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.bird-timeline-graph-point.above .bird-timeline-graph-dot {
|
||||
@@ -1433,13 +1434,7 @@ textarea {
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.bird-timeline-graph-point.owner_changed .bird-timeline-graph-dot {
|
||||
border-color: var(--accent-blue);
|
||||
}
|
||||
|
||||
.bird-timeline-graph-point.transferred .bird-timeline-graph-dot {
|
||||
border-color: var(--accent-red);
|
||||
}
|
||||
|
||||
.bird-timeline-graph-point.hatch_date .bird-timeline-graph-dot {
|
||||
width: 34px;
|
||||
@@ -1477,26 +1472,15 @@ textarea {
|
||||
}
|
||||
|
||||
.bird-timeline-graph-icon {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
color: var(--accent-green);
|
||||
font-family: "Material Symbols Outlined";
|
||||
font-size: 18px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 1;
|
||||
letter-spacing: 0;
|
||||
text-transform: none;
|
||||
white-space: nowrap;
|
||||
direction: ltr;
|
||||
font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
|
||||
font-feature-settings: "liga";
|
||||
-webkit-font-feature-settings: "liga";
|
||||
-webkit-font-smoothing: antialiased;
|
||||
fill: currentColor;
|
||||
}
|
||||
|
||||
.bird-timeline-graph-point.hatch_date .bird-timeline-graph-icon {
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
color: var(--accent-gold);
|
||||
font-size: 34px;
|
||||
}
|
||||
@@ -1707,25 +1691,6 @@ textarea {
|
||||
stroke: none;
|
||||
}
|
||||
|
||||
.bird-detail-tab .timeline-tab-icon {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: currentColor;
|
||||
font-family: "Material Symbols Outlined";
|
||||
font-size: 24px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 1;
|
||||
letter-spacing: 0;
|
||||
text-transform: none;
|
||||
white-space: nowrap;
|
||||
direction: ltr;
|
||||
font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
|
||||
-webkit-font-feature-settings: "liga";
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.bird-detail-tab:hover {
|
||||
border-color: rgba(35, 138, 90, 0.28);
|
||||
color: var(--ink);
|
||||
|
||||
Reference in New Issue
Block a user