Skip to content

Commit

Permalink
Improving interfaces landing page
Browse files Browse the repository at this point in the history
  • Loading branch information
@urmauur
urmauur committed Oct 17, 2023
1 parent c220d7c commit 57dcde2
Show file tree
Hide file tree
Showing 30 changed files with 1,107 additions and 769 deletions.
89 changes: 8 additions & 81 deletions docs/docusaurus.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@ const config = {

// Plugins we added
plugins: [
"docusaurus-plugin-sass",
async function myPlugin(context, options) {
return {
name: "docusaurus-tailwindcss",
Expand Down Expand Up @@ -75,7 +76,7 @@ const config = {
blog: false,
// Will be passed to @docusaurus/theme-classic.
theme: {
customCss: require.resolve("./src/css/custom.css"),
customCss: require.resolve("./src/styles/main.scss"),
},
// Will be passed to @docusaurus/plugin-content-pages (false to disable)
// pages: {},
Expand Down Expand Up @@ -153,86 +154,12 @@ const config = {
// label: "API",
// to: "/api",
// },
{
href: "https://github.com/janhq/jan",
label: "GitHub",
position: "right",
},
],
},
footer: {
style: "dark",
links: [
{
title: "Jan",
items: [
{
label: "Home",
to: "/",
},
{
label: "Platform",
to: "/platform",
},
{
label: "Solutions",
to: "/solutions",
},
],
},
{
title: "Docs",
items: [
{
label: "Docs",
to: "/docs",
},
{
label: "Hardware",
to: "/hardware",
},
{
label: "API",
to: "/api",
},
{
label: "Changelog",
to: "/changelog",
},
],
},
{
title: "Community",
items: [
{
label: "Discord",
href: "https://discord.gg/FTk2MvZwJH",
},
{
label: "Twitter",
href: "https://twitter.com/jan_dotai",
},
],
},
{
title: "Company",
items: [
{
label: "About",
to: "/about",
},
{
label: "Careers",
href: "https://janai.bamboohr.com/careers",
},
{
label: "GitHub",
href: "https://github.com/janhq/jan",
},
],
},
// {
// href: "https://github.com/janhq/jan",
// label: "GitHub",
// position: "right",
// },
],
copyright: `Copyright © ${new Date().getFullYear()} Jan AI Pte Ltd.`,
},
prism: {
theme: lightCodeTheme,
Expand All @@ -241,7 +168,7 @@ const config = {
},
colorMode: {
disableSwitch: false,
respectPrefersColorScheme: false,
respectPrefersColorScheme: true,
},
}),
};
Expand Down
3 changes: 3 additions & 0 deletions docs/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,12 +23,15 @@
"autoprefixer": "^10.4.16",
"axios": "^1.5.1",
"clsx": "^1.2.1",
"docusaurus-plugin-sass": "^0.2.5",
"js-yaml": "^4.1.0",
"postcss": "^8.4.30",
"prism-react-renderer": "^1.3.5",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-icons": "^4.11.0",
"redocusaurus": "^1.6.3",
"sass": "^1.69.3",
"tailwindcss": "^3.3.3"
},
"devDependencies": {
Expand Down
78 changes: 78 additions & 0 deletions docs/src/components/Announcement/index.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,78 @@
import React from "react";

import { useAppStars } from "@site/src/hooks/useAppStars";
import { useAppRelease } from "@site/src/hooks/useAppRelease";

import { AiOutlineGithub, AiOutlineTwitter } from "react-icons/ai";
import { BiLogoDiscordAlt } from "react-icons/bi";

const socials = [
{
icon: <AiOutlineTwitter className="text-xl text-white" />,
href: "https://twitter.com/jan_dotai",
},
{
icon: <BiLogoDiscordAlt className="text-xl text-white" />,
href: "https://discord.com/invite/FTk2MvZwJH",
},
{
icon: <AiOutlineGithub className="text-lg text-white" />,
href: "https://github.com/janhq/jan",
},
];

export default function AnnoncementBanner() {
const { stargazers } = useAppStars();
const { release } = useAppRelease();

return (
<div className="h-10 w-full flex-shrink-0 bg-blue-600">
<div className="container flex h-full items-center justify-between py-0.5">
<div className="flex h-6 items-center shadow-sm">
<a
href="https://github.com/janhq/jan"
target="_blank"
className="flex h-full items-center gap-x-1 rounded-l-sm bg-indigo-50 px-1 py-0.5"
>
<AiOutlineGithub className="text-lg text-gray-800" />
<span className="text-xs font-bold tracking-tight text-gray-800">
Stars
</span>
</a>
<a
href="https://github.com/janhq/jan/stargazers"
target="_blank"
className="flex h-full items-center rounded-r-sm border-l border-gray-100 bg-white px-1 py-0.5 font-medium"
>
<span className="text-xs font-bold text-gray-700">
{stargazers.count}
</span>
</a>
</div>
<a
href="https://github.com/janhq/jan/releases"
target="_blank"
className="hidden items-center gap-x-2 lg:flex"
>
✨
<div className="flex items-center rounded bg-white px-2">
<span className="font-bold uppercase text-blue-600">new</span>
</div>
<p className="text-white">
<span className="font-bold capitalize">{release.tagVersion}</span>
&nbsp;is now live on GitHub. Check it out
</p>
</a>
<div className="flex items-center gap-x-3">
{socials.map((social, i) => {
return (
<a key={i} href={social.href} target="_blank">
{social.icon}
</a>
);
})}
</div>
</div>
</div>
);
}
37 changes: 19 additions & 18 deletions docs/src/components/Elements/dropdown.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,21 +57,24 @@ export default function Dropdown() {
const updateDownloadLinks = async () => {
try {
const releaseInfo = await getLatestReleaseInfo("janhq", "jan");

// Extract appname from the first asset name
const firstAssetName = releaseInfo.assets[0].name;
const appname = extractAppName(firstAssetName);

if (!appname) {
console.error("Failed to extract appname from file name:", firstAssetName);
console.error(
"Failed to extract appname from file name:",
firstAssetName
);
return;
}

// Remove 'v' at the start of the tag_name
const tag = releaseInfo.tag_name.startsWith("v")
? releaseInfo.tag_name.substring(1)
: releaseInfo.tag_name;

const updatedSystems = systems.map((system) => {
const downloadUrl = system.fileFormat
.replace("{appname}", appname)
Expand All @@ -81,21 +84,21 @@ export default function Dropdown() {
href: `https://github.com/janhq/jan/releases/download/${releaseInfo.tag_name}/${downloadUrl}`,
};
});

setSystems(updatedSystems);
setDefaultSystem(updatedSystems[0]);
} catch (error) {
console.error("Failed to update download links:", error);
}
};

updateDownloadLinks();
}, []);

return (
<div className="inline-flex align-items-stretch">
<a
className="cursor-pointer relative inline-flex items-center rounded-l-md border-0 px-3.5 py-2.5 text-base font-semibold text-white bg-blue-600 dark:bg-blue-500 hover:bg-blue-500 dark:hover:bg-blue-400 hover:text-white"
className="cursor-pointer relative inline-flex items-center rounded-l-md border-0 px-3.5 py-2.5 text-base font-semibold text-white bg-blue-600 hover:bg-blue-500 hover:text-white"
href={defaultSystem.href}
>
<img
Expand All @@ -106,9 +109,9 @@ export default function Dropdown() {
{defaultSystem.name}
</a>
<Menu as="div" className="relative -ml-px block">
<Menu.Button className="cursor-pointer relative inline-flex items-center rounded-r-md border-0 border-l border-gray-300 active:border-l active:border-white h-full text-white bg-blue-600 dark:bg-blue-500 hover:bg-blue-500 dark:hover:bg-blue-400">
<Menu.Button className="cursor-pointer relative inline-flex items-center rounded-r-md border-l border-blue-500 h-full text-white bg-blue-600 w-8 justify-center">
<span className="sr-only">Open OS options</span>
<ChevronDownIcon className="h-5 w-5" aria-hidden="true" />
<ChevronDownIcon className="h-6 w-6" aria-hidden="true" />
</Menu.Button>
<Transition
as={Fragment}
Expand All @@ -119,26 +122,24 @@ export default function Dropdown() {
leaveFrom="transform opacity-100 scale-100"
leaveTo="transform opacity-0 scale-95"
>
<Menu.Items className="absolute right-0 z-10 mt-2 w-72 text-left origin-top-right rounded-md bg-blue-600 dark:bg-blue-500 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none">
<div className="py-1">
<Menu.Items className="absolute right-0 z-10 mt-2 w-72 text-left origin-top-right rounded-md bg-blue-600 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none overflow-hidden">
<div className="overflow-hidden">
{systems.map((system) => (
<Menu.Item key={system.name}>
{({ active }) => (
<a
href={system.href}
className={classNames(
active
? "bg-blue-500 dark:hover:bg-blue-400 hover:text-white"
: "text-white",
"block px-4 py-2"
active ? "bg-blue-500 hover:text-white" : "text-white",
"flex px-4 py-3 items-center text-white hover:text-white"
)}
>
<img
src={system.logo}
alt="Logo"
className="w-3 mr-3 -mt-1"
className="w-3 mr-3 -mt-1 flex-shrink-0"
/>
{system.name}
<span className="text-white">{system.name}</span>
</a>
)}
</Menu.Item>
Expand Down
Loading

0 comments on commit 57dcde2

Please sign in to comment.