Repository: FrancescoXX/4c-site
Branch: main
Commit: 393aa48df093
Files: 81
Total size: 152.3 KB
Directory structure:
gitextract_sgk63q96/
├── .editorconfig
├── .eslintrc.js
├── .github/
│ ├── ISSUE_TEMPLATE/
│ │ ├── bug_report.yml
│ │ ├── config.yml
│ │ ├── documentation.yml
│ │ ├── feature_request.yml
│ │ └── other.yml
│ ├── PULL_REQUEST_TEMPLATE/
│ │ └── pull_request_template.md
│ ├── dependabot.yml
│ └── workflows/
│ ├── greetings.yml
│ ├── json-syntax-check.yml
│ ├── lint.yml
│ └── release.yml
├── .gitignore
├── .gitpod.yml
├── .husky/
│ ├── commit-msg
│ └── pre-commit
├── .releaserc.js
├── .vscode/
│ ├── extensions.json
│ └── settings.json
├── CHANGELOG.md
├── CODE_OF_CONDUCT.md
├── CONTRIBUTING.md
├── LICENSE
├── README.md
├── commitlint.config.js
├── docs/
│ └── theme/
│ └── README.md
├── jsconfig.json
├── next.config.mjs
├── package.json
├── postcss.config.js
├── renovate.json
├── src/
│ ├── 4c.config.js
│ ├── components/
│ │ ├── ActiveMembers.js
│ │ ├── BlogCard.js
│ │ ├── CommunityPartners.js
│ │ ├── FaqAccordian.js
│ │ ├── Footer.jsx
│ │ ├── Form/
│ │ │ ├── JoinUsForm.js
│ │ │ └── validation/
│ │ │ └── formSchema.js
│ │ ├── GetActivemembers.js
│ │ ├── GetActivities.js
│ │ ├── GetProjects.js
│ │ ├── GetStaff.js
│ │ ├── GetVideos.js
│ │ ├── GoToTop.js
│ │ ├── Header.js
│ │ ├── JoinOurTeam.jsx
│ │ ├── Layout.js
│ │ ├── Loading.jsx
│ │ ├── Main.js
│ │ ├── ProfileCard.jsx
│ │ ├── SocialLink.jsx
│ │ ├── Staff.js
│ │ ├── Title.js
│ │ ├── Users.js
│ │ ├── blog-posts.js
│ │ └── faq.js
│ ├── data/
│ │ ├── activemembers.js
│ │ ├── blog.js
│ │ ├── events.json
│ │ ├── faq.json
│ │ ├── homepage.js
│ │ ├── navbar.js
│ │ ├── partnerCommunities.json
│ │ ├── projects.json
│ │ ├── stacks.json
│ │ ├── staff.js
│ │ └── videos.json
│ ├── pages/
│ │ ├── _app.js
│ │ ├── _document.js
│ │ ├── active-members.js
│ │ ├── index.js
│ │ ├── joinourteam.js
│ │ ├── projects.js
│ │ └── staff.js
│ ├── public/
│ │ └── manifest.json
│ ├── scripts/
│ │ └── img.js
│ ├── styles/
│ │ └── global.css
│ └── utils/
│ └── filterUsers.js
└── tailwind.config.js
================================================
FILE CONTENTS
================================================
================================================
FILE: .editorconfig
================================================
# editorconfig.org
root = true
[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
================================================
FILE: .eslintrc.js
================================================
/**
* @type {import("eslint").Linter.Config}
*/
const eslintConfig = {
env: {
browser: true,
commonjs: true,
es2022: true,
node: true,
},
extends: [
"eslint:recommended",
"plugin:eslint-comments/recommended",
"plugin:react/recommended",
"plugin:react-hooks/recommended",
"plugin:jsx-a11y/strict",
"next/core-web-vitals",
"plugin:@typescript-eslint/recommended",
"standard",
"standard-with-typescript",
],
overrides: [],
parserOptions: {
ecmaVersion: "latest",
ecmaFeatures: {
jsx: true,
},
},
plugins: [
"const-case",
"editorconfig",
"filenames",
"simple-import-sort",
"import",
"react",
"jsx-a11y",
"json-format",
"tailwindcss",
],
rules: {
"comma-dangle": ["warn", "always-multiline"],
"no-console": "warn",
quotes: ["warn", "double"],
"space-before-function-paren": ["warn", "never"],
},
settings: {
react: {
version: "detect",
},
},
}
module.exports = eslintConfig
================================================
FILE: .github/ISSUE_TEMPLATE/bug_report.yml
================================================
name: Bug Report
description: Create a report to help us improve
title: "[Bug]: "
labels: ["🚦 status: awaiting triage"]
body:
- type: textarea
id: description
attributes:
label: Description
description: A clear and concise description of what the bug is.
placeholder: When I go to the home page, the image doesn't load and returns a 404 error code
validations:
required: true
- type: textarea
id: reproduce
attributes:
label: To Reproduce
description: Steps to reproduce the behavior you were facing.
placeholder: How can someone reproduce the behavior you were facing?
value: |
1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error
validations:
required: true
- type: textarea
attributes:
label: Anything else?
description: |
Links? References? Anything that will give us more context about the issue you are encountering!
Tip: You can attach images or log files by clicking this area to highlight it and then dragging files in.
validations:
required: false
- type: checkboxes
id: guidelines
attributes:
label: Code of Conduct
options:
- label: I agree to follow this project's [Code of Conduct](https://github.com/FrancescoXX/4c-site/blob/main/CODE_OF_CONDUCT.md)
required: true
- type: markdown
attributes:
value: |
### Call to Action
To Commit on this project you should use `npm run commit`. Do not use `git commit` to avoid unwanted issues.
================================================
FILE: .github/ISSUE_TEMPLATE/config.yml
================================================
# blank_issues_enabled: false
# contact_links:
# - name: 4C Discussions
# url: https://github.com/FrancescoXX/4c-site/discussions
# about: Please ask and answer questions here.
# - name: Discord Community
# url: https://4c.rocks/join
# about: Join 4C Community, here
================================================
FILE: .github/ISSUE_TEMPLATE/documentation.yml
================================================
name: "Documentation Report"
description: Suggest improvements for the docs
title: '[Docs]: '
labels: ['🚦 status: awaiting triage']
body:
- type: textarea
id: description
attributes:
label: Description
description: A clear and concise description of what have to be updated.
placeholder: When I go to the commands.md doc, I notice that it doesn't have a table of contents
validations:
required: true
- type: textarea
attributes:
label: Anything else?
description: |
Links? References? Anything that will give us more context about the issue you are encountering!
Tip: You can attach images or log files by clicking this area to highlight it and then dragging files in.
validations:
required: false
- type: checkboxes
id: guidelines
attributes:
label: Code of Conduct
options:
- label: I agree to follow this project's [Code of Conduct](https://github.com/FrancescoXX/4c-site/blob/main/CODE_OF_CONDUCT.md)
required: true
- type: markdown
attributes:
value: |
### Call to Action
To Commit on this project you should use `npm run commit`. Do not use `git commit` to avoid unwanted issues.
================================================
FILE: .github/ISSUE_TEMPLATE/feature_request.yml
================================================
name: Feature Request
description: Suggest an idea for this project
title: '[Feat]: '
labels: ['🚦 status: awaiting triage']
body:
- type: textarea
id: description
attributes:
label: Description
description: Is your feature request related to a problem? Please describe.
placeholder: "I'm always frustrated when [...]"
value: "I'm always frustrated when [...]"
validations:
required: true
- type: textarea
id: solution
attributes:
label: Solution
description: A clear and concise description of what you want to happen.
placeholder: I want a discord command `!server` to be added where we can view the server member count
value: 'I want'
validations:
required: false
- type: textarea
attributes:
label: Anything else?
description: |
Links? References? Anything that will give us more context about the issue you are encountering!
Tip: You can attach images or log files by clicking this area to highlight it and then dragging files in.
validations:
required: false
- type: checkboxes
id: guidelines
attributes:
label: Code of Conduct
options:
- label: I agree to follow this project's [Code of Conduct](https://github.com/FrancescoXX/4c-site/blob/main/CODE_OF_CONDUCT.md)
required: true
- type: markdown
attributes:
value: |
### Call to Action
To Commit on this project you should use `npm run commit`. Do not use `git commit` to avoid unwanted issues.
================================================
FILE: .github/ISSUE_TEMPLATE/other.yml
================================================
name: Other
description: Use this, Please DO NOT create blank issues
title: '[Other]: '
labels: ['🚦 status: awaiting triage']
body:
- type: textarea
id: description
attributes:
label: Description
description: A clear and concise description of what this issue is about.
placeholder: If you are not using the wiki tab, please hide it
validations:
required: true
- type: textarea
attributes:
label: Anything else?
description: |
Links? References? Anything that will give us more context about the issue you are encountering!
Tip: You can attach images or log files by clicking this area to highlight it and then dragging files in.
validations:
required: false
- type: checkboxes
id: guidelines
attributes:
label: Code of Conduct
options:
- label: I agree to follow this project's [Code of Conduct](https://github.com/FrancescoXX/4c-site/blob/main/CODE_OF_CONDUCT.md)
required: true
- type: markdown
attributes:
value: |
### Call to Action
To Commit on this project you should use `npm run commit`. Do not use `git commit` to avoid unwanted issues.
================================================
FILE: .github/PULL_REQUEST_TEMPLATE/pull_request_template.md
================================================
## Related Issue
Closes: # <!-- issue number that will be closed through this PR -->
### Describe the changes you've made
<!-- Give a clear description of what modifications you have made -->
## How has this been tested?
<!-- Describe how have you verified the changes made -->
## Checklist
<!--
Example how to mark a checkbox:-
- [x] I have performed a self-review of my own code.
-->
- [ ] I have performed a self-review of my own code.
- [ ] I have commented on my code, particularly wherever it was hard to understand.
- [ ] I have made corresponding changes to the documentation.
- [ ] I have followed the code style of the project
- [ ] I have tested my code, and it works without errors
## Additional Information
<!-- Screenshots, notes for reviewers, anything? -->
## Code of Conduct
- [ ] I agree to follow this project's [Code of Conduct](https://github.com/FrancescoXX/4c-site/blob/main/CODE_OF_CONDUCT.md)## Related Issue
Closes: # <!-- issue number that will be closed through this PR -->
### Describe the changes you've made
<!-- Give a clear description of what modifications you have made -->
## How has this been tested?
<!-- Describe how have you verified the changes made -->
## Checklist
<!--
Example how to mark a checkbox:-
- [x] I have performed a self-review of my own code.
-->
- [ ] I have performed a self-review of my own code.
- [ ] I have commented on my code, particularly wherever it was hard to understand.
- [ ] I have made corresponding changes to the documentation.
- [ ] I have followed the code style of the project
- [ ] I have tested my code, and it works without errors
## Additional Information
<!-- Screenshots, notes for reviewers, anything? -->
## Code of Conduct
- [ ] I agree to follow this project's [Code of Conduct](https://github.com/FrancescoXX/4c-site/blob/main/CODE_OF_CONDUCT.md)
**Please keep up with the [Discord Conversation](https://discord.gg/4c) for more information.**
<!-- Thanks for contributing, keep up the good work 🔥 -->
================================================
FILE: .github/dependabot.yml
================================================
version: 2
updates:
# Update GitHub Actions
- package-ecosystem: "github-actions"
directory: "/"
schedule:
interval: "daily"
================================================
FILE: .github/workflows/greetings.yml
================================================
name: Greetings
on: [pull_request_target, issues]
jobs:
greeting:
runs-on: ubuntu-latest
permissions:
issues: write
pull-requests: write
steps:
- uses: actions/first-interaction@v1
with:
repo-token: ${{ secrets.GITHUB_TOKEN }}
issue-message: "Congratulations, ${{ github.actor }}! 🎉 Thank you for creating your first issue in 4C. Your contribution is greatly appreciated and we look forward to working with you to resolve the issue. Keep up the great work!"
pr-message: "Great job, ${{ github.actor }}! 🎉 Thank you for submitting your first pull request to 4C. Your contribution is valuable and we appreciate your efforts to improve our project. We'll review your changes and provide feedback as soon as possible. Keep up the great work!"
================================================
FILE: .github/workflows/json-syntax-check.yml
================================================
name: JSON Syntax Check
on:
push:
paths:
- "**.json"
pull_request:
jobs:
test:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- name: json-syntax-check
uses: limitusus/json-syntax-check@v2
with:
pattern: "\\.json$"
================================================
FILE: .github/workflows/lint.yml
================================================
name: Lint
on:
- push
- pull_request
jobs:
lint:
name: Lint Before Release
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v4
with:
node-version: 18.x
- name: Install dependencies
run: yarn install --frozen-lockfile
- name: Lint
run: yarn lint
================================================
FILE: .github/workflows/release.yml
================================================
name: Release
on:
push:
branches:
- main
jobs:
lint:
name: Lint Before Release
if: github.repository_owner == 'FrancescoXX'
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v4
with:
node-version: 18.x
- name: Install dependencies
run: yarn install --frozen-lockfile
- name: Lint
run: yarn lint
build:
name: Try to Build Before Release
if: github.repository_owner == 'FrancescoXX'
runs-on: ubuntu-latest
needs: lint
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v4
with:
node-version: 18.x
- name: Install dependencies
run: yarn install --frozen-lockfile
- name: Build
run: yarn build
release:
name: Create GitHub Release
if: github.repository_owner == 'FrancescoXX'
runs-on: ubuntu-latest
needs: build
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v4
with:
node-version: 18.x
- name: Install dependencies
run: yarn install --frozen-lockfile
- name: Release package
run: yarn release
env:
GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
================================================
FILE: .gitignore
================================================
package-lock.json
# Created by https://www.toptal.com/developers/gitignore/api/git,node,react,nextjs,vercel,dotenv,yarn,fish,linux,zsh,windows,osx,macos,emacs,vim,visualstudiocode,sublimetext,notepadpp,ssh,tower,storybookjs,now,replit
# Edit at https://www.toptal.com/developers/gitignore?templates=git,node,react,nextjs,vercel,dotenv,yarn,fish,linux,zsh,windows,osx,macos,emacs,vim,visualstudiocode,sublimetext,notepadpp,ssh,tower,storybookjs,now,replit
### dotenv ###
.env
### Emacs ###
# -*- mode: gitignore; -*-
*~
\#*\#
/.emacs.desktop
/.emacs.desktop.lock
*.elc
auto-save-list
tramp
.\#*
# Org-mode
.org-id-locations
*_archive
# flymake-mode
*_flymake.*
# eshell files
/eshell/history
/eshell/lastdir
# elpa packages
/elpa/
# reftex files
*.rel
# AUCTeX auto folder
/auto/
# cask packages
.cask/
dist/
# Flycheck
flycheck_*.el
# server auth directory
/server/
# projectiles files
.projectile
# directory configuration
.dir-locals.el
# network security
/network-security.data
### Fish ###
fishd.*
fish_history
fish_variables
config.local.fish
### Git ###
# Created by git for backups. To disable backups in Git:
# $ git config --global mergetool.keepBackup false
*.orig
# Created by git when using merge tools for conflicts
*.BACKUP.*
*.BASE.*
*.LOCAL.*
*.REMOTE.*
*_BACKUP_*.txt
*_BASE_*.txt
*_LOCAL_*.txt
*_REMOTE_*.txt
### Linux ###
# temporary files which can be created if a process still has a handle open of a deleted file
.fuse_hidden*
# KDE directory preferences
.directory
# Linux trash folder which might appear on any partition or disk
.Trash-*
# .nfs files are created when an open file is removed but is still being accessed
.nfs*
### macOS ###
# General
.DS_Store
.AppleDouble
.LSOverride
# Icon must end with two \r
Icon
# Thumbnails
._*
# Files that might appear in the root of a volume
.DocumentRevisions-V100
.fseventsd
.Spotlight-V100
.TemporaryItems
.Trashes
.VolumeIcon.icns
.com.apple.timemachine.donotpresent
# Directories potentially created on remote AFP share
.AppleDB
.AppleDesktop
Network Trash Folder
Temporary Items
.apdisk
### macOS Patch ###
# iCloud generated files
*.icloud
### NextJS ###
# dependencies
/node_modules
/.pnp
.pnp.js
# testing
/coverage
# next.js
/.next/
/out/
# production
/build
# misc
*.pem
# debug
npm-debug.log*
yarn-debug.log*
yarn-error.log*
.pnpm-debug.log*
# local env files
.env*.local
# vercel
.vercel
# typescript
*.tsbuildinfo
next-env.d.ts
### Node ###
# Logs
logs
*.log
lerna-debug.log*
# Diagnostic reports (https://nodejs.org/api/report.html)
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
*.lcov
# nyc test coverage
.nyc_output
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# Snowpack dependency directory (https://snowpack.dev/)
web_modules/
# TypeScript cache
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Optional stylelint cache
.stylelintcache
# Microbundle cache
.rpt2_cache/
.rts2_cache_cjs/
.rts2_cache_es/
.rts2_cache_umd/
# Optional REPL history
.node_repl_history
# Output of "npm pack"
*.tgz
# Yarn Integrity file
.yarn-integrity
# dotenv environment variable files
.env.development.local
.env.test.local
.env.production.local
.env.local
# parcel-bundler cache (https://parceljs.org/)
.cache
.parcel-cache
# Next.js build output
.next
out
# Nuxt.js build / generate output
.nuxt
dist
# Gatsby files
.cache/
# Comment in the public line in if your project uses Gatsby and not Next.js
# https://nextjs.org/blog/next-9-1#public-directory-support
# public
# vuepress build output
.vuepress/dist
# vuepress v2.x temp and cache directory
.temp
# Docusaurus cache and generated files
.docusaurus
# Serverless directories
.serverless/
# FuseBox cache
.fusebox/
# DynamoDB Local files
.dynamodb/
# TernJS port file
.tern-port
# Stores VSCode versions used for testing VSCode extensions
.vscode-test
# yarn v2
.yarn/cache
.yarn/unplugged
.yarn/build-state.yml
.yarn/install-state.gz
.pnp.*
### Node Patch ###
# Serverless Webpack directories
.webpack/
# Optional stylelint cache
# SvelteKit build / generate output
.svelte-kit
### NotepadPP ###
# Notepad++ backups #
*.bak
### now ###
.now
### OSX ###
# General
# Icon must end with two \r
# Thumbnails
# Files that might appear in the root of a volume
# Directories potentially created on remote AFP share
### react ###
.DS_*
**/*.backup.*
**/*.back.*
node_modules
*.sublime*
psd
thumb
sketch
### replit ###
# Replit config file
.replit
# Replit Nix config file
replit.nix
### SSH ###
**/.ssh/id_*
**/.ssh/*_id_*
**/.ssh/known_hosts
### StorybookJs ###
# gitignore template for the Storybook, UI guide for front apps
# website: https://storybook.js.org/
storybook-static/
### SublimeText ###
# Cache files for Sublime Text
*.tmlanguage.cache
*.tmPreferences.cache
*.stTheme.cache
# Workspace files are user-specific
*.sublime-workspace
# Project files should be checked into the repository, unless a significant
# proportion of contributors will probably not be using Sublime Text
# *.sublime-project
# SFTP configuration file
sftp-config.json
sftp-config-alt*.json
# Package control specific files
Package Control.last-run
Package Control.ca-list
Package Control.ca-bundle
Package Control.system-ca-bundle
Package Control.cache/
Package Control.ca-certs/
Package Control.merged-ca-bundle
Package Control.user-ca-bundle
oscrypto-ca-bundle.crt
bh_unicode_properties.cache
# Sublime-github package stores a github token in this file
# https://packagecontrol.io/packages/sublime-github
GitHub.sublime-settings
### Tower ###
# Tower.app - http://www.git-tower.com/
Icon.png
### Vercel ###
### Vim ###
# Swap
[._]*.s[a-v][a-z]
!*.svg # comment out if you don"t need vector files
[._]*.sw[a-p]
[._]s[a-rt-v][a-z]
[._]ss[a-gi-z]
[._]sw[a-p]
# Session
Session.vim
Sessionx.vim
# Temporary
.netrwhist
# Auto-generated tag files
tags
# Persistent undo
[._]*.un~
### VisualStudioCode ###
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
!.vscode/*.code-snippets
# Local History for Visual Studio Code
.history/
# Built Visual Studio Code Extensions
*.vsix
### VisualStudioCode Patch ###
# Ignore all local history of files
.history
.ionide
### Windows ###
# Windows thumbnail cache files
Thumbs.db
Thumbs.db:encryptable
ehthumbs.db
ehthumbs_vista.db
# Dump file
*.stackdump
# Folder config file
[Dd]esktop.ini
# Recycle Bin used on file shares
$RECYCLE.BIN/
# Windows Installer files
*.cab
*.msi
*.msix
*.msm
*.msp
# Windows shortcuts
*.lnk
### yarn ###
# https://yarnpkg.com/getting-started/qa#which-files-should-be-gitignored
.yarn/*
!.yarn/releases
!.yarn/patches
!.yarn/plugins
!.yarn/sdks
!.yarn/versions
# if you are NOT using Zero-installs, then:
# comment the following lines
!.yarn/cache
# and uncomment the following lines
# .pnp.*
### Zsh ###
# Zsh compiled script + zrecompile backup
*.zwc
*.zwc.old
# Zsh completion-optimization dumpfile
*zcompdump*
# Zsh zcalc history
.zcalc_history
# A popular plugin manager"s files
._zinit
.zinit_lstupd
# zdharma/zshelldoc tool"s files
zsdoc/data
# robbyrussell/oh-my-zsh/plugins/per-directory-history plugin"s files
# (when set-up to store the history in the local directory)
.directory_history
# MichaelAquilina/zsh-autoswitch-virtualenv plugin"s files
# (for Zsh plugins using Python)
.venv
# Zunit tests" output
/tests/_output/*
!/tests/_output/.gitkeep
# End of https://www.toptal.com/developers/gitignore/api/git,node,react,nextjs,vercel,dotenv,yarn,fish,linux,zsh,windows,osx,macos,emacs,vim,visualstudiocode,sublimetext,notepadpp,ssh,tower,storybookjs,now,replit
================================================
FILE: .gitpod.yml
================================================
# List the start up tasks. Learn more https://www.gitpod.io/docs/config-start-tasks/
tasks:
- name: Development Server
init: yarn install
command: yarn dev
# List the ports to expose. Learn more https://www.gitpod.io/docs/config-ports/
ports:
- port: 3000
onOpen: open-browser
github:
prebuilds:
master: true
branches: true
pullRequests: true
pullRequestsFromForks: true
addCheck: true
addComment: false
addBadge: true
================================================
FILE: .husky/commit-msg
================================================
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"
npx --no -- commitlint --edit "$1"
================================================
FILE: .husky/pre-commit
================================================
#!/usr/bin/env sh
. "$(dirname "$0")/_/husky.sh"
npm run lint:fix
================================================
FILE: .releaserc.js
================================================
module.exports = {
branches: [{ name: "main" }],
plugins: [
[
"@semantic-release/commit-analyzer",
{
preset: "angular",
},
],
"@semantic-release/release-notes-generator",
"@semantic-release/changelog",
[
"@semantic-release/git",
{
assets: ["CHANGELOG.md", "package.json", "yarn.lock"],
message: "chore(release): 🤖 ${nextRelease.version} [skip ci]",
},
],
[
"@semantic-release/github",
{
assets: ["CHANGELOG.md"],
},
],
],
preset: "angular",
ci: true,
debug: true,
};
================================================
FILE: .vscode/extensions.json
================================================
{
"recommendations": ["evolution-gaming.evolution-gaming--vscode-eslint"]
}
================================================
FILE: .vscode/settings.json
================================================
{
"eslint.enable": true,
"editor.formatOnSave": false,
"eslint.validate": [
"javascript",
"javascriptreact",
"json"
],
"githubPullRequests.ignoredPullRequestBranches": [
"main"
]
}
================================================
FILE: CHANGELOG.md
================================================
# [0.22.0](https://github.com/FrancescoXX/4c-site/compare/v0.21.4...v0.22.0) (2024-10-22)
### Features
* add detailed readme ([b00381a](https://github.com/FrancescoXX/4c-site/commit/b00381a96bc728d69e5e2e0923c2e4552b10b9e2))
## [0.21.4](https://github.com/FrancescoXX/4c-site/compare/v0.21.3...v0.21.4) (2023-11-18)
### Bug Fixes
* image in activitie ([2d11869](https://github.com/FrancescoXX/4c-site/commit/2d11869601019af5f255a43694192dfa2713d74f))
## [0.21.3](https://github.com/FrancescoXX/4c-site/compare/v0.21.2...v0.21.3) (2023-11-18)
### Bug Fixes
* checkout to new branch ([4d87342](https://github.com/FrancescoXX/4c-site/commit/4d87342175259e2b7baa3a3b8e9eeb92d2aba189))
## [0.21.2](https://github.com/FrancescoXX/4c-site/compare/v0.21.1...v0.21.2) (2023-11-05)
### Bug Fixes
* next image issue ([09d79b6](https://github.com/FrancescoXX/4c-site/commit/09d79b62af95ffa43556956bb338a137f3f0080a))
* next image issue ([39a5660](https://github.com/FrancescoXX/4c-site/commit/39a56609bb6cca3a12e7efb17363399091350234))
* next image issue ([f7294e8](https://github.com/FrancescoXX/4c-site/commit/f7294e8415150d68cbcaacdcdb0abd9ade783de7))
## [0.21.1](https://github.com/FrancescoXX/4c-site/compare/v0.21.0...v0.21.1) (2023-10-24)
### Bug Fixes
* lint issue ([6bceaaf](https://github.com/FrancescoXX/4c-site/commit/6bceaaf0e3cdeb6174d00b51be59f2a18f7b99fc))
# [0.21.0](https://github.com/FrancescoXX/4c-site/compare/v0.20.1...v0.21.0) (2023-10-24)
### Features
* **plugin:** commitizen-support-782 ([8c6af10](https://github.com/FrancescoXX/4c-site/commit/8c6af1067383c79cc95d51d9102a30377bbaa7ff))
## [0.20.1](https://github.com/FrancescoXX/4c-site/compare/v0.20.0...v0.20.1) (2023-10-15)
### Bug Fixes
* **ActiveMembers.js and Staff.js:** added feedback message if search input does not find a match ([9373549](https://github.com/FrancescoXX/4c-site/commit/937354979799de0605c3390f62c1973e4b47dc51))
# [0.20.0](https://github.com/FrancescoXX/4c-site/compare/v0.19.2...v0.20.0) (2023-10-15)
### Features
* Filter staff by name and description ([48bbafa](https://github.com/FrancescoXX/4c-site/commit/48bbafa88e285d0f20f9770b7142e669e009ebf8))
## [0.19.2](https://github.com/FrancescoXX/4c-site/compare/v0.19.1...v0.19.2) (2023-05-28)
### Bug Fixes
* improve user experience ([cb7b237](https://github.com/FrancescoXX/4c-site/commit/cb7b237f952d0a789024a6068ad5e3e1a0bc5fac))
* user interface ([45a6a52](https://github.com/FrancescoXX/4c-site/commit/45a6a52620b152f0c036f8c616b2bcdfc5a1deea))
## [0.19.1](https://github.com/FrancescoXX/4c-site/compare/v0.19.0...v0.19.1) (2023-05-15)
### Bug Fixes
* og image url ([f7e1afa](https://github.com/FrancescoXX/4c-site/commit/f7e1afa7c9cf693c3415d9fa8b7e674b43488be6))
* remove trailing space ([a7d102d](https://github.com/FrancescoXX/4c-site/commit/a7d102d9b495c66df813ec4b886c7c1cb05855be))
# [0.19.0](https://github.com/FrancescoXX/4c-site/compare/v0.18.9...v0.19.0) (2023-04-26)
### Features
* testing ([7d16d27](https://github.com/FrancescoXX/4c-site/commit/7d16d27b8c82e1cd1a17ac065fd3a2646aa0a38f))
* testing ([8d64761](https://github.com/FrancescoXX/4c-site/commit/8d64761e7abb354f1d788f83d3fedcd2ce6a545f))
## [0.18.9](https://github.com/FrancescoXX/4c-site/compare/v0.18.8...v0.18.9) (2023-04-11)
### Bug Fixes
* centered the menu-item! ([baea93d](https://github.com/FrancescoXX/4c-site/commit/baea93d1f3ae40eb342efbaaea053a5ccd53bfdd))
## [0.18.8](https://github.com/FrancescoXX/4c-site/compare/v0.18.7...v0.18.8) (2023-04-08)
### Bug Fixes
* activities section a bit far from previous section ([cb9dbf2](https://github.com/FrancescoXX/4c-site/commit/cb9dbf25d9644370f1018663e0e1330440af22be))
## [0.18.7](https://github.com/FrancescoXX/4c-site/compare/v0.18.6...v0.18.7) (2023-03-31)
### Bug Fixes
* added to the card title ([4b9b06b](https://github.com/FrancescoXX/4c-site/commit/4b9b06b31bdb47b2942694bf164ecb1c5b9c2642))
* blog card size(height to full) ([fc04ac4](https://github.com/FrancescoXX/4c-site/commit/fc04ac46e6b44566e6473f257473bfcc1642af85))
* image replaced ([3a2c0b5](https://github.com/FrancescoXX/4c-site/commit/3a2c0b5c4cd5af203130fdd045f4dd6c11cf256b))
* image replaced & blog card problem fixed ([84d4761](https://github.com/FrancescoXX/4c-site/commit/84d476155625cd12b5d7e813248334c72dd12aba))
## [0.18.6](https://github.com/FrancescoXX/4c-site/compare/v0.18.5...v0.18.6) (2023-03-28)
### Bug Fixes
* **project-link-centered:** centered links in the project card ([4b339ca](https://github.com/FrancescoXX/4c-site/commit/4b339caf6fda586836d2955fcd2a0f92cc4d3ef4))
## [0.18.5](https://github.com/FrancescoXX/4c-site/compare/v0.18.4...v0.18.5) (2023-03-26)
### Bug Fixes
* **comments:** removed commented code ([f77cb5c](https://github.com/FrancescoXX/4c-site/commit/f77cb5c893c56cca170fca09d3fb71b513392fc9))
* **search-tab:** improved user experience and icon-positioning issue in search-tab of projects page ([83f1d1f](https://github.com/FrancescoXX/4c-site/commit/83f1d1f90c33537e54f3d45d57f2b21e6f6d767b))
## [0.18.4](https://github.com/FrancescoXX/4c-site/compare/v0.18.3...v0.18.4) (2023-03-20)
### Bug Fixes
* search icon added in projects search bar ([608c163](https://github.com/FrancescoXX/4c-site/commit/608c163e6cadc0fdb09fbcc0a60dd165b3423317))
## [0.18.3](https://github.com/FrancescoXX/4c-site/compare/v0.18.2...v0.18.3) (2023-03-12)
### Bug Fixes
* **search-tab:** Improved search-tab of the projects page ([13a0c15](https://github.com/FrancescoXX/4c-site/commit/13a0c1508ee98ba85030e99c3846bb477a28a103))
## [0.18.2](https://github.com/FrancescoXX/4c-site/compare/v0.18.1...v0.18.2) (2023-03-08)
### Bug Fixes
* **Back To Top Button:** Solves back to top button overlapping footer icons in mobile-devices ([33a8198](https://github.com/FrancescoXX/4c-site/commit/33a8198bee66f6697c7e9ba912568cce1e4c6f8a))
## [0.18.1](https://github.com/FrancescoXX/4c-site/compare/v0.18.0...v0.18.1) (2023-03-08)
### Bug Fixes
* **incorrect link:** fix incorrect link ([c8b9a29](https://github.com/FrancescoXX/4c-site/commit/c8b9a292e81eae4d1909973d351b7d1510d6e20d))
# [0.18.0](https://github.com/FrancescoXX/4c-site/compare/v0.17.0...v0.18.0) (2023-03-04)
### Features
* change px to rem in global css ([d73b797](https://github.com/FrancescoXX/4c-site/commit/d73b7975d34a984a8b27f90a6511e385aa26d294))
* mobile font size reduced for home page ([d3fd2fc](https://github.com/FrancescoXX/4c-site/commit/d3fd2fcb88d106f0a8a2e4baa3a3d01cc547d99e))
* mobile font size reduced for home page ([34b4cbe](https://github.com/FrancescoXX/4c-site/commit/34b4cbea68eda254cce83aae7423397192cb0afa))
* nav bar background color ([b06ec05](https://github.com/FrancescoXX/4c-site/commit/b06ec05e4cadd76f0e3ed8f8d3b927b02ab54ee4))
# [0.17.0](https://github.com/FrancescoXX/4c-site/compare/v0.16.0...v0.17.0) (2023-03-04)
### Features
* add LBD profile to active members page ([b47f445](https://github.com/FrancescoXX/4c-site/commit/b47f4459e2124ba5c42e29e10ab9e4281ba643bd))
# [0.16.0](https://github.com/FrancescoXX/4c-site/compare/v0.15.3...v0.16.0) (2023-03-04)
### Features
* remove unnecessary pages ([aceb834](https://github.com/FrancescoXX/4c-site/commit/aceb834dfe8f09f506f424d15bd3e67574eaea70))
## [0.15.3](https://github.com/FrancescoXX/4c-site/compare/v0.15.2...v0.15.3) (2023-02-16)
### Bug Fixes
* fixed linting issues ([ee84210](https://github.com/FrancescoXX/4c-site/commit/ee84210fc9b75c6fa944768ca720eb340f05cd41))
## [0.15.2](https://github.com/FrancescoXX/4c-site/compare/v0.15.1...v0.15.2) (2023-02-12)
### Bug Fixes
* **data/activemembers.js:** fix social links for singh-vaibhav08 ([899568e](https://github.com/FrancescoXX/4c-site/commit/899568e3fd870be56f42de3640a696a68504cff1)), closes [sin#vaibhav08](https://github.com/sin/issues/vaibhav08)
## [0.15.1](https://github.com/FrancescoXX/4c-site/compare/v0.15.0...v0.15.1) (2023-02-12)
### Bug Fixes
* **ui:** enhanace search bar UI ([75baf95](https://github.com/FrancescoXX/4c-site/commit/75baf95a43dd85eeefb4159921aa674662d2769b))
# [0.15.0](https://github.com/FrancescoXX/4c-site/compare/v0.14.6...v0.15.0) (2023-02-10)
### Features
* add background for navbar ([abd132c](https://github.com/FrancescoXX/4c-site/commit/abd132c8d66b3204d308802078b99abe7f629f9c))
## [0.14.6](https://github.com/FrancescoXX/4c-site/compare/v0.14.5...v0.14.6) (2023-02-07)
### Bug Fixes
* **scrollable sidebar:** fix scrollable sidebar ([59cd24a](https://github.com/FrancescoXX/4c-site/commit/59cd24a320124b3d65c1722d14a4945f9d70c82f))
* **sidebar:** fix scrollable sidebar ([c9adf70](https://github.com/FrancescoXX/4c-site/commit/c9adf70b552eb6ad3de24d7281b7372b82fc99df))
## [0.14.5](https://github.com/FrancescoXX/4c-site/compare/v0.14.4...v0.14.5) (2023-02-05)
### Bug Fixes
* **bug:** fixed faq accordion answer not taking entire width ([a952dde](https://github.com/FrancescoXX/4c-site/commit/a952dde93138625cff7847e28fdd44588fb6bbfa))
## [0.14.4](https://github.com/FrancescoXX/4c-site/compare/v0.14.3...v0.14.4) (2023-01-28)
### Bug Fixes
* **homepage:** mobile responsiveness ([5652922](https://github.com/FrancescoXX/4c-site/commit/56529226283f011642c7f4f9c699e5a8d9a796be))
* **homepage:** remove deprecated frame ([752cb38](https://github.com/FrancescoXX/4c-site/commit/752cb38f687112810ab970208327171aa28d1190))
## [0.14.3](https://github.com/FrancescoXX/4c-site/compare/v0.14.2...v0.14.3) (2023-01-27)
### Bug Fixes
* **cards:** fixes for activity, blog card ([d69a4f4](https://github.com/FrancescoXX/4c-site/commit/d69a4f4a50ef6c0c41ea243bcdee075db67605ea))
* **cards:** removing extra code ([60dc4c4](https://github.com/FrancescoXX/4c-site/commit/60dc4c41e2a6dd56b346eaaccf3eb7c0d552f11d))
## [0.14.2](https://github.com/FrancescoXX/4c-site/compare/v0.14.1...v0.14.2) (2023-01-25)
### Bug Fixes
* **activemembers.js:** fix ([3dedc9d](https://github.com/FrancescoXX/4c-site/commit/3dedc9d29a5dd04da09fe39be41e94a261093ada))
## [0.14.1](https://github.com/FrancescoXX/4c-site/compare/v0.14.0...v0.14.1) (2023-01-24)
### Bug Fixes
* adding favicon ([d341718](https://github.com/FrancescoXX/4c-site/commit/d34171892c730dd471498fbc972ba8b001675270))
# [0.14.0](https://github.com/FrancescoXX/4c-site/compare/v0.13.6...v0.14.0) (2023-01-24)
### Features
* made navbar good ([7217471](https://github.com/FrancescoXX/4c-site/commit/7217471a9544083feb1dff2c369ac6653fae2cf7))
## [0.13.6](https://github.com/FrancescoXX/4c-site/compare/v0.13.5...v0.13.6) (2023-01-20)
### Bug Fixes
* fix lint error ([08331f0](https://github.com/FrancescoXX/4c-site/commit/08331f0adf623c54e4accea8b482cd940b8ead94))
* lint ([f523c99](https://github.com/FrancescoXX/4c-site/commit/f523c9971410381127c8e3a6e671d171cf52756a))
* lint error ([0b2019f](https://github.com/FrancescoXX/4c-site/commit/0b2019fab89422fb1e968a62ca1dd54b745b643b))
## [0.13.5](https://github.com/FrancescoXX/4c-site/compare/v0.13.4...v0.13.5) (2023-01-18)
### Bug Fixes
* activities card width fixed for md lg xl device ([505a607](https://github.com/FrancescoXX/4c-site/commit/505a6078840804df630191c054252f353aed06cf))
## [0.13.4](https://github.com/FrancescoXX/4c-site/compare/v0.13.3...v0.13.4) (2023-01-17)
### Bug Fixes
* activities card design improvd and card broke fixed" ([12c1ce7](https://github.com/FrancescoXX/4c-site/commit/12c1ce72287be676322feaf83c1311addf67383b))
## [0.13.3](https://github.com/FrancescoXX/4c-site/compare/v0.13.2...v0.13.3) (2023-01-14)
### Bug Fixes
* **readme:** fix readme ([d3954ef](https://github.com/FrancescoXX/4c-site/commit/d3954ef11059d598069bb14af6e360c0de606ad6))
## [0.13.2](https://github.com/FrancescoXX/4c-site/compare/v0.13.1...v0.13.2) (2023-01-14)
### Bug Fixes
* **readme:** fix readme ([57ce88d](https://github.com/FrancescoXX/4c-site/commit/57ce88d446443eff2bc7ab4c1962ca75c277f384))
* **readme:** fix readme ([5895762](https://github.com/FrancescoXX/4c-site/commit/5895762c735b5915b218d41d53ce0407097c2b88))
## [0.13.1](https://github.com/FrancescoXX/4c-site/compare/v0.13.0...v0.13.1) (2023-01-09)
### Bug Fixes
* **fix responsivenes:** responsivenes and image width changed for a better look ([b50c5a5](https://github.com/FrancescoXX/4c-site/commit/b50c5a56acd453a0bbf052a143a4409e33d9128a))
* **video page:** fixed videos page responsivenes by addjusting and adding tailwind classes ([4bc85ef](https://github.com/FrancescoXX/4c-site/commit/4bc85ef962e968e63a86dc0f99ca5f3212d058d2)), closes [#578](https://github.com/FrancescoXX/4c-site/issues/578)
# [0.13.0](https://github.com/FrancescoXX/4c-site/compare/v0.12.0...v0.13.0) (2023-01-08)
### Features
* remove tobiloba's event ([147114e](https://github.com/FrancescoXX/4c-site/commit/147114eae048f249bbe0d436f1282ea21303e57e))
# [0.12.0](https://github.com/FrancescoXX/4c-site/compare/v0.11.0...v0.12.0) (2023-01-08)
### Features
* super performance 4c (nuke) ([75e617f](https://github.com/FrancescoXX/4c-site/commit/75e617f077db1c0b33f50291cf1f2cd7e6e68456))
# [0.11.0](https://github.com/FrancescoXX/4c-site/compare/v0.10.0...v0.11.0) (2023-01-05)
### Features
* github magic (1/2) ([480c1fa](https://github.com/FrancescoXX/4c-site/commit/480c1fa1cfacab19cf83705a7fbd1bce8e1ab673))
* gitthub magic (2/2) ([9f106c2](https://github.com/FrancescoXX/4c-site/commit/9f106c2be67612afdcdf639ef7e49ff0a7ce8cef))
================================================
FILE: CODE_OF_CONDUCT.md
================================================
# Contributor Covenant Code of Conduct
## Our Pledge
We as members, contributors, and leaders pledge to make participation in our
community a harassment-free experience for everyone, regardless of age, body
size, visible or invisible disability, ethnicity, sex characteristics, gender
identity and expression, level of experience, education, socio-economic status,
nationality, personal appearance, race, caste, color, religion, or sexual
identity and orientation.
We pledge to act and interact in ways that contribute to an open, welcoming,
diverse, inclusive, and healthy community.
## Our Standards
Examples of behavior that contributes to a positive environment for our
community include:
* Demonstrating empathy and kindness toward other people
* Being respectful of differing opinions, viewpoints, and experiences
* Giving and gracefully accepting constructive feedback
* Accepting responsibility and apologizing to those affected by our mistakes,
and learning from the experience
* Focusing on what is best not just for us as individuals, but for the overall
community
Examples of unacceptable behavior include:
* The use of sexualized language or imagery, and sexual attention or advances of
any kind
* Trolling, insulting or derogatory comments, and personal or political attacks
* Public or private harassment
* Publishing others' private information, such as a physical or email address,
without their explicit permission
* Other conduct which could reasonably be considered inappropriate in a
professional setting
## Enforcement Responsibilities
Community leaders are responsible for clarifying and enforcing our standards of
acceptable behavior and will take appropriate and fair corrective action in
response to any behavior that they deem inappropriate, threatening, offensive,
or harmful.
Community leaders have the right and responsibility to remove, edit, or reject
comments, commits, code, wiki edits, issues, and other contributions that are
not aligned to this Code of Conduct, and will communicate reasons for moderation
decisions when appropriate.
## Scope
This Code of Conduct applies within all community spaces, and also applies when
an individual is officially representing the community in public spaces.
Examples of representing our community include using an official e-mail address,
posting via an official social media account, or acting as an appointed
representative at an online or offline event.
## Enforcement
Instances of abusive, harassing, or otherwise unacceptable behavior may be
reported to the community leaders responsible for enforcement in the
[Discord community](https://4c.rocks/join).
All complaints will be reviewed and investigated promptly and fairly.
All community leaders are obligated to respect the privacy and security of the
reporter of any incident.
## Enforcement Guidelines
Community leaders will follow these Community Impact Guidelines in determining
the consequences for any action they deem in violation of this Code of Conduct:
### 1. Correction
**Community Impact**: Use of inappropriate language or other behavior deemed
unprofessional or unwelcome in the community.
**Consequence**: A private, written warning from community leaders, providing
clarity around the nature of the violation and an explanation of why the
behavior was inappropriate. A public apology may be requested.
### 2. Warning
**Community Impact**: A violation through a single incident or series of
actions.
**Consequence**: A warning with consequences for continued behavior. No
interaction with the people involved, including unsolicited interaction with
those enforcing the Code of Conduct, for a specified period of time. This
includes avoiding interactions in community spaces as well as external channels
like social media. Violating these terms may lead to a temporary or permanent
ban.
### 3. Temporary Ban
**Community Impact**: A serious violation of community standards, including
sustained inappropriate behavior.
**Consequence**: A temporary ban from any sort of interaction or public
communication with the community for a specified period of time. No public or
private interaction with the people involved, including unsolicited interaction
with those enforcing the Code of Conduct, is allowed during this period.
Violating these terms may lead to a permanent ban.
### 4. Permanent Ban
**Community Impact**: Demonstrating a pattern of violation of community
standards, including sustained inappropriate behavior, harassment of an
individual, or aggression toward or disparagement of classes of individuals.
**Consequence**: A permanent ban from any sort of public interaction within the
community.
## Attribution
This Code of Conduct is adapted from the [Contributor Covenant][homepage],
version 2.1, available at
[https://www.contributor-covenant.org/version/2/1/code_of_conduct.html][v2.1].
Community Impact Guidelines were inspired by
[Mozilla's code of conduct enforcement ladder][Mozilla CoC].
For answers to common questions about this code of conduct, see the FAQ at
[https://www.contributor-covenant.org/faq][FAQ]. Translations are available at
[https://www.contributor-covenant.org/translations][translations].
[homepage]: https://www.contributor-covenant.org
[v2.1]: https://www.contributor-covenant.org/version/2/1/code_of_conduct.html
[Mozilla CoC]: https://github.com/mozilla/diversity
[FAQ]: https://www.contributor-covenant.org/faq
[translations]: https://www.contributor-covenant.org/translations
================================================
FILE: CONTRIBUTING.md
================================================
# ✨ Contributing to this project
First of all, thanks for taking the time to contribute! 🎉👍
## 💣 Reporting Bugs
This section guides you through submitting a bug report. Following these guidelines helps maintainers and the community understand your report 📝, reproduce the behavior 💻, and find related reports. 🔎
Since the new GitHub Issue forms, we only suggest you include the most information possible. But you can also **Perform a [cursory search](https://github.com/FrancescoXX/4c-site/issues)** to see if the report/request has already been raised. If it has, adds a comment to the existing issue instead of opening a new one.
> **Note:** If you find a **Closed** issue that seems like it is the same thing that you're experiencing, open a new issue and include a link to the original issue in the body of your new one.
### How Do I Submit A (Good) Bug Report?
Explain the problem and include additional details to help maintainers reproduce the problem:
- **Use a clear and descriptive title** for the issue to identify the problem.
- **Describe the exact steps which reproduce the problem** in as many details as possible.
- **Describe the behavior you observed after following the steps** and point out what exactly is the problem with that behavior.
- **Explain which behavior you expected to see instead and why.**
- **Include screenshots or animated GIFs** which show you following the described steps and clearly demonstrate the problem. If you use the keyboard while following the steps, use [this tool](https://www.cockos.com/licecap/) to record GIFs on macOS and Windows, and [this tool](https://github.com/colinkeenan/silentcast) or [this tool](https://gitlab.gnome.org/Archive/byzanz) on Linux.
## 🛠 Suggesting Enhancements
Feature requests are tracked as [GitHub issues](https://guides.github.com/features/issues/). Create an issue on that repository and provide the following information:
- **Use a clear and descriptive title** for the issue to identify the suggestion.
- **Provide a in detail description of the suggested enhancement** in as many details as possible.
- **Explain why this enhancement would be useful** to the website and the community.
## 📝 Cloning the project & creating PR
### Fork the repository.
Click on the fork button on the top of the page. This will create a copy of this repository in your account. Instead click [here](https://github.com/FrancescoXX/4c-site/fork) to fork the repository.
### Clone the forked repository.
```bash
git clone https://github.com/<your-username>/4c-site.git
```
or if use the github cli
```bash
gh repo clone <your-username>/4c-site
```
### Navigate to the project directory.
```bash
cd 4c-site
```
### Create a new branch (naming convention: type-description-issueNo)
Kindly give your branch a more descriptive name like `docs-contributing-guide-2` instead of `patch-1`.
You could follow this convention. Some ideas to get you started:
- Feature Updates: `feat-<brief 2-3 words-Description>-<ISSUE_NO>`
- Bug Fixes: `fix-<brief 2-3 words-Description>-<ISSUE_NO>`
- Documentation: `docs-<brief 2-3 words-Description>-<ISSUE_NO>`
- And so on...
To create a new branch, use the following command:
```bash
git checkout -b your-branch-name
```
### Make the necessary changes.
### Stage your changes and commit.
```bash
git add . # Stages all the changes
git commit -m "<your_commit_message>"
```
Your commit message should be something which gives concise idea of the issue you are solving.
We implement the Conventional Commits specification for commit messages. This specification is a lightweight convention on top of commit messages. It provides an easy set of rules for creating an explicit commit history; which makes it easier to write automated tools on top of. This convention dovetails with SemVer, by describing the features, fixes, and breaking changes made in commit messages.
The commit message should be structured as follows:
```bash
<type>(optional scope): <description>
```
If you are not sure about how to structure your commit message, you can use the following command:
```bash
npm run commit
```
### Push your local commits to the remote repository.
```bash
git push origin your-branch-name
```
**8.** Create a new [pull request](https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/creating-a-pull-request) from `your-branch-name`
🎉 Congratulations! You've made your first pull request! Now, you should just wait until the maintainers review your pull request.
## ✨ Understanding the project
The project is divided into two main folders:
- `src` - This folder contains all the code related to the website.
- `docs` - This folder contains everything related to the 4C community
### `src` folder
The `src` folder contains all the code related to the website. The website is built using [Next.js](https://nextjs.org/), a React framework. The website is hosted on [Vercel](https://vercel.com/).
The source code is divided into two main folders:
- `pages` - This folder contains all the pages of the website.
- `components` - This folder contains all the components of the website.
I suggest you to read the [Next.js documentation](https://nextjs.org/docs) to understand the project structure.
To run the website locally, you need to install the dependencies and run the development server:
```bash
npm i -g yarn # Install yarn
yarn # Install dependencies
yarn dev # Run the development server
```
### `docs` folder
This folder contains markdown files describing the design of the main website and some detail about the 4C community
================================================
FILE: LICENSE
================================================
MIT License
Copyright (c) 2021 - Present, Francesco Ciulla
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
================================================
FILE: README.md
================================================
# 4C (The Cool Community of Content Creators)
Imagine **The Cool Community For Content Creators** or **4C**, as a chill coffee shop (cooler even 💣). An inclusive and helpful environment, where we help content creators reach their goals by sharing experiences.
Gain access to exclusive talks/workshops with popular content creators, and hence, opportunities to collaborate.
We have games too! 🎮
## 👋 Join Us :
Join our amazing community on Discord and Twitter.
<a href="https://discord.com/invite/cRjhjFRRre"><img src="https://cdn.worldvectorlogo.com/logos/discord-6.svg" title="Discord" alt="Discord Community" width="40"/></a><a href="https://twitter.com/4ccommunityhq"><img src="https://worldvectorlogo.com/logo/twitter-logo-2" title="Twitter" alt="Twitter Account" width="40"/></a>
<br>
<img src="https://raw.githubusercontent.com/FrancescoXX/4c-site/main/src/assets/banner.jpg" alt="4C logo">
## 📷 Website overview
This repository concerns the 4C community [website](https://www.4c.rocks/). Visit the website to stay up to date with community members' projects, active members, and other amazing content!
## 🎉 Want to contribute?
Whether you are a community member or not, we would love your point of view! Feel free to first check out our [code of conduct](https://github.com/FrancescoXX/4c-site/blob/main/CODE_OF_CONDUCT.md) and also the [contribution guidelines](https://github.com/FrancescoXX/4c-site/blob/main/CONTRIBUTING.md) for any missing steps.
### 💻 For Contributors
#### 🔖 Tech Stack
The code base of this repo uses
- [NextJS](https://nextjs.org/)
- [TailwindCSS](https://tailwindcss.com/)
For contributing to the code, you will need
- [Node](https://nodejs.org/en/) installed on your computer.
- Basic knowledge of [Git](https://git-scm.com/)
#### 🔖 Contribution steps
You can directly work on this project on Gitpod!
[](https://gitpod.io/#https://github.com/FrancescoXX/4c-site)
Or, to work on it locally,
1. [Fork](https://github.com/FrancescoXX/4c-site) this repository
2. Clone the repo
```console
$ git clone git@github.com:<your github username>/4c-site.git
```
3. Navigate to the cloned directory
```console
$ cd 4c-site
```
4. Install dependencies
```console
$ npm install
```
5. Start the project on `localhost`
```console
$ npm run dev
```
##### Troubleshooting
In the course of trying to set up the project locally, if you come across an error that says `PWA is not supported`, you can try the following steps below to fix it;
> For Linux or Mac 👇
1. Go to 4c-site folder using `cd 4c-site`
2. In the terminal,
```console
$ export NODE_OPTIONS=--openssl-legacy-provider
```
3. If you get an error in the above code then use the option below
```console
$ unset NODE_OPTIONS=""
```
4. Start the development server with
```console
$ npm run dev
```
> For Windows 👇
1. Go to 4c-site folder using `cd 4c-site`
2. In the terminal,
```console
$ set NODE_OPTIONS=--openssl-legacy-provider
```
3. Start the development server with
```console
$ npm run dev
```
In order to run this project locally, you might require some additional configurations, such as downgrading your `node` version to v16.
You may get an error similar to this:
To fix this, downgrade your `node` version to v16. Here is a simple way of doing that with the [`nvm` node version manager](https://github.com/nvm-sh/nvm):
1. Download and install `nvm`. Use [nvm-setup.exe](https://github.com/coreybutler/nvm-windows/releases) for windows, or [install.sh](https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install.sh) on other systems.
2. Install version v16
```console
$ nvm install 16.16.0
```
3. Make your system use version 16 of node
```console
$ nvm use 16.16.0
```
To check if everything has worked, restart your shell and run `node -v`. The output should be `v16.16.0`. If it is, you can continue working on the project!
#### Run commit
```console
$ git commit -m <Commit-message>
```
#### 🔖 Adding a project to the project page
> Note: _The project page is reserved to display projects for community members only. Each member can put up only one project._
To add your project to the project page, head over to the [`/data`](https://github.com/FrancescoXX/4c-site/tree/main/src/data) directory, and subsequently, the `projects.json` file. There, you will find objects for each project.
For example,
```json
{
"name": "Francesco Ciulla",
"title": "FREE Web3 Resources",
"screenshot": "https://user-images.githubusercontent.com/18360871/199210192-f5599a23-f0b1-49ff-9c52-2554a72a2c14.png",
"description": "A list of resources to learn Web3 for FREE",
"link": "https://github.com/FrancescoXX/free-Web3-resources",
"twitter": "https://twitter.com/FrancescoCiull4",
"live_link": "https://www.freeweb3resources.com",
"stack": ["React", "CSS", "Solidity"]
}
```
- Create a new object similar to the one above.
- Follow the example above and create project details like;
- Your name
- The project's title
- A screenshot
- A short description
- A link to the GitHub repo (If it is open source)
- A link to your Twitter profile
- A live link to the project.
- Open a pull request 👍
---
Notice anything odd and/or missing from this README or on the website itself? Feel free to raise an [issue](https://github.com/FrancescoXX/4c-site/issues).
Join the amazing [4C community](https://discord.com/invite/cRjhjFRRre) on discord, and follow us on [Twitter](https://twitter.com/4ccommunityhq) to stay in the loop.
# 🔑 License
This repository is under the [MIT](./LICENSE) license.
Please leave a star ⭐️ All support is highly appreciated.
================================================
FILE: commitlint.config.js
================================================
module.exports = { extends: ["@commitlint/config-conventional"] }
================================================
FILE: docs/theme/README.md
================================================
# 💎 4C style guide
## Introduction
This document is a guide to the 4C style guide. It contains all the information you need to know about the 4C brand, colors, typography, and more.
## About 4C
4C is a community of creators, where you can connect with other like-minded creators, collaborate on ideas, and motivate each other to create and publish!
Our community is focused on supporting content creators in general across all social media platforms. We are a community of creators, by creators, for creators.
Our goal is to create a decentralized community, where everyone contributes to its growth, and that growth echoes back positively to every individual creator in the community.
## Assets
### 4C Logo
#### Square Variation
### Banner
## Typography
Font Family: `Poppins`
| Name | Weight |
| -------------------- | --------- |
| `Headings(h1,h2)` | `Bold` |
| `Subheadings(h3,h4)` | `Medium` |
| `Body Text` | `Regular` |
Type scale: Following Tailwind CSS type scale system
## Colors
### 4C Brand Colors
<table>
<tr>
<td><img src="http://placehold.jp/030e2c/ffffff/80x80.png?text=%20"> <br>#030e2c</td>
<td><img src="http://placehold.jp/718fe9/ffffff/80x80.png?text=%20"> <br>#718fe9</td>
<td><img src="http://placehold.jp/5fbec4/ffffff/80x80.png?text=%20"> <br>#5fbec4</td>
<td><img src="http://placehold.jp/49127b/ffffff/80x80.png?text=%20"> <br>#49127b</td>
<td><img src="http://placehold.jp/708fe6/ffffff/80x80.png?text=%20"> <br>#708fe6</td>
</tr>
</table>
### 4C Gradient CSS code
```css
linear-gradient( 34deg, rgba(68, 18, 115, 1) 0%, rgba(5, 30, 75, 1) 21%, rgba(52, 79, 141, 1) 58%, rgba(106, 137, 223, 1) 80%, rgba(145, 227, 226, 1) 99% );
```
<img src="https://ik.imagekit.io/u33i3sss0/4c/4c_gradient_iEc5YnyaL.png?ik-sdk-version=javascript-1.4.3&updatedAt=1669915186734" alt="4C gradient">
## Buttons
### Call to Action Buttons
<img src="https://ik.imagekit.io/u33i3sss0/4c/Screenshot_2022-12-01_at_12-46-50_4C_-_Creator_Community_RFydcD8tX.png?ik-sdk-version=javascript-1.4.3&updatedAt=1669916827713" alt="4C cta button">
### Call to Action Guidelines
| Style | Values |
| --------------------------- | -------------------------------------- |
| `padding-left` | `2rem` |
| `padding-right` | `2rem` |
| `padding-top` | `0.75rem` |
| `display` | `inline-flex` |
| `align-items` | `center` |
| `justify-content` | `center` |
| `gap` | `0.5rem` |
| `background-color` | `rgb(17 24 39 / var(--tw-bg-opacity))` |
| `font-weight` | `500` |
| `border-radius` | `9999px` |
| `border-bottom-left-radius` | `0px` |
### NavBar Buttons
<img src="https://ik.imagekit.io/u33i3sss0/4c/Screenshot_2022-12-01_at_14-42-11_4C_-_Creator_Community_is2hpLuyR.png?ik-sdk-version=javascript-1.4.3&updatedAt=1669923773411" alt="4C cta button">
### NavBar Button Guidelines
| Style | Values |
| ------------------ | -------- |
| `padding-left` | `1rem` |
| `padding-right` | `1rem` |
| `padding-top` | `0.5rem` |
| `padding-bottom` | `0.5rem` |
| `background-color` | `white` |
| `font-weight` | `bold` |
| `color` | `black` |
## Effects
### Shadows
```css
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(
--tw-ring-shadow,
0 0 #0000
), var(--tw-shadow);
```
### Transitions
```css
transition: PROPERTY_ANIMATING 150ms ease-out;
```
================================================
FILE: jsconfig.json
================================================
{
"compileOnSave": true,
"compilerOptions": {
"baseUrl": "src/",
"rootDir": ".",
"declaration": true,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"esModuleInterop": true,
"experimentalDecorators": true,
"forceConsistentCasingInFileNames": true,
"importHelpers": true,
"skipLibCheck": true,
"skipDefaultLibCheck": true,
"sourceMap": false,
"strict": true,
"strictNullChecks": true,
"jsx": "react"
},
"buildOptions": {
"incremental": true
}
}
================================================
FILE: next.config.mjs
================================================
import million from 'million/compiler';
/** @type {import("next").NextConfig} */
const nextConfig = {
images: {
domains: ["avatars.githubusercontent.com", "user-images.githubusercontent.com", "cdn.discordapp.com", "i.ibb.co", "i.postimg.cc", "images2.imgbox.com", "raw.githubusercontent.com", "img.youtube.com"],
formats: ["image/webp"],
unoptimized: process.env.NODE_ENV === "development",
},
async redirects() {
return [
{
destination: "https://discord.com/invite/TcmA2kbJeA",
source: "/join",
permanent: true,
},
]
},
}
const millionConfig = {
auto: true,
// if you're using RSC:
// auto: { rsc: true },
}
export default million.next(nextConfig, millionConfig);
================================================
FILE: package.json
================================================
{
"name": "4c",
"version": "0.0.0",
"private": true,
"description": "4C Community: Website, Media Kit and More",
"homepage": "https://4c.rocks",
"bugs": {
"url": "https://github.com/FrancescoXX/4c-site/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc"
},
"license": "MIT",
"author": "4C Community",
"scripts": {
"build": "next build",
"commit": "commit",
"dev": "next dev",
"lint": "eslint \"src/**/**/*.{js,json,jsx,ts,tsx}\"",
"lint:fix": "yarn lint --fix",
"prepare": "husky install",
"release": "semantic-release",
"start": "next start"
},
"dependencies": {
"@next/font": "^13.1.1",
"@tailwindcss/line-clamp": "^0.4.2",
"@tailwindcss/typography": "^0.5.8",
"autoprefixer": "^10.4.13",
"axios": "^1.2.2",
"azelf": "^1.1.0",
"classnames": "^2.3.2",
"formik": "^2.2.9",
"framer-motion": "^8.1.4",
"million": "^2.6.0-beta.13",
"multiselect-react-dropdown": "^2.0.25",
"next": "^13.1.1",
"next-seo": "^5.15.0",
"postcss": "^8.4.20",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-icons": "^4.12.0",
"react-toastify": "^9.1.1",
"sharp": "^0.31.3",
"tailwindcss": "^3.2.4",
"yup": "^0.32.11"
},
"devDependencies": {
"@commitlint/cli": "^17.3.0",
"@commitlint/config-conventional": "^17.3.0",
"@commitlint/prompt-cli": "^17.3.0",
"@semantic-release/changelog": "^6.0.2",
"@semantic-release/commit-analyzer": "^9.0.2",
"@semantic-release/git": "^10.0.1",
"@semantic-release/github": "^8.0.7",
"@semantic-release/release-notes-generator": "^10.0.3",
"@types/eslint": "^8.4.10",
"@types/node": "^18.11.18",
"@types/react": "^18.0.26",
"@typescript-eslint/eslint-plugin": "^5.48.0",
"@typescript-eslint/parser": "^5.48.0",
"cz-conventional-changelog": "^3.3.0",
"eslint": "^8.31.0",
"eslint-config-next": "^13.1.1",
"eslint-config-standard": "^17.0.0",
"eslint-config-standard-with-typescript": "^26.0.0",
"eslint-plugin-const-case": "^1.2.2",
"eslint-plugin-diff": "^2.0.1",
"eslint-plugin-editorconfig": "^4.0.2",
"eslint-plugin-eslint-comments": "^3.2.0",
"eslint-plugin-filenames": "^1.3.2",
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-json-format": "^2.0.1",
"eslint-plugin-jsx-a11y": "^6.6.1",
"eslint-plugin-n": "^15.0.0",
"eslint-plugin-promise": "^6.0.0",
"eslint-plugin-react": "^7.31.11",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-simple-import-sort": "^8.0.0",
"eslint-plugin-tailwindcss": "^3.8.0",
"husky": "^8.0.3",
"semantic-release": "^19.0.5",
"typescript": "^4.9.4",
"yarn": "^1.22.19"
},
"config": {
"commitizen": {
"path": "./node_modules/cz-conventional-changelog"
}
}
}
================================================
FILE: postcss.config.js
================================================
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}
================================================
FILE: renovate.json
================================================
{
"extends": [
"config:recommended"
],
"packageRules": [
{
"matchUpdateTypes": [
"minor",
"patch"
],
"automerge": false
}
],
"timezone": "America/Toronto",
"schedule": [
"After 11:30pm"
]
}
================================================
FILE: src/4c.config.js
================================================
module.exports = {
siteName: "4C",
title: {
short: "4C",
long: "4C - Creator Community",
},
description: {
short: "The Cool Community For Content Creators",
long: "The Cool Community For Content Creators or 4C is a community where different content creator from every domain have come together to help each other and grow.",
},
url: "https://www.4c.rocks/",
logo: "https://www.4c.rocks/logo.jpg", // Relative public path to Base URL or Absolute Path
ogImage: "https://www.4c.rocks/_next/static/media/logo.9b920fc5.png",
favicon: "/favicon.ico",
}
================================================
FILE: src/components/ActiveMembers.js
================================================
import React, { useState } from "react"
import GetActivemembers from "components/GetActivemembers"
import Users from "components/Users"
// import contributors data
import activeMembers from "data/activemembers"
import Title from "components/Title"
import { FilterUsers } from "utils/filterUsers"
const ActiveMembers = () => {
// state for currentUsers
const [currentUsers, setCurrentUsers] = useState(activeMembers)
// filter handler
const searchHandler = (event) => {
event.preventDefault()
const filterdUsers = FilterUsers(
activeMembers,
event.target.value,
)
setCurrentUsers(filterdUsers)
}
const [tab] = useState("Active Members")
return (
<div className="mt-[3em] flex items-center justify-center">
<section className="max-w-bodyContainer flex-1 text-center font-bold text-white">
<Title heading="Active Members" />
<div className="flex items-center justify-center ">
<div className="break:w[500px] relative m-auto flex max-w-[800px] self-center mobile:mx-10 laptop:w-[600px] bigScreen:w-[800px]">
<input
placeholder="Search here"
className="h-10 w-full border-slate-200 px-5 py-3 text-white outline-none placeholder:text-slate-700 contrast-more:border-slate-400 contrast-more:placeholder:text-slate-500 rounded-3xl bg-white bg-opacity-[.2] p-8 shadow backdrop-blur-3xl"
onInput={searchHandler}
/>
<svg
xmlns="http://www.w3.org/2000/svg"
className="absolute right-3 top-1/2 h-5 w-5 -translate-y-1/2 rotate-90 text-white sm:text-slate-400"
fill="none"
viewBox="0 0 24 24"
stroke="#000000"
strokeWidth={2}
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
/>
</svg>
</div>
</div>
{currentUsers.length
? <div className="m-2 flex flex-wrap items-center justify-center overflow-y-auto pb-4">
{tab === "Active Members"
? (
<GetActivemembers users={currentUsers} />
)
: (
<Users users={currentUsers} />
)}
</div>
: <p className="mt-3">User does not exist!</p>}
</section>
</div>
)
}
export default ActiveMembers
================================================
FILE: src/components/BlogCard.js
================================================
import React from "react"
import { FaTwitter, FaLink } from "react-icons/fa"
import blogs from "data/blog"
import Image from "next/image"
const styles = "transition-all ease-in cursor-pointer"
const BlogCard = () => {
return (
<section className="flex w-full flex-wrap items-center justify-center p-4 sm:p-10">
{blogs.map((blog, index) => (
<div
key={index}
className="hov-bg-theme m-5 h-full w-[330px] rounded-xl bg-[#f1f5f9] p-5 text-black shadow-md transition-all ease-out hover:-translate-y-1 xl:w-[380px]"
>
<div className="flex justify-between text-2xl">
<a href={blog.twitter} target="_blank" rel="noreferrer">
<FaTwitter className={styles} />
</a>
<a href={blog.link} target="_blank" rel="noreferrer">
<FaLink className={styles} />
</a>
</div>
<div>
<h2 className="title my-10 text-2xl">{blog.title}</h2>
</div>
<a href={blog.link} target="_blank" rel="noreferrer">
<Image
alt={`Screenshot of ${blog.title}`}
className="rounded-md object-contain "
src={blog.screenshot}
height={320}
width={568.87}
/>
</a>
<div>
<p className="mt-5 text-[18px] leading-6 text-black/80 line-clamp-2">
{blog.description}
</p>
</div>
</div>
))}
</section>
)
}
export default BlogCard
================================================
FILE: src/components/CommunityPartners.js
================================================
import Image from "next/image"
import Link from "next/link"
import React from "react"
import partnerCommunities from "../data/partnerCommunities.json"
function CommunityPartners() {
return (
<div className="container text-white flex items-center justify-center mt-20 mb-10">
<div className="p-3 max-w-bodyContainer w-full">
<header className="text-4xl font-semibold text-center">
Community Partners
</header>
<p className="text-center text-sm mt-2 italic">
Other great communities we collaborate with
</p>
<div className="flex items-center justify-center mt-8">
{partnerCommunities.map((community) => (
<div key={community.community_name} className="flex">
<div>
<Link href={community.website}>
<Image
src={community.logo}
alt={community.community_name}
width={100}
height={100}
className="object-contain transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-300"
/>
</Link>
</div>
<div className="flex items-center justify-center px-6 ">
<div>
<h1 className="text-2xl">{community.community_name}</h1>
<h3>{community.sub_desc}</h3>
<p>{community.bio}</p>
</div>
</div>
</div>
))}
</div>
</div>
</div>
)
}
export default CommunityPartners
================================================
FILE: src/components/FaqAccordian.js
================================================
import React, { useState } from "react"
import { AnimatePresence, motion } from "framer-motion"
import { IoIosArrowDown } from "react-icons/io"
const FaqAccordian = ({ faq }) => {
const [isOpen, setIsOpen] = useState(false)
return (
<li className="flex items-center justify-center w-9/12 mb-8 flex-column sm:w-9/12 md:w-8/12 lg:w-1/2">
<div
onClick={() => setIsOpen(!isOpen)}
onKeyDown={() => setIsOpen(!isOpen)}
tabIndex={0}
role="button"
className={`w-full p-8 rounded shadow cursor-pointer details backdrop-blur-lg ${
isOpen ? "bg-white/30" : "bg-white/20"
}`}
>
<p className="relative flex items-center justify-between pr-4 text-base font-bold leading-none text-white list-none">
<span>{faq.questions}</span>
<IoIosArrowDown
className={`text-2xl duration-200 ${
isOpen && "rotate-180"
}`}
/>
</p>
<AnimatePresence>
{isOpen && (
<motion.p
initial={{ opacity: 0, height: 0, marginTop: 0 }}
animate={{ opacity: 1, height: "auto", marginTop: 12 }}
exit={{ opacity: 0, height: 0, margin: 0 }}
className={"overflow-hidden text-base leading-normal text-white"}
>
{faq.answers}
</motion.p>
)}
</AnimatePresence>
</div>
</li>
)
}
export default FaqAccordian
================================================
FILE: src/components/Footer.jsx
================================================
import React from "react"
import { FaDiscord, FaGithub, FaLinkedin } from "react-icons/fa"
import { FaXTwitter } from "react-icons/fa6"
function Footer() {
return (
<footer className="md:max-md flex flex-col items-center gap-4 bg-[#0d1117] p-4 py-8 text-center text-white/80 footer">
<div className="flex items-center">
<div className="flex gap-10">
<a
className="text-2xl hover:text-white"
href="https://github.com/FrancescoXX/4c-site"
rel="noreferrer"
target="_blank"
>
<span className="sr-only">
Github Repository
</span>
<FaGithub aria-hidden="true" />
</a>
<a
className="text-2xl hover:text-white"
href="https://discord.com/invite/TcmA2kbJeA"
rel="noreferrer"
target="_blank"
>
<span className="sr-only">
Discord Server
</span>
<FaDiscord aria-hidden="true" />
</a>
<a
className="text-2xl hover:text-white"
href="https://twitter.com/4ccommunityhq"
rel="noreferrer"
target="_blank"
>
<span className="sr-only">
X
</span>
<FaXTwitter aria-hidden="true" />
</a>
<a
className="text-2xl hover:text-white"
href="https://www.linkedin.com/company/4ccommunity/about/"
rel="noreferrer"
target="_blank"
>
<span className="sr-only">
LinkedIn
</span>
<FaLinkedin aria-hidden="true" />
</a>
</div>
</div>
<p className="md:max-md: text-xs font-medium text-white/80">
4C | Developed by 4C Community ©
{" "}
{new Date().getFullYear()}
</p>
</footer>
)
}
export default Footer
================================================
FILE: src/components/Form/JoinUsForm.js
================================================
import React from "react"
import router from "next/router"
import { useFormik } from "formik"
import { formSchema } from "components/Form/validation/formSchema"
import Loading from "components/Loading"
import Axios from "axios"
const JoinusForm = () => {
const formik = useFormik({
initialValues: {
fullName: "",
email: "",
github: "",
twitter: "",
question1: "",
question2: "",
question3: "",
},
validationSchema: formSchema,
})
const [loading, setLoading] = React.useState(false)
const handleSubmit = () => {
// console.log(formik.values);
setLoading(true)
Axios.post(process.env.NEXT_PUBLIC_SHEETS_API, formik.values)
.then(function() {
setLoading(false)
alert("Thank you!! Your form has been submitted successfully!!")
router.push("/")
})
.catch(function(error) {
setLoading(false)
alert(error.message)
})
}
return (
<div className="container mx-auto">
<div className="mx-auto my-10 max-w-xl rounded-md bg-white p-5 shadow-sm">
<div className="pb-10 text-center">
<h1 className="my-3 text-base font-normal text-gray-700">
4C is a community to connect with other like-minded creators,
collaborate on ideas, and motivate each other to create and publish!
</h1>
</div>
<div>
<form id="loginform" onSubmit={formik.handleSubmit}>
<div className="mb-4">
<label
htmlFor="name"
className="ml-2 block text-left text-sm text-gray-600"
>
Full Name
</label>
<input
type="text"
name="fullName"
placeholder="John Doe"
className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm text-black placeholder:text-gray-300 focus:border-indigo-300 focus:outline-none focus:ring focus:ring-indigo-100"
onChange={formik.handleChange}
/>
{formik.errors.fullName && (
<p className="mt-2 ml-2 block text-left text-sm text-red-600 dark:text-red-500">
<span className="font-medium">{formik.errors.fullName}</span>
</p>
)}
</div>
<div className="mb-4">
<label
htmlFor="email"
className="ml-2 block text-left text-sm text-gray-600"
>
Email Address
</label>
<input
type="email"
name="email"
id="email"
placeholder="you@email.com"
required
className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm text-black placeholder:text-gray-300 focus:border-indigo-300 focus:outline-none focus:ring focus:ring-indigo-100"
onChange={formik.handleChange}
/>
{formik.errors.email && (
<p className="mt-2 ml-2 block text-left text-sm text-red-600 dark:text-red-500">
<span className="font-medium">{formik.errors.email}</span>
</p>
)}
</div>
<div className="mb-4">
<label
htmlFor="github"
className="ml-2 block text-left text-sm text-gray-600"
>
Github Username
</label>
<input
type="text"
name="github"
id="github"
placeholder="@"
required
className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm text-black placeholder:text-gray-300 focus:border-indigo-300 focus:outline-none focus:ring focus:ring-indigo-100"
onChange={formik.handleChange}
/>
{formik.errors.github && (
<p className="mt-2 ml-2 block text-left text-sm text-red-600 dark:text-red-500">
<span className="font-medium">{formik.errors.github}</span>
</p>
)}
</div>
<div className="mb-4">
<label
htmlFor="twitter"
className="ml-2 block text-left text-sm text-gray-600"
>
Twitter Username
</label>
<input
type="text"
name="twitter"
id="twitter"
placeholder="@"
required
className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm text-black placeholder:text-gray-300 focus:border-indigo-300 focus:outline-none focus:ring focus:ring-indigo-100"
onChange={formik.handleChange}
/>
{formik.errors.twitter && (
<p className="mt-2 ml-2 block text-left text-sm text-red-600 dark:text-red-500">
<span className="font-medium">{formik.errors.twitter}</span>
</p>
)}
</div>
<div className="mb-4">
<label
htmlFor="message"
className="mb-2 ml-2 block text-left text-sm text-gray-600"
>
What do you know about 4C Community?{" "}
</label>
<textarea
rows="5"
name="question1"
id="question1"
placeholder="Your Message"
className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm text-black placeholder:text-gray-300 focus:border-indigo-300 focus:outline-none focus:ring focus:ring-indigo-100"
onChange={formik.handleChange}
required
></textarea>
{formik.errors.question1 && (
<p className="mt-2 ml-2 block text-left text-sm text-red-600 dark:text-red-500">
<span className="font-medium">{formik.errors.question1}</span>
</p>
)}
</div>
<div className="mb-4">
<label
htmlFor="message"
className="mb-2 ml-2 block text-left text-sm text-gray-600"
>
Why do you want to join our staff team?
</label>
<textarea
rows="5"
name="question2"
id="question2"
placeholder="Your Message"
className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm text-black placeholder:text-gray-300 focus:border-indigo-300 focus:outline-none focus:ring focus:ring-indigo-100"
onChange={formik.handleChange}
required
></textarea>
{formik.errors.question2 && (
<p className="mt-2 ml-2 block text-left text-sm text-red-600 dark:text-red-500">
<span className="font-medium">{formik.errors.question2}</span>
</p>
)}
</div>
<div className="mb-4">
<label
htmlFor="message"
className="mb-2 ml-2 block text-left text-sm text-gray-600"
>
Tell us something cool about yourself
</label>
<textarea
rows="5"
name="question3"
id="question3"
placeholder="Your Message"
className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm text-black placeholder:text-gray-300 focus:border-indigo-300 focus:outline-none focus:ring focus:ring-indigo-100"
onChange={formik.handleChange}
required
></textarea>
{formik.errors.question3 && (
<p className="mt-2 ml-2 block text-left text-sm text-red-600 dark:text-red-500">
<span className="font-medium">{formik.errors.question3}</span>
</p>
)}
</div>
<div className="mb-4">
{loading
? (
<Loading />
)
: (
<button
form="loginform"
onClick={handleSubmit}
className="w-full rounded-md bg-blue-500 px-2 py-4 text-sm text-white focus:bg-indigo-600 focus:outline-none"
type="submit"
>
Submit your application
</button>
)}
</div>
</form>
</div>
</div>
</div>
)
}
export default JoinusForm
================================================
FILE: src/components/Form/validation/formSchema.js
================================================
import * as Yup from "yup"
export const formSchema = Yup.object().shape({
email: Yup.string().email().required("Required"),
fullName: Yup.string().required("Required").min(3, "Too Short!"),
location: Yup.string().required("Required"),
github: Yup.string().required("Required"),
twitter: Yup.string().required("Required"),
question1: Yup.string().required("Required"),
question2: Yup.string().required("Required"),
question4: Yup.string().required("Required"),
})
================================================
FILE: src/components/GetActivemembers.js
================================================
import { motion, useReducedMotion } from "framer-motion"
import ProfileCard from "components/ProfileCard"
import React from "react"
const GetActivemembers = ({ users }) => {
const shouldReduceMotion = useReducedMotion()
const hoverAnimation = shouldReduceMotion
? {}
: {
zIndex: 1,
scale: [1, 1.1, 1.1],
}
return users.map((user, index) => (
<motion.div key={index} whileHover={hoverAnimation}>
<ProfileCard
username={user.name}
avatar={user.avatar}
socials={[
{ type: "github", username: user.github },
{ type: "twitter", username: user.twitter },
{ type: "youtube", username: user.youtube },
{ type: "twitch", username: user.twitch },
{ type: "blog", username: user.blogUrl },
{ type: "linkedin", username: user.linkedin },
]}
/>
</motion.div>
))
}
export default GetActivemembers
================================================
FILE: src/components/GetActivities.js
================================================
import eventList from "../data/events.json"
import Title from "./Title"
import { FaTwitter, FaDiscord } from "react-icons/fa"
import Image from "next/image"
const events = eventList.events
const styles = "transition-all ease-in cursor-pointer"
const GetActivities = () => (
<div style={{ marginTop: "50px" }} className="flex flex-col items-center">
<Title heading="Activities" />
<section className="flex justify-center sm:w-[500px] xl:w-auto p-4 sm:p-10">
{events.map((event, idx) => {
return (
event.isActive && (
<div
key={idx}
className="hov-bg-theme m-5 h-full w-[330px] rounded-xl bg-[#f1f5f9] p-5 text-black shadow-md transition-all ease-out hover:-translate-y-1 xl:w-[380px]"
>
<div>
<h2 className="title mt-5 text-2xl">{event.name}</h2>
<div className="w-full">
<p className="text-md text-[14px] text-gray-600 leading-[20px] mt-3">
By {event.organizer}{" "}
<span className="block sm:inline text-sm font-[600] text-black">
{event.date}
</span>{" "}
</p>
</div>
<Image
src={event?.image}
alt={event.name}
className="w-full mb-4 rounded-md object-cover my-4"
width={100}
height={100}
/>
<div className="flex justify-between text-2xl bottom-1 w-[100%]">
<a
href={event.link}
target="_blank"
className="bg-theme my-4 rounded-md flex h-14 w-full items-center justify-center bg-[#70b7e6] text-4xl text-white"
rel="noreferrer"
>
{event.venue === "Twitter"
? (
<FaTwitter className={styles} />
)
: (
<FaDiscord className={styles} />
)}
</a>
</div>
</div>
</div>
)
)
})}
</section>
</div>
)
export default GetActivities
================================================
FILE: src/components/GetProjects.js
================================================
import React, { useState, useEffect } from "react"
import allProjects from "data/projects.json"
import Title from "components/Title"
import stackList from "data/stacks.json"
import Multiselect from "multiselect-react-dropdown"
import Image from "next/image"
const multiselectRef = React.createRef()
const stacks = stackList.stack.map((stack) => stack.name)
const GetProjects = () => {
const [selected, setSelected] = useState([])
const [filteredProjects, setFilteredProjects] = useState([])
// get options from stacks
const options = []
for (let i = 0; i < stacks.length; i++) {
const obj = {}
obj.id = i
obj.value = stacks[i]
options.push(obj)
}
// useEffect for filtering the projects
useEffect(() => {
let arr = []
for (let i = 0; i < allProjects.projects.length; i++) {
for (let j = 0; j < selected.length; j++) {
if (allProjects.projects[i].stack?.includes(selected[j])) {
arr.push(allProjects.projects[i])
}
}
}
if (arr.length > 0) {
arr = [...new Set(arr)]
setFilteredProjects(arr)
} else {
setFilteredProjects(allProjects.projects)
}
}, [selected])
// get selected values in dropdown
function getSelectedValues() {
const items = multiselectRef.current.getSelectedItems()
const newArray = items.map((element) => element.value)
setSelected(newArray)
}
return (
<div className="mt-[3em] flex items-start justify-start">
<section className="flex-1 text-center text-white">
<Title heading="Projects" />
<p className="text-black/70 sm:text-white/70">
Projects by 4c community Members
</p>
<div className="flex items-center justify-center">
<div className="max-w-bodyContainer">
<div className="mx-4 mt-5 mb-10 flex list-none flex-col items-center justify-center gap-[2rem] lg:flex-row lg:gap-[0.6rem]">
<div className="py-2">
<div className="before-multiselect bg-[#FEFEFE] text-[#314c89] w-full border-slate-200 px-2 outline-none placeholder:text-slate-700 contrast-more:border-slate-400 contrast-more:placeholder:text-slate-500 rounded-3xl bg-opacity-[.2] shadow backdrop-blur-3xl flex items-center flex-row ">
<Multiselect
options={options}
displayValue={"value"}
selectedValues={options.selectedValues}
onSelect={getSelectedValues}
onRemove={getSelectedValues}
placeholder="Filter By Tech Stack"
ref={multiselectRef}
showCheckbox={true}
closeOnSelect={true}
avoidHighlightFirstOption={true}
/>
<svg
xmlns="http://www.w3.org/2000/svg"
className="searchIcon h-5 w-5 rotate-90 text-white sm:text-slate-400"
fill="none"
viewBox="0 0 24 24"
stroke="#000000"
strokeWidth={2}
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
/>
</svg>
</div>
</div>
</div>
<div className="my-[1rem] flex flex-wrap items-center justify-center gap-[1.5rem] pt-4 text-left md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
{filteredProjects.map((project, index) => {
return (
<div
key={index}
className="group flex w-[280px] shrink flex-col rounded-lg p-2 transition-all duration-300 ease-in-out hover:scale-110"
>
<div className="flex h-full w-full items-center justify-center rounded-t-xl text-center shadow-sm">
<Image
alt={`Screenshot of ${project.title}`}
className="h-full max-h-[8rem] w-full overflow-hidden rounded-t-xl object-cover transition-all duration-300 ease-in-out"
src={project.screenshot}
width={272}
height={128}
/>
</div>
<div className="flex h-full w-full flex-col gap-[.2rem] justify-self-end rounded-b-xl bg-[#f1f5f9] p-4">
<div className="text-black ">
<h2 className="w-[30] text-base truncate " >{project.title}</h2>
<h4 className="flex items-center gap-2 text-sm font-normal opacity-75">
<svg
width="12"
height="24"
viewBox="0 0 30 34"
fill="none"
>
<path
d="M14.639 17.1666C18.863 17.1666 22.2872 13.7424 22.2872 9.51838C22.2872 5.29436 18.863 1.87012 14.639 1.87012C10.415 1.87012 6.99072 5.29436 6.99072 9.51838C6.99072 13.7424 10.415 17.1666 14.639 17.1666Z"
stroke="black"
strokeWidth="3.5"
/>
<path
d="M22.2877 20.226H22.8262C23.9445 20.2263 25.0242 20.6349 25.8624 21.3752C26.7006 22.1154 27.2397 23.1362 27.3784 24.2459L27.9765 29.0245C28.0303 29.455 27.9919 29.892 27.8639 30.3065C27.7359 30.7211 27.5212 31.1036 27.234 31.4288C26.9469 31.754 26.5939 32.0144 26.1984 32.1928C25.8029 32.3711 25.374 32.4633 24.9401 32.4632H4.33878C3.90494 32.4633 3.47605 32.3711 3.08056 32.1928C2.68507 32.0144 2.33203 31.754 2.04488 31.4288C1.75772 31.1036 1.54301 30.7211 1.41501 30.3065C1.287 29.892 1.24862 29.455 1.30242 29.0245L1.89898 24.2459C2.03772 23.1357 2.57726 22.1144 3.41614 21.3741C4.25503 20.6338 5.33547 20.2255 6.45429 20.226H6.9912"
stroke="black"
strokeWidth="3.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
{project.name}
</h4>
<div className="my-[.5rem] flex flex-auto">
<p className="w-full truncate text-sm">
{project.description}
</p>
</div>
</div>
<div className="bg-red my-[10px] mt-auto flex h-10 w-full items-center self-end justify-evenly pl-2.5">
<a
className={
project.live_link === ""
? "mr-3 flex items-center gap-2 rounded-full bg-gray-500 px-4 py-1.5 text-sm transition-all ease-in hover:bg-sky-700"
: "mr-3 flex items-center gap-2 rounded-full bg-[#1e293b] px-4 py-1.5 text-sm transition-all ease-in hover:bg-sky-700"
}
href={project.live_link}
target="_blank"
style={
project.live_link === ""
? { pointerEvents: "none" }
: { pointerEvents: "auto" }
}
rel="noreferrer"
>
<svg
stroke="currentColor"
fill="currentColor"
strokeWidth="0"
viewBox="0 0 16 16"
height="1em"
width="1em"
>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M1 10c0-3.9 3.1-7 7-7s7 3.1 7 7h-1c0-3.3-2.7-6-6-6s-6 2.7-6 6H1zm4 0c0-1.7 1.3-3 3-3s3 1.3 3 3-1.3 3-3 3-3-1.3-3-3zm1 0c0 1.1.9 2 2 2s2-.9 2-2-.9-2-2-2-2 .9-2 2z"
></path>
</svg>
View
</a>
<a
className="mr-3 flex items-center gap-2 rounded-full bg-[#111827] px-3 py-1.5 text-sm transition-all ease-in hover:bg-sky-700"
href={project.link}
target="_blank"
rel="noreferrer"
>
<svg
stroke="currentColor"
fill="currentColor"
strokeWidth="0"
viewBox="0 0 24 24"
height="1em"
width="1em"
>
<g>
<path fill="none" d="M0 0h24v24H0z"></path>
<path
fillRule="nonzero"
d="M5.883 18.653c-.3-.2-.558-.455-.86-.816a50.32 50.32 0 0 1-.466-.579c-.463-.575-.755-.84-1.057-.949a1 1 0 0 1 .676-1.883c.752.27 1.261.735 1.947 1.588-.094-.117.34.427.433.539.19.227.33.365.44.438.204.137.587.196 1.15.14.023-.382.094-.753.202-1.095C5.38 15.31 3.7 13.396 3.7 9.64c0-1.24.37-2.356 1.058-3.292-.218-.894-.185-1.975.302-3.192a1 1 0 0 1 .63-.582c.081-.024.127-.035.208-.047.803-.123 1.937.17 3.415 1.096A11.731 11.731 0 0 1 12 3.315c.912 0 1.818.104 2.684.308 1.477-.933 2.613-1.226 3.422-1.096.085.013.157.03.218.05a1 1 0 0 1 .616.58c.487 1.216.52 2.297.302 3.19.691.936 1.058 2.045 1.058 3.293 0 3.757-1.674 5.665-4.642 6.392.125.415.19.879.19 1.38a300.492 300.492 0 0 1-.012 2.716 1 1 0 0 1-.019 1.958c-1.139.228-1.983-.532-1.983-1.525l.002-.446.005-.705c.005-.708.007-1.338.007-1.998 0-.697-.183-1.152-.425-1.36-.661-.57-.326-1.655.54-1.752 2.967-.333 4.337-1.482 4.337-4.66 0-.955-.312-1.744-.913-2.404a1 1 0 0 1-.19-1.045c.166-.414.237-.957.096-1.614l-.01.003c-.491.139-1.11.44-1.858.949a1 1 0 0 1-.833.135A9.626 9.626 0 0 0 12 5.315c-.89 0-1.772.119-2.592.35a1 1 0 0 1-.83-.134c-.752-.507-1.374-.807-1.868-.947-.144.653-.073 1.194.092 1.607a1 1 0 0 1-.189 1.045C6.016 7.89 5.7 8.694 5.7 9.64c0 3.172 1.371 4.328 4.322 4.66.865.097 1.201 1.177.544 1.748-.192.168-.429.732-.429 1.364v3.15c0 .986-.835 1.725-1.96 1.528a1 1 0 0 1-.04-1.962v-.99c-.91.061-1.662-.088-2.254-.485z"
></path>
</g>
</svg>
Repo
</a>
</div>
</div>
</div>
)
})}
</div>
</div>
</div>
</section>
</div>
)
}
export default GetProjects
================================================
FILE: src/components/GetStaff.js
================================================
import { motion, useReducedMotion } from "framer-motion"
import ProfileCard from "components/ProfileCard"
const GetStaff = ({ users }) => {
const shouldReduceMotion = useReducedMotion()
const hoverAnimation = shouldReduceMotion
? {}
: {
zIndex: 1,
scale: [1, 1.1, 1.1],
}
return users.map((user) => (
<motion.div key={user.name} whileHover={hoverAnimation}>
<ProfileCard
username={user.name}
avatar={user.avatar}
description={user.description}
socials={[
{ type: "github", username: user.github },
{ type: "twitter", username: user.twitter },
{ type: "youtube", username: user.youtube },
{ type: "twitch", username: user.twitch },
{ type: "blog", username: user.blogUrl },
{ type: "linkedin", username: user.linkedin },
]}
/>
</motion.div>
))
}
export default GetStaff
================================================
FILE: src/components/GetVideos.js
================================================
import React from "react"
import allVideos from "data/videos.json"
import Title from "components/Title"
import Image from "next/image"
const GetVideos = () => {
return (
<div className="flex items-center justify-center">
<section className="max-w-bodyContainer flex-1 text-center text-white">
<Title heading="Videos" />
<p className="text-white/70">Videos by 4c community Members</p>
<div className="mx-4 lg:mx-12">
<div className="flex w-full flex-wrap justify-center mt-4">
{allVideos.videos.map((video, index) => (
<div
key={index}
className="details overflow-hidden hov-bg-theme medium:my-4 cursor-pointer rounded-md bg-white/10 text-white shadow-lg backdrop-blur-[30px] transition-all ease-out hover:-translate-y-2 m-4 w-[14rem] mobile:w-[17rem] medium:w-[20rem] laptop:w-[22rem]"
>
<a
href={`https://www.youtube.com/watch?v=${video.videoId}`}
target="_blank" rel="noreferrer"
>
<Image
src={`https://img.youtube.com/vi/${video.videoId}/maxresdefault.jpg`}
className="mx-auto w-full"
alt={video.videoTitle}
width={272}
height={153}
/>
<div className="py-3 px-2">
<h2>{video.videoTitle}</h2>
<span className="text-sm font-thin text-gray-300">
{video.videoAuthor}
</span>
</div>
</a>
</div>
))}
</div>
</div>
</section>
</div>
)
}
export default GetVideos
================================================
FILE: src/components/GoToTop.js
================================================
import React, { useEffect, useState } from "react"
import { FaArrowUp } from "react-icons/fa"
const GoToTop = () => {
// state to display toggler
const [isVisible, setIsVisible] = useState(false)
const goToBtn = () => {
window.scrollTo({ top: 0, left: 0, behavior: "smooth" })
}
const listenToScroll = () => {
const heightToHidden = 20
const winScroll =
document.body.scrollTop || document.documentElement.scrollTop
if (winScroll > heightToHidden) {
setIsVisible(true)
} else {
setIsVisible(false)
}
const footer = document.querySelector(".footer")
const backToTopButton = document.querySelector(".backToTopButton")
const mediaQuery = window.matchMedia("(max-width: 400px)")
const footerIsVisible = footer.getBoundingClientRect().top <= window.innerHeight
if (mediaQuery.matches) {
if (footerIsVisible) {
backToTopButton.style.bottom = `${footer.offsetHeight}px`
backToTopButton.style.transition = "0.5s"
} else {
backToTopButton.style.bottom = "48px"
}
}
}
useEffect(() => {
window.addEventListener("scroll", listenToScroll)
return () => window.removeEventListener("scroll", listenToScroll)
}, [])
// classes for gototop button
return (
<div
onClick={goToBtn}
onKeyDown={goToBtn}
role="button"
tabIndex={0}
className={`backToTopButton fixed bg-gradient-to-b from-green-400 to-blue-600 animate-bounce cursor-pointer rounded-full p-3 right-12 bottom-12 ${!isVisible ? "hidden" : "backToTop"}`}
>
{isVisible && (
<div>
<FaArrowUp className="text-black" />
</div>
)}
</div>
)
}
export default GoToTop
================================================
FILE: src/components/Header.js
================================================
import { RiMenu4Fill, RiCloseFill } from "react-icons/ri"
import { useState, useEffect } from "react"
import Link from "next/link"
// import navbar data
import navItems from "data/navbar"
import Image from "next/image"
import logoImage from "assets/logo.png"
const Navbar = () => {
const [menuActive, setMenuActive] = useState(false)
const [activeButton, setActiveButton] = useState()
useEffect(() => {
const local = window.localStorage.getItem("active")
setActiveButton(local)
}, [])
return (
<div className="container -ml-4 items-center justify-center left-0 right-0 z-[1] block fixed">
<header className="my-[0] w-[100vw] bg-[#314C89]/10 backdrop-blur-[2px] px-5 py-[0.7rem] md:px-[2rem]">
<div className="container max-w-bodyContainer px-1 sm:px-2">
<nav className="flex items-start justify-between md:justify-center">
<div className="relative flex w-full flex-wrap items-center justify-between gap-6 z-50">
<Link href="/">
<Image
width={50}
height={50}
id="four-c-logo"
className="hover:cursor-pointer"
alt="4C Logo"
src={logoImage}
priority
/>
</Link>
<button
className="text-4xl lg:hidden text-white bg-[#030e2c] p-2 rounded"
aria-label="Menu button"
type="button"
onClick={() => setMenuActive(true)}
>
<RiMenu4Fill />
</button>
<div
className={`w-full h-screen -z-40 fixed bg-[#030e2c] flex p-20 top-0 left-0 ${
menuActive ? "z-40" : ""
} flex-col items-center justify-center gap-[2rem] lg:flex-row lg:gap-[0.6rem] transition-all duration-1000 lg:w-max lg:h-max lg:!z-40 lg:static lg:bg-inherit lg:p-0 lg:top-auto lg:left-auto lg:![clip-path:unset] lg:transition-none`}
style={{
clipPath: menuActive
? "circle(100% at 50% 50%)"
: "circle(0% at 100% 0)",
}}
>
<button
className="text-4xl lg:hidden text-white bg-[#030e2c] p-2 rounded fixed top-[4rem] right-[5rem]"
aria-label="Close button"
type="button"
onClick={() => setMenuActive(false)}
>
<RiCloseFill />
</button>
{navItems.map((navItem, idx) => (
<Link
href={navItem.href}
key={idx}
onClick={() => {
window.localStorage.setItem("active", navItem.href)
}}
onKeyDown={() => {
window.localStorage.setItem("active", navItem.href)
}}
role="menuitem"
tabIndex={0}
className={`hov-bg-theme w-full rounded px-4 py-2 font-bold transition-all ease-out hover:-translate-y-1 hover:cursor-pointer lg:w-auto text-center
${
activeButton === navItem.href
? "bg-theme bg-[#70b7e6] text-white"
: "bg-[#111827] text-white"
}`}
>
{navItem.pageName}
</Link>
))}
</div>
</div>
</nav>
</div>
</header>
</div>
)
}
export default Navbar
================================================
FILE: src/components/JoinOurTeam.jsx
================================================
import React, { useState } from "react"
import JoinUsForm from "components/Form/JoinUsForm"
function JoinOurTeam() {
const [tab] = useState("Join Our Team")
return (
<div className="mt-18 flex items-start justify-start">
<section className="flex-1 text-center text-4xl font-bold text-white">
<h1>{tab}</h1>
<JoinUsForm />
</section>
</div>
)
}
export default JoinOurTeam
================================================
FILE: src/components/Layout.js
================================================
import Head from "next/head"
import { NextSeo } from "next-seo"
import Header from "components/Header"
import config from "4c.config"
import { motion } from "framer-motion"
import Footer from "components/Footer"
import favicon from "../public/favicon.ico"
const Layout = ({ header, children, ...rest }) => {
const variants = {
hidden: { opacity: 0, x: 0, y: 200 },
enter: { opacity: 1, x: 0, y: 0 },
exit: { opacity: 0, x: 0, y: 0 },
}
return (
<>
<div className="bg-theme min-h-screen" id="get-projects-scroll">
<Header {...header} />
<Head>
<link rel="shortcut icon" type="image/x-icon" href={favicon.src} />
</Head>
<NextSeo
title={config.title.short}
description={config.description.short}
canonical={config.url}
openGraph={{
url: config.url,
title: config.title.long,
description: config.description.long,
images: [
{
url: config.ogImage,
width: 1200,
height: 630,
alt: config.title.short,
type: "image/jpeg",
},
],
site_name: config.siteName,
}}
/>
<motion.main
{...rest}
variants={variants}
initial="hidden"
animate="enter"
exit="exit"
transition={{ type: "linear" }}
>
{children}
</motion.main>
</div>
<Footer />
</>
)
}
export default Layout
================================================
FILE: src/components/Loading.jsx
================================================
import React from "react"
function Loading() {
return (
<button
disabled
type="button"
className="w-full rounded-md bg-blue-500 px-2 py-4 text-sm text-white focus:bg-indigo-600 focus:outline-none"
>
<svg
role="status"
className="mr-3 inline h-4 w-4 animate-spin text-white"
viewBox="0 0 100 101"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z"
fill="#E5E7EB"
/>
<path
d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z"
fill="currentColor"
/>
</svg>
Loading...
</button>
)
}
export default Loading
================================================
FILE: src/components/Main.js
================================================
const Main = ({ eyebrow, title, description, primaryLink, twitterLink }) => {
return (
<div>
<div className="flex items-center justify-center">
<section className="container mb-[4em] md:my-[4em] max-w-bodyContainer md:p-[2em] md:mb-[0em]">
<div className="grid items-center gap-12 md:grid-cols-1 lg:grid-cols-2">
<div className="col-span-1">
<p className="hidden text-2xl font-bold uppercase tracking-wide text-white md:block">
{eyebrow}
</p>
<h1 className="main-title mt-2 text-5xl font-extrabold tracking-tight text-white md:text-6xl text-center md:text-left ">
{title}
</h1>
<div className="main-description prose-lg my-8 mx-[auto] text-slate-200 md:text-left text-center">
{description}
</div>
<ul className="my-8 flex flex-col flex-wrap gap-4 md:flex-row md:justify-start">
<li className="self-center break:self-start">{primaryLink}</li>
<li className="self-center break:self-start">{twitterLink}</li>
</ul>
</div>
<div className="flex justify-end">
<iframe
title="Discord Widget"
width="95%"
height="500"
allowtransparency="true"
sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"
src="https://discord.com/widget?id=784142072763383858&theme=dark"
></iframe>
</div>
</div>
</section>
</div>
</div>
)
}
export default Main
================================================
FILE: src/components/ProfileCard.jsx
================================================
import React from "react"
import {
FaBlog,
FaGithub,
FaYoutube,
FaTwitch,
FaLinkedin,
} from "react-icons/fa"
import { FaXTwitter } from "react-icons/fa6"
import SocialLink from "components/SocialLink"
import Image from "next/image"
const socialMediaData = {
github: {
url: "https://github.com/",
icon: FaGithub,
},
twitter: {
url: "https://twitter.com/",
icon: FaXTwitter,
},
blog: {
icon: FaBlog,
},
youtube: {
icon: FaYoutube,
},
twitch: {
icon: FaTwitch,
},
linkedin: {
icon: FaLinkedin,
url: "https://www.linkedin.com/in/",
},
}
const getSocials = (socials, username) => {
socials = socials.filter((social) => social.username)
return socials.map((social) => {
const socialMedia = socialMediaData[social.type]
if (social.type === "blog" && !social?.username?.includes("http")) {
social.username = `http://${social.username}`
}
return (
<SocialLink
link={[
socialMedia.url ? socialMedia.url + social.username : social.username,
]}
Icon={socialMedia.icon}
label={username + "'s " + social.type}
key={social.type}
/>
)
})
}
const ProfileCard = ({ username, avatar, socials = [], description }) => {
return (
<div className="m-4 flex h-64 w-64 flex-col items-center justify-center rounded-md">
<div className="h-32 w-32 overflow-hidden rounded-full shadow-sm">
<Image
src={avatar}
alt={username}
width={200}
height={200}
className="object-contain"
/>
</div>
<span className="mt-3 text-lg text-white">{username}</span>
{description?.length > 0
? (
<div className="mt-[.2em] w-[20ch] truncate p-[.4em] text-sm hover:w-[30ch] hover:text-clip wrapper">
<p className="target">{description}</p>
</div>
)
: (
""
)}
<div className="flex items-center justify-center space-x-3 rounded py-1 px-4">
{getSocials(socials, username)}
</div>
</div>
)
}
export default ProfileCard
================================================
FILE: src/components/SocialLink.jsx
================================================
import React from "react"
const SocialLink = ({ link, Icon, label }) => (
<a href={link} target="_blank" rel="noopener noreferrer" className="text-white hover:text-slate-300">
<Icon className="text-2xl" />
<span className="sr-only">{label}</span>
</a>
)
export default SocialLink
================================================
FILE: src/components/Staff.js
================================================
import React, { useState } from "react"
import GetStaff from "components/GetStaff"
import Users from "components/Users"
// import staff data
import staff from "data/staff"
import Title from "components/Title"
import { FilterUsersByNameAndDesc } from "utils/filterUsers"
const Staff = () => {
const [tab] = useState("Staff")
// state for currentUsers
const [currentUsers, setCurrentUsers] = useState(staff)
// filter handler
const searchHandler = (event) => {
event.preventDefault()
const filterdUsers = FilterUsersByNameAndDesc(staff, event.target.value)
setCurrentUsers(filterdUsers)
}
return (
<div className="flex items-center justify-center">
<div className="mt-[3em] flex max-w-bodyContainer items-start justify-start">
<section className="flex-1 text-center font-bold text-white">
<Title heading="Staff" />
<div className="flex items-center justify-center ">
<div className="break:w[500px] relative m-auto flex max-w-[800px] self-center mobile:mx-10 laptop:w-[600px] bigScreen:w-[800px]">
<input
placeholder="Search here"
className="h-10 w-full border-slate-200 px-5 py-3 text-white outline-none placeholder:text-slate-700 contrast-more:border-slate-400 contrast-more:placeholder:text-slate-500 bg-white bg-opacity-[.2] p-8 shadow backdrop-blur-3xl rounded-3xl"
onInput={searchHandler}
/>
<svg
xmlns="http://www.w3.org/2000/svg"
className="absolute right-3 top-1/2 h-5 w-5 -translate-y-1/2 rotate-90 text-white sm:text-slate-400"
fill="none"
viewBox="0 0 24 24"
stroke="#000000"
strokeWidth={2}
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
/>
</svg>
</div>
</div>
{currentUsers.length
? (
<div className="m-2 flex flex-wrap items-center justify-center gap-[1.8rem] overflow-y-auto pt-5 pb-4">
{tab === "Staff"
? (
<GetStaff users={currentUsers} />
)
: (
<Users users={currentUsers} />
)}
</div>
)
: (
<p className="mt-3">User does not exist!</p>
)}
</section>
</div>
</div>
)
}
export default Staff
================================================
FILE: src/components/Title.js
================================================
import React from "react"
function Title({ heading }) {
// Main Heading component
return (
<>
<h1 className="headTitle mb-5 uppercase tracking-widest text-white">
{heading}
</h1>
</>
)
}
export default Title
================================================
FILE: src/components/Users.js
================================================
import ProfileCard from "components/ProfileCard"
const Contributors = ({ users }) => {
if (users.length === 0) {
return (
<div className="flex h-64 flex-col items-center justify-start space-y-6 rounded-md bg-orange-300 p-8 text-lg text-gray-600 shadow-md">
None yet
</div>
)
}
return users.map((user, index) => (
<ProfileCard
key={index}
username={user.name}
avatar={user.avatar}
socials={[
{ type: "github", username: user.github },
{ type: "twitter", username: user.twitter },
{ type: "blog", username: user.blogUrl },
]}
/>
))
}
export default Contributors
================================================
FILE: src/components/blog-posts.js
================================================
import BlogCard from "components/BlogCard"
import Title from "components/Title"
const Blogs = () => {
return (
<div className="flex items-center flex-col justify-center">
<Title heading="Blogs" />
<BlogCard />
</div>
)
}
export default Blogs
================================================
FILE: src/components/faq.js
================================================
import Faqs from "data/faq.json"
import FaqAccordian from "components/FaqAccordian"
import Title from "components/Title"
const Faq = () => {
return (
<div>
<div className="page-title mb-16 mt-[30px] text-center text-white">
<Title heading="Frequently asked questions" />
</div>
<ul className="flex flex-col items-center justify-center">
{Faqs.map((faq, idx) => (
<FaqAccordian key={idx} faq={faq} />
))}
</ul>
</div>
)
}
export default Faq
================================================
FILE: src/data/activemembers.js
================================================
import AyushAvatar from "assets/sources/activemembers/Aayushd18.webp"
import AdetoyeAvatar from "assets/sources/activemembers/adetoye-dev.webp"
import AnishAvatar from "assets/sources/activemembers/AnishDe12020.webp"
import AryanAvatar from "assets/sources/activemembers/AryanBabber.webp"
import BaranAvatar from "assets/sources/activemembers/baranbbr.webp"
import CodewithvoidAvatar from "assets/sources/activemembers/codewithvoid.webp"
import CtofaninAvatar from "assets/sources/activemembers/ctoffanin.webp"
import DevvSakibAvatar from "assets/sources/activemembers/devvsakib.webp"
import EpicAdidashAvatar from "assets/sources/activemembers/epicadidash.webp"
import HaiderAliAvatar from "assets/sources/activemembers/haideralipunjabi.webp"
import JayNarayanAvatar from "assets/sources/activemembers/jaynarayan-vaishnav.webp"
import JonnieAvatar from "assets/sources/activemembers/Jonnie-Dev.webp"
import KrishAvatar from "assets/sources/activemembers/krshkun.webp"
import MayankAvatar from "assets/sources/activemembers/Mayank-KS.webp"
import PosanduAvatar from "assets/sources/activemembers/Posandu.webp"
import RakeshAvatar from "assets/sources/activemembers/RakeshSangem.webp"
import ShorunAvatar from "assets/sources/activemembers/ShorunTech.webp"
import SiddharthAvatar from "assets/sources/activemembers/SiddharthShyniben.webp"
import BobbyAvatar from "assets/sources/activemembers/thedevdojo.webp"
import BigDogTristAvatar from "assets/sources/activemembers/thePlebDev.webp"
import VaibhavAvatar from "assets/sources/activemembers/singh-vaibhav08.webp"
import LBD from "assets/sources/activemembers/lbd.webp"
import staff from "./staff"
// const staff = []
/**
* @typedef {Object} Profile
* @property {string} name
* @property {string} avatar
* @property {string?} github
* @property {string} description
* @property {string?} twitter
* @property {string?} blogUrl
* @property {number?} contributions
*/
/**
* @type {Profile[]}
*/
// export const base = [
const base = [
{
name: "L.B.D",
avatar: LBD,
github: "lambeboluwatife",
twitter: "Danibholie",
blogUrl: "https://boluwatifeportfolio.netlify.app/",
youtube: "https://www.youtube.com/@LBDmedia/videos",
linkedin: "lambe-boluwatife-87b0b6136",
contributions: 0,
},
{
name: "Aayush™",
avatar: AyushAvatar,
github: "Aayushd18",
twitter: "aayushdeshmukh",
blogUrl: "https://aayushd.in/",
contributions: 0,
},
{
name: "Adetoye Adewoye",
avatar: AdetoyeAvatar,
github: "adetoye-dev",
twitter: "adetoye_dev",
blogUrl: "https://adetoye.vercel.app/",
contributions: 0,
},
{
name: "AnishDe12020",
avatar: AnishAvatar,
github: "AnishDe12020",
twitter: "AnishDe12020",
blogUrl: "https://anishde.dev/",
contributions: 0,
},
{
name: "AryanBabber",
avatar: AryanAvatar,
github: "AryanBabber",
twitter: "ABgoneCoding",
blogUrl: "https://linkfree.eddiehub.io/aryanbabber",
contributions: 0,
},
{
name: "Baran",
avatar: BaranAvatar,
github: "baranbbr",
twitter: "banf",
blogUrl: "https://dev.to/banf",
contributions: 3,
},
{
name: "bigdogtrist",
avatar: BigDogTristAvatar,
github: "thePlebDev",
twitter: "AndroidTristan",
blogUrl: "https://dev.to/theplebdev",
contributions: 0,
},
{
name: "Bobby Iliev",
avatar: BobbyAvatar,
github: "thedevdojo",
twitter: "bobbyiliev_",
blogUrl: "https://devdojo.com/",
contributions: 0,
},
{
name: "Codewithvoid",
avatar: CodewithvoidAvatar,
github: "codewithvoid",
twitter: "codewithvoid",
blogUrl: "",
contributions: 0,
},
{
name: "epicadidash",
avatar: EpicAdidashAvatar,
github: "epicadidash",
twitter: "epicadidash",
youtube: "https://www.youtube.com/@epicadidash",
twitch: "https://www.twitch.tv/epicadidash",
linkedin: "epicadidash",
blogUrl: "",
contributions: 0,
},
{
name: "jaynarayan(Jay)",
avatar: JayNarayanAvatar,
github: "jaynarayan-vaishnav",
twitter: "jaystwtt",
blogUrl: "https://bio.link/jaynarayan",
contributions: 0,
},
{
name: "jonnie",
avatar: JonnieAvatar,
github: "Jonnie-Dev",
twitter: "JonnieDev",
blogUrl: "",
contributions: 0,
},
{
name: "Mayank",
avatar: MayankAvatar,
github: "Mayank-KS",
twitter: "",
blogUrl: "",
contributions: 0,
},
{
name: "Posandu Mapa",
avatar: PosanduAvatar,
github: "Posandu",
twitter: null,
blogUrl: "https://www.tronic247.com",
contributions: 3,
},
{
name: "Rakesh.js",
avatar: RakeshAvatar,
github: "RakeshSangem",
twitter: "RakeshSangem8",
blogUrl: "",
contributions: 0,
},
{
name: "ShorunTech",
avatar: ShorunAvatar,
github: "ShorunTech",
twitter: "shoruntech",
blogUrl: "linkfree.eddiehub.io/ShorunTech",
contributions: 0,
},
{
name: "Siddharth Shyniben",
avatar: SiddharthAvatar,
github: "SiddharthShyniben",
twitter: "SiddharthShyn",
blogUrl: "https://blog.siddu.tech/",
contributions: 0,
},
{
name: "Vaibhav",
avatar: VaibhavAvatar,
github: "singh-vaibhav08",
twitter: "singh_vaibhav08",
blogUrl: "https://vaibhavsblog.hashnode.dev/",
linkedin: "singh-vaibhav08",
contributions: 1,
},
{
name: "DevvSakib",
avatar: DevvSakibAvatar,
github: "devvsakib",
twitter: "devvsakib",
blogUrl: "https://devvsakib.me",
linkedin: "devvsakib",
contributions: null,
},
{
name: "Ctofanin",
avatar: CtofaninAvatar,
github: "ctoffanin",
twitter: "ctoffaninDev",
blogUrl: "",
linkedin: "",
contributions: null,
},
{
name: "Haider Ali Punjabi",
avatar: HaiderAliAvatar,
github: "haideralipunjabi",
twitter: "HAliPunjabi",
blogUrl: "https://blog.haideralipunjabi.com",
linkedin: "haideralipunjabi",
contributions: 6,
},
{
name: "Krish Gupta 🥑",
avatar: KrishAvatar,
github: "krshkun",
twitter: "krshkun",
blogUrl: "https://links.krsh.eu.org",
linkedin: "krshkun",
contributions: null,
},
].sort((a, b) => (a.name > b.name ? 1 : -1))
// const staffMembersAlsoActive = [
// "InHuOfficial",
// "avneesh0612",
// "ardasevinc",
// "AliReza1083",
// "avie-dev",
// "Dun-sin",
// "Njong392",
// "FrancescoXX",
// "44jax44",
// "naomi-lgbt",
// "Pradumnasaraf",
// "codewithshubhi",
// "sumitsaurabh927",
// "TechSquidTV",
// "tobySolutions",
// "Yudai-creator",
// "MadhuSaini22",
// "krupalitrivedi",
// ]
/**
* @type {Profile[]}
*/
function sorting(arraytobesorted) {
const names = []
const sortedarray = []
arraytobesorted.forEach((object) => {
const name = object.name
const updatedname = name[0].toUpperCase() + name.substring(1)
names.push(updatedname)
})
names.sort()
names.forEach((object) => {
const foundobject = arraytobesorted.find(searchedobject => object.localeCompare(searchedobject.name, undefined, { sensitivity: "accent" }) === 0)
sortedarray.push(foundobject)
})
return sortedarray
}
const activeMembers = sorting(staff.concat(base))
export default activeMembers
// module.exports = activeMembers
// module.exports.base = base
================================================
FILE: src/data/blog.js
================================================
import FreeWeb3Resources from "assets/sources/blog/free-web3-resources-demo-blog.webp"
import ContentCreator from "assets/sources/blog/4c.png"
const blogs = [
{
name: "Francesco Ciulla",
title: "FREE Web3 Resources (demo blog)",
screenshot: FreeWeb3Resources,
screenshotUrl:
"https://user-images.githubusercontent.com/18360871/199210192-f5599a23-f0b1-49ff-9c52-2554a72a2c14.png",
description: "A list of resources to learn Web3 for FREE",
link: "https://github.com/FrancescoXX/free-Web3-resources",
twitter: "https://twitter.com/FrancescoCiull4",
},
{
name: "Francesco Ciulla 2",
title: "4C - Content Creator(demo blog)",
screenshot: ContentCreator,
screenshotUrl: "https://user-images.githubusercontent.com/88102392/229171789-7d74c9bd-946b-494a-97a9-86612fdf2f27.png",
description: "The Cool Community of Content Creators",
link: "https://github.com/FrancescoXX/4c-site",
twitter: "https://twitter.com/FrancescoCiull4",
},
]
export default blogs
// module.exports = blogs
================================================
FILE: src/data/events.json
================================================
{
"events": [
{
"name": "4Call",
"image": "https://user-images.githubusercontent.com/86878236/210950060-a1e5ec9f-e21f-4a83-97b7-7bb371d5c88a.png",
"organizer": "4C Community",
"venue": "Discord",
"date": "every Saturday @ 1pm GMT",
"link": "https://discord.com/channels/784142072763383858/1058733457112567828",
"isActive": true
}
]
}
================================================
FILE: src/data/faq.json
================================================
[
{
"questions": "What does \"4C\" stands for?",
"answers": "4C stands for \"Cool Community of Content Creators\"."
},
{
"questions": "What is the goal of \"4C\"? ",
"answers": "We discuss Content Creation using Videos, Articles and Social Media. Our goal is to create a decentralized community, where everyone can create some events related to the community on their channels."
},
{
"questions": "Is \"4C\" open-source and how can I contribute?",
"answers": "4C is open source. All contributions are welcome. Visit our contributions page to learn how you can contribute."
},
{
"questions": "How can I join the community?",
"answers": "Join our Discord Server and visit the #start-here channel."
},
{
"questions": "Is \"4C\" only for experienced content creators?",
"answers": "Absolutely no. The community fosters growth on all levels, irrespective of prior experience —a platform where you can talk about your ideas and get opinions on how to execute them."
},
{
"questions": "What are the benefits of the \"4C\" community?",
"answers": "You get support, activities, collaborations, free dedicated content creation webinars (yes, you got it right ! 😄), coffee chat, and a meme channel! "
}
]
================================================
FILE: src/data/homepage.js
================================================
import { FaDiscord } from "react-icons/fa"
import { FaXTwitter } from "react-icons/fa6"
import "react-toastify/dist/ReactToastify.css"
export const main = {
eyebrow: "👋 ",
title: (
<>
<div className="">The Cool Community of Content Creators</div>
{/* <div>
<span className="text-primary">
<span className="text-theme">C</span>ool{" "}
</span>
<span className="text-primary">
<span className="text-theme">C</span>ommunity
</span>
</div>
<div className="text-x">of</div>
<div>
<span className="text-primary">
<span className="text-theme">C</span>ontent{" "}
</span>
<span className="text-primary">
<span className="text-theme">C</span>reators
</span>
</div> */}
</>
),
description: (
<>
<p>
Creating content can be rewarding, but it can also be a challenge to
come up with ideas, get your content out there, and get it noticed.
</p>
<p>
Join our online community to connect with other like-minded creators,
collaborate on ideas, and motivate each other to create and publish!
</p>
</>
),
primaryLink: (
<a
href="https://discord.com/invite/TcmA2kbJeA"
className="btn btn-primary"
target="_blank" rel="noreferrer"
>
<FaDiscord />
Join Discord Server
</a>
),
twitterLink: (
<a
href="https://twitter.com/4ccommunityhq"
className="btn btn-twitter"
target="_blank" rel="noreferrer"
>
<FaXTwitter />
X (Twitter)
</a>
),
}
================================================
FILE: src/data/navbar.js
================================================
const pages = [
{
href: "/active-members",
pageName: "Active Members",
},
{
href: "/projects",
pageName: "Projects",
},
{
href: "/staff",
pageName: "Staff",
},
]
export default pages
================================================
FILE: src/data/partnerCommunities.json
================================================
[
{
"logo": "https://user-images.githubusercontent.com/81684710/215572719-5bbd7e27-24c4-43bb-a261-33dd368e93bf.png",
"community_name": "EddieHub",
"sub_desc": "Open Source",
"bio": "Collaboration 1st, Code 2nd!!",
"website": "https://www.eddiehub.org/"
}
]
================================================
FILE: src/data/projects.json
================================================
{
"projects": [
{
"name": "Francesco Ciulla",
"title": "FREE Web3 Resources",
"screenshot": "https://user-images.githubusercontent.com/18360871/199210192-f5599a23-f0b1-49ff-9c52-2554a72a2c14.png",
"description": "A list of resources to learn Web3 for FREE",
"link": "https://github.com/FrancescoXX/free-Web3-resources",
"twitter": "https://twitter.com/FrancescoCiull4",
"live_link": "https://www.freeweb3resources.com",
"stack": [
"All",
"React",
"CSS",
"Others"
]
},
{
"name": "Pradumna Saraf",
"title": "Open Source With Pradumna",
"screenshot": "https://user-images.githubusercontent.com/51878265/198830989-51ac5f4c-92f1-4c75-b106-8f82e841a2d2.png",
"description": "Contains resources to learn about Open Source, Git, and GitHub.",
"link": "https://github.com/Pradumnasaraf/open-source-with-pradumna",
"twitter": "https://twitter.com/pradumna_saraf",
"live_link": "https://os.pradumnasaraf.dev/#/",
"stack": [
"All",
"Markdown",
"HTML",
"CSS",
"Others"
]
},
{
"name": "Susmita Dey",
"title": "Sukoon",
"screenshot": "https://user-images.githubusercontent.com/98955085/184510782-3f699206-4768-4b3a-aa6d-40c924e13578.png",
"description": "The one step solution to get relief from your stress. Live a stress-free life by using this website.",
"link": "https://github.com/Susmita-Dey/Sukoon",
"twitter": "https://twitter.com/its_SusmitaDey",
"live_link": "https://sukoon-stress-free.netlify.app/",
"stack": [
"All",
"HTML",
"CSS",
"JS/TS"
]
},
{
"name": "thegeekyb0y",
"title": "FREE Python Resources",
"screenshot": "https://user-images.githubusercontent.com/18360871/199207091-a66dac6a-4397-4142-af56-87c941f9e1e3.png",
"description": "Compiled list of Free resources to learn Python",
"link": "https://github.com/thegeekyb0y/learnpython",
"twitter": "https://twitter.com/thegeekyb0y",
"live_link": "",
"stack": [
"All",
"Markdown"
]
},
{
"name": "Ali Reza",
"title": "AniLearn.dev",
"screenshot": "https://i.ibb.co/WzY25g1/banner-anilearn.png",
"description": "Learning something with animation doesn't get easier than this",
"link": "https://github.com/AliReza1083/AniLearn.dev",
"twitter": "https://twitter.com/Ali_Developer05",
"live_link": "https://www.anilearn.dev/",
"stack": [
"All",
"Next",
"Tailwind",
"Markdown",
"JS/TS",
"Others"
]
},
{
"name": "Aditya Bisht",
"title": "BetterPoll",
"screenshot": "https://i.postimg.cc/66Z6kmf0/Capture.png",
"description": "A complete campus management android app.",
"link": "https://github.com/adityabisht02/BetterPoll-Android",
"twitter": "https://twitter.com/AdityaB35550332",
"live_link": "",
"stack": [
"All",
"Others"
]
},
{
"name": "Akshita Gupta",
"title": "Face-X",
"screenshot": "https://user-images.githubusercontent.com/18360871/199206838-97ebea3b-a413-412c-ab72-ae7763315b31.png",
"description": "Demonstration of different algorithms and operations on faces.",
"link": "https://github.com/akshitagupta15june/Face-X",
"twitter": "https://twitter.com/Akshita_archer",
"live_link": "https://www.youtube.com/watch?v=VK-IaRY9szg",
"stack": [
"All",
"Others"
]
},
{
"name": "Krishnansh Agarwal",
"title": "Library",
"screenshot": "https://i.postimg.cc/P5mgxvDr/Screenshot-20221101-110821-Chrome.jpg",
"description": "A basic library management system [only frontend]",
"link": "https://github.com/krishnanshagarwal112/Library",
"twitter": "https://twitter.com/KrishnanshDev",
"live_link": "",
"stack": [
"All",
"HTML",
"CSS",
"JS/TS"
]
},
{
"name": "Becca Lyria",
"title": "Becca Lyria",
"screenshot": "https://user-images.githubusercontent.com/18360871/201510325-cfd1e1fb-e838-448a-895d-7bc1f492d97c.png",
"description": "A community management and moderation bot for Discord.",
"link": "https://github.com/beccalyria/discord-bot",
"twitter": "https://twitter.com/becca_lyria",
"live_link": "https://www.beccalyria.com",
"stack": [
"All",
"JS/TS"
]
},
{
"name": "Njong Emy",
"title": "Abbreve",
"screenshot": "https://images2.imgbox.com/02/5a/8MUFjojh_o.png",
"description": "Open source dictionary for slang",
"link": "https://github.com/Njong392/Abbreve",
"twitter": "https://twitter.com/njong_emy",
"live_link": "https://www.abbreve.tech",
"stack": [
"All",
"React",
"Tailwind"
]
},
{
"name": "Tobiloba Adedeji",
"title": "Million.js",
"screenshot": "https://i.ibb.co/Hq16Q2L/tobiloba-portfolio.png",
"description": "Virtual DOM that makes React faster",
"link": "https://github.com/aidenybai/million",
"twitter": "https://twitter.com/toby_solutions",
"live_link": "https://million.dev",
"stack": [
"All",
"Javascript",
"Typescript"
]
},
{
"name": "Yudai H",
"title": "Yudai Creator Portfolio Website",
"screenshot": "https://user-images.githubusercontent.com/18360871/201510239-78ddaa5d-f3d6-4a3b-a88c-d5a2eb324341.png",
"description": "Building my portfolio of projects, where I going to turn this website into the center point of my brand.",
"link": "https://github.com/Yudai-creator/yudai-creator-definitive",
"twitter": "https://twitter.com/creator_yudai",
"live_link": "https://yudaicreator.com",
"stack": [
"All",
"Others"
]
},
{
"name": "Dunsin",
"title": "Code Magic",
"screenshot": "https://user-images.githubusercontent.com/78784850/198844365-b79a5bb2-f3bc-47bc-94d6-b6389552b1a5.png",
"description": "Get short css code you can use in your applications",
"link": "https://github.com/Dun-sin/Code-Magic",
"twitter": "https://twitter.com/DunsinWebDev",
"live_link": "https://code-magic.vercel.app",
"stack": [
"All",
"JS/TS"
]
},
{
"name": "Tamal Das",
"title": "Project Milan",
"screenshot": "https://user-images.githubusercontent.com/18360871/201510488-73feeba6-b08c-42a0-a985-e8f159eaa869.png",
"description": "A hub for users to collaborate with NGOs and make Earth a better place",
"link": "https://github.com/IAmTamal/Milan",
"twitter": "https://twitter.com/mrTamall",
"live_link": "https://milaan.vercel.app",
"stack": [
"All",
"React",
"Others"
]
},
{
"name": "Avie",
"title": "SpacesLounge",
"screenshot": "https://i.ibb.co/ZMpDrBM/Spaces-Lounge.png",
"description": "Twitter Spaces Host and Speaker's Lounge",
"link": "https://github.com/avie-dev/spaceslounge",
"twitter": "https://twitter.com/AvieDev",
"live_link": "https://spaceslounge.vercel.app",
"stack": [
"All",
"Tailwind",
"Next"
]
},
{
"name": "J S Vignesh Kanna",
"title": "TailwindCSS Bootstrap",
"screenshot": "https://user-images.githubusercontent.com/42484705/197696771-9aaf4f6d-1928-4d66-9d2b-01ad479d289a.png",
"description": "An opensource tailwindCSS UI component collection",
"link": "https://github.com/jsvigneshkanna/tailwind_ui_components",
"twitter": "https://twitter.com/jsvigneshkanna",
"live_link": "https://tailwindcsscomponents.vercel.app",
"stack": [
"All",
"Tailwind",
"Next"
]
},
{
"name": "Ibrahim",
"title": "Frontend Resources",
"screenshot": "https://i.ibb.co/BKt0kn2/Frontend-Resources-Banner.png",
"description": "A curated list of resources for Frontend development",
"link": "https://github.com/ibrahimraimi/frontend-resources",
"twitter": "https://twitter.com/ibrahimraimi_",
"live_link": "https://frontend-dev-resources.vercel.app/",
"stack": [
"All",
"Next",
"Markdown"
]
},
{
"name": "Mahesh Kasbe",
"title": "K-Dash",
"screenshot": "https://raw.githubusercontent.com/Mahesh-Kasabe/K-Dash/master/Images/overview.png",
"description": "Browser Based Kubernetes Real Time Monitoring Tool",
"link": "https://github.com/Mahesh-Kasabe/K-Dash",
"twitter": "https://twitter.com/maheshstwt",
"live_link": "https://youtu.be/0oRW_ZetXoc",
"stack": [
"All",
"React"
]
},
{
"name": "Letam",
"title": "Letam",
"screenshot": "https://i.ibb.co/T4P9757/Letam-image.png",
"description": "My portfolio website",
"link": "https://github.com/Yagazie-davidson/Portfolio",
"twitter": "https://twitter.com/LetamDavidson",
"live_link": "https://letam.vercel.app/",
"stack": [
"All",
"React"
]
},
{
"name": "Soumyadeep Das Bhowmick",
"title": "Santa-Funda",
"screenshot": "https://user-images.githubusercontent.com/115442240/209482401-d4a57d6d-0b71-4b9b-8a36-8942ec2c87b8.png",
"description": "Wish your friend via this site",
"link": "https://github.com/SoumyadeepOSD/Christmas-Gift/tree/master",
"twitter": "https://twitter.com/SoumyadeepDasB6",
"live_link": "https://soumyadeeposd.github.io/Christmas-Gift/"
},
{
"name": "Ellams George",
"title": "Ellams George",
"screenshot": "https://avatars.githubusercontent.com/u/103334963?v=4",
"description": "Ellams portfolio v2.0",
"link": "https://github.com/Ellamsg/folio2",
"twitter": "https://twitter.com/ellamsgeorge1",
"live_link": "https://ellamsfolio.netlify.app/"
},
{
"name": "Suman Paik",
"title": "Plant Store",
"screenshot": "https://user-images.githubusercontent.com/93247057/214245266-3404f4b8-aa12-4529-86d8-8f2e02bb67db.png",
"description": "Select and shop your favourite plant.",
"link": "https://github.com/sumanpaikdev/Plant-Store-Online",
"twitter": "https://twitter.com/sumanpaikdev",
"live_link": "https://shop-plant.netlify.app/",
"stack": [
"All",
"React",
"Tailwind"
]
}
]
}
================================================
FILE: src/data/stacks.json
================================================
{
"stack": [
{
"key": 0,
"name": "All"
},
{
"key": 1,
"name": "HTML"
},
{
"key": 2,
"name": "CSS"
},
{
"key": 3,
"name": "JS/TS"
},
{
"key": 4,
"name": "React"
},
{
"key": 5,
"name": "Tailwind"
},
{
"key": 6,
"name": "Next"
},
{
"key": 7,
"name": "Markdown"
},
{
"key": 8,
"name": "Others"
}
]
}
================================================
FILE: src/data/staff.js
================================================
import JaxAvatar from "assets/sources/staff/44jax44.webp"
import AliRezaAvatar from "assets/sources/staff/AliReza1083.webp"
import AvieAvatar from "assets/sources/staff/avie-dev.webp"
import DunsinAvatar from "assets/sources/staff/Dun-sin.webp"
import FrancescoAvatar from "assets/sources/staff/FrancescoXX.webp"
import GrahamAvatar from "assets/sources/staff/InHuOfficial.webp"
import KrupaliAvatar from "assets/sources/staff/krupalitrivedi.webp"
import LouellaAvatar from "assets/sources/staff/lovelacecoding.webp"
import MadhuAvatar from "assets/sources/staff/MadhuSaini22.webp"
import PradumnaAvatar from "assets/sources/staff/Pradumnasaraf.webp"
import SumitAvatar from "assets/sources/staff/sumitsaurabh927.webp"
import TobiAvatar from "assets/sources/staff/tobySolutions.jpeg"
import ElderAvatar from "assets/sources/staff/Elder.webp"
import TiyaAvatar from "assets/sources/staff/Tiya.webp"
/**
* @typedef {Object} Profile
* @property {string} name
* @property {string} avatar
* @property {string?} github
* @property {string} description
* @property {string?} twitter
* @property {string?} blogUrl
* @property {number?} contributions
*/
/**
* @type {Profile[]}
*/
const staff = [
{
name: "Graham",
avatar: GrahamAvatar,
github: "InHuOfficial",
description: "Open for new opportunities in 2023",
twitter: "Grahamthedev",
blogUrl: "https://dev.to/inhuofficial",
contributions: 0,
},
{
name: "Ali Reza",
avatar: AliRezaAvatar,
github: "AliReza1083",
description:
"Passionate in Coding, Refugee Boy, Threads about Web Development",
twitter: "Ali_Developer05",
blogUrl: "https://linkfree.eddiehub.io/AliReza1083",
contributions: 0,
},
{
name: "Avie",
avatar: AvieAvatar,
github: "avie-dev",
description:
"BrSE in Japan(YNS)🌸 | Community leader@ http://ossph.org | Community manager| @4ccommunityhq| open source | Spaces Host | Sharing about Tech💻, Japan🇯🇵 & Art",
twitter: "AvieDev",
blogUrl: "",
contributions: 0,
},
{
name: "Dunsin",
avatar: DunsinAvatar,
github: "Dun-sin",
description:
"🧑💻18|⚙Building https://code-magic.vercel.app and https://whischat.vercel.app |☯Being real about stuff |🥑Open Source |🎖️Tweeting from my POV |🧒She/Her",
twitter: "DunsinWebDev",
blogUrl: "https://linktr.ee/DunsinCodes",
contributions: 0,
},
{
name: "Francesco Ciulla",
avatar: FrancescoAvatar,
github: "FrancescoXX",
description:
"·Follow me, I will help you with Web3 & DevRel· Building a 1M Community 19%· Docker Captain |@dailydotdev · Public Speaker· 4C founder @4ccommunityhq",
twitter: "FrancescoCiull4",
youtube: "https://www.youtube.com/c/FrancescoCiulla",
twitch: "https://www.twitch.tv/francesco_ciulla",
blogUrl: "https://discord.com/invite/TcmA2kbJeA",
contributions: 10,
},
{
name: "JAX",
avatar: JaxAvatar,
github: "44jax44",
description:
"I will help you become a better communicator | Tweets on all aspects of communication| Life Health & Fitness Coach | Can communicate in 🇬🇧 🇫🇷 🇱🇧 🇪🇸 🇵🇹",
twitter: "44jax44",
blogUrl: "https://linktr.ee/44jax44",
contributions: 0,
},
{
name: "Pradumna Saraf",
avatar: PradumnaAvatar,
github: "Pradumnasaraf",
description: "Open Source Advocate | EddieHub Ambassador",
twitter: "pradumna_saraf",
blogUrl: "",
contributions: 0,
},
{
name: "Sumit",
avatar: SumitAvatar,
github: "sumitsaurabh927",
description:
"Explaining tech the way I wish I was taught | Tweets on Javascript, React, Open Source, and Web Development |🎙 Spaces | 🥑 Open Source advocate",
twitter: "sumitsaurabh927",
blogUrl: "https://sumitsaurabh.hashnode.dev/",
contributions: 0,
},
{
name: "Tobiloba Adedeji",
avatar: TobiAvatar,
github: "tobySolutions",
description:
"Frontend Engineer | Accessibility Advocate l Developer Advocate at Million.js",
twitter: "toby_solutions",
blogUrl: "",
linkedin: "tobiloba-adedeji",
contributions: 34,
},
{
name: "Louëlla Creemers",
avatar: LouellaAvatar,
github: "lovelacecoding",
linkedin: "louelladev",
description:
"Web Developer 🌍 | Public Speaker 🗣️ | .NET & C# 🖥️ | Dad Joke Enthusiast 🤓 | Learning and Joking With You While Working and Studying CS",
twitter: "lovelacecoding",
twitch: "https://www.twitch.tv/lovelacecoding",
blogUrl: "https://lovelacecoding.hashnode.dev/",
contributions: null,
},
{
name: "Madhu Saini",
avatar: MadhuAvatar,
github: "MadhuSaini22",
description: "Full Stack Developer | Open Source Enthusiast",
twitter: "MadhuSaini22",
blogUrl: "https://madhusaini46810.wixsite.com/original",
linkedin: "madhu-saini",
contributions: 24,
},
{
name: "Krupali",
description:
"20 🚀 || talking about blogging and communities|| web3 and web dev learner | summarising spaces in threads | chillin' in discord servers |books 💜",
avatar: KrupaliAvatar,
github: "krupalitrivedi",
twitter: "chai_really",
blogUrl: "",
linkedin: "",
contributions: null,
},
{
name: "K. Eldreth aka Elder",
github: "",
description: "Just another bystander; Lead Dev in robotics",
twitter: "Elder_Youth",
blogUrl: "",
avatar: ElderAvatar,
linkedin: "",
contributions: null,
},
{
name: "Tiya Bansal",
github: "Tiyabansal",
description: "SWE Intern @JPMC, UK | Cloud and Devops | IT Undergraduate",
twitter: "TiyaTwts",
blogUrl: "",
avatar: TiyaAvatar,
linkedin: "tiya-bansal",
contributions: null,
},
].sort((a, b) => (a.name > b.name ? 1 : -1))
export default staff
// module.exports = staff
================================================
FILE: src/data/videos.json
================================================
{
"videos": [
{
"videoId": "az-ILjdFCe8",
"videoTitle": "4C Website - Let's code it",
"videoAuthor": "Francesco Ciulla"
},
{
"videoId": "uIS3hlHJ05o",
"videoTitle": "Communities & Content Creators - 4C",
"videoAuthor": "Francesco Ciulla"
},
{
"videoId": "o5UxTeN6OCg",
"videoTitle": "4Castle event - Let's GEEK out together",
"videoAuthor": "Francesco Ciulla"
}
]
}
================================================
FILE: src/pages/_app.js
================================================
import "styles/global.css"
import React, { useEffect } from "react"
import Head from "next/head"
import { AnimatePresence } from "framer-motion"
import { Poppins, Red_Hat_Display as RedHatDisplay } from "@next/font/google"
import pages from "data/navbar"
import GoToTop from "components/GoToTop"
const poppins = Poppins({
weight: ["400", "500", "600"],
variable: "--font-poppins",
subsets: ["latin"],
display: "swap",
})
const redHatDisplay = RedHatDisplay({
weight: ["700"],
variable: "--font-redhat",
subsets: ["latin"],
display: "swap",
})
export default function App({ Component, pageProps }) {
useEffect(() => {
const preloads = [
...pages.map((page) => page.href),
"/",
]
preloads.forEach((href) => {
const link = document.createElement("link")
link.rel = "prefetch"
link.href = href
document.head.appendChild(link)
})
})
return (
<div className={`${poppins.variable} ${redHatDisplay.variable} font-sans`}>
<Head>
<meta
name="description"
content="4C: The Cool Community for Content Creators"
/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
</Head>
<AnimatePresence
mode="wait"
onExitComplete={() => window.scrollTo(0, 0)}
>
<Component {...pageProps} />
</AnimatePresence>
<GoToTop/>
</div>
)
}
================================================
FILE: src/pages/_document.js
================================================
import Document, { Html, Head, Main, NextScript } from "next/document"
class MyDocument extends Document {
render() {
return (
<Html lang="en">
<Head>
<link
rel="manifest"
crossOrigin="use-credentials"
href="/manifest.json"
/>
<link rel="apple-touch-icon" href="/icon.png"></link>
<meta name="theme-color" content="#fff" />
</Head>
<body className="overflow-x-hidden">
<Main />
<NextScript />
</body>
</Html>
)
}
}
export default MyDocument
================================================
FILE: src/pages/active-members.js
================================================
import Layout from "components/Layout"
import ActiveMembers from "components/ActiveMembers"
export default function Home() {
return (
<Layout className="flex flex-col justify-start mt-[7rem]">
<ActiveMembers />
</Layout>
)
}
================================================
FILE: src/pages/index.js
================================================
import Blogs from "components/blog-posts"
import CommunityPartners from "components/CommunityPartners"
import Faq from "components/faq"
import GetActivities from "components/GetActivities"
import GetVideos from "components/GetVideos"
import Layout from "components/Layout"
import Main from "components/Main"
import { main } from "data/homepage"
import { useRouter } from "next/router"
import React from "react"
export default function Home() {
const router = useRouter()
if (typeof window !== "undefined") {
if (router.pathname === "/") {
localStorage.removeItem("active")
}
}
return (
<div>
<Layout className="flex flex-col justify-center mt-[13rem] md:mt-[5rem]">
<Main {...main} />
<div className="flex flex-col gap-16">
<GetActivities />
<GetVideos />
<Blogs />
<Faq />
</div>
<CommunityPartners />
</Layout>
</div>
)
}
================================================
FILE: src/pages/joinourteam.js
================================================
import Layout from "components/Layout"
import JoinOurTeam from "components/JoinOurTeam"
export default function joinOurTeam() {
return (
<Layout className="flex flex-col justify-center mt-[9rem]">
<JoinOurTeam />
</Layout>
)
}
================================================
FILE: src/pages/projects.js
================================================
import Layout from "components/Layout"
import GetProjects from "components/GetProjects"
export default function joinOurTeam() {
return (
<Layout className="flex flex-col justify-center mt-[7rem]">
<GetProjects />
</Layout>
)
}
================================================
FILE: src/pages/staff.js
================================================
import Layout from "components/Layout"
import Staff from "components/Staff"
export default function Home() {
return (
<Layout className="flex flex-col justify-start mt-[7rem]">
<Staff />
</Layout>
)
}
================================================
FILE: src/public/manifest.json
================================================
{
"theme_color": "#FFF7ED",
"background_color": "#EA580C",
"display": "standalone",
"scope": "/",
"start_url": "/",
"name": "4c",
"description": "The Cool Community For Content Creators",
"short_name": "4c",
"icons": []
}
================================================
FILE: src/scripts/img.js
================================================
/* eslint-disable eslint-comments/disable-enable-pair */
/* eslint-disable @typescript-eslint/no-var-requires */
const activemembers = require("../data/activemembers")
const blogs = require("../data/blog.js")
const projects = require("../data/projects.json")
const staff = require("../data/staff")
const { azelf } = require("azelf")
const path = require("path")
const { rm } = require("fs/promises")
const trevenant = new (require("trevenant")).Trevenant()
// a function that makes sentences become url friendly endpoints
function urlify(text) {
return text
.toString()
.toLowerCase()
.replace(/\s+/g, "-") // Replace spaces with -
.replace(/[^\w-]+/g, "") // Remove all non-word chars
.replace(/--+/g, "-") // Replace multiple - with single -
.replace(/^-+/, "") // Trim - from start of text
.replace(/-+$/, "") // Trim - from end of text
}
async function megaAzelf(url, name, type) {
trevenant.info(`Processing ${name}`)
await azelf(url, name, {
directory: path.join(__dirname, "..", "assets", "sources", type),
webp: true,
quality: 60,
})
trevenant.success(`Finished processing ${name}`)
}
async function main() {
trevenant.info("Cleaning up old images")
await rm(path.join(__dirname, "..", "assets", "sources"), {
recursive: true,
force: true,
})
for await (const member of activemembers.base) {
megaAzelf(
`https://github.com/${member.github}.png`,
`${member.github}.webp`,
"activemembers",
)
}
for await (const member of staff) {
megaAzelf(
`https://github.com/${member.github}.png`,
`${member.github}.webp`,
"staff",
)
}
for await (const post of blogs) {
trevenant.info(`Processing ${post.title}`)
if (post.screenshot === "") return trevenant.warn(`No screenshot for ${post.title}`)
await azelf(post.screenshot, `${urlify(post.title)}.webp`, {
directory: path.join(__dirname, "..", "assets", "sources", "blog"),
webp: true,
quality: 60,
})
}
for await (const project of projects.projects) {
trevenant.info(`Processing ${project.titles}`)
if (project.screenshot === "") return trevenant.warn(`No screenshot for ${project.titles}`)
await azelf(project.screenshot, `${urlify(project.title)}.webp`, {
directory: path.join(__dirname, "..", "assets", "sources", "projects"),
webp: true,
quality: 60,
})
}
}
main()
================================================
FILE: src/styles/global.css
================================================
@tailwind base;
@tailwind components;
@tailwind utilities;
h1,
h2,
h3,
h4,
h5,
h6 {
@apply font-sans;
font-family: var(--font-redhat)
}
.hamburger {
display: block;
}
.bg-theme {
background: rgb(68, 18, 115);
background: linear-gradient(
34deg,
rgba(68, 18, 115, 1) 0%,
rgba(5, 30, 75, 1) 21%,
rgba(52, 79, 141, 1) 58%,
rgba(106, 137, 223, 1) 80%,
rgba(145, 227, 226, 1) 99%
);
}
.hov-bg-theme:hover {
box-shadow: 0 0 35px rgba(255, 255, 255, 0.8);
}
.text-theme {
color: #fff;
}
@media (min-width: 768px) {
.text-theme {
color: #fff;
}
}
@media (min-width: 1024px) {
.hamburger {
display: none;
}
}
@media (max-width: 613px) {
body .before-multiselect{
@apply bg-transparent shadow-none outline-none backdrop-blur-none;
}
body #multiselectContainerReact .searchWrapper input {
@apply bg-[#FEFEFE] text-[#314c89] w-full border-slate-200 px-3 outline-none placeholder:text-slate-700 contrast-more:border-slate-400 contrast-more:placeholder:text-slate-500 rounded-3xl bg-opacity-[.2] shadow backdrop-blur-3xl ml-0 p-2;
}
body #multiselectContainerReact .searchWrapper .chip {
@apply mb-3;
}
.searchIcon {
@apply absolute right-8 bottom-[15px];
}
}
@media (max-width: 430px){
.backToTop{
right: 20px;
}
}
@media (max-width: 400px) {
.group {
width: 339px;
}
.main-title {
font-size: 2.1875rem;
margin-top: 1.25rem;
}
.main-description {
text-align: justify;
font-size: 0.9375rem;
}
.backToTop{
right: 10px;
}
}
@media (max-width: 358px) {
.group {
width: 310px;
}
}
@media (max-width: 310px) {
.projectContainer {
width: 93vw;
}
.group {
width: 95vw;
}
.projDetail {
overflow-x: hidden;
}
}
/* .details summary::after {
content: ">";
} */
.headTitle {
@apply text-2xl md:text-2xl lg:text-3xl;
}
.btn {
@apply inline-flex cursor-pointer items-center justify-center gap-2 rounded-md px-8 py-3 font-semibold no-underline antialiased outline-none transition duration-200 ease-in-out focus:ring-2 focus:ring-indigo-600 focus:ring-offset-2;
}
.btn-primary {
@apply translate-x-0 transform rounded-full rounded-bl-none bg-gray-900 font-medium text-white shadow-2xl hover:translate-y-1 hover:bg-[#7289DA] hover:shadow-md;
}
.btn-twitter {
@apply translate-x-0 transform rounded-full rounded-bl-none bg-gray-900 font-medium text-white shadow-2xl hover:translate-y-1 hover:bg-[rgb(29,161,242)] hover:shadow-md;
}
#multiselectContainerReact {
@apply w-full border-slate-200 px-2 outline-none placeholder:text-slate-700 contrast-more:border-slate-400 contrast-more:placeholder:text-slate-500;
}
#multiselectContainerReact .searchWrapper{
@apply text-[#314c89] border-none flex flex-wrap items-center h-auto;
}
#multiselectContainerReact .searchWrapper .chip{
@apply mb-0;
}
#multiselectContainerReact .searchWrapper input{
@apply placeholder:text-slate-700 text-white font-bold ml-2 mt-0;
}
#get-projects-scroll{
overflow: hidden;
}
#four-c-logo{
height: auto;
width: 56px;
}
::-webkit-scrollbar {
width: 12px; /* Width of the scrollbar */
}
::-webkit-scrollbar-track {
background: #f1f1f1; /* Color of the track */
}
::-webkit-scrollbar-thumb {
background-color: #7aace0 ; /* Color of the scroll thumb */
border-radius: 13px;
}
================================================
FILE: src/utils/filterUsers.js
================================================
export const FilterUsers = (users, target) => {
const filteredUsers = []
for (let i = 0; i < users.length; i++) {
const name = users[i].name.toLowerCase()
const matcher = target.toLowerCase()
if (name.includes(matcher)) {
filteredUsers.push(users[i])
}
}
return filteredUsers
}
export const FilterUsersByNameAndDesc = (users, target) => {
const regex = new RegExp(target, "i")
return users.filter((user) =>
regex.test(user.name) ||
regex.test(user.description))
}
================================================
FILE: tailwind.config.js
================================================
// eslint-disable-next-line @typescript-eslint/no-var-requires
const { fontFamily: _fontFamily } = require("tailwindcss/defaultTheme")
/**
* @type {import("tailwindcss").Config}
*/
const tailwindConfig = {
content: [
"./src/**/*.{js,ts,jsx,tsx}",
],
theme: {
container: {
center: true,
padding: "1rem",
},
extend: {
screens: {
bigScreen: "1100px",
laptop: "801px",
medium: "450px",
break: "500px",
mobile: "300px",
},
fontFamily: {
sans: ["var(--font-poppins)", ..._fontFamily.sans],
},
dropShadow: {
"3xl": "0 0 10px #0000006e",
},
maxWidth: {
bodyContainer: "1300px",
},
},
},
variants: {},
plugins: [
require("@tailwindcss/typography"),
require("@tailwindcss/line-clamp"),
],
}
module.exports = tailwindConfig
gitextract_sgk63q96/ ├── .editorconfig ├── .eslintrc.js ├── .github/ │ ├── ISSUE_TEMPLATE/ │ │ ├── bug_report.yml │ │ ├── config.yml │ │ ├── documentation.yml │ │ ├── feature_request.yml │ │ └── other.yml │ ├── PULL_REQUEST_TEMPLATE/ │ │ └── pull_request_template.md │ ├── dependabot.yml │ └── workflows/ │ ├── greetings.yml │ ├── json-syntax-check.yml │ ├── lint.yml │ └── release.yml ├── .gitignore ├── .gitpod.yml ├── .husky/ │ ├── commit-msg │ └── pre-commit ├── .releaserc.js ├── .vscode/ │ ├── extensions.json │ └── settings.json ├── CHANGELOG.md ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── commitlint.config.js ├── docs/ │ └── theme/ │ └── README.md ├── jsconfig.json ├── next.config.mjs ├── package.json ├── postcss.config.js ├── renovate.json ├── src/ │ ├── 4c.config.js │ ├── components/ │ │ ├── ActiveMembers.js │ │ ├── BlogCard.js │ │ ├── CommunityPartners.js │ │ ├── FaqAccordian.js │ │ ├── Footer.jsx │ │ ├── Form/ │ │ │ ├── JoinUsForm.js │ │ │ └── validation/ │ │ │ └── formSchema.js │ │ ├── GetActivemembers.js │ │ ├── GetActivities.js │ │ ├── GetProjects.js │ │ ├── GetStaff.js │ │ ├── GetVideos.js │ │ ├── GoToTop.js │ │ ├── Header.js │ │ ├── JoinOurTeam.jsx │ │ ├── Layout.js │ │ ├── Loading.jsx │ │ ├── Main.js │ │ ├── ProfileCard.jsx │ │ ├── SocialLink.jsx │ │ ├── Staff.js │ │ ├── Title.js │ │ ├── Users.js │ │ ├── blog-posts.js │ │ └── faq.js │ ├── data/ │ │ ├── activemembers.js │ │ ├── blog.js │ │ ├── events.json │ │ ├── faq.json │ │ ├── homepage.js │ │ ├── navbar.js │ │ ├── partnerCommunities.json │ │ ├── projects.json │ │ ├── stacks.json │ │ ├── staff.js │ │ └── videos.json │ ├── pages/ │ │ ├── _app.js │ │ ├── _document.js │ │ ├── active-members.js │ │ ├── index.js │ │ ├── joinourteam.js │ │ ├── projects.js │ │ └── staff.js │ ├── public/ │ │ └── manifest.json │ ├── scripts/ │ │ └── img.js │ ├── styles/ │ │ └── global.css │ └── utils/ │ └── filterUsers.js └── tailwind.config.js
SYMBOL INDEX (19 symbols across 16 files)
FILE: next.config.mjs
method redirects (line 10) | async redirects() {
FILE: src/components/CommunityPartners.js
function CommunityPartners (line 5) | function CommunityPartners() {
FILE: src/components/Footer.jsx
function Footer (line 5) | function Footer() {
FILE: src/components/GetProjects.js
function getSelectedValues (line 42) | function getSelectedValues() {
FILE: src/components/JoinOurTeam.jsx
function JoinOurTeam (line 4) | function JoinOurTeam() {
FILE: src/components/Loading.jsx
function Loading (line 3) | function Loading() {
FILE: src/components/Title.js
function Title (line 3) | function Title({ heading }) {
FILE: src/data/activemembers.js
function sorting (line 257) | function sorting(arraytobesorted) {
FILE: src/pages/_app.js
function App (line 23) | function App({ Component, pageProps }) {
FILE: src/pages/_document.js
class MyDocument (line 3) | class MyDocument extends Document {
method render (line 4) | render() {
FILE: src/pages/active-members.js
function Home (line 4) | function Home() {
FILE: src/pages/index.js
function Home (line 12) | function Home() {
FILE: src/pages/joinourteam.js
function joinOurTeam (line 4) | function joinOurTeam() {
FILE: src/pages/projects.js
function joinOurTeam (line 4) | function joinOurTeam() {
FILE: src/pages/staff.js
function Home (line 4) | function Home() {
FILE: src/scripts/img.js
function urlify (line 15) | function urlify(text) {
function megaAzelf (line 26) | async function megaAzelf(url, name, type) {
function main (line 38) | async function main() {
Condensed preview — 81 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (169K chars).
[
{
"path": ".editorconfig",
"chars": 166,
"preview": "# editorconfig.org\nroot = true\n\n[*]\nindent_style = space\nindent_size = 2\nend_of_line = lf\ncharset = utf-8\ntrim_trailing_"
},
{
"path": ".eslintrc.js",
"chars": 1034,
"preview": "/**\n * @type {import(\"eslint\").Linter.Config}\n */\nconst eslintConfig = {\n env: {\n browser: true,\n commonjs: true,"
},
{
"path": ".github/ISSUE_TEMPLATE/bug_report.yml",
"chars": 1601,
"preview": "name: Bug Report\ndescription: Create a report to help us improve\ntitle: \"[Bug]: \"\nlabels: [\"🚦 status: awaiting triage\"]\n"
},
{
"path": ".github/ISSUE_TEMPLATE/config.yml",
"chars": 287,
"preview": "# blank_issues_enabled: false\n# contact_links:\n# - name: 4C Discussions\n# url: https://github.com/FrancescoXX/4c-s"
},
{
"path": ".github/ISSUE_TEMPLATE/documentation.yml",
"chars": 1240,
"preview": "name: \"Documentation Report\"\ndescription: Suggest improvements for the docs\ntitle: '[Docs]: '\nlabels: ['🚦 status: awaiti"
},
{
"path": ".github/ISSUE_TEMPLATE/feature_request.yml",
"chars": 1557,
"preview": "name: Feature Request\ndescription: Suggest an idea for this project\ntitle: '[Feat]: '\nlabels: ['🚦 status: awaiting triag"
},
{
"path": ".github/ISSUE_TEMPLATE/other.yml",
"chars": 1202,
"preview": "name: Other\ndescription: Use this, Please DO NOT create blank issues\ntitle: '[Other]: '\nlabels: ['🚦 status: awaiting tri"
},
{
"path": ".github/PULL_REQUEST_TEMPLATE/pull_request_template.md",
"chars": 2015,
"preview": "## Related Issue\n\nCloses: # <!-- issue number that will be closed through this PR -->\n\n### Describe the changes you've m"
},
{
"path": ".github/dependabot.yml",
"chars": 143,
"preview": "version: 2\nupdates:\n # Update GitHub Actions\n - package-ecosystem: \"github-actions\"\n directory: \"/\"\n schedule:\n "
},
{
"path": ".github/workflows/greetings.yml",
"chars": 811,
"preview": "name: Greetings\n\non: [pull_request_target, issues]\n\njobs:\n greeting:\n runs-on: ubuntu-latest\n permissions:\n "
},
{
"path": ".github/workflows/json-syntax-check.yml",
"chars": 290,
"preview": "name: JSON Syntax Check\n\non:\n push:\n paths:\n - \"**.json\"\n pull_request:\n\njobs:\n test:\n runs-on: ubuntu-lat"
},
{
"path": ".github/workflows/lint.yml",
"chars": 360,
"preview": "name: Lint\n\non:\n - push\n - pull_request\n\njobs:\n lint:\n name: Lint Before Release\n runs-on: ubuntu-latest\n\n s"
},
{
"path": ".github/workflows/release.yml",
"chars": 1266,
"preview": "name: Release\non:\n push:\n branches:\n - main\n\njobs:\n lint:\n name: Lint Before Release\n if: github.reposit"
},
{
"path": ".gitignore",
"chars": 8098,
"preview": "package-lock.json\n\n\n# Created by https://www.toptal.com/developers/gitignore/api/git,node,react,nextjs,vercel,dotenv,yar"
},
{
"path": ".gitpod.yml",
"chars": 467,
"preview": "# List the start up tasks. Learn more https://www.gitpod.io/docs/config-start-tasks/\ntasks:\n - name: Development Server"
},
{
"path": ".husky/commit-msg",
"chars": 89,
"preview": "#!/usr/bin/env sh\n . \"$(dirname -- \"$0\")/_/husky.sh\"\n\n npx --no -- commitlint --edit \"$1\""
},
{
"path": ".husky/pre-commit",
"chars": 67,
"preview": "#!/usr/bin/env sh\n. \"$(dirname \"$0\")/_/husky.sh\"\n\nnpm run lint:fix\n"
},
{
"path": ".releaserc.js",
"chars": 597,
"preview": "module.exports = {\n branches: [{ name: \"main\" }],\n plugins: [\n [\n \"@semantic-release/commit-analyzer\",\n {"
},
{
"path": ".vscode/extensions.json",
"chars": 78,
"preview": "{\n \"recommendations\": [\"evolution-gaming.evolution-gaming--vscode-eslint\"]\n}\n"
},
{
"path": ".vscode/settings.json",
"chars": 209,
"preview": "{\n \"eslint.enable\": true,\n \"editor.formatOnSave\": false,\n \"eslint.validate\": [\n \"javascript\",\n \"javascriptreact"
},
{
"path": "CHANGELOG.md",
"chars": 13364,
"preview": "# [0.22.0](https://github.com/FrancescoXX/4c-site/compare/v0.21.4...v0.22.0) (2024-10-22)\n\n\n### Features\n\n* add detailed"
},
{
"path": "CODE_OF_CONDUCT.md",
"chars": 5511,
"preview": "# Contributor Covenant Code of Conduct\n\n## Our Pledge\n\nWe as members, contributors, and leaders pledge to make participa"
},
{
"path": "CONTRIBUTING.md",
"chars": 5604,
"preview": "# ✨ Contributing to this project\n\nFirst of all, thanks for taking the time to contribute! 🎉👍\n\n## 💣 Reporting Bugs\n\nThis "
},
{
"path": "LICENSE",
"chars": 1084,
"preview": "MIT License\n\nCopyright (c) 2021 - Present, Francesco Ciulla\n\nPermission is hereby granted, free of charge, to any person"
},
{
"path": "README.md",
"chars": 5891,
"preview": "# 4C (The Cool Community of Content Creators)\n\nImagine **The Cool Community For Content Creators** or **4C**, as a chill"
},
{
"path": "commitlint.config.js",
"chars": 66,
"preview": "module.exports = { extends: [\"@commitlint/config-conventional\"] }\n"
},
{
"path": "docs/theme/README.md",
"chars": 4202,
"preview": "# 💎 4C style guide\n\n## Introduction\n\nThis document is a guide to the 4C style guide. It contains all the information you"
},
{
"path": "jsconfig.json",
"chars": 530,
"preview": "{\n \"compileOnSave\": true,\n \"compilerOptions\": {\n \"baseUrl\": \"src/\",\n \"rootDir\": \".\",\n \"declaration\": true,\n "
},
{
"path": "next.config.mjs",
"chars": 742,
"preview": "import million from 'million/compiler';\n\n/** @type {import(\"next\").NextConfig} */\nconst nextConfig = {\n images: {\n d"
},
{
"path": "package.json",
"chars": 2820,
"preview": "{\n \"name\": \"4c\",\n \"version\": \"0.0.0\",\n \"private\": true,\n \"description\": \"4C Community: Website, Media Kit and More\","
},
{
"path": "postcss.config.js",
"chars": 82,
"preview": "module.exports = {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n}\n"
},
{
"path": "renovate.json",
"chars": 253,
"preview": "{\n \"extends\": [\n \"config:recommended\"\n ],\n \"packageRules\": [\n {\n \"matchUpdateTypes\": [\n \"minor\",\n "
},
{
"path": "src/4c.config.js",
"chars": 581,
"preview": "module.exports = {\n siteName: \"4C\",\n title: {\n short: \"4C\",\n long: \"4C - Creator Community\",\n },\n description:"
},
{
"path": "src/components/ActiveMembers.js",
"chars": 2459,
"preview": "import React, { useState } from \"react\"\nimport GetActivemembers from \"components/GetActivemembers\"\nimport Users from \"co"
},
{
"path": "src/components/BlogCard.js",
"chars": 1541,
"preview": "import React from \"react\"\nimport { FaTwitter, FaLink } from \"react-icons/fa\"\nimport blogs from \"data/blog\"\nimport Image "
},
{
"path": "src/components/CommunityPartners.js",
"chars": 1610,
"preview": "import Image from \"next/image\"\nimport Link from \"next/link\"\nimport React from \"react\"\nimport partnerCommunities from \".."
},
{
"path": "src/components/FaqAccordian.js",
"chars": 1474,
"preview": "import React, { useState } from \"react\"\nimport { AnimatePresence, motion } from \"framer-motion\"\n\nimport { IoIosArrowDown"
},
{
"path": "src/components/Footer.jsx",
"chars": 1967,
"preview": "import React from \"react\"\nimport { FaDiscord, FaGithub, FaLinkedin } from \"react-icons/fa\"\nimport { FaXTwitter } from \"r"
},
{
"path": "src/components/Form/JoinUsForm.js",
"chars": 8765,
"preview": "import React from \"react\"\nimport router from \"next/router\"\nimport { useFormik } from \"formik\"\nimport { formSchema } from"
},
{
"path": "src/components/Form/validation/formSchema.js",
"chars": 479,
"preview": "import * as Yup from \"yup\"\nexport const formSchema = Yup.object().shape({\n email: Yup.string().email().required(\"Requir"
},
{
"path": "src/components/GetActivemembers.js",
"chars": 935,
"preview": "import { motion, useReducedMotion } from \"framer-motion\"\nimport ProfileCard from \"components/ProfileCard\"\nimport React f"
},
{
"path": "src/components/GetActivities.js",
"chars": 2293,
"preview": "import eventList from \"../data/events.json\"\nimport Title from \"./Title\"\nimport { FaTwitter, FaDiscord } from \"react-icon"
},
{
"path": "src/components/GetProjects.js",
"chars": 11121,
"preview": "import React, { useState, useEffect } from \"react\"\nimport allProjects from \"data/projects.json\"\nimport Title from \"compo"
},
{
"path": "src/components/GetStaff.js",
"chars": 930,
"preview": "import { motion, useReducedMotion } from \"framer-motion\"\nimport ProfileCard from \"components/ProfileCard\"\n\nconst GetStaf"
},
{
"path": "src/components/GetVideos.js",
"chars": 1772,
"preview": "import React from \"react\"\nimport allVideos from \"data/videos.json\"\nimport Title from \"components/Title\"\nimport Image fro"
},
{
"path": "src/components/GoToTop.js",
"chars": 1727,
"preview": "import React, { useEffect, useState } from \"react\"\nimport { FaArrowUp } from \"react-icons/fa\"\n\nconst GoToTop = () => {\n "
},
{
"path": "src/components/Header.js",
"chars": 3655,
"preview": "import { RiMenu4Fill, RiCloseFill } from \"react-icons/ri\"\nimport { useState, useEffect } from \"react\"\nimport Link from \""
},
{
"path": "src/components/JoinOurTeam.jsx",
"chars": 415,
"preview": "import React, { useState } from \"react\"\nimport JoinUsForm from \"components/Form/JoinUsForm\"\n\nfunction JoinOurTeam() {\n "
},
{
"path": "src/components/Layout.js",
"chars": 1573,
"preview": "import Head from \"next/head\"\nimport { NextSeo } from \"next-seo\"\nimport Header from \"components/Header\"\nimport config fro"
},
{
"path": "src/components/Loading.jsx",
"chars": 1588,
"preview": "import React from \"react\"\n\nfunction Loading() {\n return (\n <button\n disabled\n type=\"button\"\n classNam"
},
{
"path": "src/components/Main.js",
"chars": 1690,
"preview": "const Main = ({ eyebrow, title, description, primaryLink, twitterLink }) => {\n return (\n <div>\n <div className="
},
{
"path": "src/components/ProfileCard.jsx",
"chars": 2136,
"preview": "import React from \"react\"\nimport {\n FaBlog,\n FaGithub,\n FaYoutube,\n FaTwitch,\n FaLinkedin,\n} from \"react-icons/fa\"\n"
},
{
"path": "src/components/SocialLink.jsx",
"chars": 294,
"preview": "import React from \"react\"\n\nconst SocialLink = ({ link, Icon, label }) => (\n <a href={link} target=\"_blank\" rel=\"noopene"
},
{
"path": "src/components/Staff.js",
"chars": 2595,
"preview": "import React, { useState } from \"react\"\nimport GetStaff from \"components/GetStaff\"\nimport Users from \"components/Users\"\n"
},
{
"path": "src/components/Title.js",
"chars": 244,
"preview": "import React from \"react\"\n\nfunction Title({ heading }) {\n // Main Heading component\n return (\n <>\n <h1 classNa"
},
{
"path": "src/components/Users.js",
"chars": 660,
"preview": "import ProfileCard from \"components/ProfileCard\"\n\nconst Contributors = ({ users }) => {\n if (users.length === 0) {\n "
},
{
"path": "src/components/blog-posts.js",
"chars": 268,
"preview": "import BlogCard from \"components/BlogCard\"\nimport Title from \"components/Title\"\n\nconst Blogs = () => {\n return (\n <d"
},
{
"path": "src/components/faq.js",
"chars": 528,
"preview": "import Faqs from \"data/faq.json\"\nimport FaqAccordian from \"components/FaqAccordian\"\nimport Title from \"components/Title\""
},
{
"path": "src/data/activemembers.js",
"chars": 7313,
"preview": "import AyushAvatar from \"assets/sources/activemembers/Aayushd18.webp\"\nimport AdetoyeAvatar from \"assets/sources/activeme"
},
{
"path": "src/data/blog.js",
"chars": 1045,
"preview": "import FreeWeb3Resources from \"assets/sources/blog/free-web3-resources-demo-blog.webp\"\nimport ContentCreator from \"asset"
},
{
"path": "src/data/events.json",
"chars": 388,
"preview": "{\n \"events\": [\n {\n \"name\": \"4Call\",\n \"image\": \"https://user-images.githubusercontent.com/86878236/21095006"
},
{
"path": "src/data/faq.json",
"chars": 1266,
"preview": "[\n {\n \"questions\": \"What does \\\"4C\\\" stands for?\",\n \"answers\": \"4C stands for \\\"Cool Community of Content Creator"
},
{
"path": "src/data/homepage.js",
"chars": 1629,
"preview": "import { FaDiscord } from \"react-icons/fa\"\nimport { FaXTwitter } from \"react-icons/fa6\"\nimport \"react-toastify/dist/Reac"
},
{
"path": "src/data/navbar.js",
"chars": 220,
"preview": "const pages = [\n {\n href: \"/active-members\",\n pageName: \"Active Members\",\n },\n {\n href: \"/projects\",\n pag"
},
{
"path": "src/data/partnerCommunities.json",
"chars": 281,
"preview": "[\n {\n \"logo\": \"https://user-images.githubusercontent.com/81684710/215572719-5bbd7e27-24c4-43bb-a261-33dd368e93bf.png"
},
{
"path": "src/data/projects.json",
"chars": 10721,
"preview": "{\n \"projects\": [\n {\n \"name\": \"Francesco Ciulla\",\n \"title\": \"FREE Web3 Resources\",\n \"screenshot\": \"htt"
},
{
"path": "src/data/stacks.json",
"chars": 480,
"preview": "{\n \"stack\": [\n {\n \"key\": 0,\n \"name\": \"All\"\n },\n {\n \"key\": 1,\n \"name\": \"HTML\"\n },\n {\n"
},
{
"path": "src/data/staff.js",
"chars": 5789,
"preview": "import JaxAvatar from \"assets/sources/staff/44jax44.webp\"\nimport AliRezaAvatar from \"assets/sources/staff/AliReza1083.we"
},
{
"path": "src/data/videos.json",
"chars": 448,
"preview": "{\n \"videos\": [\n {\n \"videoId\": \"az-ILjdFCe8\",\n \"videoTitle\": \"4C Website - Let's code it\",\n \"videoAuth"
},
{
"path": "src/pages/_app.js",
"chars": 1421,
"preview": "import \"styles/global.css\"\nimport React, { useEffect } from \"react\"\nimport Head from \"next/head\"\nimport { AnimatePresenc"
},
{
"path": "src/pages/_document.js",
"chars": 595,
"preview": "import Document, { Html, Head, Main, NextScript } from \"next/document\"\n\nclass MyDocument extends Document {\n render() {"
},
{
"path": "src/pages/active-members.js",
"chars": 244,
"preview": "import Layout from \"components/Layout\"\nimport ActiveMembers from \"components/ActiveMembers\"\n\nexport default function Hom"
},
{
"path": "src/pages/index.js",
"chars": 943,
"preview": "import Blogs from \"components/blog-posts\"\nimport CommunityPartners from \"components/CommunityPartners\"\nimport Faq from \""
},
{
"path": "src/pages/joinourteam.js",
"chars": 246,
"preview": "import Layout from \"components/Layout\"\nimport JoinOurTeam from \"components/JoinOurTeam\"\n\nexport default function joinOur"
},
{
"path": "src/pages/projects.js",
"chars": 246,
"preview": "import Layout from \"components/Layout\"\nimport GetProjects from \"components/GetProjects\"\n\nexport default function joinOur"
},
{
"path": "src/pages/staff.js",
"chars": 220,
"preview": "import Layout from \"components/Layout\"\nimport Staff from \"components/Staff\"\n\nexport default function Home() {\n return ("
},
{
"path": "src/public/manifest.json",
"chars": 240,
"preview": "{\n \"theme_color\": \"#FFF7ED\",\n \"background_color\": \"#EA580C\",\n \"display\": \"standalone\",\n \"scope\": \"/\",\n \"start_url\":"
},
{
"path": "src/scripts/img.js",
"chars": 2430,
"preview": "/* eslint-disable eslint-comments/disable-enable-pair */\n/* eslint-disable @typescript-eslint/no-var-requires */\nconst a"
},
{
"path": "src/styles/global.css",
"chars": 3350,
"preview": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n @apply font-sans;\n font-family: "
},
{
"path": "src/utils/filterUsers.js",
"chars": 507,
"preview": "export const FilterUsers = (users, target) => {\n const filteredUsers = []\n for (let i = 0; i < users.length; i++) {\n "
},
{
"path": "tailwind.config.js",
"chars": 884,
"preview": "// eslint-disable-next-line @typescript-eslint/no-var-requires\nconst { fontFamily: _fontFamily } = require(\"tailwindcss/"
}
]
About this extraction
This page contains the full source code of the FrancescoXX/4c-site GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 81 files (152.3 KB), approximately 45.3k tokens, and a symbol index with 19 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.