add code of conduct (#9)

* add code of conduct
* fix navbar code and edit code of conduct headers
* edit dropdown class code for safer checking value

packages/astro/src/components/HeaderNav.astro

@@ -1,16 +1,20 @@
 ---
 const routes = [
-	["wiki", "Wiki"],
-	["getting-started", "Get Started"],
-	["events", "Events"],
-	["projects", "Projects"],
-	["blog", "Blog"],
-	["donate", "Donate"],
-	["about", "About"],
+	{ label: "Wiki", page: "wiki" },
+    { label: "Get Started", page: "getting-started" },
+    { label: "Events", page: "events" },
+    { label: "Projects", page: "projects" },
+    { label: "Blog", page: "blog" },
+    { label: "Donate", page: "donate" },
+	{ label: "About", page: "about",
+        pages: [
+            { label: "Code of Conduct", page: "about/code-of-conduct" }
+        ]
+    }
 ];
-	// because of annoying differences between dev and build modes, due to this
-	// behavior (https://github.com/withastro/astro/issues/5630), always remove
-	// any trailing slash so currentPage can match the pages above
+// because of annoying differences between dev and build modes, due to this
+// behavior (https://github.com/withastro/astro/issues/5630), always remove
+// any trailing slash so currentPage can match the pages above
 const fullPath = Astro.url.pathname.replace(/\/$/, "");
 const currentPage = fullPath.slice(fullPath.lastIndexOf("/") + 1);
 ---
@@ -24,13 +28,18 @@ const currentPage = fullPath.slice(fullPath.lastIndexOf("/") + 1);
 		</li>
 	</ul>
 	<ul>
-		{
-			routes.map(([page, label]) => (
-				<li>
-					<a href={page} aria-current={currentPage === page ? "page" : false}>{label}</a>
-				</li>
-			))
-		}
+		{routes.map(route => (
+            <li class={`nav-item ${route.pages?.length > 0 ? "dropdown" : ""}`}>
+                <a href={route.page} aria-current={currentPage === route.page ? "page" : false}>{route.label}</a>
+                {route.pages?.length > 0 && 
+                    <div class="dropdown-content">
+                        {route.pages.map(page => (
+                            <a href={page.page} aria-current={currentPage === page.page ? "page" : false}>{page.label}</a>
+                        ))}
+                    </div>
+                }
+            </li>
+        ))}
 	</ul>
 </nav>
 
@@ -40,4 +49,30 @@ const currentPage = fullPath.slice(fullPath.lastIndexOf("/") + 1);
 		cursor: default;
 		pointer-events: none;
 	}
+
+	.dropdown {
+        position: relative;
+        display: inline-block;
+    }
+
+    .dropdown-content {
+        display: none;
+        position: absolute;
+        background-color: #f9f9f9;
+        min-width: 160px;
+        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+        z-index: 1;
+    }
+
+    .dropdown-content a {
+        color: black;
+        padding: 12px 16px;
+        text-decoration: none;
+        display: block;
+    }
+
+    .dropdown:hover .dropdown-content {
+        display: block;
+    }
+
 </style>

packages/astro/src/pages/about/code-of-conduct.md

@@ -0,0 +1,82 @@
+---
+layout: "@/layouts/BaseLayout.astro"
+title: Code of Conduct
+description: Code of Conduct
+---
+
+# SF Civic Tech is a space for everyone.
+
+What does that mean?
+
+* We value the people here and make everyone feel welcome
+* We make room for all brigade members to engage, discuss, and collaborate
+* We support each other to build a strong civic tech community
+* We respect the boundaries of others
+
+These are not just statements of belief, but principles that we collectively enact. We are dedicated to upholding them, and to ensuring that all members of our community respect them.
+
+Below, you’ll find the full text of our Code of Conduct, with more detailed information about our community principles. You’ll also find our harassment policy, along with information about who to contact if you think the policy has been violated. For other questions about the Code of Conduct, or about our brigade, reach out to [email protected].
+
+
+## Code of Conduct
+
+1. The SF Civic Tech community expects that SF Civic Tech activities and events:
+
+2. Are a safe and respectful environment for all participants.
+
+3. Are a place where people are free to fully express their identities.
+
+4. Presume the value of others. Everyone’s ideas, skills, and contributions have value.
+
+5. Don’t assume everyone has the same context, and encourage questions.
+
+6. Find a way for people to be productive with their skills (technical and not) and energy. Use language such as “yes/and”, not “no/but.”
+
+7. Encourage members and participants to listen as much as they speak.
+
+8. Strive to build tools that are open and free technology for public use. Activities that aim to foster public use, not for private gain, are prioritized.
+
+9. Prioritize access for and input from those who are traditionally excluded from the civic process.
+
+10. Work to ensure that all demographics present in the community are represented.
+
+11. Actively involve community groups and those with subject matter expertise in the decision-making process.
+
+12. Ensure that the relationships and conversations between community members, the local government staff and community partners remain respectful, participatory, and productive.
+
+13. Provide an environment where people are not subjected to discrimination or harassment. SF Civic Tech reserves the right to ask anyone in violation of these policies not to participate in SF Civic Tech events or network activities.
+
+
+## Anti-Harassment Policy
+
+### What is harassment?
+Harassment is any unwanted behavior, physical or verbal (or even suggested ), that makes someone feel uncomfortable, humiliated, or mentally distressed. While harassment laws differ between states, most states consider these two main factors when deciding the validity of an accusation:
+
+* Behavior that annoy, threaten, or demean another - whether intentional or unintentional
+* Repetition and severity of the unwanted action.
+
+### Some examples
+Harassment includes but is not limited to: offensive verbal or written comments related to gender, gender identity and expression, sexual orientation, disability, physical appearance, body size, race, religion; sexual images in public spaces; deliberate intimidation; stalking; following; cyberbullying; cyberstalking; harassing photography or recording; sustained disruption of talks or other events; inappropriate physical contact; unwelcome sexual attention; unwarranted exclusion; and patronizing language or action.
+
+### Our dedication to the community
+SF Civic Tech is dedicated to providing a harassment-free experience for everyone regardless of gender, gender identity and expression, sexual orientation, disability, physical appearance, body size, race, age, or religion. We do not tolerate harassment of staff, presenters, and participants in any form. Sexual language and imagery are not appropriate for any SF Civic Tech event or network activity, including talks. Anyone in violation of these policies may be expelled from SF Civic Tech network activities, events, and digital forums, at the discretion of the event organizer or forum administrator.
+
+### Repercussions for harassing someone in our community
+If a participant engages in harassing behavior, the organizers may take any action they deem appropriate, including warning the offender or expulsion from SF Civic Tech network activities, events, and digital forums.
+
+### Speak up
+If you are being harassed, notice that someone else is being harassed, or have any other concerns, please tell one of the Organizers, Executives, or Executive Director, what you experienced or witnessed at [email protected] or Slack.
+
+If the harassment took place at in-person event, event staff or forum administrators will be happy to help participants contact hotel/venue security or local law enforcement, provide escorts, or otherwise assist those experiencing harassment to feel safe for the duration of the event.
+
+If you cannot reach an event organizer or forum administrator and/or it is an emergency, please call 911 and/or remove yourself from the situation.
+
+We value you and hope that by communicating these expectations widely, we can all enjoy a harassment-free environment.
+
+This anti-harassment policy is based on the example policy from the Geek Feminism wiki, created by the Ada Initiative and other volunteers. Additional resources we used include the Ohio LinuxFest anti-harassment policy, written by Esther Filderman and Beth Lynn Eicher, and the Con Anti-Harassment Project. Mary Gardiner, Valerie Aurora, Sarah Smith, and Donna Benjamin generalized the policies and added supporting material, and What Is Considered Harassment? Definition, Types, and Examples by Inspired eLearning powered by Vipre, Many members of LinuxChix, Geek Feminism and other groups contributed to this work.
+
+
+## Email Template for Anti-Harassment Reporting
+SUBJECT: Safe Space alert at [EVENT NAME]
+
+I am writing because of a harassment issue at SF Civic Tech, (NAME, PLACE [even virtual events], DATE OF EVENT). You can reach me at (CONTACT INFO). Thank you.

packages/astro/src/pages/about/index.astro

@@ -0,0 +1,58 @@
+---
+import BaseLayout from "@/layouts/BaseLayout.astro";
+---
+
+<BaseLayout title="About">
+	<h1>About</h1>
+
+	<h2> Code of Conduct </h2>
+	<p>SF Civic Tech is a space for everyone. What does that mean?</p>
+
+	<ul>
+		<li> We value the people here and make everyone feel welcome </li>
+		<li> We make room for all brigade members to engage, discuss, and collaborate </li>
+		<li> We support each other to build a strong civic tech community </li>
+		<li> We respect the boundaries of others </li>
+	</ul>
+
+	<p> These are not just statements of belief, but principles that we collectively enact. 
+	We are dedicated to upholding them, and to ensuring that all members of our community 
+	respect them. </p>
+
+	<p>The full Code of Conduct is available, with more detailed information about our 
+	community principles. You’ll also find our harassment policy, along with information 
+	about who to contact if you think the policy has been violated. For other questions 
+	about the Code of Conduct, or about our collective, reach out to [email protected].
+	</p>
+
+    <div class="code-of-conduct-btn">
+	    <a href="code-of-conduct" role="button">Read the full Code of Conduct</a>
+    </div>
+</BaseLayout>
+
+<style>
+	h1, h2 {
+		text-align: center
+	}
+
+	h2 {
+		font-size: 20px;
+	}
+
+	p, ul {
+		line-height: 1.4em;
+    	font-size: 16px;
+		margin-bottom: 20px;
+
+		li {
+			margin-bottom: 0px
+		}
+	}
+
+    .code-of-conduct-btn {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+</style>