From 6306f0ab62d2a3b08df8a9cd7301d12fb557bd4e Mon Sep 17 00:00:00 2001 From: Youwen Wu Date: Fri, 9 Feb 2024 23:44:00 -0800 Subject: [PATCH] fix styling stuff --- README.md | 16 +++++++++++++ src/app/about/page.tsx | 3 +-- src/app/contact/page.tsx | 4 +--- src/app/globals.css | 14 +++++++++++ src/app/help/page.tsx | 4 +--- src/app/home.module.css | 33 -------------------------- src/app/layout.tsx | 19 ++++----------- src/app/legal/copyright/page.tsx | 4 +--- src/app/legal/privacy/page.tsx | 4 +--- src/app/page.tsx | 3 +-- src/app/searchBar/searchBar.module.css | 33 ++++++++++++++++++++++++++ src/app/searchBar/searchBar.tsx | 17 +++++++++++++ src/app/status/notifications/page.tsx | 4 +--- src/app/status/page.tsx | 4 +--- src/app/styles/standard.module.css | 8 ------- src/app/subscribe/page.tsx | 4 +--- tailwind.config.ts | 33 ++++++++++++++++++-------- 17 files changed, 117 insertions(+), 90 deletions(-) create mode 100644 src/app/searchBar/searchBar.module.css create mode 100644 src/app/searchBar/searchBar.tsx delete mode 100644 src/app/styles/standard.module.css diff --git a/README.md b/README.md index c304b67..add4a64 100644 --- a/README.md +++ b/README.md @@ -10,3 +10,19 @@ However, this repository is open for anyone—in Team 1280, in another FRC team, eeXiv borrows from a pioneer in digital open access, arXiv.org, and hosts the most FRC-specific scholarly articles in numerous subject areas, curated by our strong community of volunteer moderators. [^1]: Whichever idiot decided "arXiv" should be pronounced like "archive" can cope; eeXiv is not changing its name or pronunciation. + +--- + +## For Maintainers + +The dummies guide to maintaining a Next.js project: + +- This is not HTML + - Do not treat it as HTML, although it shares many common elements. Consult the documentation at least once before attempting anything for the first time, including common tasks. +- General semantics + - Use `` components when linking to a local path (like /status) and use a normal `` component when linking to an external site (like github.com). + - Try not to use global CSS classes when possible + - You can see a globals.css file in the root directory. Add classes to this file sparingly, only when you actually have a common class that will be shared across many components (however, also consider using a tailwind CSS extension class for this) + - Try to use CSS modules for your components. You can access them from your modules by importing them (`import styles from './path-to-css-module` and using them in your components with `className={styles.class_name}`). This will allow you to use the same class names in different parts of the website without any conflicts, as Post CSS will generate unique classes from the CSS modules. +- Important: THIS IS NOT JAVASCRIPT! You CANNOT use global variables, window variables, etc, or even stateful variables that are meant to persist beyond a single refresh cycle (which can happen many times per second). Use the STATE for this (see [the module we are using for state management](https://github.com/pmndrs/zustand)) +- Try to define modules for your components instead of putting everything in one file to avoid JANK diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx index fec2bf3..5ad178b 100644 --- a/src/app/about/page.tsx +++ b/src/app/about/page.tsx @@ -1,9 +1,8 @@ import Link from 'next/link' -import standardStyles from '../styles/standard.module.css' export default function Page() { return ( -
+

{`eeXiv is a project hosted by Team 1280 EECS ("Electrical Engineering and Computer Science"), independent of the department of the same name at`}{' '} diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx index 15b897d..b09a9b8 100644 --- a/src/app/contact/page.tsx +++ b/src/app/contact/page.tsx @@ -1,8 +1,6 @@ -import standardStyles from '../styles/standard.module.css' - export default function Page() { return ( -

+

You can contact a team representative directly at{' '} diff --git a/src/app/globals.css b/src/app/globals.css index 22909d9..234dbcb 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -11,3 +11,17 @@ * { box-sizing: border-box; } + +a { + color: #2563eb; /* Tailwind's blue-600 */ +} + +a:hover { + text-decoration: underline; +} + +.content { + margin-top: 40px; + padding: 35px; + border-radius: 15px; +} diff --git a/src/app/help/page.tsx b/src/app/help/page.tsx index fb11bc8..d856b44 100644 --- a/src/app/help/page.tsx +++ b/src/app/help/page.tsx @@ -1,8 +1,6 @@ -import standardStyles from '../styles/standard.module.css' - export default function Page() { return ( -

+

We are always looking for contributors to help us improve eeXiv. If you are interested in helping, whether as a peer reviewer, external diff --git a/src/app/home.module.css b/src/app/home.module.css index 47dff30..f2d39fe 100644 --- a/src/app/home.module.css +++ b/src/app/home.module.css @@ -26,39 +26,6 @@ cursor: pointer; } -.search { - position: absolute; - top: 175px; - left: 50%; - width: 40vw; -} - -.searchBox, -.searchButton { - display: inline; -} - -.searchBox { - height: 45px; - border: 3px solid #0c5198; - border-radius: 10px; - padding: 22px; -} - -.searchButton { - background-color: #0c5198; - color: white; - border: 3px solid white; - padding: 10px; - border-radius: 10px; - margin-left: 10px; -} - -.searchButton:hover { - background-color: white; - color: #0c5198; -} - .wordmark { float: left; height: 100px; diff --git a/src/app/layout.tsx b/src/app/layout.tsx index abb7fc9..32c8590 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -3,6 +3,7 @@ import { Inter, Zilla_Slab } from 'next/font/google' import './globals.css' import styles from './home.module.css' import Link from 'next/link' +import SearchBar from './searchBar/searchBar' const inter = Inter({ subsets: ['latin'] }) const zillaSlab = Zilla_Slab({ subsets: ['latin'], weight: ['500', '700'] }) @@ -25,32 +26,22 @@ export default function RootLayout({

We gratefully acknowledge support from our volunteer peer reviewers, member institutions, and all{' '} - open-source contributors - + .

- + eeXiv2

-
- - -
+
{children}