styling
This commit is contained in:
parent
5468c18a01
commit
d3ce2a3ec1
5
.gitignore
vendored
5
.gitignore
vendored
@ -179,6 +179,5 @@ bun.lockb
|
||||
build/
|
||||
|
||||
|
||||
pnpm-lock.yaml
|
||||
|
||||
|
||||
pnpm-lock.yaml
|
||||
package-lock.json
|
||||
|
||||
@ -61,9 +61,10 @@ fi
|
||||
echo "Installing dependencies..."
|
||||
export PATH=${BASE}/node_modules/.bin:$PATH
|
||||
|
||||
pnpm install @docusaurus/core@3.6.3 @docusaurus/preset-classic@3.6.3 @docusaurus/theme-mermaid@3.6.3
|
||||
pnpm install @docusaurus/core @docusaurus/preset-classic @docusaurus/theme-mermaid
|
||||
pnpm install react-player
|
||||
pnpm install tailwindcss
|
||||
pnpm install --save-dev @types/node @docusaurus/types @docusaurus/preset-classic prism-react-renderer redocusaurus
|
||||
# pnpm add redocusaurus
|
||||
pnpm add tailwindcss-animate class-variance-authority clsx tailwind-merge lucide-react
|
||||
# #pnpm dlx shadcn@latest init
|
||||
|
||||
23599
package-lock.json
generated
23599
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
10
package.json
10
package.json
@ -17,7 +17,6 @@
|
||||
"dependencies": {
|
||||
"@docusaurus/core": "^3.6.3",
|
||||
"@docusaurus/plugin-client-redirects": "3.6.3",
|
||||
"@docusaurus/preset-classic": "^3.6.3",
|
||||
"@docusaurus/theme-mermaid": "^3.6.3",
|
||||
"@hookform/resolvers": "^3.9.1",
|
||||
"@mdx-js/react": "^3.0.0",
|
||||
@ -53,7 +52,6 @@
|
||||
"embla-carousel-react": "^8.5.1",
|
||||
"input-otp": "^1.4.1",
|
||||
"next-themes": "^0.4.4",
|
||||
"prism-react-renderer": "^2.3.0",
|
||||
"raw-loader": "^4.0.2",
|
||||
"react": "^18.0.0",
|
||||
"react-day-picker": "8.10.1",
|
||||
@ -62,7 +60,6 @@
|
||||
"react-player": "^2.16.0",
|
||||
"react-resizable-panels": "^2.1.7",
|
||||
"recharts": "^2.15.0",
|
||||
"redocusaurus": "^2.2.0",
|
||||
"sonner": "^1.7.1",
|
||||
"tailwindcss-animate": "^1.0.7",
|
||||
"vaul": "^1.1.2",
|
||||
@ -71,11 +68,12 @@
|
||||
"devDependencies": {
|
||||
"@docusaurus/module-type-aliases": "3.6.3",
|
||||
"@docusaurus/plugin-content-blog": "^3.6.3",
|
||||
"@docusaurus/preset-classic": "^3.6.3",
|
||||
"@docusaurus/theme-common": "^3.6.3",
|
||||
"@docusaurus/tsconfig": "3.6.3",
|
||||
"@docusaurus/types": "3.6.3",
|
||||
"@types/bun": "latest",
|
||||
"@types/node": "^22.10.2",
|
||||
"@types/node": "^22.10.5",
|
||||
"@types/react": "^19.0.2",
|
||||
"@types/react-dom": "^19.0.2",
|
||||
"autoprefixer": "^10.4.20",
|
||||
@ -83,7 +81,9 @@
|
||||
"clsx": "^2.1.1",
|
||||
"lucide-react": "^0.469.0",
|
||||
"postcss": "^8.4.49",
|
||||
"tailwind-merge": "^2.5.5",
|
||||
"prism-react-renderer": "^2.4.1",
|
||||
"redocusaurus": "^2.2.0",
|
||||
"tailwind-merge": "^2.6.0",
|
||||
"tailwindcss": "^3.4.17",
|
||||
"typescript": "~5.5.2"
|
||||
},
|
||||
|
||||
3955
pnpm-lock.yaml
3955
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
@ -330,22 +330,109 @@ aside.theme-doc-sidebar-container {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
/* Mobile elements */
|
||||
.navbar__toggle {
|
||||
color: #ffffff;
|
||||
/* Enhanced Mobile Responsiveness */
|
||||
@media screen and (max-width: 768px) {
|
||||
/* Improved typography for mobile */
|
||||
body {
|
||||
font-size: 16px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
h1 { font-size: clamp(1.75rem, 8vw, 2.5rem); }
|
||||
h2 { font-size: clamp(1.5rem, 6vw, 2rem); }
|
||||
h3 { font-size: clamp(1.25rem, 5vw, 1.75rem); }
|
||||
h4 { font-size: clamp(1rem, 4vw, 1.5rem); }
|
||||
|
||||
/* Better spacing on mobile */
|
||||
.container {
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
}
|
||||
|
||||
/* Improved table handling */
|
||||
.table-responsive {
|
||||
display: block;
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
/* Better image handling */
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/* Enhanced touch targets */
|
||||
.navbar__item,
|
||||
.menu__link,
|
||||
.table-of-contents__link,
|
||||
.navbar__toggle,
|
||||
button {
|
||||
min-height: 44px;
|
||||
padding: 0.75rem 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-sidebar {
|
||||
background-color: #131213;
|
||||
/* Mobile Navigation */
|
||||
@media (max-width: 996px) {
|
||||
.navbar__toggle {
|
||||
display: block !important;
|
||||
position: fixed !important;
|
||||
top: 1rem !important;
|
||||
right: 1rem !important;
|
||||
z-index: 9999 !important;
|
||||
width: 44px !important;
|
||||
height: 44px !important;
|
||||
background: #000 !important;
|
||||
color: #fff !important;
|
||||
border-radius: 4px !important;
|
||||
cursor: pointer !important;
|
||||
}
|
||||
|
||||
.navbar__toggle::before {
|
||||
content: '☰' !important;
|
||||
font-size: 24px !important;
|
||||
}
|
||||
|
||||
.navbar-sidebar {
|
||||
display: block !important;
|
||||
position: fixed !important;
|
||||
top: 0 !important;
|
||||
left: 0 !important;
|
||||
bottom: 0 !important;
|
||||
width: 300px !important;
|
||||
background: #000 !important;
|
||||
z-index: 9998 !important;
|
||||
}
|
||||
|
||||
.navbar-sidebar__items {
|
||||
padding: 1rem !important;
|
||||
}
|
||||
|
||||
.navbar-sidebar__backdrop {
|
||||
position: fixed !important;
|
||||
top: 0 !important;
|
||||
left: 0 !important;
|
||||
right: 0 !important;
|
||||
bottom: 0 !important;
|
||||
background: rgba(0, 0, 0, 0.5) !important;
|
||||
z-index: 9997 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-sidebar__brand {
|
||||
background-color: #131213;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
/* Prevent body scroll when menu is open */
|
||||
body.menu-open {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.navbar-sidebar__items {
|
||||
background-color: #131213;
|
||||
/* Enhanced touch feedback */
|
||||
@media (hover: none) {
|
||||
.navbar__item:active,
|
||||
.menu__link:active,
|
||||
.table-of-contents__link:active {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
/* Enhanced button styling for shadcn */
|
||||
@ -513,13 +600,35 @@ aside.theme-doc-sidebar-container {
|
||||
margin: 2rem 0;
|
||||
}
|
||||
|
||||
/* Enhanced blog styles with modern typography and spacing */
|
||||
/* Enhanced blog styles with mobile optimization */
|
||||
.blog-post-title,
|
||||
.blog-list-title,
|
||||
.blog-list-page article header h2 {
|
||||
font-size: clamp(1.5rem, 3vw, 2.5rem) !important;
|
||||
margin-bottom: 1rem;
|
||||
transition: color var(--transition-fast);
|
||||
word-wrap: break-word;
|
||||
overflow-wrap: break-word;
|
||||
hyphens: auto;
|
||||
}
|
||||
|
||||
/* Mobile-optimized blog images */
|
||||
@media screen and (max-width: 768px) {
|
||||
.blog-post img,
|
||||
article.blog-list-item img {
|
||||
margin: 1.5rem 0;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.blog-post-title,
|
||||
.blog-list-title {
|
||||
font-size: clamp(1.25rem, 6vw, 1.75rem) !important;
|
||||
}
|
||||
|
||||
article.margin-bottom--xl {
|
||||
margin-bottom: 2rem;
|
||||
padding-bottom: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.blog-post-title:hover,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user