Skip to content

Commit

Permalink
Merge pull request #392 from credebl/outlined-icons
Browse files Browse the repository at this point in the history 
feat:Outlined icons
  • Loading branch information
@16-karan
16-karan authored Oct 31, 2023
2 parents 2933ecf + f25a046 commit 7294645
Show file tree
Hide file tree
Showing 8 changed files with 468 additions and 419 deletions.
3 changes: 3 additions & 0 deletions public/images/person_FILL1_wght400_GRAD0_opsz24.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
190 changes: 98 additions & 92 deletions src/app/SideBar.astro
View file

Large diffs are not rendered by default.

107 changes: 58 additions & 49 deletions src/components/BreadCrumbs/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,62 +6,71 @@ import { Breadcrumb } from 'flowbite-react';
import { HiHome } from 'react-icons/hi';

interface BreadCrumbI {
href: string;
text: string;
href: string;
text: string;
}

export default function BreadCrumbs() {
const [breadcrumbList, setBreadcrumbList] = useState<BreadCrumbI[]>([]);

const [breadcrumbList, setBreadcrumbs] = useState<BreadCrumbI[]>([])
useEffect(() => {
const pathUrl = window.location.pathname;
const asPathNestedRoutes = pathUrl.split('/').filter((v) => v.length > 0);

useEffect(() => {
const crumblist = asPathNestedRoutes.map((subpath, idx) => {
const href = `/${asPathNestedRoutes.slice(0, idx + 1).join('/')}`;
return { href, text: subpath };
});

const pathUrl = window.location.pathname
const asPathNestedRoutes = pathUrl
.split('/')
.filter((v) => v.length > 0);
setBreadcrumbList(crumblist);
}, []);

const crumblist = asPathNestedRoutes.map((subpath, idx) => {
const href = `/${asPathNestedRoutes.slice(0, idx + 1).join('/')}`;
return { href, text: subpath };
});
return (
<Breadcrumb
aria-label="Solid background breadcrumb example"
className="bg-gray-50 py-3 dark:bg-gray-900"
>
<div className="flex flex-wrap">
<Breadcrumb.Item href="/dashboard">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
fill="none"
viewBox="0 0 24 24"
>
<path
fill="#6B7280"
d="M6 19h3v-6h6v6h3v-9l-6-4.5L6 10v9Zm-2 2V9l8-6 8 6v12h-7v-6h-2v6H4Z"
/>
</svg>

setBreadcrumbs(crumblist)
<p>Home</p>
</Breadcrumb.Item>

}, [])

return (
<Breadcrumb
aria-label="Solid background breadcrumb example"
className="bg-gray-50 py-3 dark:bg-gray-900"
>

<div className='flex flex-wrap'>
<Breadcrumb.Item
href="/dashboard"
icon={HiHome}
>
<p>
Home
</p>
</Breadcrumb.Item>

{breadcrumbList.map((crumb, idx) => {
const crumbData = crumb.text.charAt(0).toUpperCase() + crumb.text.slice(1)
const routes = crumbData ? crumbData?.split("-").reduce((s, c) => (s.charAt(0).toUpperCase() + s.slice(1)) + " " + (c.charAt(0).toUpperCase() + c.slice(1))
) : ""
return (
<Breadcrumb.Item
href={crumb.href}
key={idx}
>
{routes}
</Breadcrumb.Item>
);
})}
</div>
</Breadcrumb>
)
{breadcrumbList.map((crumb, idx) => {
console.log("crumb",);

const crumbData =
crumb.text.charAt(0).toUpperCase() + crumb.text.slice(1);
const routes = crumbData
? crumbData
?.split('-')
.reduce(
(s, c) =>
s.charAt(0).toUpperCase() +
s.slice(1) +
' ' +
(c.charAt(0).toUpperCase() + c.slice(1)),
)
: '';
return (
<Breadcrumb.Item href={crumb.href} key={crumb.text}>
{routes}
</Breadcrumb.Item>
);
})}
</div>
</Breadcrumb>
);
}


34 changes: 22 additions & 12 deletions src/components/ColorModeSwitcher.astro
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,25 +6,35 @@
>
<svg
id="theme-toggle-dark-icon"
class="hidden w-5 h-5"
fill="currentColor"
viewBox="0 0 20 20"
class="hidden"
xmlns="http://www.w3.org/2000/svg"
><path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"
width="24"
height="24"
fill="none"
viewBox="0 0 24 24"
>
<path
fill="#6B7280"
d="M12 21c-2.5 0-4.625-.875-6.375-2.625S3 14.5 3 12s.875-4.625 2.625-6.375S9.5 3 12 3a9.304 9.304 0 0 1 1.35.1 5.292 5.292 0 0 0-1.637 1.887A5.31 5.31 0 0 0 11.1 7.5c0 1.5.525 2.775 1.575 3.825C13.725 12.375 15 12.9 16.5 12.9a5.28 5.28 0 0 0 2.525-.613A5.322 5.322 0 0 0 20.9 10.65 8.505 8.505 0 0 1 21 12c0 2.5-.875 4.625-2.625 6.375S14.5 21 12 21Zm0-2c1.467 0 2.783-.404 3.95-1.212a7.012 7.012 0 0 0 2.55-3.163c-.333.083-.667.15-1 .2-.333.05-.667.075-1 .075-2.05 0-3.796-.72-5.238-2.162C9.821 11.296 9.1 9.55 9.1 7.5c0-.333.025-.667.075-1 .05-.333.117-.667.2-1a7.013 7.013 0 0 0-3.162 2.55C5.404 9.217 5 10.533 5 12c0 1.933.683 3.583 2.05 4.95C8.417 18.317 10.067 19 12 19Z"
></path></svg
>

<svg
id="theme-toggle-light-icon"
class="hidden w-5 h-5"
fill="currentColor"
viewBox="0 0 20 20"
class="hidden "
width="24"
height="24"
fill="none"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
><path
d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z"
fill-rule="evenodd"
clip-rule="evenodd"></path></svg
>
</button>
<path
fill="#6B7280"
d="M12 15c.833 0 1.542-.292 2.125-.875A2.893 2.893 0 0 0 15 12c0-.833-.292-1.542-.875-2.125A2.893 2.893 0 0 0 12 9c-.833 0-1.542.292-2.125.875A2.893 2.893 0 0 0 9 12c0 .833.292 1.542.875 2.125A2.893 2.893 0 0 0 12 15Zm0 2c-1.383 0-2.563-.488-3.537-1.463C7.488 14.563 7 13.383 7 12s.487-2.563 1.463-3.537C9.438 7.488 10.617 7 12 7s2.563.487 3.537 1.463C16.512 9.438 17 10.617 17 12s-.488 2.563-1.463 3.537C14.563 16.512 13.383 17 12 17ZM2 13a.967.967 0 0 1-.712-.287A.968.968 0 0 1 1 12a.97.97 0 0 1 .288-.713A.967.967 0 0 1 2 11h2c.283 0 .52.096.713.287.191.192.287.43.287.713s-.096.52-.287.713A.967.967 0 0 1 4 13H2Zm18 0a.968.968 0 0 1-.712-.287A.968.968 0 0 1 19 12a.97.97 0 0 1 .288-.713A.968.968 0 0 1 20 11h2a.97.97 0 0 1 .712.287c.192.192.288.43.288.713s-.096.52-.288.713A.968.968 0 0 1 22 13h-2Zm-8-8a.968.968 0 0 1-.713-.287A.967.967 0 0 1 11 4V2a.97.97 0 0 1 .287-.712A.968.968 0 0 1 12 1a.97.97 0 0 1 .713.288A.968.968 0 0 1 13 2v2c0 .283-.096.52-.287.713A.968.968 0 0 1 12 5Zm0 18a.968.968 0 0 1-.713-.288A.968.968 0 0 1 11 22v-2a.97.97 0 0 1 .287-.712A.968.968 0 0 1 12 19a.97.97 0 0 1 .713.288A.968.968 0 0 1 13 20v2a.97.97 0 0 1-.287.712A.968.968 0 0 1 12 23ZM5.65 7.05 4.575 6a.87.87 0 0 1-.288-.7 1.09 1.09 0 0 1 .288-.725c.2-.2.442-.3.725-.3s.517.1.7.3L7.05 5.65c.183.2.275.433.275.7 0 .267-.092.5-.275.7a.856.856 0 0 1-.688.288 1.07 1.07 0 0 1-.712-.288ZM18 19.425l-1.05-1.075a1.019 1.019 0 0 1-.275-.713c0-.274.092-.504.275-.687a.856.856 0 0 1 .688-.287c.274.008.512.104.712.287L19.425 18a.87.87 0 0 1 .287.7 1.085 1.085 0 0 1-.287.725c-.2.2-.442.3-.725.3a.908.908 0 0 1-.7-.3ZM16.95 7.05a.856.856 0 0 1-.287-.688 1.07 1.07 0 0 1 .287-.712L18 4.575a.87.87 0 0 1 .7-.288c.283.009.525.105.725.288.2.2.3.442.3.725s-.1.517-.3.7L18.35 7.05c-.2.183-.433.275-.7.275-.267 0-.5-.092-.7-.275ZM4.575 19.425c-.2-.2-.3-.442-.3-.725s.1-.517.3-.7l1.075-1.05c.2-.183.438-.275.712-.275.276 0 .505.092.688.275.2.183.296.413.288.688a1.07 1.07 0 0 1-.288.712L6 19.425a.87.87 0 0 1-.7.287 1.085 1.085 0 0 1-.725-.287Z"
></path>
</svg></button
>

<div
id="tooltip-toggle"
role="tooltip"
Expand Down
4 changes: 2 additions & 2 deletions src/components/CreateEcosystemOrgModal/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,7 @@ import { createOrganization } from "../../api/organization";
import { getFromLocalStorage } from "../../api/Auth";
import { createEcosystems } from "../../api/ecosystem";
import { getOrgDetails } from "../../config/ecosystem";
import React from "react";

import defaultUserIcon from "../../../public/images/person_FILL1_wght400_GRAD0_opsz24.svg"
interface Values {
name: string;
description: string;
Expand Down Expand Up @@ -291,6 +290,7 @@ const CreateEcosystemOrgModal = (props: IProps) => {
typeof (logoImage.logoFile) === "string" ?
<Avatar
size="lg"
img={defaultUserIcon}
/> :
<img
className="mb-4 rounded-lg w-28 h-28 sm:mb-0 xl:mb-4 2xl:mb-0"
Expand Down
Loading

0 comments on commit 7294645

Please sign in to comment.