Skip to content

Commit

Permalink
feat(docs): ✨ update meta for nav & arrange aside
Browse files Browse the repository at this point in the history
  • Loading branch information
navin-moorthy committed Jan 3, 2022
1 parent 207c409 commit f7e88d2
Show file tree
Hide file tree
Showing 22 changed files with 417 additions and 364 deletions.
28 changes: 14 additions & 14 deletions .yalc/nextra-renderlesskit-theme-docs/dist/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -325,7 +325,7 @@ var defaultTheme = {
logo: /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("span", {
className: "mr-2 font-extrabold hidden md:inline"
}, "Nextra"), /* @__PURE__ */ React2.createElement("span", {
className: "text-gray-600 font-normal hidden md:inline"
className: "text-slate-600 font-normal hidden md:inline"
}, "The Next Docs Builder")),
head: /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("meta", {
name: "msapplication-TileColor",
Expand Down Expand Up @@ -876,7 +876,7 @@ var NextLink = ({ route, title, isRTL }) => {
return /* @__PURE__ */ React7.createElement(Link2, {
href: route
}, /* @__PURE__ */ React7.createElement("a", {
className: cn("text-lg font-medium p-4 -m-4 no-underline text-gray-600 hover:text-blue-600 flex items-center", { "ml-2": !isRTL, "mr-2": isRTL }),
className: cn("text-lg font-medium p-4 -m-4 no-underline text-slate-600 hover:text-blue-600 flex items-center", { "ml-2": !isRTL, "mr-2": isRTL }),
title
}, title, /* @__PURE__ */ React7.createElement(arrow_right_default, {
className: cn("transform inline flex-shrink-0", {
Expand All @@ -889,7 +889,7 @@ var PrevLink = ({ route, title, isRTL }) => {
return /* @__PURE__ */ React7.createElement(Link2, {
href: route
}, /* @__PURE__ */ React7.createElement("a", {
className: cn("text-lg font-medium p-4 -m-4 no-underline text-gray-600 hover:text-blue-600 flex items-center", { "mr-2": !isRTL, "ml-2": isRTL }),
className: cn("text-lg font-medium p-4 -m-4 no-underline text-slate-600 hover:text-blue-600 flex items-center", { "mr-2": !isRTL, "ml-2": isRTL }),
title
}, /* @__PURE__ */ React7.createElement(arrow_right_default, {
className: cn("transform inline flex-shrink-0", {
Expand Down Expand Up @@ -957,7 +957,7 @@ var Footer = ({
}, children, /* @__PURE__ */ React7.createElement("hr", null), config.footer ? /* @__PURE__ */ React7.createElement("div", {
className: "mt-24 flex justify-between flex-col-reverse md:flex-row items-center md:items-end"
}, /* @__PURE__ */ React7.createElement("span", {
className: "text-gray-600"
className: "text-slate-600"
}, render_component_default(config.footerText, { locale })), /* @__PURE__ */ React7.createElement("div", {
className: "mt-6"
}), config.footerEditLink ? /* @__PURE__ */ React7.createElement(EditPageLink, {
Expand Down Expand Up @@ -1067,16 +1067,16 @@ function LocaleSwitch({ options, isRTL }) {
})), /* @__PURE__ */ React11.createElement("span", {
className: "sr-only"
}, "Languages")), mounted ? /* @__PURE__ */ React11.createElement("ul", {
className: cn2("locale-dropdown absolute block bg-white dark:bg-dark border dark:border-gray-700 py-1 rounded shadow-lg", { "right-0": !isRTL, "left-0": isRTL })
className: cn2("locale-dropdown absolute block bg-white dark:bg-dark border dark:border-slate-700 py-1 rounded shadow-lg", { "right-0": !isRTL, "left-0": isRTL })
}, Array.isArray(options) && options.map((l) => /* @__PURE__ */ React11.createElement("li", {
key: l.locale
}, /* @__PURE__ */ React11.createElement(Link3, {
href: asPath,
locale: l.locale
}, /* @__PURE__ */ React11.createElement("a", {
className: cn2("block no-underline text-current py-2 px-4 hover:bg-gray-200 dark:hover:bg-gray-800 whitespace-nowrap", {
className: cn2("block no-underline text-current py-2 px-4 hover:bg-slate-200 dark:hover:bg-slate-800 whitespace-nowrap", {
"font-semibold": locale === l.locale,
"bg-gray-100 dark:bg-gray-900": locale === l.locale
"bg-slate-100 dark:bg-slate-900": locale === l.locale
})
}, l.text))))) : null);
}
Expand Down Expand Up @@ -1182,7 +1182,7 @@ var Search = ({ directories = [] }) => {
}), show ? null : /* @__PURE__ */ React12.createElement("div", {
className: "hidden sm:flex absolute inset-y-0 right-0 py-1.5 pr-1.5"
}, /* @__PURE__ */ React12.createElement("kbd", {
className: "inline-flex items-center px-2 font-sans text-sm font-medium text-gray-400 dark:text-gray-800 dark:border-gray-800 border rounded"
className: "inline-flex items-center px-2 font-sans text-sm font-medium text-slate-400 dark:text-slate-800 dark:border-slate-800 border rounded"
}, "/"))), renderList && /* @__PURE__ */ React12.createElement("ul", {
className: "absolute left-0 z-20 w-full p-0 m-0 mt-1 list-none border divide-y rounded shadow-md md:right-0 top-100 md:w-auto"
}, results.map((res, i) => {
Expand Down Expand Up @@ -1242,7 +1242,7 @@ var Item2 = ({ title, active, href, onMouseOver, excerpt }) => {
}, /* @__PURE__ */ React13.createElement("span", {
className: "font-semibold"
}, title), excerpt ? /* @__PURE__ */ React13.createElement("div", {
className: "text-gray-600"
className: "text-slate-600"
}, /* @__PURE__ */ React13.createElement(TextWithHighlights, {
content: excerpt.text,
ranges: excerpt.highlight_ranges
Expand Down Expand Up @@ -1368,7 +1368,7 @@ function Search2() {
}), show ? null : /* @__PURE__ */ React13.createElement("div", {
className: "hidden sm:flex absolute inset-y-0 right-0 py-1.5 pr-1.5"
}, /* @__PURE__ */ React13.createElement("kbd", {
className: "inline-flex items-center px-2 font-sans text-sm font-medium text-gray-400 dark:text-gray-800 dark:border-gray-800 border rounded"
className: "inline-flex items-center px-2 font-sans text-sm font-medium text-slate-400 dark:text-slate-800 dark:border-slate-800 border rounded"
}, "/"))), renderList && /* @__PURE__ */ React13.createElement("ul", {
className: "absolute z-20 p-0 m-0 mt-1 divide-y top-full"
}, results.map((res, i) => {
Expand Down Expand Up @@ -1450,7 +1450,7 @@ function Navbar({
const activeRoute = getFSRoute(asPath, locale).split("#")[0];
const { menu, setMenu } = useMenuContext();
return /* @__PURE__ */ React15.createElement("nav", {
className: "flex items-center bg-white z-20 fixed top-0 left-0 right-0 h-16 border-b border-gray-200 px-6 dark:bg-dark dark:border-gray-900 bg-opacity-[.97] dark:bg-opacity-100"
className: "flex items-center bg-white z-20 fixed top-0 left-0 right-0 h-16 border-b border-slate-200 px-6 dark:bg-dark dark:border-slate-900 bg-opacity-[.97] dark:bg-opacity-100"
}, /* @__PURE__ */ React15.createElement("div", {
className: "w-full flex items-center mr-2"
}, /* @__PURE__ */ React15.createElement(Link6, {
Expand All @@ -1469,7 +1469,7 @@ function Navbar({
href,
key: page.route
}, /* @__PURE__ */ React15.createElement("a", {
className: cn5("no-underline whitespace-nowrap mr-4 hidden md:inline-block", page.route === activeRoute || activeRoute.startsWith(page.route + "/") ? "text-current" : "text-gray-500")
className: cn5("no-underline whitespace-nowrap mr-4 hidden md:inline-block", page.route === activeRoute || activeRoute.startsWith(page.route + "/") ? "text-current" : "text-slate-500")
}, page.title));
}) : null, /* @__PURE__ */ React15.createElement("div", {
className: "flex-1"
Expand Down Expand Up @@ -1662,7 +1662,7 @@ function Sidebar({
height: "calc(100vh - 4rem)"
}
}, /* @__PURE__ */ React16.createElement("div", {
className: "sidebar border-gray-200 dark:border-gray-900 w-full p-4 pb-40 md:pb-16 h-full overflow-y-auto"
className: "sidebar border-slate-200 dark:border-slate-900 w-full p-4 pb-40 md:pb-16 h-full overflow-y-auto"
}, /* @__PURE__ */ React16.createElement("div", {
className: "mb-4 block md:hidden"
}, config.customSearch || (config.search ? config.unstable_stork ? /* @__PURE__ */ React16.createElement(Search2, null) : /* @__PURE__ */ React16.createElement(search_default, {
Expand Down Expand Up @@ -1716,7 +1716,7 @@ function ToC({
style: indent(heading.depth)
}, /* @__PURE__ */ React17.createElement("a", {
href: `#${slug}`,
className: cn7("no-underline hover:text-gray-900 dark:hover:text-gray-100", state && state.isActive ? "text-gray-900 dark:text-gray-100 font-semibold" : "text-gray-600")
className: cn7("no-underline hover:text-slate-900 dark:hover:text-slate-100", state && state.isActive ? "text-slate-900 dark:text-slate-100 font-semibold" : "text-slate-600")
}, text));
})) : null);
}
Expand Down
2 changes: 1 addition & 1 deletion .yalc/nextra-renderlesskit-theme-docs/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -94,5 +94,5 @@
"emoji": "emoji",
"editor": false
},
"yalcSig": "ce299f7b490219a9f2f1eb4999c0c447"
"yalcSig": "ecdf36723a243c305d9261fd73b2c6b3"
}
78 changes: 41 additions & 37 deletions .yalc/nextra-renderlesskit-theme-docs/style.css
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
@tailwind base;
@tailwind components;
@tailwind utilities;

html {
@apply subpixel-antialiased;
Expand All @@ -10,7 +12,7 @@ body {
@apply bg-white;
}
.dark body {
@apply bg-dark text-gray-100;
@apply bg-dark text-slate-100;
}

h1 {
Expand All @@ -21,7 +23,7 @@ h2 {
@apply pb-1 border-b;
}
.dark h2 {
@apply border-gray-900;
@apply border-slate-900;
}
h3 {
@apply text-2xl font-semibold tracking-tight mt-8;
Expand Down Expand Up @@ -51,18 +53,18 @@ hr {
@apply my-8;
}
.dark hr {
@apply border-gray-900;
@apply border-slate-900;
}
code {
@apply text-gray-800 bg-gray-500 bg-opacity-25 rounded;
@apply text-slate-800 bg-slate-500 bg-opacity-25 rounded;
box-decoration-break: clone;
}
.dark code {
@apply text-gray-300 bg-gray-800;
@apply text-slate-300 bg-slate-800;
}
pre {
@apply p-4 bg-gray-200 rounded-lg mt-6 mb-4 overflow-x-auto;
@apply dark:bg-gray-800;
@apply p-4 bg-slate-200 rounded-lg mt-6 mb-4 overflow-x-auto;
@apply dark:bg-slate-800;
}
pre code {
@apply p-0 text-sm text-black bg-transparent rounded-none inline-block min-w-full;
Expand All @@ -71,9 +73,6 @@ a code {
@apply text-current no-underline;
}

@tailwind components;
@tailwind utilities;

.main-container {
min-height: 100vh;
}
Expand All @@ -89,31 +88,31 @@ a code {
@apply ring;
}
.sidebar .active-anchor {
@apply font-semibold text-gray-900 dark:text-white;
@apply font-semibold text-slate-900 dark:text-white;
}
.sidebar li.active > a {
@apply font-semibold text-black bg-gray-200;
@apply font-semibold text-black bg-slate-200;
}
.dark .sidebar li.active > a {
@apply text-white bg-gray-800;
@apply text-white bg-slate-800;
}
.sidebar button,
.sidebar a {
@apply block w-full text-left text-base no-underline text-gray-600 mt-1 p-2 rounded select-none outline-none;
@apply block w-full text-left text-base no-underline text-slate-600 mt-1 p-2 rounded select-none outline-none;
-webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
}
.dark .sidebar button,
.dark .sidebar a {
@apply text-gray-500;
@apply text-slate-500;
}
.sidebar a:hover,
.sidebar button:hover {
@apply text-gray-900 bg-gray-100;
@apply text-slate-900 bg-slate-100;
}
.dark .sidebar a:hover,
.dark .sidebar button:hover {
@apply text-white bg-gray-900;
@apply text-white bg-slate-900;
}
article ul {
@apply list-disc ml-6 mt-6;
Expand All @@ -125,8 +124,8 @@ article ol {
@apply list-decimal ml-6 mt-6;
}
article blockquote {
@apply italic pl-6 border-l-2 border-gray-300 text-gray-700;
@apply dark:border-gray-700 dark:text-gray-400;
@apply italic pl-6 border-l-2 border-slate-300 text-slate-700;
@apply dark:border-slate-700 dark:text-slate-400;
}

.subheading-anchor {
Expand All @@ -141,10 +140,10 @@ article blockquote {
}
.anchor-icon {
opacity: 0;
@apply ml-2 text-gray-500 select-none;
@apply ml-2 text-slate-500 select-none;
}
.dark .anchor-icon {
@apply text-gray-700;
@apply text-slate-700;
}

h2 a {
Expand All @@ -166,36 +165,36 @@ h2 a {

/* Search */
.nextra-search input {
@apply border-gray-300 text-gray-900;
@apply border-slate-300 text-slate-900;
}
.dark .nextra-search input {
@apply bg-dark border-gray-800 text-gray-100;
@apply bg-dark border-slate-800 text-slate-100;
}
.nextra-search input::placeholder {
@apply text-gray-400;
@apply text-slate-400;
}
.dark .nextra-search input::placeholder {
@apply text-gray-700;
@apply text-slate-700;
}
.nextra-search ul {
@apply rounded border bg-white text-gray-100 border-gray-300 divide-gray-300 overflow-hidden shadow-lg list-none;
@apply rounded border bg-white text-slate-100 border-slate-300 divide-slate-300 overflow-hidden shadow-lg list-none;
}
.dark .nextra-search ul {
@apply bg-dark text-gray-100 border-gray-700 divide-gray-700;
@apply bg-dark text-slate-100 border-slate-700 divide-slate-700;
}
.nextra-search ul li {
@apply text-gray-800;
@apply text-slate-800;
}
.nextra-search ul li.active,
.nextra-search ul a:focus li {
@apply bg-gray-200;
@apply bg-slate-200;
}
.dark .nextra-search ul li {
@apply text-gray-300;
@apply text-slate-300;
}
.dark .nextra-search ul li.active,
.dark .nextra-search ul a:focus li {
@apply bg-gray-800;
@apply bg-slate-800;
}
.nextra-search ul li .highlight {
@apply bg-yellow-300;
Expand Down Expand Up @@ -259,12 +258,12 @@ table {
@apply p-0;
}
table tr {
@apply m-0 p-0 border-t border-gray-300;
@apply dark:border-gray-700;
@apply m-0 p-0 border-t border-slate-300;
@apply dark:border-slate-700;
}
table tr:nth-child(2n) {
@apply bg-gray-100;
@apply dark:bg-gray-900;
@apply bg-slate-100;
@apply dark:bg-slate-900;
}
table tr th {
@apply font-semibold;
Expand All @@ -280,8 +279,8 @@ table tr td[align="right"] {
table tr th,
table tr td {
@apply text-left;
@apply m-0 px-4 py-2 border border-gray-300;
@apply dark:border-gray-700;
@apply m-0 px-4 py-2 border border-slate-300;
@apply dark:border-slate-700;
}
.table-container {
overflow: auto;
Expand All @@ -301,6 +300,11 @@ pre .prism-code {
.dark pre .prism-code {
--c-highlight: #3d4b61;
}

pre .prism-code .token-line {
line-height: 150%;
}

pre .prism-code .token.plain,
pre .prism-code .token.builtin,
pre .prism-code .token.char,
Expand Down
2 changes: 1 addition & 1 deletion .yalc/nextra-renderlesskit-theme-docs/yalc.sig
Original file line number Diff line number Diff line change
@@ -1 +1 @@
ce299f7b490219a9f2f1eb4999c0c447
ecdf36723a243c305d9261fd73b2c6b3
2 changes: 1 addition & 1 deletion components/ComponentLinks.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ const ComponentLinks: React.FC<ComponentLinkProps> = ({
"https://renderlesskit-react-tailwind.vercel.app/?path=/story/";

return (
<ButtonGroup size="md" className="mt-5 component-links">
<ButtonGroup size="md" variant="outline" className="mt-5 component-links">
{github && (
<Button
as={Link}
Expand Down
Loading

0 comments on commit f7e88d2

Please sign in to comment.