testing
This commit is contained in:
chark1es
parent
4fa1e52980
commit
03de67defa
5 changed files with 184 additions and 128 deletions
64
package.json
64
package.json
|
|
@ -1,34 +1,34 @@
|
||||||
{
|
{
|
||||||
"name": "",
|
"name": "ieeeucsd",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"version": "0.0.1",
|
"version": "0.0.1",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "astro dev",
|
"dev": "astro dev",
|
||||||
"start": "astro dev",
|
"start": "astro dev",
|
||||||
"build": "astro build",
|
"build": "astro build",
|
||||||
"preview": "astro preview",
|
"preview": "astro preview",
|
||||||
"astro": "astro"
|
"astro": "astro"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@astrojs/mdx": "^1.1.2",
|
"@astrojs/mdx": "^1.1.2",
|
||||||
"@astrojs/react": "^3.0.3",
|
"@astrojs/react": "^3.0.3",
|
||||||
"@astrojs/tailwind": "^5.0.2",
|
"@astrojs/tailwind": "^5.0.2",
|
||||||
"@fontsource-variable/open-sans": "^5.0.16",
|
"@fontsource-variable/open-sans": "^5.0.16",
|
||||||
"@nextui-org/react": "^2.1.13",
|
"@nextui-org/react": "^2.1.13",
|
||||||
"@types/react": "^18.0.21",
|
"@types/react": "^18.0.21",
|
||||||
"@types/react-dom": "^18.0.6",
|
"@types/react-dom": "^18.0.6",
|
||||||
"astro": "^3.3.0",
|
"astro": "^3.3.0",
|
||||||
"framer-motion": "^10.16.4",
|
"framer-motion": "^10.16.4",
|
||||||
"react": "^18.0.0",
|
"react": "^18.0.0",
|
||||||
"react-dom": "^18.0.0",
|
"react-dom": "^18.0.0",
|
||||||
"scss": "^0.2.4",
|
"scss": "^0.2.4",
|
||||||
"tailwindcss": "^3.0.24",
|
"tailwindcss": "^3.0.24",
|
||||||
"tailwindcss-animate": "^1.0.7"
|
"tailwindcss-animate": "^1.0.7"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"daisyui": "^3.9.2",
|
"daisyui": "^3.9.2",
|
||||||
"prettier": "^3.0.3",
|
"prettier": "^3.0.3",
|
||||||
"prettier-plugin-astro": "^0.12.0",
|
"prettier-plugin-astro": "^0.12.0",
|
||||||
"sass": "^1.69.3"
|
"sass": "^1.69.3"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
BIN
public/backgrounds/fa21qp.png
Normal file
BIN
public/backgrounds/fa21qp.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 689 KiB |
|
|
@ -1,41 +1,74 @@
|
||||||
---
|
|
||||||
import logo_with_text from '';
|
|
||||||
---
|
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.grid-cols-custom {
|
.grid-cols-custom {
|
||||||
grid-template-columns: 1fr auto 1fr; /* This makes the side columns take up equal space, regardless of content, while the center column takes the width of the content */
|
grid-template-columns: 1fr auto 1fr;
|
||||||
}
|
}
|
||||||
</style>
|
.nav-background {
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
background-image: url("/backgrounds/fa21qp.png");
|
||||||
|
background-size: cover;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center 45%;
|
||||||
|
}
|
||||||
|
.nav-background::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0; /* Cover the parent */
|
||||||
|
background-color: rgba(
|
||||||
|
0,
|
||||||
|
51,
|
||||||
|
102,
|
||||||
|
0.9
|
||||||
|
); /* This is a guess of the ieee-blue color with 50% opacity, adjust as necessary */
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
<nav class="mt-2">
|
<nav class="nav-background flex-inline max-w-80 mx-auto">
|
||||||
<div class="hidden xl:grid grid-flow-col auto-cols-max justify-center items-center gap-4 h-32 grid-cols-custom">
|
<div
|
||||||
<div class="flex justify-center space-x-12 sm:space-x-14 md:space-x-16 lg:space-x-18">
|
class="hidden xl:grid grid-flow-col auto-cols-max justify-center items-center gap-4 h-32 grid-cols-custom text-white"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="flex justify-center space-x-12 sm:space-x-14 md:space-x-16 lg:space-x-18"
|
||||||
|
>
|
||||||
<!-- Left content here -->
|
<!-- Left content here -->
|
||||||
<a href="/" class="text-2xl hover:scale-110 transition text-ieee-blue font-bold">Home</a>
|
<a href="/" class="text-2xl hover:scale-110 transition font-bold"
|
||||||
<a href="/" class="text-2xl text-ieee-blue font-bold">About Us</a>
|
>Home</a
|
||||||
<a href="/" class="text-2xl text-ieee-blue font-bold">Project Space</a>
|
>
|
||||||
|
<a href="/" class="text-2xl font-bold">About Us</a>
|
||||||
|
<a href="/" class="text-2xl font-bold">Project Space</a>
|
||||||
<!-- You can add more items here, and they will be centered -->
|
<!-- You can add more items here, and they will be centered -->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Centered image -->
|
<!-- Centered image -->
|
||||||
<div class="flex justify-center">
|
<div class="flex justify-center">
|
||||||
<img src="/icons/logo_with_text.svg" alt="description of image" class="h-24" />
|
<img
|
||||||
|
src="/icons/logo_with_text.svg"
|
||||||
|
alt="description of image"
|
||||||
|
class="h-24"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="flex justify-center space-x-4 sm:space-x-6 md:space-x-8 lg:space-x-12">
|
<div
|
||||||
|
class="flex justify-center space-x-4 sm:space-x-6 md:space-x-8 lg:space-x-12"
|
||||||
|
>
|
||||||
<!-- Right content here -->
|
<!-- Right content here -->
|
||||||
<a href="/" class="text-2xl text-ieee-blue font-bold">Events</a>
|
<a href="/" class="text-2xl font-bold">Events</a>
|
||||||
<a href="/" class="text-2xl text-ieee-blue font-bold">Projects</a>
|
<a href="/" class="text-2xl font-bold">Projects</a>
|
||||||
<a href="/" class="text-2xl text-ieee-blue font-bold">Contact Us</a>
|
<a href="/" class="text-2xl font-bold">Contact Us</a>
|
||||||
<!-- You can add more items here, and they will be centered -->
|
<!-- You can add more items here, and they will be centered -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid xl:hidden items-center h-32" >
|
<div class="grid xl:hidden items-center h-32">
|
||||||
<div class="flex justify-left">
|
<div class="flex justify-left content-center">
|
||||||
<img src="/icons/logo_with_full_text.svg" alt="description of image" class="h-24 scale-50" />
|
<img
|
||||||
|
src="/icons/logo_with_full_text.svg"
|
||||||
|
alt="description of image"
|
||||||
|
class="h-24 scale-50"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -3,4 +3,13 @@ import Layout from "../layouts/Layout.astro";
|
||||||
import Card from "../components/Card.astro";
|
import Card from "../components/Card.astro";
|
||||||
---
|
---
|
||||||
|
|
||||||
<Layout title="Home" />
|
<Layout title="Home">
|
||||||
|
<iframe
|
||||||
|
src="https://discord.com/widget?id=1041800035370811545&theme=dark"
|
||||||
|
width="350"
|
||||||
|
height="500"
|
||||||
|
allowtransparency="true"
|
||||||
|
frameborder="0"
|
||||||
|
sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"
|
||||||
|
></iframe>
|
||||||
|
</Layout>
|
||||||
|
|
|
||||||
|
|
@ -1,76 +1,90 @@
|
||||||
/** @type {import('tailwindcss').Config} */
|
/** @type {import('tailwindcss').Config} */
|
||||||
module.exports = {
|
module.exports = {
|
||||||
darkMode: ["class"],
|
darkMode: ["class"],
|
||||||
content: [
|
content: [
|
||||||
'./pages/**/*.{ts,tsx}',
|
"./pages/**/*.{ts,tsx}",
|
||||||
'./components/**/*.{ts,tsx}',
|
"./components/**/*.{ts,tsx}",
|
||||||
'./app/**/*.{ts,tsx}',
|
"./app/**/*.{ts,tsx}",
|
||||||
'./src/**/*.{ts,tsx}',
|
"./src/**/*.{ts,tsx}",
|
||||||
],
|
"./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}",
|
||||||
theme: {
|
],
|
||||||
container: {
|
theme: {
|
||||||
center: true,
|
container: {
|
||||||
padding: "2rem",
|
center: true,
|
||||||
screens: {
|
padding: "2rem",
|
||||||
"2xl": "1400px",
|
screens: {
|
||||||
},
|
"2xl": "1400px",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
extend: {
|
||||||
|
colors: {
|
||||||
|
border: "hsl(var(--border))",
|
||||||
|
input: "hsl(var(--input))",
|
||||||
|
ring: "hsl(var(--ring))",
|
||||||
|
background: "hsl(var(--background))",
|
||||||
|
foreground: "hsl(var(--foreground))",
|
||||||
|
primary: {
|
||||||
|
DEFAULT: "hsl(var(--primary))",
|
||||||
|
foreground: "hsl(var(--primary-foreground))",
|
||||||
|
},
|
||||||
|
secondary: {
|
||||||
|
DEFAULT: "hsl(var(--secondary))",
|
||||||
|
foreground: "hsl(var(--secondary-foreground))",
|
||||||
|
},
|
||||||
|
destructive: {
|
||||||
|
DEFAULT: "hsl(var(--destructive))",
|
||||||
|
foreground: "hsl(var(--destructive-foreground))",
|
||||||
|
},
|
||||||
|
muted: {
|
||||||
|
DEFAULT: "hsl(var(--muted))",
|
||||||
|
foreground: "hsl(var(--muted-foreground))",
|
||||||
|
},
|
||||||
|
accent: {
|
||||||
|
DEFAULT: "hsl(var(--accent))",
|
||||||
|
foreground: "hsl(var(--accent-foreground))",
|
||||||
|
},
|
||||||
|
popover: {
|
||||||
|
DEFAULT: "hsl(var(--popover))",
|
||||||
|
foreground: "hsl(var(--popover-foreground))",
|
||||||
|
},
|
||||||
|
card: {
|
||||||
|
DEFAULT: "hsl(var(--card))",
|
||||||
|
foreground: "hsl(var(--card-foreground))",
|
||||||
|
},
|
||||||
|
ieee: {
|
||||||
|
blue: "#00629B",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
borderRadius: {
|
||||||
|
lg: "var(--radius)",
|
||||||
|
md: "calc(var(--radius) - 2px)",
|
||||||
|
sm: "calc(var(--radius) - 4px)",
|
||||||
|
},
|
||||||
|
keyframes: {
|
||||||
|
"accordion-down": {
|
||||||
|
from: { height: 0 },
|
||||||
|
to: { height: "var(--radix-accordion-content-height)" },
|
||||||
|
},
|
||||||
|
"accordion-up": {
|
||||||
|
from: { height: "var(--radix-accordion-content-height)" },
|
||||||
|
to: { height: 0 },
|
||||||
|
},
|
||||||
|
},
|
||||||
|
animation: {
|
||||||
|
"accordion-down": "accordion-down 0.2s ease-out",
|
||||||
|
"accordion-up": "accordion-up 0.2s ease-out",
|
||||||
|
},
|
||||||
|
},
|
||||||
},
|
},
|
||||||
extend: {
|
plugins: [require("daisyui"), require("tailwindcss-animate")],
|
||||||
colors: {
|
daisyui: {
|
||||||
border: "hsl(var(--border))",
|
themes: false, // true: all themes | false: only light + dark | array: specific themes like this ["light", "dark", "cupcake"]
|
||||||
input: "hsl(var(--input))",
|
darkTheme: "light", // name of one of the included themes for dark mode
|
||||||
ring: "hsl(var(--ring))",
|
base: true, // applies background color and foreground color for root element by default
|
||||||
background: "hsl(var(--background))",
|
styled: true, // include daisyUI colors and design decisions for all components
|
||||||
foreground: "hsl(var(--foreground))",
|
utils: true, // adds responsive and modifier utility classes
|
||||||
primary: {
|
rtl: false, // rotate style direction from left-to-right to right-to-left. You also need to add dir="rtl" to your html tag and install `tailwindcss-flip` plugin for Tailwind CSS.
|
||||||
DEFAULT: "hsl(var(--primary))",
|
prefix: "", // prefix for daisyUI classnames (components, modifiers and responsive class names. Not colors)
|
||||||
foreground: "hsl(var(--primary-foreground))",
|
logs: true, // Shows info about daisyUI version and used config in the console when building your CSS
|
||||||
},
|
|
||||||
secondary: {
|
|
||||||
DEFAULT: "hsl(var(--secondary))",
|
|
||||||
foreground: "hsl(var(--secondary-foreground))",
|
|
||||||
},
|
|
||||||
destructive: {
|
|
||||||
DEFAULT: "hsl(var(--destructive))",
|
|
||||||
foreground: "hsl(var(--destructive-foreground))",
|
|
||||||
},
|
|
||||||
muted: {
|
|
||||||
DEFAULT: "hsl(var(--muted))",
|
|
||||||
foreground: "hsl(var(--muted-foreground))",
|
|
||||||
},
|
|
||||||
accent: {
|
|
||||||
DEFAULT: "hsl(var(--accent))",
|
|
||||||
foreground: "hsl(var(--accent-foreground))",
|
|
||||||
},
|
|
||||||
popover: {
|
|
||||||
DEFAULT: "hsl(var(--popover))",
|
|
||||||
foreground: "hsl(var(--popover-foreground))",
|
|
||||||
},
|
|
||||||
card: {
|
|
||||||
DEFAULT: "hsl(var(--card))",
|
|
||||||
foreground: "hsl(var(--card-foreground))",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
borderRadius: {
|
|
||||||
lg: "var(--radius)",
|
|
||||||
md: "calc(var(--radius) - 2px)",
|
|
||||||
sm: "calc(var(--radius) - 4px)",
|
|
||||||
},
|
|
||||||
keyframes: {
|
|
||||||
"accordion-down": {
|
|
||||||
from: { height: 0 },
|
|
||||||
to: { height: "var(--radix-accordion-content-height)" },
|
|
||||||
},
|
|
||||||
"accordion-up": {
|
|
||||||
from: { height: "var(--radix-accordion-content-height)" },
|
|
||||||
to: { height: 0 },
|
|
||||||
},
|
|
||||||
},
|
|
||||||
animation: {
|
|
||||||
"accordion-down": "accordion-down 0.2s ease-out",
|
|
||||||
"accordion-up": "accordion-up 0.2s ease-out",
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
},
|
};
|
||||||
plugins: [require("tailwindcss-animate")],
|
|
||||||
}
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue