diff --git a/docs/getting-started.md b/docs/getting-started.md index ed4f875..d130c19 100644 --- a/docs/getting-started.md +++ b/docs/getting-started.md @@ -10,21 +10,15 @@ description: Rebase your skills with modern software development practices. Dev-Rebase is a collection of short guides designed to help developers learn about modern software development practices. These guides cover essential topics that are commonly expected in today's tech industry, especially when working at international companies or applying for remote positions. -## Why I created this website? +## How did Dev-Rebase come to exist? -### My personal journey +I'm [Mohammad Ghanem](https://www.linkedin.com/in/ghanem-mhd/), and I created Dev-Rebase after experiencing firsthand the gap between local development experience and international tech expectations. -I'm [Mohammad Ghanem](https://www.linkedin.com/in/ghanem-mhd/), a software engineer who moved from Syria to Germany. As someone from Syria, I experienced firsthand how software development practices can vary significantly between different regions and markets... +When I moved from Syria to Germany and started working at different companies, I quickly realized there were many practices and approaches that companies expected me to know as a developer. I had to actively learn these topics to bridge the gap in my knowledge and meet industry standards. -This became very clear when I moved to Germany and started working at different companies. I quickly realized there were many practices and approaches that most companies expected me to know as a developer. I had to actively learn these topics to bridge the gap in my knowledge and meet industry standards. +About a year ago, I started volunteering with the [Imagine Foundation](https://www.joinimagine.com/) as a technical coach, conducting sessions for developers trying to enter the European job market. During these sessions, I noticed that most developers faced similar knowledge gaps for the same reasons I had experienced - their work environments implemented fewer modern practices, and the expectations were lower. -### Coaching experience that inspired this project - -About a year ago, I started volunteering with the [Imagine Foundation](https://www.joinimagine.com/) as a technical coach. I began conducting technical coaching sessions for developers who were trying to enter the European job market. Over the course of this work, I completed dozens of sessions, numbering in the high double digits, with people at different skill levels. - -I loved every single session and had the pleasure of meeting many wonderful people. During these sessions, I noticed that most fellows (we call them fellows because that's the name of the program at Imagine) faced similar knowledge gaps. This happened for the same reasons I experienced - their work environments implemented fewer modern practices, and the expectations were lower. - -This gap in knowledge and skills could affect their chances when applying for remote jobs or positions that require relocation. After seeing this pattern repeat many times, I realized it would be valuable to collect these practices and topics in one place and share them with my fellows and anyone else who might find them useful. +After seeing this pattern repeat many times across dozens of coaching sessions, I realized it would be valuable to collect these practices and topics in one place and share them with anyone who might find them useful. That's how Dev-Rebase was born - to help developers bridge the gap between local experience and global tech opportunities. ## For who? @@ -39,30 +33,30 @@ If you can already program and build applications, but want to learn about indus ## How to use this guide? -The topics are presented in an order that makes logical sense, but **you can read them in any order** that works for you. Each guide is designed to be self-contained, so feel free to jump to topics that interest you most or that you need to learn for your current work. At the end of each topic, there a list of resources in English and Arabic. These resources are not exhaustive and don't the topic in depth, but they are a good starting point to learn more. +The topics are presented in an order that makes logical sense, but **you can read them in any order** that works for you. Each guide is designed to be self-contained, so feel free to jump to topics that interest you most or that you need to learn for your current work. At the end of each topic, there a list of resources in English and Arabic. These resources are not exhaustive and don't cover the topic in depth, but they are a good starting point to learn more. ## What topics are covered? **Core Skills** - Essential technical skills that every developer needs to work effectively in modern development environments. -- [Web Development](/web) -- [Git](/git) -- [Testing](/testing) +- [Web Development](/docs/web) +- [Git](/docs/git) +- [Testing](/docs/testing) **Deployment & Production** - Tools and practices for deploying applications and maintaining them in production environments. -- [Containerization](/containerization) -- [CI/CD](/ci-cd) -- [Observability](/observability) +- [Containerization](/docs/containerization) +- [CI/CD](/docs/ci-cd) +- [Observability](/docs/observability) **Learn by Doing** - Practical ways to apply your skills and build real-world experience while contributing to the developer community. -- [Open Source](/open-source) +- [Open Source](/docs/open-source) **Learn from Others** - Resources for connecting with experienced developers and communities that can accelerate your growth. -- [Mentorship](/mentorship) -- [Global Communities](/global-communities) +- [Mentorship](/docs/mentorship) +- [Global Communities](/docs/global-communities) ## How to contribute? diff --git a/docusaurus.config.js b/docusaurus.config.js index de5186e..7ae0a14 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -11,7 +11,7 @@ import { themes as prismThemes } from 'prism-react-renderer'; /** @type {import('@docusaurus/types').Config} */ const config = { title: 'Dev-Rebase', - tagline: 'Dinosaurs are cool', + tagline: 'Rebase your skills with modern software development practices', favicon: 'img/favicon.ico', // Future flags, see https://docusaurus.io/docs/api/docusaurus-config#future @@ -61,7 +61,7 @@ const config = { ({ docs: { sidebarPath: './sidebars.js', - routeBasePath: '/', + routeBasePath: '/docs', }, blog: false, theme: { @@ -80,7 +80,7 @@ const config = { title: 'Dev-Rebase', logo: { alt: 'Dev-Rebase Logo', - src: 'img/rebase-icon-red.png', + src: 'img/logo.svg', }, items: [ { diff --git a/package-lock.json b/package-lock.json index 010eb0b..2835b43 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19,7 +19,11 @@ "devDependencies": { "@docusaurus/module-type-aliases": "3.8.0", "@docusaurus/types": "3.8.0", - "prettier": "^3.5.3" + "@tailwindcss/postcss": "^4.1.11", + "autoprefixer": "^10.4.21", + "postcss": "^8.5.6", + "prettier": "^3.5.3", + "tailwindcss": "^4.1.11" }, "engines": { "node": ">=18.0" @@ -238,6 +242,18 @@ "node": ">= 14.0.0" } }, + "node_modules/@alloc/quick-lru": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz", + "integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==", + "dev": true, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/@ampproject/remapping": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz", @@ -3627,6 +3643,18 @@ "@hapi/hoek": "^9.0.0" } }, + "node_modules/@isaacs/fs-minipass": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/@isaacs/fs-minipass/-/fs-minipass-4.0.1.tgz", + "integrity": "sha512-wgm9Ehl2jpeqP3zw/7mo3kRHFp5MEDhqAdwy1fTGkHAwnkGOVsgpvQhL8B5n1qlb01jV3n/bI0ZfZp5lWA1k4w==", + "dev": true, + "dependencies": { + "minipass": "^7.0.4" + }, + "engines": { + "node": ">=18.0.0" + } + }, "node_modules/@jest/schemas": { "version": "29.6.3", "resolved": "https://registry.npmjs.org/@jest/schemas/-/schemas-29.6.3.tgz", @@ -4134,6 +4162,276 @@ "node": ">=14.16" } }, + "node_modules/@tailwindcss/node": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/node/-/node-4.1.11.tgz", + "integrity": "sha512-yzhzuGRmv5QyU9qLNg4GTlYI6STedBWRE7NjxP45CsFYYq9taI0zJXZBMqIC/c8fViNLhmrbpSFS57EoxUmD6Q==", + "dev": true, + "dependencies": { + "@ampproject/remapping": "^2.3.0", + "enhanced-resolve": "^5.18.1", + "jiti": "^2.4.2", + "lightningcss": "1.30.1", + "magic-string": "^0.30.17", + "source-map-js": "^1.2.1", + "tailwindcss": "4.1.11" + } + }, + "node_modules/@tailwindcss/node/node_modules/jiti": { + "version": "2.5.1", + "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.5.1.tgz", + "integrity": "sha512-twQoecYPiVA5K/h6SxtORw/Bs3ar+mLUtoPSc7iMXzQzK8d7eJ/R09wmTwAjiamETn1cXYPGfNnu7DMoHgu12w==", + "dev": true, + "bin": { + "jiti": "lib/jiti-cli.mjs" + } + }, + "node_modules/@tailwindcss/oxide": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/oxide/-/oxide-4.1.11.tgz", + "integrity": "sha512-Q69XzrtAhuyfHo+5/HMgr1lAiPP/G40OMFAnws7xcFEYqcypZmdW8eGXaOUIeOl1dzPJBPENXgbjsOyhg2nkrg==", + "dev": true, + "hasInstallScript": true, + "dependencies": { + "detect-libc": "^2.0.4", + "tar": "^7.4.3" + }, + "engines": { + "node": ">= 10" + }, + "optionalDependencies": { + "@tailwindcss/oxide-android-arm64": "4.1.11", + "@tailwindcss/oxide-darwin-arm64": "4.1.11", + "@tailwindcss/oxide-darwin-x64": "4.1.11", + "@tailwindcss/oxide-freebsd-x64": "4.1.11", + "@tailwindcss/oxide-linux-arm-gnueabihf": "4.1.11", + "@tailwindcss/oxide-linux-arm64-gnu": "4.1.11", + "@tailwindcss/oxide-linux-arm64-musl": "4.1.11", + "@tailwindcss/oxide-linux-x64-gnu": "4.1.11", + "@tailwindcss/oxide-linux-x64-musl": "4.1.11", + "@tailwindcss/oxide-wasm32-wasi": "4.1.11", + "@tailwindcss/oxide-win32-arm64-msvc": "4.1.11", + "@tailwindcss/oxide-win32-x64-msvc": "4.1.11" + } + }, + "node_modules/@tailwindcss/oxide-android-arm64": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-android-arm64/-/oxide-android-arm64-4.1.11.tgz", + "integrity": "sha512-3IfFuATVRUMZZprEIx9OGDjG3Ou3jG4xQzNTvjDoKmU9JdmoCohQJ83MYd0GPnQIu89YoJqvMM0G3uqLRFtetg==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@tailwindcss/oxide-darwin-arm64": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-arm64/-/oxide-darwin-arm64-4.1.11.tgz", + "integrity": "sha512-ESgStEOEsyg8J5YcMb1xl8WFOXfeBmrhAwGsFxxB2CxY9evy63+AtpbDLAyRkJnxLy2WsD1qF13E97uQyP1lfQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@tailwindcss/oxide-darwin-x64": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-x64/-/oxide-darwin-x64-4.1.11.tgz", + "integrity": "sha512-EgnK8kRchgmgzG6jE10UQNaH9Mwi2n+yw1jWmof9Vyg2lpKNX2ioe7CJdf9M5f8V9uaQxInenZkOxnTVL3fhAw==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@tailwindcss/oxide-freebsd-x64": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-freebsd-x64/-/oxide-freebsd-x64-4.1.11.tgz", + "integrity": "sha512-xdqKtbpHs7pQhIKmqVpxStnY1skuNh4CtbcyOHeX1YBE0hArj2romsFGb6yUmzkq/6M24nkxDqU8GYrKrz+UcA==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "freebsd" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@tailwindcss/oxide-linux-arm-gnueabihf": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm-gnueabihf/-/oxide-linux-arm-gnueabihf-4.1.11.tgz", + "integrity": "sha512-ryHQK2eyDYYMwB5wZL46uoxz2zzDZsFBwfjssgB7pzytAeCCa6glsiJGjhTEddq/4OsIjsLNMAiMlHNYnkEEeg==", + "cpu": [ + "arm" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@tailwindcss/oxide-linux-arm64-gnu": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-gnu/-/oxide-linux-arm64-gnu-4.1.11.tgz", + "integrity": "sha512-mYwqheq4BXF83j/w75ewkPJmPZIqqP1nhoghS9D57CLjsh3Nfq0m4ftTotRYtGnZd3eCztgbSPJ9QhfC91gDZQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@tailwindcss/oxide-linux-arm64-musl": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-musl/-/oxide-linux-arm64-musl-4.1.11.tgz", + "integrity": "sha512-m/NVRFNGlEHJrNVk3O6I9ggVuNjXHIPoD6bqay/pubtYC9QIdAMpS+cswZQPBLvVvEF6GtSNONbDkZrjWZXYNQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@tailwindcss/oxide-linux-x64-gnu": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-gnu/-/oxide-linux-x64-gnu-4.1.11.tgz", + "integrity": "sha512-YW6sblI7xukSD2TdbbaeQVDysIm/UPJtObHJHKxDEcW2exAtY47j52f8jZXkqE1krdnkhCMGqP3dbniu1Te2Fg==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@tailwindcss/oxide-linux-x64-musl": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-musl/-/oxide-linux-x64-musl-4.1.11.tgz", + "integrity": "sha512-e3C/RRhGunWYNC3aSF7exsQkdXzQ/M+aYuZHKnw4U7KQwTJotnWsGOIVih0s2qQzmEzOFIJ3+xt7iq67K/p56Q==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@tailwindcss/oxide-wasm32-wasi": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-wasm32-wasi/-/oxide-wasm32-wasi-4.1.11.tgz", + "integrity": "sha512-Xo1+/GU0JEN/C/dvcammKHzeM6NqKovG+6921MR6oadee5XPBaKOumrJCXvopJ/Qb5TH7LX/UAywbqrP4lax0g==", + "bundleDependencies": [ + "@napi-rs/wasm-runtime", + "@emnapi/core", + "@emnapi/runtime", + "@tybys/wasm-util", + "@emnapi/wasi-threads", + "tslib" + ], + "cpu": [ + "wasm32" + ], + "dev": true, + "optional": true, + "dependencies": { + "@emnapi/core": "^1.4.3", + "@emnapi/runtime": "^1.4.3", + "@emnapi/wasi-threads": "^1.0.2", + "@napi-rs/wasm-runtime": "^0.2.11", + "@tybys/wasm-util": "^0.9.0", + "tslib": "^2.8.0" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/@tailwindcss/oxide-win32-arm64-msvc": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-arm64-msvc/-/oxide-win32-arm64-msvc-4.1.11.tgz", + "integrity": "sha512-UgKYx5PwEKrac3GPNPf6HVMNhUIGuUh4wlDFR2jYYdkX6pL/rn73zTq/4pzUm8fOjAn5L8zDeHp9iXmUGOXZ+w==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@tailwindcss/oxide-win32-x64-msvc": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-x64-msvc/-/oxide-win32-x64-msvc-4.1.11.tgz", + "integrity": "sha512-YfHoggn1j0LK7wR82TOucWc5LDCguHnoS879idHekmmiR7g9HUtMw9MI0NHatS28u/Xlkfi9w5RJWgz2Dl+5Qg==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@tailwindcss/postcss": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/@tailwindcss/postcss/-/postcss-4.1.11.tgz", + "integrity": "sha512-q/EAIIpF6WpLhKEuQSEVMZNMIY8KhWoAemZ9eylNAih9jxMGAYPPWBn3I9QL/2jZ+e7OEz/tZkX5HwbBR4HohA==", + "dev": true, + "dependencies": { + "@alloc/quick-lru": "^5.2.0", + "@tailwindcss/node": "4.1.11", + "@tailwindcss/oxide": "4.1.11", + "postcss": "^8.4.41", + "tailwindcss": "4.1.11" + } + }, "node_modules/@trysound/sax": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/@trysound/sax/-/sax-0.2.0.tgz", @@ -5457,6 +5755,15 @@ "fsevents": "~2.3.2" } }, + "node_modules/chownr": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/chownr/-/chownr-3.0.0.tgz", + "integrity": "sha512-+IxzY9BZOQd/XuYPRmrvEVjF/nqj5kgT4kEq7VofrDoM1MxoRjEWkrCC3EtLi59TVawxTAn+orJwFQcrqEN1+g==", + "dev": true, + "engines": { + "node": ">=18" + } + }, "node_modules/chrome-trace-event": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/chrome-trace-event/-/chrome-trace-event-1.0.4.tgz", @@ -6507,6 +6814,15 @@ "npm": "1.2.8000 || >= 1.4.16" } }, + "node_modules/detect-libc": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz", + "integrity": "sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==", + "dev": true, + "engines": { + "node": ">=8" + } + }, "node_modules/detect-node": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.1.0.tgz", @@ -8872,6 +9188,234 @@ "node": ">=6" } }, + "node_modules/lightningcss": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.30.1.tgz", + "integrity": "sha512-xi6IyHML+c9+Q3W0S4fCQJOym42pyurFiJUHEcEyHS0CeKzia4yZDEsLlqOFykxOdHpNy0NmvVO31vcSqAxJCg==", + "dev": true, + "dependencies": { + "detect-libc": "^2.0.3" + }, + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + }, + "optionalDependencies": { + "lightningcss-darwin-arm64": "1.30.1", + "lightningcss-darwin-x64": "1.30.1", + "lightningcss-freebsd-x64": "1.30.1", + "lightningcss-linux-arm-gnueabihf": "1.30.1", + "lightningcss-linux-arm64-gnu": "1.30.1", + "lightningcss-linux-arm64-musl": "1.30.1", + "lightningcss-linux-x64-gnu": "1.30.1", + "lightningcss-linux-x64-musl": "1.30.1", + "lightningcss-win32-arm64-msvc": "1.30.1", + "lightningcss-win32-x64-msvc": "1.30.1" + } + }, + "node_modules/lightningcss-darwin-arm64": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.30.1.tgz", + "integrity": "sha512-c8JK7hyE65X1MHMN+Viq9n11RRC7hgin3HhYKhrMyaXflk5GVplZ60IxyoVtzILeKr+xAJwg6zK6sjTBJ0FKYQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-darwin-x64": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.30.1.tgz", + "integrity": "sha512-k1EvjakfumAQoTfcXUcHQZhSpLlkAuEkdMBsI/ivWw9hL+7FtilQc0Cy3hrx0AAQrVtQAbMI7YjCgYgvn37PzA==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-freebsd-x64": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.30.1.tgz", + "integrity": "sha512-kmW6UGCGg2PcyUE59K5r0kWfKPAVy4SltVeut+umLCFoJ53RdCUWxcRDzO1eTaxf/7Q2H7LTquFHPL5R+Gjyig==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "freebsd" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-arm-gnueabihf": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.30.1.tgz", + "integrity": "sha512-MjxUShl1v8pit+6D/zSPq9S9dQ2NPFSQwGvxBCYaBYLPlCWuPh9/t1MRS8iUaR8i+a6w7aps+B4N0S1TYP/R+Q==", + "cpu": [ + "arm" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-arm64-gnu": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.30.1.tgz", + "integrity": "sha512-gB72maP8rmrKsnKYy8XUuXi/4OctJiuQjcuqWNlJQ6jZiWqtPvqFziskH3hnajfvKB27ynbVCucKSm2rkQp4Bw==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-arm64-musl": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.30.1.tgz", + "integrity": "sha512-jmUQVx4331m6LIX+0wUhBbmMX7TCfjF5FoOH6SD1CttzuYlGNVpA7QnrmLxrsub43ClTINfGSYyHe2HWeLl5CQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-x64-gnu": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.30.1.tgz", + "integrity": "sha512-piWx3z4wN8J8z3+O5kO74+yr6ze/dKmPnI7vLqfSqI8bccaTGY5xiSGVIJBDd5K5BHlvVLpUB3S2YCfelyJ1bw==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-x64-musl": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.30.1.tgz", + "integrity": "sha512-rRomAK7eIkL+tHY0YPxbc5Dra2gXlI63HL+v1Pdi1a3sC+tJTcFrHX+E86sulgAXeI7rSzDYhPSeHHjqFhqfeQ==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-win32-arm64-msvc": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.30.1.tgz", + "integrity": "sha512-mSL4rqPi4iXq5YVqzSsJgMVFENoa4nGTT/GjO2c0Yl9OuQfPsIfncvLrEW6RbbB24WtZ3xP/2CCmI3tNkNV4oA==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-win32-x64-msvc": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.30.1.tgz", + "integrity": "sha512-PVqXh48wh4T53F/1CCu8PIPCxLzWyCnn/9T5W1Jpmdy5h9Cwd+0YQS6/LwhHXSafuc61/xg9Lv5OrCby6a++jg==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, "node_modules/lilconfig": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.3.tgz", @@ -8990,6 +9534,15 @@ "yallist": "^3.0.2" } }, + "node_modules/magic-string": { + "version": "0.30.17", + "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.17.tgz", + "integrity": "sha512-sNPKHvyjVf7gyjwS4xGTaW/mCnF8wnjtifKBEhxfZ7E/S8tQ0rssrwGNn6q8JH/ohItJfSQp9mBtQYuTlH5QnA==", + "dev": true, + "dependencies": { + "@jridgewell/sourcemap-codec": "^1.5.0" + } + }, "node_modules/markdown-extensions": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/markdown-extensions/-/markdown-extensions-2.0.0.tgz", @@ -11244,6 +11797,42 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/minipass": { + "version": "7.1.2", + "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz", + "integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==", + "dev": true, + "engines": { + "node": ">=16 || 14 >=14.17" + } + }, + "node_modules/minizlib": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-3.0.2.tgz", + "integrity": "sha512-oG62iEk+CYt5Xj2YqI5Xi9xWUeZhDI8jjQmC5oThVH5JGCTgIjr7ciJDzC7MBzYd//WvR1OTmP5Q38Q8ShQtVA==", + "dev": true, + "dependencies": { + "minipass": "^7.1.2" + }, + "engines": { + "node": ">= 18" + } + }, + "node_modules/mkdirp": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-3.0.1.tgz", + "integrity": "sha512-+NsyUUAZDmo6YVHzL/stxSu3t9YS1iljliy3BSDrXJ/dkn1KYdmtZODGGjLcc9XLgVVpH4KshHB8XmZgMhaBXg==", + "dev": true, + "bin": { + "mkdirp": "dist/cjs/src/bin.js" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, "node_modules/mrmime": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.1.tgz", @@ -11879,9 +12468,9 @@ } }, "node_modules/postcss": { - "version": "8.5.3", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.3.tgz", - "integrity": "sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==", + "version": "8.5.6", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz", + "integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==", "funding": [ { "type": "opencollective", @@ -11897,7 +12486,7 @@ } ], "dependencies": { - "nanoid": "^3.3.8", + "nanoid": "^3.3.11", "picocolors": "^1.1.1", "source-map-js": "^1.2.1" }, @@ -15009,6 +15598,12 @@ "node": ">= 10" } }, + "node_modules/tailwindcss": { + "version": "4.1.11", + "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.1.11.tgz", + "integrity": "sha512-2E9TBm6MDD/xKYe+dvJZAmg3yxIEDNRc0jwlNyDg/4Fil2QcSLjFKGVff0lAf1jjeaArlG/M75Ey/EYr/OJtBA==", + "dev": true + }, "node_modules/tapable": { "version": "2.2.2", "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.2.tgz", @@ -15017,6 +15612,32 @@ "node": ">=6" } }, + "node_modules/tar": { + "version": "7.4.3", + "resolved": "https://registry.npmjs.org/tar/-/tar-7.4.3.tgz", + "integrity": "sha512-5S7Va8hKfV7W5U6g3aYxXmlPoZVAwUMy9AOKyF2fVuZa2UD3qZjg578OrLRt8PcNN1PleVaL/5/yYATNL0ICUw==", + "dev": true, + "dependencies": { + "@isaacs/fs-minipass": "^4.0.0", + "chownr": "^3.0.0", + "minipass": "^7.1.2", + "minizlib": "^3.0.1", + "mkdirp": "^3.0.1", + "yallist": "^5.0.0" + }, + "engines": { + "node": ">=18" + } + }, + "node_modules/tar/node_modules/yallist": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/yallist/-/yallist-5.0.0.tgz", + "integrity": "sha512-YgvUTfwqyc7UXVMrB+SImsVYSmTS8X/tSrtdNZMImM+n7+QTriRXyXim0mBrTXNeqzVF0KWGgHPeiyViFFrNDw==", + "dev": true, + "engines": { + "node": ">=18" + } + }, "node_modules/terser": { "version": "5.40.0", "resolved": "https://registry.npmjs.org/terser/-/terser-5.40.0.tgz", diff --git a/package.json b/package.json index 13f721e..4681bcf 100644 --- a/package.json +++ b/package.json @@ -26,6 +26,8 @@ "devDependencies": { "@docusaurus/module-type-aliases": "3.8.0", "@docusaurus/types": "3.8.0", + "autoprefixer": "^10.4.21", + "postcss": "^8.5.6", "prettier": "^3.5.3" }, "browserslist": { @@ -43,4 +45,4 @@ "engines": { "node": ">=18.0" } -} +} \ No newline at end of file diff --git a/postcss.config.js b/postcss.config.js new file mode 100644 index 0000000..32abf33 --- /dev/null +++ b/postcss.config.js @@ -0,0 +1,5 @@ +module.exports = { + plugins: { + autoprefixer: {}, + }, +} \ No newline at end of file diff --git a/src/css/custom.css b/src/css/custom.css index 96457f9..7680f8e 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -1,49 +1,87 @@ /** - * Any CSS included here will be global. The classic template - * bundles Infima by default. Infima is a CSS framework designed to - * work well for content-centric websites. + * Clean custom CSS for Dev-Rebase + * Relies on Docusaurus built-in theming with minimal overrides */ -/* - You can override the default Infima variables here. - This is the light theme configuration. -*/ +/* Light theme - Primary colors only */ :root { - /* Infima primary color */ - --ifm-color-primary: #457b9d; - --ifm-color-primary-dark: #3d6d8b; - --ifm-color-primary-darker: #3a6682; - --ifm-color-primary-darkest: #2e5066; - --ifm-color-primary-light: #4d89b1; - --ifm-color-primary-lighter: #5491ba; - --ifm-color-primary-lightest: #69a3c9; + --ifm-color-primary: #6366f1; + --ifm-color-primary-dark: #4f46e5; + --ifm-color-primary-darker: #4338ca; + --ifm-color-primary-darkest: #3730a3; + --ifm-color-primary-light: #818cf8; + --ifm-color-primary-lighter: #a5b4fc; + --ifm-color-primary-lightest: #c7d2fe; + + /* Accent color for hover states */ + --ifm-color-warning: #f59e0b; /* Code block styling */ --ifm-code-font-size: 95%; - --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.08); + --docusaurus-highlighted-code-line-bg: rgba(99, 102, 241, 0.1); - /* Custom palette colors */ - --custom-red-pantone: #e63946; - --custom-honeydew: #f1faee; - --custom-non-photo-blue: #a8dadc; - --custom-cerulean: #457b9d; - --custom-berkeley-blue: #1d3557; + /* Button styling */ + --ifm-button-border-radius: 9999px; } -/* - For readability concerns, you should choose a lighter palette in dark mode. - This is the dark theme configuration. -*/ +/* Dark theme - Primary colors only */ [data-theme='dark'] { - /* Infima primary color - using the lighter blue for contrast */ - --ifm-color-primary: #a8dadc; - --ifm-color-primary-dark: #96c4c6; - --ifm-color-primary-darker: #8fc0c2; - --ifm-color-primary-darkest: #73a7a9; - --ifm-color-primary-light: #badde0; - --ifm-color-primary-lighter: #c1e1e3; - --ifm-color-primary-lightest: #d4e9eb; + --ifm-color-primary: #a78bfa; + --ifm-color-primary-dark: #9333ea; + --ifm-color-primary-darker: #7c3aed; + --ifm-color-primary-darkest: #6d28d9; + --ifm-color-primary-light: #c4b5fd; + --ifm-color-primary-lighter: #ddd6fe; + --ifm-color-primary-lightest: #ede9fe; + + /* Accent color for dark mode */ + --ifm-color-warning: #fbbf24; /* Code block styling */ - --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3); + --docusaurus-highlighted-code-line-bg: rgba(167, 139, 250, 0.2); +} + +/* Button hover effects */ +.button:hover { + transform: scale(1.05); +} + +.button:active { + transform: scale(0.95); +} + +.button--primary:hover { + background: var(--ifm-color-warning); +} + +/* Card hover effects */ +.card:hover { + transform: translateY(-4px); +} + +/* Mobile TOC styling - minimal fix for white text */ +.theme-doc-toc-mobile { + background: var(--ifm-color-primary); + border-radius: var(--ifm-border-radius); +} + +.theme-doc-toc-mobile .table-of-contents__link, +.theme-doc-toc-mobile h3, +.theme-doc-toc-mobile button { + color: white !important; +} + +.theme-doc-toc-mobile .table-of-contents__link:hover { + background: rgba(255, 255, 255, 0.1); + border-radius: 0.25rem; +} + +/* Smooth scrolling */ +html { + scroll-behavior: smooth; +} + +/* Link hover color */ +.markdown a:hover { + color: var(--ifm-color-warning); } diff --git a/src/pages/index.js b/src/pages/index.js new file mode 100644 index 0000000..1afa9bf --- /dev/null +++ b/src/pages/index.js @@ -0,0 +1,341 @@ +import React, { useState, useEffect } from 'react'; +import Link from '@docusaurus/Link'; +import Head from '@docusaurus/Head'; +import styles from './index.module.css'; + +// Dark Mode Toggle Component +function DarkModeToggle() { + const [isDark, setIsDark] = useState(false); + + useEffect(() => { + // Check for saved theme preference or default to light mode + const savedTheme = typeof window !== 'undefined' ? localStorage.getItem('theme') : null; + const prefersDark = typeof window !== 'undefined' ? window.matchMedia('(prefers-color-scheme: dark)').matches : false; + const initialTheme = savedTheme || (prefersDark ? 'dark' : 'light'); + + setIsDark(initialTheme === 'dark'); + if (typeof document !== 'undefined') { + document.documentElement.setAttribute('data-theme', initialTheme); + // Also set on body for full coverage + document.body.setAttribute('data-theme', initialTheme); + } + }, []); + + const toggleTheme = () => { + const newTheme = isDark ? 'light' : 'dark'; + setIsDark(!isDark); + if (typeof document !== 'undefined') { + document.documentElement.setAttribute('data-theme', newTheme); + // Also set on body for full coverage + document.body.setAttribute('data-theme', newTheme); + } + if (typeof window !== 'undefined') { + localStorage.setItem('theme', newTheme); + } + }; + + return ( + + ); +} + +// Container Component +function Container({ children, className = '' }) { + return ( +
+ {children} +
+ ); +} + +// Hero Section Component +function HeroSection() { + return ( +
+
+
+
+
+ + +
+
+
+ Dev-Rebase Logo +
+

+ Dev-Rebase +

+

+ Collection of short guides to help developers learn about modern software development practices covering essential topics that are commonly expected in today's tech industry, especially when working at international companies or applying for remote positions. +

+
+ + Start Reading + +
+
+
+ +
+ ); +} + +// Topics Component +function Topics() { + const topics = [ + { + title: "Core Skills", + description: "Essential technical skills that every developer needs including Web Development, Git, and Testing fundamentals.", + icon: "🎯", + link: "/docs/web" + }, + { + title: "Deployment & Production", + description: "Tools and practices for deploying applications including Containerization, CI/CD, and Observability.", + icon: "🚀", + link: "/docs/containerization" + }, + { + title: "Community & Growth", + description: "Connect with others and build experience through Open Source, Mentorship, and Global Communities.", + icon: "🤝", + link: "/docs/open-source" + } + ]; + + return ( + +
+

+ What Topics Are Covered? +

+

+

+
+
+ {topics.map((topic, index) => ( +
+
+
+ {topic.icon} +
+
+
+ {topic.title} +
+

+ {topic.description} +

+
+ + Read more + → + +
+
+ ))} +
+ + ); +} + +// For Who Component +function ForWho() { + return ( + +
+
+ Programming illustration +
+
+

+ For Who? +

+

+ This guide targets developers who can already program but want to learn modern industry practices and methodologies. +

+
+
+
👨‍💻
+
+

Experienced Developers

+

Developers and CS graduates with programming knowledge.

+
+
+
+
🏢
+
+

Industry Professionals

+

Frontend, backend, or mobile engineers.

+
+
+
+
🌍
+
+

International Aspirants

+

Anyone seeking modern development practices for global companies.

+
+
+
+
+
+ + ); +} + +// How to Contribute Component +function HowToContribute() { + return ( + +
+

How to Contribute?

+

+ This is an open source project, and anyone is welcome to contribute! If you find a topic that is missing, contains errors, or could be improved, please feel free to get involved. +

+
+
+
+
🐛
+

Report Issues

+

+ Found an error or missing information? Open an issue to let us know. +

+ + Open Issue → + +
+
+
✨
+

Improve Content

+

+ Submit pull requests to improve existing guides or add new topics. +

+ + Submit PR → + +
+
+
💡
+

Request Topics

+

+ Have an idea for a new guide? Create an issue to request it. +

+ + Request Topic → + +
+
+ + ); +} + +// Footer Component +function Footer() { + return ( + + ); +} + +// Main Test Page Component +export default function TestPage() { + return ( + <> + + Dev-Rebase + + +
+
+ + + + +
+
+ + ); +} \ No newline at end of file diff --git a/src/pages/index.module.css b/src/pages/index.module.css new file mode 100644 index 0000000..902adca --- /dev/null +++ b/src/pages/index.module.css @@ -0,0 +1,1606 @@ +/* Container */ +.container { + max-width: 80rem; + margin: 0 auto; + padding-left: 1.5rem; + padding-right: 1.5rem; +} + +@media (min-width: 768px) { + .container { + padding-left: 3rem; + padding-right: 3rem; + } +} + +/* Dark Mode Toggle */ +.darkModeToggle { + position: fixed; + top: 2rem; + right: 2rem; + z-index: 1000; + background: white; + border: 2px solid #e5e7eb; + border-radius: 50%; + width: 3.5rem; + height: 3.5rem; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + transition: all 0.3s ease; + box-shadow: + 0 4px 6px -1px rgba(0, 0, 0, 0.1), + 0 2px 4px -1px rgba(0, 0, 0, 0.06); +} + +.darkModeToggle:hover { + transform: scale(1.1); + box-shadow: + 0 10px 15px -3px rgba(0, 0, 0, 0.1), + 0 4px 6px -2px rgba(0, 0, 0, 0.05); +} + +[data-theme='dark'] .darkModeToggle { + background: #1f2937; + border-color: #4b5563; + box-shadow: + 0 4px 6px -1px rgba(0, 0, 0, 0.3), + 0 2px 4px -1px rgba(0, 0, 0, 0.2); +} + +[data-theme='dark'] .darkModeToggle:hover { + box-shadow: + 0 10px 15px -3px rgba(0, 0, 0, 0.3), + 0 4px 6px -2px rgba(0, 0, 0, 0.2); +} + +.toggleIcon { + font-size: 1.5rem; + transition: transform 0.3s ease; +} + +.darkModeToggle:hover .toggleIcon { + transform: rotate(20deg); +} + +/* Responsive adjustments for dark mode toggle */ +@media (max-width: 768px) { + .darkModeToggle { + top: 1.5rem; + right: 1.5rem; + width: 3rem; + height: 3rem; + } + + .toggleIcon { + font-size: 1.25rem; + } +} + +/* Main Layout */ +.main { + background: white; + min-height: 100vh; +} + +[data-theme='dark'] .main { + background: #0f172a; +} + +/* Ensure body and html background is also set for dark mode */ +:global([data-theme='dark']), +:global([data-theme='dark'] body), +:global([data-theme='dark'] html) { + background-color: #0f172a !important; + color: #f9fafb; +} + +.main > * + * { + margin-top: 10rem; +} + +.main > *:last-child { + margin-bottom: 10rem; +} + +/* Hero Section */ +.heroSection { + position: relative; + padding-top: 9rem; + padding-bottom: 4rem; +} + +.heroBackground { + position: absolute; + inset: 0; + display: grid; + grid-template-columns: repeat(2, 1fr); + opacity: 0.4; + overflow: hidden; +} + +[data-theme='dark'] .heroBackground { + opacity: 0.2; +} + +.heroBlur1 { + height: 14rem; + background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%); + filter: blur(106px); + margin-left: -13rem; +} + +[data-theme='dark'] .heroBlur1 { + background: linear-gradient(135deg, #1e40af 0%, #6366f1 100%); +} + +.heroBlur2 { + height: 8rem; + background: linear-gradient(90deg, #06b6d4 0%, #0ea5e9 100%); + filter: blur(106px); +} + +[data-theme='dark'] .heroBlur2 { + background: linear-gradient(90deg, #1e40af 0%, #4338ca 100%); +} + +.heroContent { + position: relative; + padding-top: 0; + margin-left: auto; +} + +.heroInner { + text-align: center; + margin: 0 auto; +} + +@media (min-width: 1024px) { + .heroInner { + width: 66.666667%; + } +} + +/* Hero Logo Styling */ +.heroLogo { + margin-bottom: 1rem; + display: flex; + justify-content: center; + align-items: center; +} + +.logoImage { + height: 5rem; + width: auto; + max-width: 100%; + transition: transform 0.3s ease; + filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.1)); +} + +.logoImage:hover { + transform: scale(1.05); +} + +/* Responsive logo sizing */ +@media (min-width: 768px) { + .logoImage { + height: 6.5rem; + } +} + +@media (min-width: 1024px) { + .logoImage { + height: 8rem; + } +} + +/* Dark mode logo adjustments */ +[data-theme='dark'] .logoImage { + filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.3)); +} + +.heroTitle { + color: #111827; + font-weight: 700; + font-size: 3rem; + line-height: 1; + text-balance: balance; + margin-bottom: 2rem; +} + +[data-theme='dark'] .heroTitle { + color: white; +} + +@media (min-width: 768px) { + .heroTitle { + font-size: 3.75rem; + } +} + +@media (min-width: 1280px) { + .heroTitle { + font-size: 4.5rem; + } +} + +.heroTitleAccent { + color: #6366f1; +} + +[data-theme='dark'] .heroTitleAccent { + color: white; +} + +.heroDescription { + margin-top: 2rem; + color: #374151; + font-size: 1.125rem; + line-height: 1.75; + max-width: 48rem; + margin-left: auto; + margin-right: auto; +} + +[data-theme='dark'] .heroDescription { + color: #d1d5db; +} + +.heroButtons { + margin-top: 4rem; + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 1rem; +} + +@media (max-width: 640px) { + .heroButtons { + flex-direction: column; + align-items: center; + } +} + +.heroPrimaryButton, +.heroSecondaryButton { + position: relative; + display: flex; + height: 2.75rem; + align-items: center; + justify-content: center; + padding: 0 1.5rem; + text-decoration: none; + border-radius: 9999px; + font-weight: 600; + transition: all 0.3s ease; + width: 100%; + max-width: max-content; +} + +@media (min-width: 640px) { + .heroPrimaryButton, + .heroSecondaryButton { + width: auto; + } +} + +.heroPrimaryButton { + background: #6366f1; + color: white; +} + +.heroPrimaryButton:hover { + background: #f59e0b; + transform: scale(1.05); + color: white; + text-decoration: none; +} + +.heroPrimaryButton:active { + transform: scale(0.95); +} + +.heroSecondaryButton { + background: linear-gradient( + to bottom, + rgba(99, 102, 241, 0.1), + rgba(99, 102, 241, 0.1) + ); + border: 1px solid transparent; + color: #6366f1; +} + +[data-theme='dark'] .heroSecondaryButton { + background: #374151; + border-color: #4b5563; + color: white; +} + +.heroSecondaryButton:hover { + transform: scale(1.05); + color: #f59e0b; + text-decoration: none; +} + +[data-theme='dark'] .heroSecondaryButton:hover { + color: #fbbf24; +} + +.heroSecondaryButton:active { + transform: scale(0.95); +} + +.buttonText, +.buttonTextSecondary { + position: relative; + font-size: 1rem; + font-weight: 600; +} + +.heroStats { + display: none; + padding: 2rem 0; + margin-top: 4rem; + border-top: 1px solid #f3f4f6; + border-bottom: 1px solid #f3f4f6; + justify-content: space-between; + gap: 2rem; +} + +@media (min-width: 640px) { + .heroStats { + display: flex; + } +} + +[data-theme='dark'] .heroStats { + border-color: #374151; +} + +.heroStat { + text-align: left; +} + +.heroStatTitle { + font-size: 1.125rem; + font-weight: 600; + color: #374151; + margin-bottom: 0.5rem; +} + +[data-theme='dark'] .heroStatTitle { + color: white; +} + +.heroStatText { + color: #6b7280; + margin: 0; +} + +[data-theme='dark'] .heroStatText { + color: #9ca3af; +} + +.clientLogos { + margin-top: 3rem; + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 1rem; +} + +@media (min-width: 640px) { + .clientLogos { + grid-template-columns: repeat(4, 1fr); + } +} + +@media (min-width: 768px) { + .clientLogos { + grid-template-columns: repeat(6, 1fr); + } +} + +.clientLogo { + padding: 1rem; + filter: grayscale(100%); + transition: filter 0.2s ease; + display: flex; + align-items: center; + justify-content: center; +} + +.clientLogo:hover { + filter: grayscale(0%); +} + +.logoText { + font-weight: 600; + color: #6b7280; + font-size: 0.875rem; +} + +[data-theme='dark'] .logoText { + color: #9ca3af; +} + +/* Features Section */ +.featuresHeader { + margin-bottom: 4rem; +} + +@media (min-width: 768px) { + .featuresHeader { + width: 66.666667%; + } +} + +@media (min-width: 1024px) { + .featuresHeader { + width: 50%; + } +} + +.sparkleIcon { + width: 1.5rem; + height: 1.5rem; + color: #f59e0b; + font-size: 1.5rem; + margin-bottom: 2rem; +} + +.featuresTitle { + margin: 2rem 0; + font-size: 1.5rem; + font-weight: 700; + color: #374151; + line-height: 1.25; +} + +@media (min-width: 768px) { + .featuresTitle { + font-size: 2.25rem; + } +} + +[data-theme='dark'] .featuresTitle { + color: white; +} + +.featuresDescription { + color: #4b5563; + line-height: 1.75; +} + +[data-theme='dark'] .featuresDescription { + color: #d1d5db; +} + +.featuresGrid { + margin-top: 4rem; + display: grid; + gap: 0; + overflow: hidden; + border-radius: 1.5rem; + border: 1px solid #f3f4f6; + color: #4b5563; +} + +@media (min-width: 640px) { + .featuresGrid { + grid-template-columns: repeat(2, 1fr); + } +} + +@media (min-width: 1024px) { + .featuresGrid { + grid-template-columns: repeat(3, 1fr); + } +} + +[data-theme='dark'] .featuresGrid { + border-color: #4b5563; + color: #d1d5db; +} + +.featureCard { + position: relative; + background: white; + transition: all 0.3s ease; + border-right: 1px solid #f3f4f6; + border-bottom: 1px solid #f3f4f6; +} + +.featureCard:hover { + z-index: 1; + box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); +} + +[data-theme='dark'] .featureCard { + background: #1f2937; + border-color: #4b5563; +} + +[data-theme='dark'] .featureCard:hover { + box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); +} + +.featureCardInner { + position: relative; + padding: 3rem 2rem; + display: flex; + flex-direction: column; + gap: 2rem; +} + +.featureIcon { + font-size: 3rem; + text-align: center; +} + +.featureContent { + display: flex; + flex-direction: column; + gap: 0.5rem; +} + +.featureTitle { + font-size: 1.25rem; + font-weight: 600; + color: #374151; + transition: color 0.3s ease; +} + +.featureCard:hover .featureTitle { + color: #f59e0b; +} + +[data-theme='dark'] .featureCard:hover .featureTitle { + color: #fbbf24; +} + +[data-theme='dark'] .featureTitle { + color: white; +} + +.featureDescription { + color: #4b5563; + margin: 0; +} + +[data-theme='dark'] .featureDescription { + color: #d1d5db; +} + +.featureLink { + display: flex; + align-items: center; + justify-content: space-between; + text-decoration: none; + color: #4b5563; + transition: color 0.3s ease; +} + +.featureCard:hover .featureLink { + color: #f59e0b; +} + +[data-theme='dark'] .featureCard:hover .featureLink { + color: #fbbf24; +} + +[data-theme='dark'] .featureLink { + color: #d1d5db; +} + +.featureLinkText { + font-size: 0.875rem; +} + +.featureArrow { + opacity: 0; + transform: translateX(-1rem); + transition: all 0.3s ease; + font-size: 1.25rem; +} + +.featureCard:hover .featureArrow { + opacity: 1; + transform: translateX(0); +} + +/* Stats Section */ +.statsIcon { + width: 1.5rem; + height: 1.5rem; + color: #0ea5e9; + font-size: 1.5rem; + margin-bottom: 2rem; +} + +.statsContent { + display: flex; + flex-direction: column; + gap: 1.5rem; + align-items: center; + color: #4b5563; +} + +@media (min-width: 768px) { + .statsContent { + flex-direction: row-reverse; + gap: 1.5rem; + } +} + +@media (min-width: 1024px) { + .statsContent { + gap: 3rem; + align-items: center; + } +} + +[data-theme='dark'] .statsContent { + color: #d1d5db; +} + +.statsImage { + width: 100%; +} + +@media (min-width: 768px) { + .statsImage { + width: 41.666667%; + } +} + +@media (min-width: 1024px) { + .statsImage { + width: 50%; + } +} + +.chartPlaceholder { + width: 100%; + height: 20rem; + display: flex; + align-items: center; + justify-content: center; + background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%); + border-radius: 1rem; +} + +[data-theme='dark'] .chartPlaceholder { + background: linear-gradient(135deg, #374151 0%, #4b5563 100%); +} + +.chartCircle { + width: 8rem; + height: 8rem; + border-radius: 50%; + background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%); + display: flex; + align-items: center; + justify-content: center; + color: white; + font-weight: 700; + font-size: 1.5rem; +} + +.forWhoImage { + width: 90%; + height: auto; + max-width: 90%; + object-fit: contain; +} + +.statsText { + width: 100%; +} + +@media (min-width: 768px) { + .statsText { + width: 58.333333%; + } +} + +@media (min-width: 1024px) { + .statsText { + width: 50%; + } +} + +.statsTitle { + font-size: 1.875rem; + font-weight: 700; + color: #111827; + margin-bottom: 2rem; +} + +@media (min-width: 768px) { + .statsTitle { + font-size: 2.25rem; + } +} + +[data-theme='dark'] .statsTitle { + color: white; +} + +.statsDescription { + margin: 2rem 0; + color: #4b5563; + line-height: 1.75; +} + +[data-theme='dark'] .statsDescription { + color: #d1d5db; +} + +.statsFeatures { + display: flex; + flex-direction: column; + gap: 1rem; + margin-top: 2rem; + padding-top: 2rem; + border-top: 1px solid #f3f4f6; +} + +[data-theme='dark'] .statsFeatures { + border-color: #374151; +} + +.statsFeature { + display: flex; + gap: 1rem; + align-items: flex-start; +} + +@media (min-width: 768px) { + .statsFeature { + align-items: center; + } +} + +.statsFeatureIcon { + width: 3rem; + height: 3rem; + display: flex; + align-items: center; + justify-content: center; + border-radius: 50%; + background: rgba(99, 102, 241, 0.1); + font-size: 1.5rem; + flex-shrink: 0; +} + +[data-theme='dark'] .statsFeatureIcon { + background: rgba(99, 102, 241, 0.2); +} + +.statsFeatureContent { + flex: 1; +} + +.statsFeatureTitle { + font-size: 1.125rem; + font-weight: 600; + color: #374151; + margin-bottom: 0.25rem; +} + +[data-theme='dark'] .statsFeatureTitle { + color: white; +} + +.statsFeatureText { + color: #6b7280; + margin: 0; +} + +[data-theme='dark'] .statsFeatureText { + color: #9ca3af; +} + +/* Testimonials Section */ +.testimonials { + color: #4b5563; +} + +[data-theme='dark'] .testimonials { + color: #d1d5db; +} + +.testimonialsHeader { + margin-bottom: 5rem; + padding: 0 1.5rem; +} + +@media (min-width: 768px) { + .testimonialsHeader { + padding: 0; + } +} + +.testimonialsTitle { + text-align: center; + font-size: 1.5rem; + font-weight: 700; + color: #1f2937; + margin-bottom: 1rem; +} + +@media (min-width: 768px) { + .testimonialsTitle { + font-size: 2.25rem; + } +} + +[data-theme='dark'] .testimonialsTitle { + color: white; +} + +.testimonialsGrid { + display: grid; + gap: 2rem; +} + +@media (min-width: 768px) { + .testimonialsGrid { + grid-template-columns: repeat(2, 1fr); + } +} + +@media (min-width: 1024px) { + .testimonialsGrid { + grid-template-columns: repeat(3, 1fr); + } +} + +.testimonialCard { + padding: 2rem; + border: 1px solid #f3f4f6; + border-radius: 1.5rem; + background: white; + box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.1); + transition: transform 0.3s ease; +} + +.testimonialCard:hover { + transform: translateY(-4px); +} + +[data-theme='dark'] .testimonialCard { + background: #1f2937; + border-color: #4b5563; + box-shadow: none; +} + +.testimonialHeader { + display: flex; + gap: 1rem; + margin-bottom: 2rem; +} + +.testimonialAvatar { + width: 3rem; + height: 3rem; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + font-size: 1.5rem; + background: #f3f4f6; +} + +[data-theme='dark'] .testimonialAvatar { + background: #374151; +} + +.testimonialInfo { + flex: 1; +} + +.testimonialName { + font-size: 1.125rem; + font-weight: 500; + color: #374151; + margin-bottom: 0.25rem; +} + +[data-theme='dark'] .testimonialName { + color: white; +} + +.testimonialRole { + font-size: 0.875rem; + color: #6b7280; + margin: 0; +} + +[data-theme='dark'] .testimonialRole { + color: #d1d5db; +} + +.testimonialText { + line-height: 1.75; + color: #4b5563; + margin: 0; +} + +[data-theme='dark'] .testimonialText { + color: #d1d5db; +} + +/* Call to Action Section */ +.cta { + position: relative; + padding: 4rem 0; +} + +.ctaBackground { + position: absolute; + inset: 0; + height: max-content; + width: 100%; + margin: auto; + display: grid; + grid-template-columns: repeat(2, 1fr); + opacity: 0.4; +} + +[data-theme='dark'] .ctaBackground { + opacity: 0.2; +} + +.ctaBlur1 { + height: 14rem; + background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%); + filter: blur(106px); + margin-left: -13rem; +} + +[data-theme='dark'] .ctaBlur1 { + background: linear-gradient(135deg, #1e40af 0%, #6366f1 100%); +} + +.ctaBlur2 { + height: 8rem; + background: linear-gradient(90deg, #06b6d4 0%, #0ea5e9 100%); + filter: blur(106px); +} + +[data-theme='dark'] .ctaBlur2 { + background: linear-gradient(90deg, #06b6d4 0%, #0ea5e9 100%); +} + +.ctaContent { + position: relative; +} + +.ctaAvatars { + display: flex; + align-items: center; + justify-content: center; + margin-bottom: 1.5rem; +} + +.ctaAvatarSmall, +.ctaAvatarMedium, +.ctaAvatarLarge { + border-radius: 50%; + object-fit: cover; + border: 2px solid white; + margin-left: -0.5rem; +} + +.ctaAvatarSmall:first-child { + margin-left: 0; +} + +.ctaAvatarSmall { + width: 2rem; + height: 2rem; +} + +.ctaAvatarMedium { + width: 3rem; + height: 3rem; +} + +.ctaAvatarLarge { + width: 4rem; + height: 4rem; + z-index: 10; + position: relative; +} + +[data-theme='dark'] .ctaAvatarSmall, +[data-theme='dark'] .ctaAvatarMedium, +[data-theme='dark'] .ctaAvatarLarge { + border-color: #374151; +} + +.ctaText { + margin: 1.5rem auto 0; + text-align: center; +} + +@media (min-width: 768px) { + .ctaText { + width: 66.666667%; + } +} + +@media (min-width: 1024px) { + .ctaText { + width: 58.333333%; + } +} + +.ctaTitle { + text-align: center; + font-size: 2.25rem; + font-weight: 700; + color: #1f2937; + margin-bottom: 1.5rem; +} + +@media (min-width: 768px) { + .ctaTitle { + font-size: 3rem; + } +} + +[data-theme='dark'] .ctaTitle { + color: white; +} + +.ctaDescription { + text-align: center; + font-size: 1.25rem; + color: #4b5563; + margin-bottom: 1.5rem; +} + +[data-theme='dark'] .ctaDescription { + color: #d1d5db; +} + +.ctaButtons { + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 1.5rem; +} + +.ctaPrimaryButton, +.ctaSecondaryButton { + position: relative; + display: flex; + height: 3rem; + width: 100%; + align-items: center; + justify-content: center; + padding: 0 2rem; + border-radius: 9999px; + font-weight: 600; + text-decoration: none; + transition: all 0.3s ease; +} + +@media (min-width: 640px) { + .ctaPrimaryButton, + .ctaSecondaryButton { + width: auto; + } +} + +.ctaPrimaryButton { + background: #6366f1; + color: white; +} + +.ctaPrimaryButton:hover { + background: #f59e0b; + transform: scale(1.05); + color: white; + text-decoration: none; +} + +.ctaPrimaryButton:active { + transform: scale(0.95); +} + +.ctaSecondaryButton { + background: linear-gradient( + to bottom, + rgba(99, 102, 241, 0.1), + rgba(99, 102, 241, 0.1) + ); + border: 1px solid transparent; + color: #6366f1; +} + +[data-theme='dark'] .ctaSecondaryButton { + background: #374151; + border-color: #4b5563; + color: white; +} + +.ctaSecondaryButton:hover { + transform: scale(1.05); + color: #f59e0b; + text-decoration: none; +} + +[data-theme='dark'] .ctaSecondaryButton:hover { + color: #fbbf24; +} + +.ctaSecondaryButton:active { + transform: scale(0.95); +} + +/* About Creator Section */ +.aboutHeader { + margin-bottom: 3rem; + text-align: center; +} + +.aboutTitle { + font-size: 1.875rem; + font-weight: 700; + color: #1f2937; + margin-bottom: 1rem; +} + +@media (min-width: 768px) { + .aboutTitle { + font-size: 2.25rem; + } +} + +[data-theme='dark'] .aboutTitle { + color: white; +} + +.aboutContent { + display: flex; + justify-content: center; +} + +.aboutCard { + background: white; + padding: 2rem; + border-radius: 1rem; + border: 1px solid #f3f4f6; + max-width: 48rem; + box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1); +} + +[data-theme='dark'] .aboutCard { + background: #1f2937; + border-color: #4b5563; +} + +.aboutText { + color: #4b5563; + line-height: 1.75; + margin-bottom: 1.5rem; +} + +.aboutText:last-child { + margin-bottom: 0; +} + +[data-theme='dark'] .aboutText { + color: #d1d5db; +} + +.aboutLink { + color: #6366f1; + font-weight: 600; + text-decoration: none; + transition: color 0.3s ease; +} + +.aboutLink:hover { + color: #f59e0b; + text-decoration: underline; +} + +[data-theme='dark'] .aboutLink { + color: #a78bfa; +} + +[data-theme='dark'] .aboutLink:hover { + color: #fbbf24; +} + +/* How to Contribute Section */ +.contributeHeader { + margin-bottom: 3rem; + text-align: center; +} + +.contributeTitle { + font-size: 1.875rem; + font-weight: 700; + color: #1f2937; + margin-bottom: 1rem; +} + +@media (min-width: 768px) { + .contributeTitle { + font-size: 2.25rem; + } +} + +[data-theme='dark'] .contributeTitle { + color: white; +} + +.contributeDescription { + color: #4b5563; + margin: 0 auto; + max-width: 48rem; + line-height: 1.75; +} + +[data-theme='dark'] .contributeDescription { + color: #d1d5db; +} + +.contributeGrid { + display: grid; + gap: 2rem; + margin-top: 3rem; +} + +@media (min-width: 768px) { + .contributeGrid { + grid-template-columns: repeat(2, 1fr); + } +} + +@media (min-width: 1024px) { + .contributeGrid { + grid-template-columns: repeat(3, 1fr); + } +} + +.contributeCard { + background: white; + padding: 2rem; + border-radius: 1rem; + border: 1px solid #f3f4f6; + text-align: center; + transition: all 0.3s ease; + box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1); +} + +.contributeCard:hover { + z-index: 1; + transform: translateY(-4px); + box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); +} + +[data-theme='dark'] .contributeCard:hover { + box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); +} + +[data-theme='dark'] .contributeCard { + background: #1f2937; + border-color: #4b5563; +} + +.contributeIcon { + font-size: 3rem; + margin-bottom: 1rem; +} + +.contributeCardTitle { + font-size: 1.25rem; + font-weight: 600; + color: #1f2937; + margin-bottom: 1rem; + transition: color 0.3s ease; +} + +.contributeCard:hover .contributeCardTitle { + color: #f59e0b; +} + +[data-theme='dark'] .contributeCard:hover .contributeCardTitle { + color: #fbbf24; +} + +[data-theme='dark'] .contributeCardTitle { + color: white; +} + +.contributeCardDescription { + color: #4b5563; + line-height: 1.75; + margin-bottom: 1.5rem; +} + +[data-theme='dark'] .contributeCardDescription { + color: #d1d5db; +} + +.contributeLink { + color: #6366f1; + font-weight: 600; + text-decoration: none; + transition: color 0.3s ease; +} + +.contributeCard:hover .contributeLink { + color: #f59e0b; +} + +[data-theme='dark'] .contributeCard:hover .contributeLink { + color: #fbbf24; +} + +.contributeLink:hover { + color: #f59e0b; + text-decoration: none; +} + +[data-theme='dark'] .contributeLink { + color: #a78bfa; +} + +[data-theme='dark'] .contributeLink:hover { + color: #fbbf24; +} + +/* Responsive Design */ +@media (max-width: 768px) { + .main > * + * { + margin-top: 5rem; + } + + .main > *:last-child { + margin-bottom: 5rem; + } + + .heroSection { + padding-top: 6rem; + } + + .heroTitle { + font-size: 2.5rem; + } + + .featuresGrid { + grid-template-columns: 1fr; + } + + .statsContent { + flex-direction: column; + } + + .testimonialsGrid { + grid-template-columns: 1fr; + } + + .blogGrid { + grid-template-columns: 1fr; + } +} + +/* Animation utilities */ +@keyframes fadeIn { + from { + opacity: 0; + transform: translateY(20px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +.heroTitle { + animation: fadeIn 0.8s ease-out; +} + +.heroDescription { + animation: fadeIn 0.8s ease-out 0.2s both; +} + +.heroButtons { + animation: fadeIn 0.8s ease-out 0.4s both; +} + +/* Footer Section */ +.footer { + background: #f8fafc; + border-top: 1px solid #e2e8f0; + padding: 4rem 0 2rem; + margin-top: 6rem; +} + +[data-theme='dark'] .footer { + background: #0f172a; + border-top-color: #334155; +} + +.footerContent { + display: grid; + gap: 2rem; + margin-bottom: 3rem; +} + +@media (min-width: 768px) { + .footerContent { + grid-template-columns: repeat(2, 1fr); + gap: 3rem; + } +} + +@media (min-width: 1024px) { + .footerContent { + grid-template-columns: repeat(3, 1fr); + } +} + +.footerSection { + display: flex; + flex-direction: column; +} + +.footerBrand { + margin-bottom: 1rem; +} + +.footerBrandTitle { + font-size: 1.5rem; + font-weight: 700; + color: #1f2937; + margin-bottom: 0.75rem; +} + +[data-theme='dark'] .footerBrandTitle { + color: white; +} + +.footerBrandDescription { + color: #4b5563; + line-height: 1.6; + margin: 0; +} + +[data-theme='dark'] .footerBrandDescription { + color: #94a3b8; +} + +.footerSectionTitle { + font-size: 1rem; + font-weight: 600; + color: #1f2937; + margin-bottom: 1rem; +} + +[data-theme='dark'] .footerSectionTitle { + color: white; +} + +.footerLinks { + list-style: none; + padding: 0; + margin: 0; + display: flex; + flex-direction: column; + gap: 0.75rem; +} + +.footerLink { + color: #4b5563; + text-decoration: none; + transition: color 0.3s ease; + line-height: 1.5; +} + +.footerLink:hover { + color: #f59e0b; +} + +[data-theme='dark'] .footerLink { + color: #94a3b8; +} + +[data-theme='dark'] .footerLink:hover { + color: #fbbf24; +} + +.footerBottom { + border-top: 1px solid #e2e8f0; + padding-top: 2rem; +} + +[data-theme='dark'] .footerBottom { + border-top-color: #334155; +} + +.footerBottomContent { + display: flex; + flex-direction: column; + gap: 1rem; + text-align: center; +} + +@media (min-width: 768px) { + .footerBottomContent { + flex-direction: row; + justify-content: space-between; + align-items: flex-start; + text-align: left; + } +} + +.footerBottomLeft { + display: flex; + flex-direction: column; + gap: 0.5rem; +} + +@media (min-width: 768px) { + .footerBottomLeft { + gap: 0.25rem; + } +} + +.footerCopyright { + color: #6b7280; + font-size: 0.875rem; + margin: 0; +} + +[data-theme='dark'] .footerCopyright { + color: #94a3b8; +} + +.footerBuiltWith { + color: #6b7280; + font-size: 0.875rem; + margin: 0; +} + +[data-theme='dark'] .footerBuiltWith { + color: #94a3b8; +} + +.footerCredit { + color: #6b7280; + font-size: 0.875rem; + margin: 0; +} + +[data-theme='dark'] .footerCredit { + color: #94a3b8; +} + +.footerCreditLink { + color: #6366f1; + text-decoration: none; + font-weight: 500; + transition: color 0.3s ease; +} + +.footerCreditLink:hover { + color: #f59e0b; + text-decoration: underline; +} + +[data-theme='dark'] .footerCreditLink { + color: #a78bfa; +} + +[data-theme='dark'] .footerCreditLink:hover { + color: #fbbf24; +} diff --git a/static/img/dev-rebase-social-card copy.png b/static/img/dev-rebase-social-card copy.png new file mode 100644 index 0000000..bae51ca Binary files /dev/null and b/static/img/dev-rebase-social-card copy.png differ diff --git a/static/img/favicon.ico b/static/img/favicon.ico index cd36c26..3e7d7fa 100644 Binary files a/static/img/favicon.ico and b/static/img/favicon.ico differ diff --git a/static/img/logo.svg b/static/img/logo.svg new file mode 100644 index 0000000..aaf7ab1 --- /dev/null +++ b/static/img/logo.svg @@ -0,0 +1,42 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/img/undraw_programming_65t2.png b/static/img/undraw_programming_65t2.png new file mode 100644 index 0000000..866efbe Binary files /dev/null and b/static/img/undraw_programming_65t2.png differ