Home page

This commit is contained in:
2025-12-01 01:17:42 +01:00
parent 4cbed2184b
commit d32bf3c010
10 changed files with 454 additions and 59 deletions
+53
View File
@@ -8,6 +8,8 @@
"name": "orus",
"version": "0.1.0",
"dependencies": {
"framer-motion": "^12.23.24",
"lucide-react": "^0.555.0",
"next": "16.0.6",
"react": "19.2.0",
"react-dom": "19.2.0"
@@ -1061,6 +1063,33 @@
"node": ">=10.13.0"
}
},
"node_modules/framer-motion": {
"version": "12.23.24",
"resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-12.23.24.tgz",
"integrity": "sha512-HMi5HRoRCTou+3fb3h9oTLyJGBxHfW+HnNE25tAXOvVx/IvwMHK0cx7IR4a2ZU6sh3IX1Z+4ts32PcYBOqka8w==",
"license": "MIT",
"dependencies": {
"motion-dom": "^12.23.23",
"motion-utils": "^12.23.6",
"tslib": "^2.4.0"
},
"peerDependencies": {
"@emotion/is-prop-valid": "*",
"react": "^18.0.0 || ^19.0.0",
"react-dom": "^18.0.0 || ^19.0.0"
},
"peerDependenciesMeta": {
"@emotion/is-prop-valid": {
"optional": true
},
"react": {
"optional": true
},
"react-dom": {
"optional": true
}
}
},
"node_modules/graceful-fs": {
"version": "4.2.11",
"resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
@@ -1339,6 +1368,15 @@
"url": "https://opencollective.com/parcel"
}
},
"node_modules/lucide-react": {
"version": "0.555.0",
"resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.555.0.tgz",
"integrity": "sha512-D8FvHUGbxWBRQM90NZeIyhAvkFfsh3u9ekrMvJ30Z6gnpBHS6HC6ldLg7tL45hwiIz/u66eKDtdA23gwwGsAHA==",
"license": "ISC",
"peerDependencies": {
"react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0"
}
},
"node_modules/magic-string": {
"version": "0.30.21",
"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz",
@@ -1349,6 +1387,21 @@
"@jridgewell/sourcemap-codec": "^1.5.5"
}
},
"node_modules/motion-dom": {
"version": "12.23.23",
"resolved": "https://registry.npmjs.org/motion-dom/-/motion-dom-12.23.23.tgz",
"integrity": "sha512-n5yolOs0TQQBRUFImrRfs/+6X4p3Q4n1dUEqt/H58Vx7OW6RF+foWEgmTVDhIWJIMXOuNNL0apKH2S16en9eiA==",
"license": "MIT",
"dependencies": {
"motion-utils": "^12.23.6"
}
},
"node_modules/motion-utils": {
"version": "12.23.6",
"resolved": "https://registry.npmjs.org/motion-utils/-/motion-utils-12.23.6.tgz",
"integrity": "sha512-eAWoPgr4eFEOFfg2WjIsMoqJTW6Z8MTUCgn/GZ3VRpClWBdnbjryiA3ZSNLyxCTmCQx4RmYX6jX1iWHbenUPNQ==",
"license": "MIT"
},
"node_modules/nanoid": {
"version": "3.3.11",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
+2
View File
@@ -8,6 +8,8 @@
"start": "next start"
},
"dependencies": {
"framer-motion": "^12.23.24",
"lucide-react": "^0.555.0",
"next": "16.0.6",
"react": "19.2.0",
"react-dom": "19.2.0"
-1
View File
@@ -1 +0,0 @@
<svg fill="none" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M14.5 13.5V5.41a1 1 0 0 0-.3-.7L9.8.29A1 1 0 0 0 9.08 0H1.5v13.5A2.5 2.5 0 0 0 4 16h8a2.5 2.5 0 0 0 2.5-2.5m-1.5 0v-7H8v-5H3v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1M9.5 5V2.12L12.38 5zM5.13 5h-.62v1.25h2.12V5zm-.62 3h7.12v1.25H4.5zm.62 3h-.62v1.25h7.12V11z" clip-rule="evenodd" fill="#666" fill-rule="evenodd"/></svg>

Before

Width:  |  Height:  |  Size: 391 B

-1
View File
@@ -1 +0,0 @@
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.27 14.1a6.5 6.5 0 0 0 3.67-3.45q-1.24.21-2.7.34-.31 1.83-.97 3.1M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.48-1.52a7 7 0 0 1-.96 0H7.5a4 4 0 0 1-.84-1.32q-.38-.89-.63-2.08a40 40 0 0 0 3.92 0q-.25 1.2-.63 2.08a4 4 0 0 1-.84 1.31zm2.94-4.76q1.66-.15 2.95-.43a7 7 0 0 0 0-2.58q-1.3-.27-2.95-.43a18 18 0 0 1 0 3.44m-1.27-3.54a17 17 0 0 1 0 3.64 39 39 0 0 1-4.3 0 17 17 0 0 1 0-3.64 39 39 0 0 1 4.3 0m1.1-1.17q1.45.13 2.69.34a6.5 6.5 0 0 0-3.67-3.44q.65 1.26.98 3.1M8.48 1.5l.01.02q.41.37.84 1.31.38.89.63 2.08a40 40 0 0 0-3.92 0q.25-1.2.63-2.08a4 4 0 0 1 .85-1.32 7 7 0 0 1 .96 0m-2.75.4a6.5 6.5 0 0 0-3.67 3.44 29 29 0 0 1 2.7-.34q.31-1.83.97-3.1M4.58 6.28q-1.66.16-2.95.43a7 7 0 0 0 0 2.58q1.3.27 2.95.43a18 18 0 0 1 0-3.44m.17 4.71q-1.45-.12-2.69-.34a6.5 6.5 0 0 0 3.67 3.44q-.65-1.27-.98-3.1" fill="#666"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath></defs></svg>

Before

Width:  |  Height:  |  Size: 1.0 KiB

-1
View File
@@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>

Before

Width:  |  Height:  |  Size: 1.3 KiB

+4
View File
@@ -0,0 +1,4 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="100" height="100" fill="black"/>
<path d="M30.99 46.975C31.49 47.795 31.74 48.69 31.74 49.66C31.74 50.62 31.49 51.515 30.99 52.345C30.49 53.165 29.81 53.815 28.95 54.295C28.1 54.765 27.17 55 26.16 55C25.15 55 24.215 54.765 23.355 54.295C22.495 53.815 21.815 53.165 21.315 52.345C20.815 51.515 20.565 50.62 20.565 49.66C20.565 48.69 20.815 47.795 21.315 46.975C21.815 46.155 22.495 45.505 23.355 45.025C24.215 44.545 25.15 44.305 26.16 44.305C27.17 44.305 28.1 44.545 28.95 45.025C29.81 45.505 30.49 46.155 30.99 46.975ZM29.13 46.825C28.31 46.035 27.315 45.64 26.145 45.64C24.985 45.64 23.995 46.035 23.175 46.825C22.355 47.605 21.945 48.55 21.945 49.66C21.945 50.76 22.355 51.705 23.175 52.495C23.995 53.275 24.985 53.665 26.145 53.665C27.315 53.665 28.31 53.275 29.13 52.495C29.95 51.705 30.36 50.76 30.36 49.66C30.36 48.55 29.95 47.605 29.13 46.825ZM41.6272 50.26C42.6072 51.42 43.4122 52.38 44.0422 53.14C44.6822 53.9 45.2072 54.52 45.6172 55H44.2822C44.1122 55 43.9522 54.965 43.8022 54.895L43.7722 54.925C43.7522 54.905 43.7322 54.885 43.7122 54.865C43.6522 54.795 43.5322 54.655 43.3522 54.445C42.3322 53.245 40.7672 51.405 38.6572 48.925C39.7972 48.925 40.7172 48.925 41.4172 48.925C41.5772 48.915 41.6622 48.915 41.6722 48.925C42.1622 48.915 42.5772 48.755 42.9172 48.445C43.2572 48.125 43.4322 47.735 43.4422 47.275C43.4322 46.815 43.2572 46.43 42.9172 46.12C42.5772 45.8 42.1622 45.64 41.6722 45.64C41.6622 45.64 41.5922 45.64 41.4622 45.64C40.2422 45.64 38.1372 45.64 35.1472 45.64C34.8672 45.64 34.6322 45.55 34.4422 45.37C34.2522 45.18 34.1572 44.95 34.1572 44.68V44.29C39.1072 44.29 41.5872 44.29 41.5972 44.29C42.4772 44.27 43.2322 44.555 43.8622 45.145C44.5022 45.725 44.8272 46.435 44.8372 47.275C44.8272 48.105 44.5122 48.815 43.8922 49.405C43.2722 49.995 42.5172 50.28 41.6272 50.26ZM57.0638 54.925L56.8088 55L56.7938 54.175C56.7938 53.815 56.9588 53.56 57.2888 53.41C57.9988 53.06 58.5588 52.565 58.9688 51.925C59.3888 51.285 59.5988 50.585 59.5988 49.825V44.665C59.5988 44.565 59.6338 44.48 59.7038 44.41C59.7838 44.34 59.8738 44.305 59.9738 44.305H60.9788V49.75C60.9888 50.94 60.6338 52.015 59.9138 52.975C59.1938 53.925 58.2438 54.575 57.0638 54.925ZM49.8038 49.825C49.8038 49.745 49.8038 49.695 49.8038 49.675C49.8038 49.495 49.8038 47.705 49.8038 44.305H50.8088C50.9188 44.305 51.0088 44.34 51.0788 44.41C51.1488 44.48 51.1838 44.565 51.1838 44.665V49.825C51.1838 50.585 51.3888 51.285 51.7988 51.925C52.2188 52.565 52.7838 53.06 53.4938 53.41C53.8238 53.56 53.9888 53.815 53.9888 54.175L53.9738 55L53.7188 54.925C52.5588 54.575 51.6138 53.93 50.8838 52.99C50.1638 52.05 49.8038 50.995 49.8038 49.825ZM76.8217 52C76.8217 52.79 76.5417 53.47 75.9817 54.04C75.4217 54.61 74.7267 54.93 73.8967 55C73.8967 55 71.3967 55 66.3967 55V54.355C66.3967 54.165 66.4667 54.005 66.6067 53.875C66.7467 53.735 66.9167 53.665 67.1167 53.665H73.7767C74.2367 53.645 74.6267 53.475 74.9467 53.155C75.2767 52.825 75.4417 52.44 75.4417 52C75.4417 51.57 75.2767 51.19 74.9467 50.86C74.6267 50.52 74.1917 50.345 73.6417 50.335C73.4517 50.325 73.2867 50.255 73.1467 50.125C73.0067 49.985 72.9367 49.82 72.9367 49.63V48.985H73.6867C74.5467 48.995 75.2817 49.295 75.8917 49.885C76.5117 50.465 76.8217 51.17 76.8217 52ZM69.3817 45.64C68.9017 45.64 68.4867 45.805 68.1367 46.135C67.7967 46.455 67.6267 46.845 67.6267 47.305C67.6267 47.765 67.7967 48.16 68.1367 48.49C68.4867 48.81 68.9017 48.97 69.3817 48.97C69.5917 48.97 69.7667 49.04 69.9067 49.18C70.0467 49.32 70.1167 49.485 70.1167 49.675V50.32H69.3817C68.5217 50.32 67.7817 50.025 67.1617 49.435C66.5517 48.845 66.2467 48.135 66.2467 47.305C66.2467 46.465 66.5617 45.75 67.1917 45.16C67.8217 44.56 68.5867 44.275 69.4867 44.305H76.3717V44.935C76.3717 45.135 76.3017 45.305 76.1617 45.445C76.0217 45.575 75.8517 45.64 75.6517 45.64C71.6517 45.64 69.5617 45.64 69.3817 45.64Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 3.9 KiB

+3
View File
@@ -0,0 +1,3 @@
<svg width="57" height="11" viewBox="0 0 57 11" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.425 2.715C10.925 3.535 11.175 4.43 11.175 5.4C11.175 6.36 10.925 7.255 10.425 8.085C9.925 8.905 9.245 9.555 8.385 10.035C7.535 10.505 6.605 10.74 5.595 10.74C4.585 10.74 3.65 10.505 2.79 10.035C1.93 9.555 1.25 8.905 0.749998 8.085C0.249998 7.255 -2.38419e-06 6.36 -2.38419e-06 5.4C-2.38419e-06 4.43 0.249998 3.535 0.749998 2.715C1.25 1.895 1.93 1.245 2.79 0.765001C3.65 0.285001 4.585 0.0450008 5.595 0.0450008C6.605 0.0450008 7.535 0.285001 8.385 0.765001C9.245 1.245 9.925 1.895 10.425 2.715ZM8.565 2.565C7.745 1.775 6.75 1.38 5.58 1.38C4.42 1.38 3.43 1.775 2.61 2.565C1.79 3.345 1.38 4.29 1.38 5.4C1.38 6.5 1.79 7.445 2.61 8.235C3.43 9.015 4.42 9.405 5.58 9.405C6.75 9.405 7.745 9.015 8.565 8.235C9.385 7.445 9.795 6.5 9.795 5.4C9.795 4.29 9.385 3.345 8.565 2.565ZM21.0622 6C22.0422 7.16 22.8472 8.12 23.4772 8.88C24.1172 9.64 24.6422 10.26 25.0522 10.74H23.7172C23.5472 10.74 23.3872 10.705 23.2372 10.635L23.2072 10.665C23.1872 10.645 23.1672 10.625 23.1472 10.605C23.0872 10.535 22.9672 10.395 22.7872 10.185C21.7672 8.985 20.2022 7.145 18.0922 4.665C19.2322 4.665 20.1522 4.665 20.8522 4.665C21.0122 4.655 21.0972 4.655 21.1072 4.665C21.5972 4.655 22.0122 4.495 22.3522 4.185C22.6922 3.865 22.8672 3.475 22.8772 3.015C22.8672 2.555 22.6922 2.17 22.3522 1.86C22.0122 1.54 21.5972 1.38 21.1072 1.38C21.0972 1.38 21.0272 1.38 20.8972 1.38C19.6772 1.38 17.5722 1.38 14.5822 1.38C14.3022 1.38 14.0672 1.29 13.8772 1.11C13.6872 0.920001 13.5922 0.690001 13.5922 0.420001V0.030001C18.5422 0.030001 21.0222 0.030001 21.0322 0.030001C21.9122 0.0100012 22.6672 0.295001 23.2972 0.885002C23.9372 1.465 24.2622 2.175 24.2722 3.015C24.2622 3.845 23.9472 4.555 23.3272 5.145C22.7072 5.735 21.9522 6.02 21.0622 6ZM36.4987 10.665L36.2437 10.74L36.2287 9.915C36.2287 9.555 36.3937 9.3 36.7237 9.15C37.4337 8.8 37.9937 8.305 38.4037 7.665C38.8237 7.025 39.0337 6.325 39.0337 5.565V0.405002C39.0337 0.305001 39.0687 0.220001 39.1387 0.150001C39.2187 0.0800009 39.3087 0.0450008 39.4087 0.0450008H40.4137V5.49C40.4237 6.68 40.0687 7.755 39.3487 8.715C38.6287 9.665 37.6787 10.315 36.4987 10.665ZM29.2387 5.565C29.2387 5.485 29.2387 5.435 29.2387 5.415C29.2387 5.235 29.2387 3.445 29.2387 0.0450008H30.2437C30.3537 0.0450008 30.4437 0.0800009 30.5137 0.150001C30.5837 0.220001 30.6187 0.305001 30.6187 0.405002V5.565C30.6187 6.325 30.8237 7.025 31.2337 7.665C31.6537 8.305 32.2187 8.8 32.9287 9.15C33.2587 9.3 33.4237 9.555 33.4237 9.915L33.4087 10.74L33.1537 10.665C31.9937 10.315 31.0487 9.67 30.3187 8.73C29.5987 7.79 29.2387 6.735 29.2387 5.565ZM56.2567 7.74C56.2567 8.53 55.9767 9.21 55.4167 9.78C54.8567 10.35 54.1617 10.67 53.3317 10.74C53.3317 10.74 50.8317 10.74 45.8317 10.74V10.095C45.8317 9.905 45.9017 9.745 46.0417 9.615C46.1817 9.475 46.3517 9.405 46.5517 9.405H53.2117C53.6717 9.385 54.0617 9.215 54.3817 8.895C54.7117 8.565 54.8767 8.18 54.8767 7.74C54.8767 7.31 54.7117 6.93 54.3817 6.6C54.0617 6.26 53.6267 6.085 53.0767 6.075C52.8867 6.065 52.7217 5.995 52.5817 5.865C52.4417 5.725 52.3717 5.56 52.3717 5.37V4.725H53.1217C53.9817 4.735 54.7167 5.035 55.3267 5.625C55.9467 6.205 56.2567 6.91 56.2567 7.74ZM48.8167 1.38C48.3367 1.38 47.9217 1.545 47.5717 1.875C47.2317 2.195 47.0617 2.585 47.0617 3.045C47.0617 3.505 47.2317 3.9 47.5717 4.23C47.9217 4.55 48.3367 4.71 48.8167 4.71C49.0267 4.71 49.2017 4.78 49.3417 4.92C49.4817 5.06 49.5517 5.225 49.5517 5.415V6.06H48.8167C47.9567 6.06 47.2167 5.765 46.5967 5.175C45.9867 4.585 45.6817 3.875 45.6817 3.045C45.6817 2.205 45.9967 1.49 46.6267 0.900001C47.2567 0.300001 48.0217 0.0150012 48.9217 0.0450008H55.8067V0.675002C55.8067 0.875001 55.7367 1.045 55.5967 1.185C55.4567 1.315 55.2867 1.38 55.0867 1.38C51.0867 1.38 48.9967 1.38 48.8167 1.38Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 3.7 KiB

-1
View File
@@ -1 +0,0 @@
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1155 1000"><path d="m577.3 0 577.4 1000H0z" fill="#fff"/></svg>

Before

Width:  |  Height:  |  Size: 128 B

-1
View File
@@ -1 +0,0 @@
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 2.5h13v10a1 1 0 0 1-1 1h-11a1 1 0 0 1-1-1zM0 1h16v11.5a2.5 2.5 0 0 1-2.5 2.5h-11A2.5 2.5 0 0 1 0 12.5zm3.75 4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5M7 4.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0m1.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5" fill="#666"/></svg>

Before

Width:  |  Height:  |  Size: 385 B

+392 -54
View File
@@ -1,65 +1,403 @@
import Image from "next/image";
"use client";
import React, { useState, useEffect } from "react";
import { motion } from "framer-motion";
import {
Github,
MessageSquare,
Shield,
Code2,
Rocket,
Users,
Heart,
ArrowRight,
ExternalLink,
Lock,
Terminal,
Sparkles,
} from "lucide-react";
export default function HomePage() {
const [mounted, setMounted] = useState(false);
useEffect(() => {
setMounted(true);
}, []);
const features = [
{
icon: Heart,
title: "Open Source First",
description:
"We love the open source community and all our projects are completely open source for everyone to use and contribute.",
},
{
icon: Users,
title: "Growing Community",
description:
"Join our thriving community full of beginners and pros. Learn, collaborate, and grow together.",
},
{
icon: Shield,
title: "Cybersecurity & Dev",
description:
"Building tools for developers and cybersecurity enthusiasts. Security-first approach to everything we create.",
},
];
const values = [
{
icon: Rocket,
title: "For Startups",
description:
"Empowering startups with the tools and community they need to succeed",
},
{
icon: Code2,
title: "Developer Tools",
description:
"Creating powerful, intuitive tools that make developers' lives easier",
},
{
icon: Lock,
title: "Security Focused",
description:
"Building with security in mind from day one, every single time",
},
];
const containerVariants = {
hidden: { opacity: 0 },
visible: {
opacity: 1,
transition: {
staggerChildren: 0.1,
},
},
};
const itemVariants = {
hidden: { y: 20, opacity: 0 },
visible: {
y: 0,
opacity: 1,
transition: {
duration: 0.5,
},
},
};
export default function Home() {
return (
<div className="flex min-h-screen items-center justify-center bg-zinc-50 font-sans dark:bg-black">
<main className="flex min-h-screen w-full max-w-3xl flex-col items-center justify-between py-32 px-16 bg-white dark:bg-black sm:items-start">
<Image
className="dark:invert"
src="/next.svg"
alt="Next.js logo"
width={100}
height={20}
priority
<div className="min-h-screen bg-gradient-to-br from-slate-950 via-purple-950 to-slate-950 text-white">
{/* Animated background */}
<div className="fixed inset-0 opacity-20">
<div
className="absolute inset-0"
style={{
backgroundImage: `radial-gradient(circle at 2px 2px, rgb(168, 85, 247) 1px, transparent 0)`,
backgroundSize: "50px 50px",
}}
/>
<div className="flex flex-col items-center gap-6 text-center sm:items-start sm:text-left">
<h1 className="max-w-xs text-3xl font-semibold leading-10 tracking-tight text-black dark:text-zinc-50">
To get started, edit the page.tsx file.
</h1>
<p className="max-w-md text-lg leading-8 text-zinc-600 dark:text-zinc-400">
Looking for a starting point or more instructions? Head over to{" "}
<a
href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
className="font-medium text-zinc-950 dark:text-zinc-50"
</div>
{/* Gradient orbs */}
<div className="fixed inset-0 overflow-hidden pointer-events-none">
<motion.div
className="absolute top-1/4 -left-1/4 w-96 h-96 bg-purple-500/30 rounded-full blur-3xl"
animate={{
scale: [1, 1.2, 1],
opacity: [0.3, 0.5, 0.3],
}}
transition={{
duration: 8,
repeat: Infinity,
}}
/>
<motion.div
className="absolute bottom-1/4 -right-1/4 w-96 h-96 bg-blue-500/30 rounded-full blur-3xl"
animate={{
scale: [1.2, 1, 1.2],
opacity: [0.3, 0.5, 0.3],
}}
transition={{
duration: 8,
repeat: Infinity,
delay: 1,
}}
/>
</div>
{/* Navigation */}
<motion.nav
initial={{ y: -100 }}
animate={{ y: 0 }}
className="relative z-10 px-6 py-6 flex justify-between items-center max-w-7xl mx-auto"
>
<motion.div className="flex items-center" whileHover={{ scale: 1.05 }}>
<img src="orus.svg" alt="Logo" className="h-3.5"></img>
</motion.div>
<div className="flex gap-6 items-center">
{["Community", "Projects", "About"].map((item, i) => (
<motion.a
key={item}
href={`#${item.toLowerCase()}`}
className="text-slate-300 hover:text-white transition-colors hidden md:block"
initial={{ opacity: 0, y: -20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ delay: i * 0.1 }}
whileHover={{ y: -2 }}
>
Templates
</a>{" "}
or the{" "}
<a
href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
className="font-medium text-zinc-950 dark:text-zinc-50"
{item}
</motion.a>
))}
<motion.a
href="https://discord.gg/HFRsNxfCqT"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center gap-2 px-4 py-2 bg-purple-500 hover:bg-purple-600 rounded-lg font-semibold transition-colors text-sm"
whileHover={{ scale: 1.05 }}
whileTap={{ scale: 0.95 }}
>
<MessageSquare className="w-4 h-4" />
Join Discord
</motion.a>
</div>
</motion.nav>
{/* Hero Section */}
<motion.section
className="relative z-10 px-6 py-20 lg:py-32 max-w-7xl mx-auto"
variants={containerVariants}
initial="hidden"
animate="visible"
>
<div className="text-center max-w-4xl mx-auto">
<motion.div variants={itemVariants} className="mb-6">
<span className="inline-flex items-center gap-2 px-4 py-2 bg-purple-500/10 border border-purple-500/20 rounded-full text-purple-400 text-sm">
<Sparkles className="w-4 h-4" />
Cybersecurity & Development Organization
</span>
</motion.div>
<motion.h1
variants={itemVariants}
className="text-5xl lg:text-7xl font-bold mb-6"
>
<span className="bg-gradient-to-r from-white via-purple-200 to-blue-200 bg-clip-text text-transparent">
Hello, World!
</span>
</motion.h1>
<motion.p
variants={itemVariants}
className="text-xl lg:text-2xl text-slate-300 mb-4 leading-relaxed"
>
Welcome to{" "}
<span className="text-purple-400 font-semibold">ORUS</span>, a
cybersecurity & dev organization,
</motion.p>
<motion.p
variants={itemVariants}
className="text-2xl lg:text-3xl font-bold text-white mb-12"
>
Simply for developers.
</motion.p>
<motion.div
variants={itemVariants}
className="flex flex-col sm:flex-row gap-4 justify-center"
>
<motion.a
href="https://github.com/orus-dev"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-gradient-to-r from-purple-500 to-blue-500 hover:from-purple-600 hover:to-blue-600 rounded-lg font-semibold text-lg transition-all shadow-lg shadow-purple-500/50"
whileHover={{
scale: 1.05,
boxShadow: "0 20px 50px rgba(168, 85, 247, 0.4)",
}}
whileTap={{ scale: 0.95 }}
>
Learning
</a>{" "}
center.
<Github className="w-5 h-5" />
View Our Projects
<ArrowRight className="w-5 h-5" />
</motion.a>
<motion.a
href="https://discord.gg/HFRsNxfCqT"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center justify-center gap-2 px-8 py-4 border-2 border-purple-500 hover:bg-purple-500/10 rounded-lg font-semibold text-lg transition-all"
whileHover={{ scale: 1.05 }}
whileTap={{ scale: 0.95 }}
>
<MessageSquare className="w-5 h-5" />
Join Community
</motion.a>
</motion.div>
</div>
</motion.section>
{/* Features Section */}
<motion.section
className="relative z-10 px-6 py-20 max-w-7xl mx-auto"
initial="hidden"
whileInView="visible"
viewport={{ once: true }}
variants={containerVariants}
>
<div className="grid md:grid-cols-3 gap-8">
{features.map((feature, i) => (
<motion.div
key={i}
variants={itemVariants}
whileHover={{ y: -8 }}
className="relative group"
>
<div className="absolute inset-0 bg-gradient-to-r from-purple-500/20 to-blue-500/20 rounded-2xl blur-xl group-hover:blur-2xl transition-all" />
<div className="relative bg-slate-900/50 backdrop-blur border border-slate-700 hover:border-purple-500/50 rounded-2xl p-8 transition-all h-full">
<div className="inline-flex items-center justify-center w-14 h-14 bg-purple-500/10 rounded-xl mb-6">
<feature.icon className="w-7 h-7 text-purple-400" />
</div>
<h3 className="text-2xl font-semibold mb-3 group-hover:text-purple-400 transition-colors">
{feature.title}
</h3>
<p className="text-slate-400 leading-relaxed">
{feature.description}
</p>
</div>
</motion.div>
))}
</div>
</motion.section>
{/* What We Do Section */}
<motion.section
className="relative z-10 px-6 py-20 max-w-7xl mx-auto"
initial="hidden"
whileInView="visible"
viewport={{ once: true }}
variants={containerVariants}
>
<motion.div variants={itemVariants} className="text-center mb-16">
<h2 className="text-4xl lg:text-5xl font-bold mb-4 bg-gradient-to-r from-white to-purple-200 bg-clip-text text-transparent">
Empowering Startups
</h2>
<p className="text-slate-400 text-lg max-w-2xl mx-auto">
ORUS is an organization dedicated to supporting startups with
cutting-edge tools, security expertise, and a collaborative
community
</p>
</motion.div>
<div className="grid md:grid-cols-3 gap-6">
{values.map((value, i) => (
<motion.div
key={i}
variants={itemVariants}
className="bg-slate-900/30 backdrop-blur border border-slate-800 hover:border-purple-500/30 rounded-xl p-6 transition-all"
>
<value.icon className="w-10 h-10 text-purple-400 mb-4" />
<h4 className="text-xl font-semibold mb-2">{value.title}</h4>
<p className="text-slate-400">{value.description}</p>
</motion.div>
))}
</div>
<div className="flex flex-col gap-4 text-base font-medium sm:flex-row">
<a
className="flex h-12 w-full items-center justify-center gap-2 rounded-full bg-foreground px-5 text-background transition-colors hover:bg-[#383838] dark:hover:bg-[#ccc] md:w-[158px]"
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
target="_blank"
rel="noopener noreferrer"
>
<Image
className="dark:invert"
src="/vercel.svg"
alt="Vercel logomark"
width={16}
height={16}
/>
Deploy Now
</a>
<a
className="flex h-12 w-full items-center justify-center rounded-full border border-solid border-black/[.08] px-5 transition-colors hover:border-transparent hover:bg-black/[.04] dark:border-white/[.145] dark:hover:bg-[#1a1a1a] md:w-[158px]"
href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
target="_blank"
rel="noopener noreferrer"
>
Documentation
</a>
</motion.section>
{/* CTA Section */}
<motion.section
className="relative z-10 px-6 py-20 max-w-5xl mx-auto"
initial="hidden"
whileInView="visible"
viewport={{ once: true }}
variants={containerVariants}
>
<motion.div
variants={itemVariants}
className="relative overflow-hidden bg-gradient-to-r from-purple-500/10 to-blue-500/10 backdrop-blur border border-purple-500/20 rounded-3xl p-12 text-center"
>
<div className="absolute inset-0 bg-gradient-to-r from-purple-500/5 to-blue-500/5" />
<div className="relative">
<h2 className="text-3xl lg:text-4xl font-bold mb-4">
Ready to Join ORUS?
</h2>
<p className="text-slate-300 text-lg mb-8 max-w-2xl mx-auto">
Whether you're a beginner or a pro, there's a place for you in our
community. Let's build something amazing together.
</p>
<div className="flex flex-col sm:flex-row gap-4 justify-center">
<motion.a
href="https://discord.gg/HFRsNxfCqT"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-purple-500 hover:bg-purple-600 rounded-lg font-semibold text-lg transition-colors"
whileHover={{ scale: 1.05 }}
whileTap={{ scale: 0.95 }}
>
<MessageSquare className="w-5 h-5" />
Join Discord Community
</motion.a>
<motion.a
href="https://github.com/orus-dev"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center justify-center gap-2 px-8 py-4 border border-slate-600 hover:border-slate-400 rounded-lg font-semibold text-lg transition-colors"
whileHover={{ scale: 1.05 }}
whileTap={{ scale: 0.95 }}
>
<Github className="w-5 h-5" />
Explore on GitHub
</motion.a>
</div>
</div>
</motion.div>
</motion.section>
{/* Footer */}
<footer className="relative z-10 px-6 py-12 border-t border-slate-800/50 mt-20">
<div className="max-w-7xl mx-auto">
<div className="flex flex-col md:flex-row justify-between items-center gap-6">
<div className="flex items-center gap-3">
<Shield className="w-6 h-6 text-purple-400" />
<span className="text-lg font-semibold">ORUS</span>
</div>
<div className="text-slate-400 text-center">
© 2024 ORUS. Open source for everyone. Built with 💜 for
developers.
</div>
<div className="flex gap-6">
<motion.a
href="https://github.com/orus-dev"
target="_blank"
rel="noopener noreferrer"
className="text-slate-400 hover:text-purple-400 transition-colors"
whileHover={{ scale: 1.2, rotate: 5 }}
>
<Github className="w-6 h-6" />
</motion.a>
<motion.a
href="https://discord.gg/HFRsNxfCqT"
target="_blank"
rel="noopener noreferrer"
className="text-slate-400 hover:text-purple-400 transition-colors"
whileHover={{ scale: 1.2, rotate: -5 }}
>
<MessageSquare className="w-6 h-6" />
</motion.a>
</div>
</div>
</div>
</main>
</footer>
</div>
);
}