xevion/utsa-handbook
1
0
Fork 0
mirror of https://github.com/Xevion/utsa-handbook.git synced 2025-12-06 01:16:46 -06:00
Code Issues Packages Projects Releases Wiki Activity

SCSS, simplify header, improve README

Browse Source
This commit is contained in:
Xevion
2024-03-10 01:49:24 -06:00
parent 0b6b83eb42
commit 68d9299f11
10 changed files with 189 additions and 252 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
CHANGELOG.md
View File

@@ -1,5 +1,13 @@
# 0.0.2
- Added version/commit hash to the footer
- Added theme toggle to the header
- Culled lots of unnecessary CSS/unused content
- Switched CSS to SCSS
# 0.0.1
- Initialized with Astro Sample
- Added [Vercel Deployment](https://handbook.xevion.dev)
- Built up the README with Content Ideas, Badges, Formatting
- Added [CHANGELOG.md](./CHANGELOG.md)
- Added [Vercel Deployment](https://handbook.xevion.dev)

9
README.md
View File

@@ -48,11 +48,11 @@ A handbook for students at [The University of Texas at San Antonio][utsa], with
The UTSA Handbook is intended to be a living document filled with perspectives, opinions and information gathered from numerous students, old and young, incoming and graduated.
- Please consider contributing where
If you have something to add, please consider contributing! The process is easier than you think, and is an easy way to participate in open source and contribute to the UTSA CS community.
## Setup
This setup guide is very simple and does not cover
This setup guide is very simple and does not cover the full process of installation. Expansion will occur in the future.
```bash
git clone https://github.com/Xevion/utsa-handbook.git
@@ -61,6 +61,11 @@ pnpm dev
pnpm build
```
## Notes
- All content frontmatter obeys [this](https://github.com/withastro/astro/blob/main/packages/astro-rss/src/schema.ts) schema (for [@astrojs/rss](https://docs.astro.build/en/guides/rss/)).
- Document your changes in [CHANGELOG.md][changelog]. Not required for minor frontmatter changes, but recommended for all other changes.
### Disclaimer
This repository is completely unassociated with UTSA or the UTSA Computer Science department. All opinions and those of any contributors are their own and are not made in UTSA or UTSA CS's place.

5
package.json
View File

@@ -1,7 +1,7 @@
{
"name": "",
"name": "handbook",
"type": "module",
"version": "0.0.1",
"version": "0.0.2",
"scripts": {
"dev": "astro dev",
"start": "astro dev",
@@ -22,6 +22,7 @@
"astro": "^4.4.15",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"sass": "^1.71.1",
"tailwindcss": "^3.4.1",
"typescript": "^5.4.2"
}

34
pnpm-lock.yaml generated
View File

@@ -34,13 +34,16 @@ dependencies:
version: 18.2.21
astro:
specifier: ^4.4.15
version: 4.4.15(@types/node@20.11.25)(typescript@5.4.2)
version: 4.4.15(@types/node@20.11.25)(sass@1.71.1)(typescript@5.4.2)
react:
specifier: ^18.2.0
version: 18.2.0
react-dom:
specifier: ^18.2.0
version: 18.2.0(react@18.2.0)
sass:
specifier: ^1.71.1
version: 1.71.1
tailwindcss:
specifier: ^3.4.1
version: 3.4.1
@@ -150,7 +153,7 @@ packages:
'@astrojs/markdown-remark': 4.2.1
'@mdx-js/mdx': 3.0.1
acorn: 8.11.3
astro: 4.4.15(@types/node@20.11.25)(typescript@5.4.2)
astro: 4.4.15(@types/node@20.11.25)(sass@1.71.1)(typescript@5.4.2)
es-module-lexer: 1.4.1
estree-util-visit: 2.0.0
github-slugger: 2.0.0
@@ -214,7 +217,7 @@ packages:
astro: ^3.0.0 || ^4.0.0
tailwindcss: ^3.0.24
dependencies:
astro: 4.4.15(@types/node@20.11.25)(typescript@5.4.2)
astro: 4.4.15(@types/node@20.11.25)(sass@1.71.1)(typescript@5.4.2)
autoprefixer: 10.4.18(postcss@8.4.35)
postcss: 8.4.35
postcss-load-config: 4.0.2(postcss@8.4.35)
@@ -1054,7 +1057,7 @@ packages:
'@babel/plugin-transform-react-jsx-source': 7.23.3(@babel/core@7.24.0)
'@types/babel__core': 7.20.5
react-refresh: 0.14.0
vite: 5.1.5(@types/node@20.11.25)
vite: 5.1.5(@types/node@20.11.25)(sass@1.71.1)
transitivePeerDependencies:
- supports-color
dev: false
@@ -1231,7 +1234,7 @@ packages:
hasBin: true
dev: false
/astro@4.4.15(@types/node@20.11.25)(typescript@5.4.2):
/astro@4.4.15(@types/node@20.11.25)(sass@1.71.1)(typescript@5.4.2):
resolution: {integrity: sha512-RTiAnlO8hDp6GqMVvaeJxyuCJhHNEho09lHshMNQBqgRabYPOJGW0HZZrbLRGNOqN9I14ivhZIunYGgAaGQpWw==}
engines: {node: '>=18.14.1', npm: '>=6.14.0'}
hasBin: true
@@ -1295,7 +1298,7 @@ packages:
tsconfck: 3.0.3(typescript@5.4.2)
unist-util-visit: 5.0.0
vfile: 6.0.1
vite: 5.1.5(@types/node@20.11.25)
vite: 5.1.5(@types/node@20.11.25)(sass@1.71.1)
vitefu: 0.2.5(vite@5.1.5)
which-pm: 2.1.1
yargs-parser: 21.1.1
@@ -2257,6 +2260,10 @@ packages:
resolution: {integrity: sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==}
dev: false
/immutable@4.3.5:
resolution: {integrity: sha512-8eabxkth9gZatlwl5TBuJnCsoTADlL6ftEr7A4qgdaTsPyreilDSnUk57SO+jfKcNtxPa22U5KK6DSeAYhpBJw==}
dev: false
/import-meta-resolve@4.0.0:
resolution: {integrity: sha512-okYUR7ZQPH+efeuMJGlq4f8ubUgO50kByRPyt/Cy1Io4PSRsPjxME+YlVaCOx+NIToW7hCsZNFJyTPFFKepRSA==}
dev: false
@@ -3825,6 +3832,16 @@ packages:
resolution: {integrity: sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==}
dev: false
/sass@1.71.1:
resolution: {integrity: sha512-wovtnV2PxzteLlfNzbgm1tFXPLoZILYAMJtvoXXkD7/+1uP41eKkIt1ypWq5/q2uT94qHjXehEYfmjKOvjL9sg==}
engines: {node: '>=14.0.0'}
hasBin: true
dependencies:
chokidar: 3.6.0
immutable: 4.3.5
source-map-js: 1.0.2
dev: false
/sax@1.3.0:
resolution: {integrity: sha512-0s+oAmw9zLl1V1cS9BtZN7JAd0cW5e0QH4W3LWEK6a4LaLEA2OTpGYWDY+6XasBLtz6wkm3u1xRw95mRuJ59WA==}
dev: false
@@ -4436,7 +4453,7 @@ packages:
vfile-message: 4.0.2
dev: false
/vite@5.1.5(@types/node@20.11.25):
/vite@5.1.5(@types/node@20.11.25)(sass@1.71.1):
resolution: {integrity: sha512-BdN1xh0Of/oQafhU+FvopafUp6WaYenLU/NFoL5WyJL++GxkNfieKzBhM24H3HVsPQrlAqB7iJYTHabzaRed5Q==}
engines: {node: ^18.0.0 || >=20.0.0}
hasBin: true
@@ -4468,6 +4485,7 @@ packages:
esbuild: 0.19.12
postcss: 8.4.35
rollup: 4.12.1
sass: 1.71.1
optionalDependencies:
fsevents: 2.3.3
dev: false
@@ -4480,7 +4498,7 @@ packages:
vite:
optional: true
dependencies:
vite: 5.1.5(@types/node@20.11.25)
vite: 5.1.5(@types/node@20.11.25)(sass@1.71.1)
dev: false
/volar-service-css@0.0.30(@volar/language-service@2.0.4):

4
src/components/BaseHead.astro
View File

@@ -1,7 +1,5 @@
---
// Import the global.css file here so that it is included on
// all pages through the use of the <BaseHead /> component.
import '@/styles/global.css';
import '@/styles/global.scss';
interface Props {
title: string;

20
src/components/Header.astro
View File

@@ -1,12 +1,14 @@
---
import HeaderLink from '@components/HeaderLink.astro';
import { SITE_TITLE } from '@/consts';
import ThemeToggle from '@components/ThemeToggle';
import HeaderLink from "@components/HeaderLink.astro";
import { SITE_TITLE } from "@/consts";
import ThemeToggle from "@components/ThemeToggle";
---
<header>
<header class="dark:bg-zinc-900/70 bg-zinc-200 dark:text-zinc-300 text-black">
<nav>
<h2><a href="/">{SITE_TITLE}</a></h2>
<h2>
<a href="/">{SITE_TITLE}</a>
</h2>
<div class="internal-links">
<HeaderLink href="/">Home</HeaderLink>
<HeaderLink href="/blog">Blog</HeaderLink>
@@ -14,7 +16,11 @@ import ThemeToggle from '@components/ThemeToggle';
</div>
<div class="social-links">
<ThemeToggle client:only />
<a class="dark:color-zinc-100" href="https://m.webtoo.ls/@astro" target="_blank">
<a
class="dark:color-zinc-100"
href="https://m.webtoo.ls/@astro"
target="_blank"
>
<span class="sr-only">Follow Astro on Mastodon</span>
<svg viewBox="0 0 16 16" aria-hidden="true" width="32" height="32"
><path
@@ -48,7 +54,6 @@ import ThemeToggle from '@components/ThemeToggle';
header {
margin: 0;
padding: 0 1em;
background: white;
box-shadow: 0 2px 8px rgba(var(--black), 5%);
}
h2 {
@@ -67,7 +72,6 @@ import ThemeToggle from '@components/ThemeToggle';
}
nav a {
padding: 1em 0.5em;
color: var(--black);
border-bottom: 4px solid transparent;
text-decoration: none;
}

1
src/consts.ts
View File

@@ -1,2 +1,3 @@
export const SITE_TITLE = 'UTSA CS Handbook';
export const SITE_DESCRIPTION = 'An unofficial guide to the Computer Science program at UTSA';
export const GITHUB_URL = 'https://github.com/Xevion/utsa-handbook'

2
src/pages/index.astro
View File

@@ -10,7 +10,7 @@ import { SITE_TITLE, SITE_DESCRIPTION } from '../consts';
<head>
<BaseHead title={SITE_TITLE} description={SITE_DESCRIPTION} />
</head>
<body class="dark:text-zinc-200 dark:bg-zinc-700">
<body class="dark:text-zinc-200 dark:bg-zinc-800">
<Header />
<Footer />
</body>

154
src/styles/global.css
View File

@@ -1,154 +0,0 @@
/*
The CSS in this style tag is based off of Bear Blog's default CSS.
https://github.com/HermanMartinus/bearblog/blob/297026a877bc2ab2b3bdfbd6b9f7961c350917dd/templates/styles/blog/default.css
License MIT: https://github.com/HermanMartinus/bearblog/blob/master/LICENSE.md
*/
:root {
--accent: #2337ff;
--accent-dark: #000d8a;
--black: 15, 18, 25;
--gray: 96, 115, 159;
--gray-light: 229, 233, 240;
--gray-dark: 34, 41, 57;
--gray-gradient: rgba(var(--gray-light), 50%), #fff;
--box-shadow: 0 2px 6px rgba(var(--gray), 25%), 0 8px 24px rgba(var(--gray), 33%),
0 16px 32px rgba(var(--gray), 33%);
}
@font-face {
font-family: 'Atkinson';
src: url('/fonts/atkinson-regular.woff') format('woff');
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Atkinson';
src: url('/fonts/atkinson-bold.woff') format('woff');
font-weight: 700;
font-style: normal;
font-display: swap;
}
body {
font-family: 'Atkinson', sans-serif;
margin: 0;
padding: 0;
text-align: left;
/* background: linear-gradient(var(--gray-gradient)) no-repeat; */
/* background-size: 100% 600px; */
word-wrap: break-word;
overflow-wrap: break-word;
/* color: rgb(var(--gray-dark)); */
font-size: 20px;
line-height: 1.7;
}
main {
width: 720px;
max-width: calc(100% - 2em);
margin: auto;
padding: 3em 1em;
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0 0 0.5rem 0;
color: rgb(var(--black));
line-height: 1.2;
}
h1 {
font-size: 3.052em;
}
h2 {
font-size: 2.441em;
}
h3 {
font-size: 1.953em;
}
h4 {
font-size: 1.563em;
}
h5 {
font-size: 1.25em;
}
strong,
b {
font-weight: 700;
}
a {
color: var(--accent);
}
a:hover {
color: var(--accent);
}
p {
margin-bottom: 1em;
}
.prose p {
margin-bottom: 2em;
}
textarea {
width: 100%;
font-size: 16px;
}
input {
font-size: 16px;
}
table {
width: 100%;
}
img {
max-width: 100%;
height: auto;
border-radius: 8px;
}
code {
padding: 2px 5px;
background-color: rgb(var(--gray-light));
border-radius: 2px;
}
pre {
padding: 1.5em;
border-radius: 8px;
}
pre > code {
all: unset;
}
blockquote {
border-left: 4px solid var(--accent);
padding: 0 0 0 20px;
margin: 0px;
font-size: 1.333em;
}
hr {
border: none;
border-top: 1px solid rgb(var(--gray-light));
}
@media (max-width: 720px) {
body {
font-size: 18px;
}
main {
padding: 1em;
}
}
.sr-only {
border: 0;
padding: 0;
margin: 0;
position: absolute !important;
height: 1px;
width: 1px;
overflow: hidden;
/* IE6, IE7 - a 0 height clip, off to the bottom right of the visible 1px box */
clip: rect(1px 1px 1px 1px);
/* maybe deprecated but we need to support legacy browsers */
clip: rect(1px, 1px, 1px, 1px);
/* modern browsers, clip-path works inwards from each corner */
clip-path: inset(50%);
/* added line to stop words getting smushed together (as they go onto seperate lines and some screen readers do not understand line feeds as a space */
white-space: nowrap;
}

56
src/styles/global.scss Normal file
View File

@@ -0,0 +1,56 @@
/*
The CSS in this style tag is based off of Bear Blog's default CSS.
https://github.com/HermanMartinus/bearblog/blob/297026a877bc2ab2b3bdfbd6b9f7961c350917dd/templates/styles/blog/default.css
License MIT: https://github.com/HermanMartinus/bearblog/blob/master/LICENSE.md
*/
:root {
--accent: #2337ff;
--accent-dark: #000d8a;
--black: 15, 18, 25;
--gray: 96, 115, 159;
--gray-light: 229, 233, 240;
--gray-dark: 34, 41, 57;
--gray-gradient: rgba(var(--gray-light), 50%), #fff;
--box-shadow: 0 2px 6px rgba(var(--gray), 25%), 0 8px 24px rgba(var(--gray), 33%),
0 16px 32px rgba(var(--gray), 33%);
}
@font-face {
font-family: "Atkinson";
src: url("/fonts/atkinson-regular.woff") format("woff");
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Atkinson";
src: url("/fonts/atkinson-bold.woff") format("woff");
font-weight: 700;
font-style: normal;
font-display: swap;
}
html {
font-family: "Atkinson", sans-serif;
word-wrap: break-word;
overflow-wrap: break-word;
font-size: 20px;
line-height: 1.7;
}
main {
width: 720px;
max-width: calc(100% - 2em);
margin: auto;
padding: 3em 1em;
}
@media (max-width: 720px) {
html {
font-size: 18px;
}
main {
padding: 1em;
}
}