├── .eslintrc.json
├── .github
└── workflows
│ └── nextjs.yml
├── .gitignore
├── .vscode
└── settings.json
├── LICENSE
├── README.md
├── app
├── globals.css
├── head.tsx
├── layout.tsx
├── page.tsx
└── providers.tsx
├── components
├── emoji
│ └── Emoji.tsx
├── hero
│ └── Hero.tsx
├── navbar
│ └── Navbar.tsx
├── scrolltotop
│ └── ScrollToTopButton.tsx
└── search
│ └── Search.tsx
├── next.config.js
├── package-lock.json
├── package.json
├── pages
└── api
│ └── hello.ts
├── postcss.config.js
├── public
├── android-chrome-192x192.png
├── android-chrome-512x512.png
├── apple-touch-icon.png
├── assets
│ └── bg.png
├── browserconfig.xml
├── favicon-16x16.png
├── favicon-32x32.png
├── favicon.ico
├── mstile-150x150.png
├── safari-pinned-tab.svg
└── site.webmanifest
├── tailwind.config.js
├── tsconfig.json
├── utils
└── emoji.json
└── yarn.lock
/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "next/core-web-vitals"
3 | }
4 |
--------------------------------------------------------------------------------
/.github/workflows/nextjs.yml:
--------------------------------------------------------------------------------
1 | # Sample workflow for building and deploying a Next.js site to GitHub Pages
2 | #
3 | # To get started with Next.js see: https://nextjs.org/docs/getting-started
4 | #
5 | name: Deploy Next.js site to Pages
6 |
7 | on:
8 | # Runs on pushes targeting the default branch
9 | push:
10 | branches: ["main"]
11 |
12 | # Allows you to run this workflow manually from the Actions tab
13 | workflow_dispatch:
14 |
15 | # Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
16 | permissions:
17 | contents: read
18 | pages: write
19 | id-token: write
20 |
21 | # Allow one concurrent deployment
22 | concurrency:
23 | group: "pages"
24 | cancel-in-progress: true
25 |
26 | jobs:
27 | # Build job
28 | build:
29 | runs-on: ubuntu-latest
30 | steps:
31 | - name: Checkout
32 | uses: actions/checkout@v3
33 | - name: Detect package manager
34 | id: detect-package-manager
35 | run: |
36 | if [ -f "${{ github.workspace }}/yarn.lock" ]; then
37 | echo "manager=yarn" >> $GITHUB_OUTPUT
38 | echo "command=install" >> $GITHUB_OUTPUT
39 | echo "runner=yarn" >> $GITHUB_OUTPUT
40 | exit 0
41 | elif [ -f "${{ github.workspace }}/package.json" ]; then
42 | echo "manager=npm" >> $GITHUB_OUTPUT
43 | echo "command=ci" >> $GITHUB_OUTPUT
44 | echo "runner=npx --no-install" >> $GITHUB_OUTPUT
45 | exit 0
46 | else
47 | echo "Unable to determine packager manager"
48 | exit 1
49 | fi
50 | - name: Setup Node
51 | uses: actions/setup-node@v3
52 | with:
53 | node-version: "16"
54 | cache: ${{ steps.detect-package-manager.outputs.manager }}
55 | - name: Setup Pages
56 | uses: actions/configure-pages@v3
57 | with:
58 | # Automatically inject basePath in your Next.js configuration file and disable
59 | # server side image optimization (https://nextjs.org/docs/api-reference/next/image#unoptimized).
60 | #
61 | # You may remove this line if you want to manage the configuration yourself.
62 | static_site_generator: next
63 | - name: Restore cache
64 | uses: actions/cache@v3
65 | with:
66 | path: |
67 | .next/cache
68 | # Generate a new cache whenever packages or source files change.
69 | key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-${{ hashFiles('**.[jt]s', '**.[jt]sx') }}
70 | # If source files changed but packages didn't, rebuild from a prior cache.
71 | restore-keys: |
72 | ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-
73 | - name: Install dependencies
74 | run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }}
75 | - name: Build with Next.js
76 | run: ${{ steps.detect-package-manager.outputs.runner }} next build
77 | - name: Static HTML export with Next.js
78 | run: ${{ steps.detect-package-manager.outputs.runner }} next export
79 | - name: Upload artifact
80 | uses: actions/upload-pages-artifact@v1
81 | with:
82 | path: ./out
83 |
84 | # Deployment job
85 | deploy:
86 | environment:
87 | name: github-pages
88 | url: ${{ steps.deployment.outputs.page_url }}
89 | runs-on: ubuntu-latest
90 | needs: build
91 | steps:
92 | - name: Deploy to GitHub Pages
93 | id: deployment
94 | uses: actions/deploy-pages@v1
95 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 | /.pnp
6 | .pnp.js
7 |
8 | # testing
9 | /coverage
10 |
11 | # next.js
12 | /.next/
13 | /out/
14 |
15 | # production
16 | /build
17 |
18 | # misc
19 | .DS_Store
20 | *.pem
21 |
22 | # debug
23 | npm-debug.log*
24 | yarn-debug.log*
25 | yarn-error.log*
26 | .pnpm-debug.log*
27 |
28 | # local env files
29 | .env*.local
30 |
31 | # vercel
32 | .vercel
33 |
34 | # typescript
35 | *.tsbuildinfo
36 | next-env.d.ts
--------------------------------------------------------------------------------
/.vscode/settings.json:
--------------------------------------------------------------------------------
1 | {
2 | "typescript.tsdk": "node_modules\\typescript\\lib",
3 | "typescript.enablePromptUseWorkspaceTsdk": true
4 | }
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2023 Coding With Enjoy
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | جعبه ابزار برنامه نویسا | Developers Tools 🤩🤩
2 |
3 | ###
4 |
5 |
6 |
7 | ###
8 |
9 | دمو | Demo 😁
https://ohmoji.netlify.app
10 |
11 | ###
12 |
13 |
14 |
15 | ###
16 |
17 |
18 |
19 |
28 |
29 |
توسعه داده شده توسط برنامه نویسی با لذت
67 |
68 | ###
69 |
--------------------------------------------------------------------------------
/app/globals.css:
--------------------------------------------------------------------------------
1 | @tailwind base;
2 | @tailwind components;
3 | @tailwind utilities;
4 |
5 | @layer base {
6 | html {
7 | scroll-behavior: smooth;
8 | }
9 |
10 | body {
11 | font-family: "Poppins", sans-serif;
12 | }
13 | }
14 |
15 | @layer components {
16 | .container {
17 | @apply max-w-[1280px] w-[calc(100%-3rem)] ml-[1.5rem] mr-[1.5rem] lg:m-auto;
18 | }
19 |
20 | .item-copy {
21 | @apply absolute bg-[#0077ff33] rounded-[8px] p-[6px] bottom-[8px] left-[8px] cursor-pointer transition-opacity text-[12px] text-[#0077ff];
22 | }
23 |
24 | .scroll_top {
25 | @apply fixed flex items-center right-[1.5rem] bottom-[-20%] bg-white p-[1rem] rounded-[8px] transition-[.6s] duration-[.6s] z-[50] cursor-pointer shadow-[0_1px_2px_rgba(0,0,0,0.2)] dark:bg-[#18191A];
26 | }
27 |
28 | .selector {
29 | @apply relative h-[196px] flex flex-col gap-[.8rem] cursor-pointer justify-center items-center shadow-[0_1px_2px_rgba(0,0,0,0.2)] bg-white p-[2rem] rounded-[8px] dark:bg-[#18191A];
30 | }
31 | }
32 |
33 | .selector {
34 | --first-color: #5ddcff;
35 | --second-color: #3c67e3;
36 | --third-color: #4e00c2;
37 | }
38 |
39 | @property --rotate {
40 | syntax: "";
41 | initial-value: 132deg;
42 | inherits: false;
43 | }
44 |
45 | .selector::before,
46 | .selector::after {
47 | opacity: 0;
48 | content: "";
49 | transition: all 0.5s ease-in-out;
50 | }
51 |
52 | .selector:hover::before,
53 | .selector:hover::after {
54 | position: absolute;
55 | z-index: -1;
56 | background-image: linear-gradient(
57 | var(--rotate),
58 | var(--first-color),
59 | var(--second-color) 43%,
60 | var(--third-color)
61 | );
62 | animation: spin 2.5s linear infinite;
63 | opacity: 1;
64 | }
65 |
66 | .selector:hover::before {
67 | width: 104%;
68 | height: 104%;
69 | border-radius: 8px;
70 | top: -2%;
71 | left: -2%;
72 | }
73 |
74 | .selector:hover::after {
75 | top: 0;
76 | left: 0;
77 | right: 0;
78 | height: 100%;
79 | width: 100%;
80 | transform: scale(0.9);
81 | filter: blur(70px);
82 | }
83 |
84 | @keyframes spin {
85 | 0% {
86 | --rotate: 0deg;
87 | }
88 |
89 | 100% {
90 | --rotate: 360deg;
91 | }
92 | }
93 |
--------------------------------------------------------------------------------
/app/head.tsx:
--------------------------------------------------------------------------------
1 | export default function Head() {
2 | return (
3 | <>
4 | OHMOJI
5 |
6 |
10 |
14 |
15 |
16 |
17 |
21 |
26 |
32 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
49 |
50 |
51 |
52 |
53 |
54 |
55 |
59 |
60 |
61 | );
62 | }
--------------------------------------------------------------------------------
/app/layout.tsx:
--------------------------------------------------------------------------------
1 | import "@fontsource/poppins/500.css";
2 | import "@fontsource/poppins/700.css";
3 | import "./globals.css";
4 | import { Providers } from "./providers";
5 | import Head from "./head";
6 |
7 | export default function RootLayout({
8 | children,
9 | }: {
10 | children: React.ReactNode;
11 | }) {
12 | return (
13 |
14 |
15 |
16 | 
48 | 
51 | 
54 | 
57 |