Skip to content

Commit bceb255

Browse files
committed
Update design + add resources page
1 parent e7dca73 commit bceb255

File tree

10 files changed

+549
-107
lines changed

10 files changed

+549
-107
lines changed

docs/docs/intro.md

Lines changed: 23 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -16,54 +16,34 @@ For each snippet, you will find the **source code**, required **permissions**, l
1616

1717
Currently, we offer snippets for [Streamlit](/docs/category/streamlit), [Dash](/docs/category/dash), and [FastAPI](/docs/category/fastapi) and they can be easily adapted to other Python frameworks.
1818

19-
<div className="mt-4 flex w-full flex-row items-center justify-center space-x-4 sm:w-auto">
20-
<Link to="/docs/category/streamlit" className="landing-button-horizontal">
21-
<button className="inline-flex w-full items-center justify-center border-2 border-lava-600 bg-transparent px-8 py-2.5 text-center align-middle text-lg font-semibold text-lava-600 hover:cursor-pointer hover:border-lava-700 hover:underline">
22-
<div className="flex h-8 items-center">
23-
<img src="/img/logo_streamlit.svg" className="mr-4 h-6" />
24-
</div>
25-
<span className="m-0 p-0">Build with Streamlit</span>
19+
<div className="mt-6 flex w-full flex-col items-center justify-center gap-4 sm:flex-row">
20+
<Link to="/docs/category/streamlit" className="w-full sm:w-auto">
21+
<button className="inline-flex h-14 w-full items-center justify-center gap-3 border-2 border-lava-600 bg-transparent px-6 py-2.5 text-lg font-semibold text-lava-600 transition-colors hover:border-lava-700 hover:bg-lava-600 hover:text-white">
22+
<img
23+
src="/img/logo_streamlit.svg"
24+
alt="Streamlit logo"
25+
className="h-6 w-6 object-contain"
26+
/>
27+
<span>Build with Streamlit</span>
2628
</button>
2729
</Link>
28-
<Link to="/docs/category/dash" className="landing-button-horizontal">
29-
<button className="inline-flex w-full items-center justify-center border-2 border-lava-600 bg-transparent px-8 py-2.5 text-center align-middle text-lg font-semibold text-lava-600 hover:cursor-pointer hover:border-lava-700 hover:underline">
30-
<div className="flex h-8 items-center">
31-
<img src="/img/logo_dash.png" className="mr-4 h-6" />
32-
</div>
30+
<Link to="/docs/category/dash" className="w-full sm:w-auto">
31+
<button className="inline-flex h-14 w-full items-center justify-center gap-3 border-2 border-lava-600 bg-transparent px-6 py-2.5 text-lg font-semibold text-lava-600 transition-colors hover:border-lava-700 hover:bg-lava-600 hover:text-white">
32+
<img
33+
src="/img/logo_dash.png"
34+
alt="Dash logo"
35+
className="h-6 w-6 object-contain"
36+
/>
3337
<span>Build with Dash</span>
3438
</button>
3539
</Link>
36-
<Link to="/docs/category/fastapi" className="landing-button-horizontal">
37-
<button className="inline-flex w-full items-center justify-center border-2 border-lava-600 bg-transparent px-8 py-2.5 text-center align-middle text-lg font-semibold text-lava-600 hover:cursor-pointer hover:border-lava-700 hover:underline">
38-
<div className="flex h-8 items-center">
39-
<img src="/img/logo_fastapi.svg" className="mr-4 h-6" />
40-
</div>
41-
<span>Build with FastAPI</span>
42-
</button>
43-
</Link>
44-
</div>
45-
<div className="mt-4 flex w-full flex-col items-center justify-center space-y-4 sm:w-auto">
46-
<Link to="/docs/category/streamlit" className="landing-button-vertical w-full">
47-
<button className="inline-flex w-full items-center justify-center border-2 border-lava-600 bg-transparent px-8 py-2.5 text-center align-middle text-lg font-semibold text-lava-600 hover:cursor-pointer hover:border-lava-700 hover:underline">
48-
<div className="flex h-8 items-center">
49-
<img src="/img/logo_streamlit.svg" className="mr-4 h-6" />
50-
</div>
51-
<span className="m-0 p-0">Build with Streamlit</span>
52-
</button>
53-
</Link>
54-
<Link to="/docs/category/dash" className="landing-button-vertical w-full">
55-
<button className="inline-flex w-full items-center justify-center border-2 border-lava-600 bg-transparent px-8 py-2.5 text-center align-middle text-lg font-semibold text-lava-600 hover:cursor-pointer hover:border-lava-700 hover:underline">
56-
<div className="flex h-8 items-center">
57-
<img src="/img/logo_dash.png" className="mr-4 h-6" />
58-
</div>
59-
<span>Build with Dash</span>
60-
</button>
61-
</Link>
62-
<Link to="/docs/category/fastapi" className="landing-button-vertical w-full">
63-
<button className="inline-flex w-full items-center justify-center border-2 border-lava-600 bg-transparent px-8 py-2.5 text-center align-middle text-lg font-semibold text-lava-600 hover:cursor-pointer hover:border-lava-700 hover:underline">
64-
<div className="flex h-8 items-center">
65-
<img src="/img/logo_fastapi.svg" className="mr-4 h-6" />
66-
</div>
40+
<Link to="/docs/category/fastapi" className="w-full sm:w-auto">
41+
<button className="inline-flex h-14 w-full items-center justify-center gap-3 border-2 border-lava-600 bg-transparent px-6 py-2.5 text-lg font-semibold text-lava-600 transition-colors hover:border-lava-700 hover:bg-lava-600 hover:text-white">
42+
<img
43+
src="/img/logo_fastapi.svg"
44+
alt="FastAPI logo"
45+
className="h-6 w-6 object-contain"
46+
/>
6747
<span>Build with FastAPI</span>
6848
</button>
6949
</Link>

docs/docusaurus.config.ts

Lines changed: 3 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -37,19 +37,14 @@ const config: Config = {
3737
docs: {
3838
sidebarPath: "./sidebars.ts",
3939
editUrl:
40-
"https://github.com/pbv0/databricks-apps-cookbook/edit/main/docs/",
40+
"https://github.com/databricks-solutions/databricks-apps-cookbook/edit/main/docs/",
4141
},
4242
blog: {
4343
showReadingTime: true,
4444
feedOptions: {
4545
type: ["rss", "atom"],
4646
xslt: true,
4747
},
48-
// Please change this to your repo.
49-
// Remove this to remove the "edit this page" links.
50-
editUrl:
51-
"https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/",
52-
// Useful options to enforce blogging best practices
5348
onInlineTags: "warn",
5449
onInlineAuthors: "warn",
5550
onUntruncatedBlogPosts: "warn",
@@ -62,16 +57,8 @@ const config: Config = {
6257
],
6358

6459
plugins: [
60+
"./src/plugins/tailwind-config.js",
6561
require.resolve("docusaurus-lunr-search"),
66-
function tailwindPlugin(context, options) {
67-
return {
68-
name: "tailwind-plugin",
69-
configurePostCss(postcssOptions) {
70-
postcssOptions.plugins = [require("@tailwindcss/postcss")];
71-
return postcssOptions;
72-
},
73-
};
74-
},
7562
],
7663

7764
themeConfig: {
@@ -109,7 +96,7 @@ const config: Config = {
10996
position: "left",
11097
activeBasePath: "docs/category/fastapi",
11198
},
112-
{ to: "blog", label: "Blog", position: "left" },
99+
{ to: "resources", label: "Resources", position: "left" },
113100
{
114101
href: "https://github.com/pbv0/databricks-apps-cookbook/",
115102
label: "GitHub",

docs/package-lock.json

Lines changed: 13 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

docs/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,8 +22,7 @@
2222
"docusaurus-lunr-search": "^3.6.0",
2323
"prism-react-renderer": "^2.3.0",
2424
"react": "^19.0.0",
25-
"react-dom": "^19.0.0",
26-
"tailwindcss-animate": "^1.0.7"
25+
"react-dom": "^19.0.0"
2726
},
2827
"devDependencies": {
2928
"@docusaurus/module-type-aliases": "^3.8.1",
@@ -33,6 +32,7 @@
3332
"postcss": "^8.5.6",
3433
"prettier": "^3.5.3",
3534
"prettier-plugin-tailwindcss": "^0.6.11",
35+
"tailwind-merge": "^3.3.1",
3636
"tailwindcss": "^4.1.11",
3737
"typescript": "~5.6.2"
3838
},

docs/postcss.config.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
module.exports = {
2+
plugins: {
3+
"@tailwindcss/postcss": {},
4+
},
5+
};

docs/src/css/custom.css

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
@import url("https://fonts.googleapis.com/css2?family=DM+Mono:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap");
22

33
@layer theme, base, components, utilities;
4-
@import "tailwindcss/theme.css" layer(theme) important;
5-
@import "tailwindcss/utilities.css" layer(utilities) important;
4+
@import "tailwindcss/theme.css" layer(theme);
5+
@import "tailwindcss/utilities.css" layer(utilities);
66

77
@custom-variant dark (&:is([data-theme="dark"] *));
88

@@ -18,6 +18,8 @@
1818
--ifm-heading-font-family: "DM Sans";
1919
--ifm-font-family-monospace: "DM Mono", monospace;
2020

21+
--ifm-heading-color: #1e2938;
22+
2123
--ifm-color-primary: #ff3621;
2224
--ifm-color-primary-dark: #ff1c04;
2325
--ifm-color-primary-darker: #f51700;
@@ -44,6 +46,8 @@
4446
}
4547

4648
[data-theme="dark"] {
49+
--ifm-heading-color: #ffffff;
50+
4751
--ifm-color-primary: #ff3621;
4852
--ifm-color-primary-dark: #ff1c04;
4953
--ifm-color-primary-darker: #f51700;

docs/src/pages/index.tsx

Lines changed: 5 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -24,60 +24,23 @@ function HomepageHeader() {
2424
<p className="mt-2 max-w-3xl text-gray-800 xs:text-xl md:mt-4 md:text-3xl md:leading-10 dark:text-white">
2525
{siteConfig.tagline}
2626
</p>
27-
<div className="mt-2 flex w-full flex-row items-center justify-center space-x-4 sm:w-auto">
28-
<Link
29-
to="/docs/category/streamlit"
30-
className="landing-button-horizontal"
31-
>
27+
<div className="mt-4 flex w-full flex-col items-center justify-center gap-4 xs:flex-col sm:w-auto sm:flex-row">
28+
<Link to="/docs/category/streamlit" className="w-full sm:w-auto">
3229
<button className="w-full border-2 border-lava-600 bg-lava-600 px-8 py-2.5 align-middle font-semibold text-white hover:cursor-pointer hover:border-lava-700 hover:bg-lava-700 hover:underline xs:text-lg">
3330
Streamlit
3431
</button>
3532
</Link>
36-
<Link to="/docs/category/dash" className="landing-button-horizontal">
33+
<Link to="/docs/category/dash" className="w-full sm:w-auto">
3734
<button className="w-full border-2 border-lava-600 bg-lava-600 px-8 py-2.5 align-middle font-semibold text-white hover:cursor-pointer hover:border-lava-700 hover:bg-lava-700 hover:underline xs:text-lg">
3835
Dash
3936
</button>
4037
</Link>
41-
<Link
42-
to="/docs/category/fastapi"
43-
className="landing-button-horizontal"
44-
>
38+
<Link to="/docs/category/fastapi" className="w-full sm:w-auto">
4539
<button className="w-full border-2 border-lava-600 bg-lava-600 px-8 py-2.5 align-middle font-semibold text-white hover:cursor-pointer hover:border-lava-700 hover:bg-lava-700 hover:underline xs:text-lg">
4640
FastAPI
4741
</button>
4842
</Link>
49-
<Link to="/docs/intro" className="landing-button-horizontal">
50-
<button className="w-full border-2 border-gray-800 bg-transparent px-8 py-2.5 align-middle font-semibold text-gray-800 hover:cursor-pointer hover:underline xs:text-lg dark:border-white dark:text-white">
51-
Learn more
52-
</button>
53-
</Link>
54-
</div>
55-
<div className="mt-2 flex w-full flex-col items-center justify-center space-y-4 sm:w-auto">
56-
<Link
57-
to="/docs/category/streamlit"
58-
className="landing-button-vertical w-full"
59-
>
60-
<button className="w-full border-2 border-lava-600 bg-lava-600 px-8 py-2.5 align-middle font-semibold text-white hover:cursor-pointer hover:border-lava-700 hover:bg-lava-700 hover:underline xs:text-lg">
61-
Streamlit
62-
</button>
63-
</Link>
64-
<Link
65-
to="/docs/category/dash"
66-
className="landing-button-vertical w-full"
67-
>
68-
<button className="w-full border-2 border-lava-600 bg-lava-600 px-8 py-2.5 align-middle font-semibold text-white hover:cursor-pointer hover:border-lava-700 hover:bg-lava-700 hover:underline xs:text-lg">
69-
Dash
70-
</button>
71-
</Link>
72-
<Link
73-
to="/docs/category/fastapi"
74-
className="landing-button-vertical w-full"
75-
>
76-
<button className="w-full border-2 border-lava-600 bg-lava-600 px-8 py-2.5 align-middle font-semibold text-white hover:cursor-pointer hover:border-lava-700 hover:bg-lava-700 hover:underline xs:text-lg">
77-
FastAPI
78-
</button>
79-
</Link>
80-
<Link to="/docs/intro" className="landing-button-vertical w-full">
43+
<Link to="/docs/intro" className="w-full sm:w-auto">
8144
<button className="w-full border-2 border-gray-800 bg-transparent px-8 py-2.5 align-middle font-semibold text-gray-800 hover:cursor-pointer hover:underline xs:text-lg dark:border-white dark:text-white">
8245
Learn more
8346
</button>

0 commit comments

Comments
 (0)