Munelit/munebase.dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Stylesheet added

Browse Source
This commit is contained in:
Moonlit Productions
2025-09-29 11:25:44 -04:00
parent 514f8f42dd
commit 0b493ffb0d
5 changed files with 223 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
root/index.html
View File

@ -2,7 +2,10 @@
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Munebase</title>
<link rel="stylesheet" href="styles/main.css">
</head>
<body>

1
root/match.html
View File

@ -5,6 +5,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Match Video &amp; Stats</title>
<link rel="stylesheet" href="styles/main.css">
</head>
<body>

3
root/projects.html
View File

@ -2,7 +2,10 @@
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Munebase Projects</title>
<link rel="stylesheet" href="styles/main.css">
</head>
<body>

3
root/resources.html
View File

@ -2,7 +2,10 @@
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Munebase Resources</title>
<link rel="stylesheet" href="styles/main.css">
</head>
<body>

213
root/styles/main.css Normal file
View File

@ -0,0 +1,213 @@
:root {
--primary-dark-blue: #1a237e;
--secondary-dark-blue: #283593;
--accent-blue: #3f51b5;
--light-blue: #5c6bc0;
--text-light: #e8eaf6;
--text-secondary: #c5cae9;
--background-dark: #0d1421;
--background-secondary: #1e2937;
--border-color: #374151;
--link-color: #7986cb;
--link-hover: #9fa8da;
--font-family: 'Arial', 'Helvetica', sans-serif;
--font-size-base: 16px;
--line-height-base: 1.6;
--spacing-small: 0.5rem;
--spacing-large: 1.5rem;
--border-radius: 8px;
--border-radius-sm: 4px;
--shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}
body {
font-family: var(--font-family);
line-height: var(--line-height-base);
background-color: var(--background-dark);
color: var(--text-light);
min-height: 100vh;
display: flex;
flex-direction: column;
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: var(--text-light);
margin-bottom: var(--spacing-small);
font-weight: bold;
}
h1 {
font-size: 2.5rem;
margin-bottom: var(--spacing-large);
}
h2 {
font-size: 2rem;
color: var(--light-blue);
border-bottom: 2px solid var(--accent-blue);
padding-bottom: var(--spacing-small);
}
h3 {
font-size: 1.5rem;
}
p {
margin-bottom: var(--spacing-small);
color: var(--text-secondary);
}
a {
color: var(--link-color);
text-decoration: none;
transition: color 0.3s ease;
}
a:hover {
color: var(--link-hover);
text-decoration: underline;
}
header {
background: linear-gradient(135deg, var(--primary-dark-blue), var(--secondary-dark-blue));
padding: var(--spacing-large) var(--spacing-large);
box-shadow: var(--shadow);
border-bottom: 3px solid var(--accent-blue);
}
header h1 {
margin-bottom: var(--spacing-small);
text-align: center;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
nav {
display: flex;
justify-content: center;
gap: var(--spacing-large);
flex-wrap: wrap;
}
nav a {
background-color: var(--background-secondary);
color: var(--text-light);
padding: var(--spacing-small) var(--spacing-small);
border-radius: var(--border-radius);
border: 2px solid var(--border-color);
transition: all 0.3s ease;
font-weight: 500;
}
nav a:hover {
background-color: var(--accent-blue);
border-color: var(--light-blue);
transform: translateY(-2px);
box-shadow: var(--shadow);
text-decoration: none;
}
main {
flex: 1;
max-width: 1200px;
margin: 0 auto;
padding: var(--spacing-large);
width: 100%;
}
article {
background-color: var(--background-secondary);
border-radius: var(--border-radius);
padding: var(--spacing-large);
box-shadow: var(--shadow);
border: 1px solid var(--border-color);
}
ul,
ol {
margin-left: var(--spacing-large);
margin-bottom: var(--spacing-small);
}
li {
margin-bottom: var(--spacing-small);
color: var(--text-secondary);
}
li strong {
color: var(--text-light);
}
dl {
margin-bottom: var(--spacing-small);
}
dt {
font-weight: bold;
color: var(--text-light);
margin-top: var(--spacing-small);
margin-bottom: var(--spacing-small);
}
dt:first-child {
margin-top: 0;
}
dd {
margin-left: var(--spacing-large);
margin-bottom: var(--spacing-small);
color: var(--text-secondary);
}
video {
max-width: 100%;
height: auto;
border-radius: var(--border-radius);
box-shadow: var(--shadow);
border: 2px solid var(--border-color);
margin: var(--spacing-small) 0;
}
audio {
width: 100%;
margin: var(--spacing-small) 0;
}
table {
width: 100%;
border-collapse: collapse;
margin: var(--spacing-small) 0;
background-color: var(--background-dark);
border-radius: var(--border-radius);
overflow: hidden;
box-shadow: var(--shadow);
}
th,
td {
padding: var(--spacing-small);
text-align: left;
border-bottom: 1px solid var(--border-color);
}
th {
background-color: var(--primary-dark-blue);
color: var(--text-light);
font-weight: bold;
}
td {
color: var(--text-secondary);
}
tr:hover {
background-color: var(--background-secondary);
}