mirror of
https://github.com/Hestia-Homes/assessment-model.git
synced 2026-06-30 12:55:02 +00:00
Fixed layout on portfolio page, updated the house icons
This commit is contained in:
Khalim Conn-Kowlessar
parent
74f11f13f7
commit
19bbaa9787
6 changed files with 103 additions and 71 deletions
|
|
@ -1,48 +1,18 @@
|
|||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
viewBox="0 0 512 512" xml:space="preserve">
|
||||
<rect x="289.389" y="183.65" style="fill:#80D7D7;" width="100.173" height="178.085"/>
|
||||
<path style="fill:#9DB0CA;" d="M389.564,378.436H289.391c-9.22,0-16.695-7.475-16.695-16.695V183.656
|
||||
c0-9.22,7.475-16.695,16.695-16.695h100.173c9.22,0,16.695,7.475,16.695,16.695v178.085
|
||||
C406.259,370.961,398.785,378.436,389.564,378.436z"/>
|
||||
<path style="fill:#C5DCFD;" d="M456.345,378.436h-66.782c-9.22,0-16.695-7.475-16.695-16.695V183.656
|
||||
c0-9.22,7.475-16.695,16.695-16.695h66.782c9.22,0,16.695,7.475,16.695,16.695v178.085
|
||||
C473.041,370.961,465.567,378.436,456.345,378.436z"/>
|
||||
<rect x="122.434" y="183.65" style="fill:#80D7D7;" width="100.173" height="178.085"/>
|
||||
<path style="fill:#B1C6E4;" d="M222.609,378.436H122.436c-9.22,0-16.695-7.475-16.695-16.695V183.656
|
||||
c0-9.22,7.475-16.695,16.695-16.695h100.173c9.22,0,16.695,7.475,16.695,16.695v178.085
|
||||
C239.304,370.961,231.83,378.436,222.609,378.436z"/>
|
||||
<g>
|
||||
<path style="fill:#DBE9FD;" d="M122.436,378.436H55.654c-9.22,0-16.695-7.475-16.695-16.695V183.656
|
||||
c0-9.22,7.475-16.695,16.695-16.695h66.782c9.22,0,16.695,7.475,16.695,16.695v178.085
|
||||
C139.132,370.961,131.658,378.436,122.436,378.436z"/>
|
||||
<path style="fill:#DBE9FD;" d="M289.391,378.436h-66.782c-9.22,0-16.695-7.475-16.695-16.695V183.656
|
||||
c0-9.22,7.475-16.695,16.695-16.695h66.782c9.22,0,16.695,7.475,16.695,16.695v178.085
|
||||
C306.086,370.961,298.612,378.436,289.391,378.436z"/>
|
||||
</g>
|
||||
<g>
|
||||
<path style="fill:#C5DCFD;" d="M289.391,166.96H256v211.476h33.391c9.22,0,16.695-7.475,16.695-16.695V183.656
|
||||
C306.086,174.435,298.612,166.96,289.391,166.96z"/>
|
||||
<path style="fill:#C5DCFD;" d="M456.345,445.218H55.654c-9.22,0-16.695-7.475-16.695-16.695v-83.477h434.082v83.477
|
||||
C473.041,437.743,465.567,445.218,456.345,445.218z"/>
|
||||
</g>
|
||||
<path style="fill:#B1C6E4;" d="M473.041,345.045H256v100.173h200.346c9.22,0,16.695-7.475,16.695-16.695V345.045z"/>
|
||||
<path style="fill:#DBE9FD;" d="M489.736,512H22.263c-9.223,0-16.695-7.478-16.695-16.695v-66.782
|
||||
c0-9.217,7.473-16.695,16.695-16.695h467.473c9.217,0,16.695,7.478,16.695,16.695v66.782C506.432,504.522,498.955,512,489.736,512z"
|
||||
/>
|
||||
<g>
|
||||
<path style="fill:#C5DCFD;" d="M489.736,411.827H256V512h233.737c9.217,0,16.695-7.478,16.695-16.695v-66.782
|
||||
C506.432,419.306,498.955,411.827,489.736,411.827z"/>
|
||||
<path style="fill:#C5DCFD;" d="M489.736,200.351H22.263c-7.256,0-13.685-4.685-15.896-11.598
|
||||
c-2.217-6.913,0.288-14.467,6.191-18.684L246.294,3.114c5.804-4.152,13.609-4.152,19.412,0l233.737,166.955
|
||||
c5.902,4.217,8.402,11.771,6.195,18.684C503.421,195.666,496.998,200.351,489.736,200.351z"/>
|
||||
</g>
|
||||
<g>
|
||||
<path style="fill:#B1C6E4;" d="M489.736,200.351c7.26,0,13.685-4.685,15.902-11.598c2.206-6.913-0.294-14.467-6.195-18.684
|
||||
L265.707,3.114C262.805,1.038,259.402,0,256,0v200.351H489.736z"/>
|
||||
<circle style="fill:#B1C6E4;" cx="255.998" cy="116.868" r="16.695"/>
|
||||
</g>
|
||||
<path style="fill:#9DB0CA;" d="M272.695,116.874c0-9.22-7.475-16.695-16.695-16.695v33.391
|
||||
C265.221,133.569,272.695,126.094,272.695,116.874z"/>
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
<svg width="800px" height="800px" viewBox="0 0 24 24" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
|
||||
<g transform="translate(0 -1028.4)">
|
||||
<rect height="5.9999" width="3" y="1031.4" x="17" fill="#c0392b"/>
|
||||
<path d="m12 3.0312l-9 8.9688v1.812 5.376 1.812h1 8 8 1v-1.812-5.376-1.812l-9-8.9688z" transform="translate(0 1028.4)" fill="#bdc3c7"/>
|
||||
<path fill="#95a5a6" d="m12 1032-9 8.9v1.9 0.1l9-9 9 9v-0.1-1.9l-9-8.9z"/>
|
||||
<g>
|
||||
<path d="m12 1029.4-11.314 11.3 1.4145 1.4 9.8995-9.9 9.899 9.9 1.415-1.4-11.314-11.3z" fill="#e74c3c"/>
|
||||
<path d="m14 9a2 2 0 1 1 -4 0 2 2 0 1 1 4 0z" transform="translate(0 1029.4)" fill="#3498db"/>
|
||||
<rect height="6" width="4" y="1043.4" x="10" fill="#e67e22"/>
|
||||
<path d="m12 17.5a0.5 0.5 0 1 1 -1 0 0.5 0.5 0 1 1 1 0z" transform="translate(1.5 1029.4)" fill="#d35400"/>
|
||||
<path d="m12 1036.4c-1.105 0-2 0.9-2 2 0 0.1 0.021 0.3 0.062 0.5 0.222-0.9 1.006-1.5 1.938-1.5s1.716 0.6 1.938 1.5c0.041-0.2 0.062-0.4 0.062-0.5 0-1.1-0.895-2-2-2z" fill="#2980b9"/>
|
||||
<path d="m12 17.5a0.5 0.5 0 1 1 -1 0 0.5 0.5 0 1 1 1 0z" transform="translate(1.5 1028.9)" fill="#f1c40f"/>
|
||||
<rect height="1" width="4" y="1042.4" x="10" fill="#d35400"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 3.2 KiB After Width: | Height: | Size: 1.4 KiB |
60
public/house-icon-4.svg
Normal file
60
public/house-icon-4.svg
Normal file
|
|
@ -0,0 +1,60 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
<svg width="800px" height="800px" viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--noto" preserveAspectRatio="xMidYMid meet">
|
||||
<path fill="#ab5832" d="M19.16 48.94V28.58l-1.64.1V16.14l15.82-.1v12.35H31.7v11.96z">
|
||||
</path>
|
||||
<path fill="#fff3e1" d="M64.11 23.33L18.67 68.99l.35 42.21l89.75-.85l.13-45z">
|
||||
</path>
|
||||
<path d="M16.97 103.79l3.14-1.73V67.98l-2.92 1.95c-.01 0 .32 33.86-.22 33.86z" fill="#5f4e47">
|
||||
</path>
|
||||
<path fill="#5f4e47" d="M107.2 69.82v32.03l3.14 1.73V71.01z">
|
||||
</path>
|
||||
<path fill="#bcaa93" d="M64.42 28.21L17.18 72.42V61.27l47.29-44.79l45.87 47.5v9.41z">
|
||||
</path>
|
||||
<path d="M12.55 59.36l-2.77 5.11l7.43-.11s46.35-45.08 47.35-45.12c1.21-.05 45.76 45.91 45.76 45.91l6.59-.1l-49.44-53.26l-7.26-.48l-47.66 48.05z" fill="#ab5832">
|
||||
</path>
|
||||
<path d="M4 63.19c-.78.95-.01 1.45.62 1.45s7.89-.21 7.89-.21l50.04-48.69s1.15-1.18 1.97-1.14c.89.04 2.04 1.17 2.04 1.17l50.28 49.29s5.73.02 6.64-.21c.99-.24.49-1.18-.73-2.49c-.9-.97-51.73-51.25-52.57-52.12c-2.5-2.58-3.72-4.08-6.08-3.98c-2.37.1-3.77 1.85-6.14 4.03c-.7.66-53.63 52.5-53.96 52.9z" fill="#ed6c31">
|
||||
</path>
|
||||
<g fill="#a6cfd5">
|
||||
<path d="M93.5 80.83h10.25V72.3a2.87 2.87 0 0 0-2.87-2.87H93.5v11.4z">
|
||||
</path>
|
||||
<path d="M90.42 80.83v-11.4h-8a2.87 2.87 0 0 0-2.87 2.87v8.54h10.87z">
|
||||
</path>
|
||||
<path d="M90.42 84.07H79.55v8a2.87 2.87 0 0 0 2.87 2.87h8V84.07z">
|
||||
</path>
|
||||
<path d="M93.5 84.07v10.87h7.38a2.87 2.87 0 0 0 2.87-2.87v-8H93.5z">
|
||||
</path>
|
||||
</g>
|
||||
<g fill="#a6cfd5">
|
||||
<path d="M36.75 80.83H47V72.3a2.87 2.87 0 0 0-2.87-2.87h-7.38v11.4z">
|
||||
</path>
|
||||
<path d="M33.66 80.83v-11.4h-8a2.87 2.87 0 0 0-2.87 2.87v8.54h10.87z">
|
||||
</path>
|
||||
<path d="M33.66 84.07H22.8v8a2.87 2.87 0 0 0 2.87 2.87h8V84.07z">
|
||||
</path>
|
||||
<path d="M36.75 84.07v10.87h7.38A2.87 2.87 0 0 0 47 92.07v-8H36.75z">
|
||||
</path>
|
||||
</g>
|
||||
<path d="M50.34 106.73s-.15-24.74 0-30.99c.15-6.24 6.01-11.64 12.8-11.41c8.4.29 12.72 5.01 13.03 11.1c.31 6.09.31 31.68.31 31.68l-26.14-.38z" fill="#d27857">
|
||||
</path>
|
||||
<path d="M53.47 108.07s-.12-26.36 0-31.24c.15-6.05 4.71-9.23 10.01-8.93c6.17.35 9.22 3.63 9.46 8.4c.24 4.76.24 31.79.24 31.79l-19.71-.02z" fill="#ab5932">
|
||||
</path>
|
||||
<g fill="#d27857">
|
||||
<path d="M69.99 86.58c-.02-4.34-.06-8.17-.12-9.34c-.16-3.15-2.4-5.6-6.75-5.75c-3.51-.12-6.4 2.62-6.48 5.85c-.03 1.19-.02 4.93 0 9.19l13.35.05z">
|
||||
</path>
|
||||
<path d="M56.67 91.45c.04 5.81.09 11.16.09 11.16l13.27.04s0-5.33-.02-11.14l-13.34-.06z">
|
||||
</path>
|
||||
</g>
|
||||
<path d="M70.03 88.81c-.05 1.41.52 2.55 2.19 2.55s2.28-.78 2.4-2.29c.1-1.35-.83-2.55-2.4-2.45c-1.56.11-2.15 1.2-2.19 2.19z" fill="#ffba02">
|
||||
</path>
|
||||
<path d="M79.61 116.31s10.88.11 18.74-.12c7.86-.23 13.55.12 14.72-1.06c1.17-1.17 1.15-11.14-4.3-13.84c-5.01-2.48-8.25.04-9.97.21c-2.27.23-5.08-1.18-7.14-1.22c-8.51-.18-11.49 6.51-11.49 6.51l-.56 9.52z" fill="#728037">
|
||||
</path>
|
||||
<path d="M14.53 115.49c.91.85 7.86.88 16.25.82c8.39-.06 15.14.02 15.14.02l1.4-8.47l-1.7-1.41s.19-4.24-5.16-5.69c-3.7-1-6.92.65-10.03.7c-3.11.06-5.98-1.35-9.44-.53c-3.22.76-5.73 2.86-6.75 7.1c-.71 2.94-.53 6.69.29 7.46z" fill="#728037">
|
||||
</path>
|
||||
<path d="M44.92 125.17l.07-8.85h.65l-.01-9.86h34.73l-.12 9.86H81v8.62c-.01-.01-36.08.28-36.08.23z" fill="#b0b0b0">
|
||||
</path>
|
||||
<path fill="#9b9b9b" d="M80.99 121.3v3.63l-36.08.24l.03-3.9z">
|
||||
</path>
|
||||
<path fill="#9b9b9b" d="M45.62 112.48l34.65.01v3.82H45.62z">
|
||||
</path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.4 KiB |
|
|
@ -19,7 +19,7 @@ export default function CardTiles({
|
|||
<div className="grid grid-cols-1 gap-6 max-w-7xl sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5">
|
||||
<AddNewCard />
|
||||
{Portfolios.map((portfolio, index) => {
|
||||
const image_idx = index % 4;
|
||||
const image_idx = index % 5;
|
||||
return (
|
||||
<Card
|
||||
key={portfolio.id}
|
||||
|
|
|
|||
|
|
@ -6,8 +6,8 @@ import { PlusIcon, TableCellsIcon } from "@heroicons/react/24/outline";
|
|||
|
||||
export default function AddNew({ portfolioId }: { portfolioId: string }) {
|
||||
return (
|
||||
<Menu as="div" className="relative w-full">
|
||||
<Menu.Button className="rounded-md bg-brandtan text-white hover:bg-hovertan w-full">
|
||||
<Menu as="div" className="relative">
|
||||
<Menu.Button className="rounded-md bg-brandtan text-white hover:bg-hovertan">
|
||||
<div className="mx-8">Add New</div>
|
||||
</Menu.Button>
|
||||
<Menu.Items className="hover:bg-brandtan absolute right-0 mt-2 w-48 origin-top-right overflow-hidden rounded-md border bg-white shadow-lg focus:outline-none">
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@ const Home = async () => {
|
|||
{
|
||||
id: "d290f1ee-6c54-4b01-90e6-d701748f0857",
|
||||
title: "Portfolio 7",
|
||||
budget: "£33k",
|
||||
budget: "£233k",
|
||||
},
|
||||
{
|
||||
id: "d290f1ee-6c54-4b01-90e6-d701748f0858",
|
||||
|
|
@ -51,7 +51,7 @@ const Home = async () => {
|
|||
{
|
||||
id: "d290f1ee-6c54-4b01-90e6-d701748f0860",
|
||||
title: "Portfolio 10",
|
||||
budget: "£93k",
|
||||
budget: "93k",
|
||||
},
|
||||
];
|
||||
|
||||
|
|
|
|||
|
|
@ -143,35 +143,35 @@ export default async function Page({
|
|||
{
|
||||
id: "d290f1ee-6c54-4b01-90e6-d701748f0855",
|
||||
title: "Portfolio 5",
|
||||
budget: 35000,
|
||||
cost: 35000,
|
||||
budget: 250000,
|
||||
cost: 250000,
|
||||
co2Reduction: 1.9,
|
||||
totalWorksHours: 15,
|
||||
totalValueIncrease: 35000 * 1.2,
|
||||
rentalYieldIncrease: 35000 * 0.002,
|
||||
properties: generateProperties(35000, "5") as Property[],
|
||||
totalValueIncrease: 250000 * 1.2,
|
||||
rentalYieldIncrease: 250000 * 0.002,
|
||||
properties: generateProperties(250000, "5") as Property[],
|
||||
},
|
||||
{
|
||||
id: "d290f1ee-6c54-4b01-90e6-d701748f0856",
|
||||
title: "Portfolio 6",
|
||||
budget: 30000,
|
||||
cost: 30000,
|
||||
budget: 410000,
|
||||
cost: 410000,
|
||||
co2Reduction: 1.4,
|
||||
totalWorksHours: 10,
|
||||
totalValueIncrease: 30000 * 1.2,
|
||||
rentalYieldIncrease: 30000 * 0.002,
|
||||
properties: generateProperties(10000, "6") as Property[],
|
||||
totalValueIncrease: 410000 * 1.2,
|
||||
rentalYieldIncrease: 410000 * 0.002,
|
||||
properties: generateProperties(410000, "6") as Property[],
|
||||
},
|
||||
{
|
||||
id: "d290f1ee-6c54-4b01-90e6-d701748f0857",
|
||||
title: "Portfolio 7",
|
||||
budget: 33000,
|
||||
cost: 33000,
|
||||
budget: 233000,
|
||||
cost: 233000,
|
||||
co2Reduction: 10.4,
|
||||
totalWorksHours: 25,
|
||||
totalValueIncrease: 33000 * 1.2,
|
||||
rentalYieldIncrease: 33000 * 0.002,
|
||||
properties: generateProperties(33000, "7") as Property[],
|
||||
totalValueIncrease: 233000 * 1.2,
|
||||
rentalYieldIncrease: 233000 * 0.002,
|
||||
properties: generateProperties(233000, "7") as Property[],
|
||||
},
|
||||
{
|
||||
id: "d290f1ee-6c54-4b01-90e6-d701748f0858",
|
||||
|
|
@ -257,8 +257,8 @@ export default async function Page({
|
|||
</h1>
|
||||
</div>
|
||||
<div className="flex justify-center">
|
||||
<div className="grid grid-cols-5 gap-4 w-full max-w-7xl h-screen">
|
||||
<div className="flex-col">
|
||||
<div className="grid grid-cols-8 gap-4 w-full max-w-7xl h-screen">
|
||||
<div className="col-span-2 flex-col">
|
||||
<div
|
||||
className="mb-4 max-h-96 bg-white p-4 rounded-lg border shadow-sm
|
||||
text-black h-1/2"
|
||||
|
|
@ -291,9 +291,11 @@ export default async function Page({
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<AddNew portfolioId={demo_id} />
|
||||
<div className="w-full flex justify-center">
|
||||
<AddNew portfolioId={demo_id} />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-span-3 bg-white">
|
||||
<div className="col-span-6 bg-white">
|
||||
{properties.length === 0 ? (
|
||||
<EmptyPropertyState />
|
||||
) : (
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue