diff --git a/src/pages/code-of-conduct/index.css b/src/pages/code-of-conduct/index.css new file mode 100644 index 00000000..b3064658 --- /dev/null +++ b/src/pages/code-of-conduct/index.css @@ -0,0 +1,415 @@ +:root { + /* Dark Theme Variables */ + --coc-bg-primary: linear-gradient( + 135deg, + #0f0f23 0%, + #1a1a2e 25%, + #16213e 50%, + #0f3460 75%, + #533483 100% + ); + --coc-bg-card: rgba(255, 255, 255, 0.03); + --coc-bg-card-hover: rgba(255, 255, 255, 0.08); + --coc-bg-secondary: rgba(255, 255, 255, 0.05); + --coc-text-primary: #ffffff; + --coc-text-secondary: #e2e8f0; + --coc-text-muted: #cbd5e1; + --coc-text-dim: #94a3b8; + --coc-border: rgba(255, 255, 255, 0.1); + --coc-border-hover: rgba(102, 126, 234, 0.3); + --coc-accent-primary: #667eea; + --coc-accent-secondary: #764ba2; + --coc-shadow: rgba(0, 0, 0, 0.2); + --coc-shadow-hover: rgba(0, 0, 0, 0.3); + + /* This is the dark gradient that will now be used in both modes */ + --coc-accent-gradient: linear-gradient( + 135deg, + var(--coc-accent-primary) 0%, + var(--coc-accent-secondary) 100% + ); +} + +/* Light Theme Variables */ +[data-theme="light"] { + --coc-bg-primary: linear-gradient( + 135deg, + #f8fafc 0%, + #e2e8f0 25%, + #cbd5e1 50%, + #94a3b8 75%, + #64748b 100% + ); + --coc-bg-card: rgba(255, 255, 255, 0.9); + --coc-bg-card-hover: rgba(255, 255, 255, 0.95); + --coc-bg-secondary: rgba(255, 255, 255, 0.8); + --coc-text-primary: #0f172a; + --coc-text-secondary: #1e293b; + --coc-text-muted: #334155; + --coc-text-dim: #64748b; + --coc-border: rgba(0, 0, 0, 0.1); + --coc-border-hover: rgba(102, 126, 234, 0.4); + /* These accent colors are still needed for links */ + --coc-accent-primary: #4f46e5; + --coc-accent-secondary: #7c3aed; + --coc-shadow: rgba(0, 0, 0, 0.1); + --coc-shadow-hover: rgba(0, 0, 0, 0.15); + /* + NOTE: --coc-accent-gradient is NOT defined here, + Thus,it inherits the dark one from :root + */ +} + +/* Force theme variables on specific elements */ +html[data-theme="light"] { + --coc-bg-primary: linear-gradient( + 135deg, + #f8fafc 0%, + #e2e8f0 25%, + #cbd5e1 50%, + #94a3b8 75%, + #64748b 100% + ); + --coc-bg-card: rgba(255, 255, 255, 0.9); + --coc-bg-card-hover: rgba(255, 255, 255, 0.95); + --coc-bg-secondary: rgba(255, 255, 255, 0.8); + --coc-text-primary: #0f172a; + --coc-text-secondary: #1e293b; + --coc-text-muted: #334155; + --coc-text-dim: #64748b; + --coc-border: rgba(0, 0, 0, 0.1); + --coc-border-hover: rgba(102, 126, 234, 0.4); + --coc-shadow: rgba(0, 0, 0, 0.1); + --coc-shadow-hover: rgba(0, 0, 0, 0.15); +} + +/* Animations */ +@keyframes fadeInUp { + from { + opacity: 0; + transform: translateY(30px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes backgroundShift { + 0%, + 100% { + transform: translateX(0px) translateY(0px) scale(1); + } + 25% { + transform: translateX(30px) translateY(-20px) scale(1.02); + } + 50% { + transform: translateX(-10px) translateY(30px) scale(0.98); + } + 75% { + transform: translateX(-25px) translateY(-15px) scale(1.01); + } +} + +/* Main Container */ +.coc-container { + font-family: + "Inter", + -apple-system, + BlinkMacSystemFont, + "Segoe UI", + Roboto, + sans-serif; + background: var(--coc-bg-primary); + color: var(--coc-text-secondary); + min-height: 100vh; + position: relative; + overflow: hidden; + transition: all 0.3s ease; +} + +/* Background Effects */ +.coc-container::before { + content: ""; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: + radial-gradient( + circle at 20% 80%, + rgba(120, 119, 198, 0.08) 0%, + transparent 60% + ), + radial-gradient( + circle at 80% 20%, + rgba(255, 119, 198, 0.06) 0%, + transparent 60% + ), + radial-gradient( + circle at 40% 40%, + rgba(120, 219, 255, 0.04) 0%, + transparent 60% + ); + animation: backgroundShift 25s ease-in-out infinite; + pointer-events: none; +} + +/* Light theme background effects */ +[data-theme="light"] .coc-container::before { + background: + radial-gradient( + circle at 20% 80%, + rgba(79, 70, 229, 0.05) 0%, + transparent 60% + ), + radial-gradient( + circle at 80% 20%, + rgba(124, 58, 237, 0.04) 0%, + transparent 60% + ), + radial-gradient( + circle at 40% 40%, + rgba(236, 72, 153, 0.03) 0%, + transparent 60% + ); +} + +/* Content Wrapper */ +.coc-content-wrapper { + position: relative; + z-index: 1; + max-width: 1200px; + margin: 0 auto; + padding: 4rem 1.5rem; + animation: fadeInUp 0.8s ease-out; +} + +/* Header Section */ +.coc-header { + text-align: center; + margin-bottom: 3rem; +} + +.coc-title { + font-size: 3rem; + font-weight: 900; + background: linear-gradient( + 135deg, + var(--coc-text-primary) 0%, + var(--coc-text-secondary) 30%, + var(--coc-text-muted) 60%, + var(--coc-text-dim) 100% + ); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; + margin-bottom: 1rem; + line-height: 1.1; + letter-spacing: -0.02em; +} + +.coc-last-updated { + font-size: 1rem; + color: var(--coc-text-muted); + margin-bottom: 1.5rem; +} + +.coc-intro { + font-size: 1.125rem; + color: var(--coc-text-muted); + line-height: 1.6; + max-width: 42rem; + margin: 0 auto; +} + +.coc-intro a { + color: var(--coc-accent-primary); + text-decoration: none; + font-weight: 500; + transition: all 0.3s ease; +} + +.coc-intro a:hover { + color: var(--coc-accent-secondary); + text-decoration: underline; +} + +/* Main Content Card */ +.coc-content-card { + background: var(--coc-bg-card); + border: 1px solid var(--coc-border); + border-radius: 1.5rem; + padding: 3rem; + backdrop-filter: blur(20px); + box-shadow: 0 10px 20px var(--coc-shadow); + transition: all 0.3s ease; + margin-bottom: 2rem; +} + +.coc-content-card:hover { + box-shadow: 0 15px 30px var(--coc-shadow-hover); +} + +/* Section Styles */ +.coc-section { + margin-bottom: 2.5rem; +} + +.coc-section:last-child { + margin-bottom: 0; +} + +.coc-section-title { + font-size: 1.75rem; + font-weight: 700; + color: var(--coc-text-primary); + margin-bottom: 1rem; + display: flex; + align-items: center; + gap: 0.5rem; +} + +.coc-section-icon { + font-size: 1.5rem; +} + +.coc-section-content { + color: var(--coc-text-muted); + line-height: 1.8; + font-size: 1rem; +} + +.coc-section-content p { + margin-bottom: 1rem; +} + +.coc-section-content p:last-child { + margin-bottom: 0; +} + +.coc-section-content a { + color: var(--coc-accent-primary); + text-decoration: none; + font-weight: 500; + transition: all 0.3s ease; +} + +.coc-section-content a:hover { + color: var(--coc-accent-secondary); + text-decoration: underline; +} + +/* List Styles */ +.coc-list { + list-style: none; + padding: 0; + margin: 1rem 0; + display: flex; + flex-direction: column; + gap: 1.5rem; +} + +.coc-list-item { + background: var(--coc-bg-secondary); + border: 1px solid var(--coc-border); + border-radius: 1rem; + padding: 1.5rem; + transition: all 0.3s ease; +} + +.coc-list-item:hover { + background: var(--coc-bg-card-hover); + border-color: var(--coc-border-hover); + transform: translateX(4px); +} + +.coc-list-item strong { + color: var(--coc-text-primary); + font-weight: 600; + font-size: 1.125rem; + display: block; + margin-bottom: 0.5rem; +} + +/* Contact Section */ +.coc-contact-section { + background: var(--coc-accent-gradient); + border-radius: 1.5rem; + padding: 2rem; + text-align: center; + box-shadow: 0 10px 20px rgba(102, 126, 234, 0.3); + transition: all 0.3s ease; +} + +.coc-contact-section:hover { + transform: translateY(-4px); + box-shadow: 0 15px 30px rgba(102, 126, 234, 0.4); +} + +.coc-contact-title { + font-size: 1.5rem; + font-weight: 700; + color: white; + margin-bottom: 1rem; +} + +.coc-contact-content { + color: rgba(255, 255, 255, 0.95); + line-height: 1.6; + font-size: 1rem; +} + +.coc-contact-content a { + color: white; + text-decoration: none; + font-weight: 600; + border-bottom: 2px solid rgba(255, 255, 255, 0.5); + transition: all 0.3s ease; +} + +.coc-contact-content a:hover { + border-bottom-color: white; +} + +/* Responsive adjustments */ +@media (max-width: 768px) { + .coc-content-wrapper { + padding: 2rem 1rem; + } + + .coc-title { + font-size: 2rem; + } + + .coc-intro { + font-size: 1rem; + } + + .coc-content-card { + padding: 2rem 1.5rem; + } + + .coc-section-title { + font-size: 1.5rem; + } + + .coc-header { + margin-bottom: 2rem; + } +} + +@media (max-width: 480px) { + .coc-title { + font-size: 1.75rem; + } + + .coc-section-title { + font-size: 1.25rem; + } + + .coc-content-card { + padding: 1.5rem 1rem; + } +} \ No newline at end of file diff --git a/src/pages/code-of-conduct/index.tsx b/src/pages/code-of-conduct/index.tsx index 957c3a6e..f55a4e5c 100644 --- a/src/pages/code-of-conduct/index.tsx +++ b/src/pages/code-of-conduct/index.tsx @@ -1,249 +1,290 @@ -import React, { ReactNode } from "react"; import Layout from "@theme/Layout"; +import React from "react"; import Link from "@docusaurus/Link"; +import "./index.css"; -interface SectionProps { - title: string; - children: ReactNode; -} +const CodeOfConduct: React.FC = () => { + return ( + +
+
+ {/* Header Section */} +
+

Code of Conduct

+

+ Last Updated: 29th Oct 2025 +

+

+ This Code of Conduct outlines our pledge, standards, and + enforcement policies for the RecodeHive community. +

+
-const Section = ({ title, children }: SectionProps) => ( -
-

{title}

- {children} -
-); + {/* Main Content Card */} +
+ {/* Our Pledge */} +
+

+ 🤝 + 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, + 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. +

+
+
-interface ListItemProps { - title: string; - description: ReactNode; -} + {/* Our Standards */} +
+

+ ✨ + 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 +
    • +
-const ListItem = ({ title, description }: ListItemProps) => ( -
  • - {title} -

    {description}

    -
    • -); +

    + 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 +
      • +
    +
    +
    -const LastUpdated = () => ( -

    - Last Updated: 25th May 2025 -

    -); + {/* Enforcement Responsibilities */} +
    +

    + 🛡️ + 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. +

    +
    +
    -const OurPledge = () => ( -
    -

    - 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, - 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. -

    -
    -); + {/* Scope */} +
    +

    + 🌐 + 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. +

    +
    +
    -const OurStandards = () => ( -
    -

    - 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 */} +
    +

    + ⚖️ + Enforcement +

    +
    +

    + Instances of abusive, harassing, or otherwise unacceptable + behavior may be reported to the community leaders responsible + for enforcement at Email. 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. +

    +
    +
    -const EnforcementResponsibilities = () => ( -
    -

    - 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. -

    -
    -); + {/* Enforcement Guidelines */} +
    +

    + 📜 + 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. + 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 + interaction or public communication with the community for a + specified period. Violating these terms may lead to a + permanent ban. +
      • +
    • + 4. Permanent Ban +
      + Community Impact: Demonstrating a pattern + of violation of community standards, including harassment of + an individual, or disparagement of groups. +
      + Consequence: A permanent ban from any sort + of public interaction within the community. +
      • +
    +
    +
    -const 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. -

    -
    -); + {/* Attribution */} +
    +

    + 📚 + Attribution +

    +
    +

    + This Code of Conduct is adapted from the{" "} + + Contributor Covenant + + , version 2.0. +

    +

    + For more details, visit{" "} + + here + + . +

    +
    +
    +
    -const Enforcement = () => ( -
    -

    - Instances of abusive, harassing, or otherwise unacceptable behavior may be - reported to the community leaders responsible for enforcement at Email. - 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. -

    -
    -); - -const EnforcementGuidelines = () => ( -
    -

    - Community leaders will follow these Community Impact Guidelines in - determining the consequences for any action they deem in violation of this - Code of Conduct: -

    -
      - - 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. - - } - /> - - 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. Violating these terms may lead to a - temporary or permanent ban. - - } - /> - - Community Impact: A serious violation of community - standards, including sustained inappropriate behavior. -
      - Consequence: A temporary ban from any interaction - or public communication with the community for a specified period. - Violating these terms may lead to a permanent ban. - - } - /> - - Community Impact: Demonstrating a pattern of - violation of community standards, including harassment of an - individual, or disparagement of groups. -
      - Consequence: A permanent ban from any sort of - public interaction within the community. - - } - /> -
    -
    -); - -const Attribution = () => ( -
    -

    - This Code of Conduct is adapted from the{" "} - - Contributor Covenant - - , version 2.0. -

    -

    - For more details, visit{" "} - - here - - . -

    -
    -); - -const CodeOfConduct = () => ( - -
    -

    Code Of Conduct

    -
    - - - - - - - - + {/* Contact Section */} +
    +

    Contact Us

    +
    +

    + If you have any questions or concerns about this Code of + Conduct, please contact us at{" "} + + sanjay@recodehive.com + + . +

    +
    +
    +
    -
    - -); + + ); +}; export default CodeOfConduct;