first commit

This commit is contained in:
Raven Scott
2024-09-16 07:53:26 -04:00
commit 4df0d17183
10 changed files with 954 additions and 0 deletions

153
views/about.ejs Normal file
View File

@ -0,0 +1,153 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Meta and Title -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>About Me - Raven Scott</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css">
<!-- Font Awesome CSS for Icons -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<!-- Custom CSS -->
<link rel="stylesheet" href="/css/styles.css">
<style>
/* Custom styles for a more professional look */
body {
background-color: #1a1a1a;
color: #e0e0e0;
}
.navbar {
background-color: #212529;
}
.about-me h2,
.about-me h3 {
color: #ffffff;
font-weight: bold;
}
.about-me p {
font-size: 1.1rem;
line-height: 1.7;
color: #d1d1d1;
}
.about-me {
padding: 50px 0;
}
.container {
max-width: 900px;
margin: auto;
}
.footer-logo {
font-size: 1.5rem;
font-weight: bold;
}
.footer-links a {
color: #9a9a9a;
font-size: 0.9rem;
}
.footer-links a:hover {
color: #ffffff;
}
.btn-primary {
background-color: #007bff;
border-color: #007bff;
}
.btn-primary:hover {
background-color: #0056b3;
border-color: #004085;
}
/* Add padding for better text readability */
.about-me p {
padding-bottom: 15px;
}
/* Separator style for sections */
.section-divider {
width: 80px;
height: 3px;
background-color: #007bff;
margin: 20px 0;
border-radius: 2px;
}
</style>
</head>
<body>
<!-- Navigation Bar -->
<nav class="navbar navbar-expand-lg navbar-dark">
<div class="container-fluid">
<a class="navbar-brand" href="/">Raven Scott</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/about">About Me</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/contact">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- About Me Section -->
<section class="about-me py-5">
<div class="container text-center">
<h2 class="text-white mb-4">About Me</h2>
<div class="section-divider"></div>
<p class="lead">Hi, Im Raven Scott, a Linux enthusiast and problem solver with a deep passion for technology and creativity. I thrive in environments where I can learn, experiment, and turn ideas into reality. Whether it's building systems, coding, or tackling complex technical challenges, I find joy in using technology to make life easier and more efficient.</p>
<p>My passion for Linux and open-source technologies began early on, and since then, Ive been on a continuous journey of growth and discovery. From troubleshooting networking issues to optimizing servers for performance, I love diving deep into the intricate details of how things work. The thrill of solving problems, especially when it comes to system security or performance optimization, is what fuels me every day.</p>
<h3 class="text-white mt-5">What Drives Me</h3>
<div class="section-divider"></div>
<p>Im passionate about more than just the technical side. I believe in the power of technology to bring people together, and thats why Im dedicated to creating platforms and solutions that are accessible and impactful. Whether it's hosting services, developing peer-to-peer applications, or automating complex tasks, Im always exploring new ways to push the boundaries of what's possible.</p>
<p>Outside of work, I love contributing to community projects and sharing my knowledge with others. Helping people grow their own skills is one of the most rewarding aspects of what I do. From mentoring to writing documentation, Im constantly looking for ways to give back to the tech community.</p>
<h3 class="text-white mt-5">Creative Side</h3>
<div class="section-divider"></div>
<p>When Im not deep in the technical world, Im exploring my creative side through music. I run my own music label, where I produce and distribute AI-generated music across all platforms. Music and technology blend seamlessly for me, as both are outlets for innovation and expression.</p>
<p>In everything I do, from coding to creating music, my goal is to keep learning, growing, and sharing my passion with the world. If you ever want to connect, collaborate, or simply chat about tech or music, feel free to reach out!</p>
</div>
</section>
<!-- Footer -->
<footer class="bg-dark text-white text-center py-4">
<div class="container">
<h4 class="footer-logo mb-3">Never Stop Learning</h4>
<p class="footer-links mb-3">
<a href="/" class="text-white text-decoration-none me-3">Home</a>
<a href="/about" class="text-white text-decoration-none me-3">About</a>
<a href="/contact" class="text-white text-decoration-none">Contact</a>
</p>
<p class="mb-0">&copy; 2024 Raven Scott. All rights reserved.</p>
</div>
</footer>
<!-- Bootstrap JS Bundle -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

77
views/blog-post.ejs Normal file
View File

@ -0,0 +1,77 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><%= title %></title>
<!-- Stylesheets -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<link rel="stylesheet" href="/css/styles.css">
<!-- Highlight.js CSS for Syntax Highlighting -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/styles/default.min.css">
</head>
<body>
<!-- Navbar -->
<nav class="navbar navbar-expand-lg navbar-dark">
<div class="container-fluid">
<a class="navbar-brand" href="/">Raven Scott</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link active" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/about">About Me</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/contact">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<header class="bg-primary text-white text-center py-5">
<h1><%= title %></h1>
<p class="lead"><%= lead %></p> <!-- Lead is dynamically set here -->
</header>
<main class="container my-5">
<!-- Render Markdown content as HTML -->
<div class="markdown-content">
<%- content %>
</div>
</main>
<!-- Footer -->
<footer class="bg-dark text-white text-center py-4">
<div class="container">
<h4 class="footer-logo mb-3">Never Stop Learning</h4>
<p class="footer-links mb-3">
<a href="/" class="text-white text-decoration-none me-3">Home</a>
<a href="/about" class="text-white text-decoration-none me-3">About</a>
<a href="/contact" class="text-white text-decoration-none">Contact</a>
</p>
<p class="mb-0">&copy; 2024 Raven Scott. All rights reserved.</p>
</div>
</footer>
<!-- Scripts -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
<!-- Highlight.js Script -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/highlight.min.js"></script>
<script>
// Initialize Highlight.js
document.addEventListener('DOMContentLoaded', (event) => {
document.querySelectorAll('pre code').forEach((block) => {
hljs.highlightElement(block);
});
});
</script>
</body>
</html>

96
views/contact.ejs Normal file
View File

@ -0,0 +1,96 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Meta and Title -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Contact Me - Raven Scott</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css">
<!-- Font Awesome CSS for Icons -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<!-- Custom CSS -->
<link rel="stylesheet" href="/css/styles.css">
</head>
<body class="bg-dark text-white">
<!-- Navigation Bar -->
<nav class="navbar navbar-expand-lg navbar-dark">
<div class="container-fluid">
<a class="navbar-brand" href="/">Raven Scott</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link active" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/about">About Me</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/contact">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Contact Me Section -->
<header class="d-flex align-items-center justify-content-center text-center py-5">
<div class="container">
<h2 class="mb-4 text-white">Contact Me</h2>
<p class="lead text-white">Have a question or need help with a project? Fill out the form below, and I'll be in touch!</p>
<!-- Display success or error message -->
<% if (typeof msg !== 'undefined') { %>
<div class="alert alert-info mt-3">
<%= msg %>
</div>
<% } %>
<!-- Contact Form -->
<form action="/contact" method="POST" class="mt-4">
<div class="mb-3">
<label for="name" class="form-label">Your Name<span class="text-danger">*</span></label>
<input type="text" class="form-control bg-dark text-white border-secondary" id="name" name="name" required>
</div>
<div class="mb-3">
<label for="email" class="form-label">Email Address<span class="text-danger">*</span></label>
<input type="email" class="form-control bg-dark text-white border-secondary" id="email" name="email" required>
</div>
<div class="mb-3">
<label for="subject" class="form-label">Subject<span class="text-danger">*</span></label>
<input type="text" class="form-control bg-dark text-white border-secondary" id="subject" name="subject" required>
</div>
<div class="mb-3">
<label for="message" class="form-label">Your Message<span class="text-danger">*</span></label>
<textarea class="form-control bg-dark text-white border-secondary" id="message" name="message" rows="6" required></textarea>
</div>
<button type="submit" class="btn btn-primary">Send Message</button>
</form>
</div>
</header>
<!-- Footer -->
<footer class="bg-dark text-white text-center py-4">
<div class="container">
<h4 class="footer-logo mb-3">Never Stop Learning</h4>
<p class="footer-links mb-3">
<a href="/" class="text-white text-decoration-none me-3">Home</a>
<a href="/about" class="text-white text-decoration-none me-3">About</a>
<a href="/contact" class="text-white text-decoration-none">Contact</a>
</p>
<p class="mb-0">&copy; 2024 Raven Scott. All rights reserved.</p>
</div>
</footer>
<!-- Bootstrap JS Bundle -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

74
views/index.ejs Normal file
View File

@ -0,0 +1,74 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><%= title %></title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="/css/styles.css">
</head>
<body>
<!-- Navbar -->
<nav class="navbar navbar-expand-lg navbar-dark">
<div class="container-fluid">
<a class="navbar-brand" href="/">raven-scott.fyi</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link active" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/about">About Me</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/contact">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<header class="py-5">
<div class="container text-center">
<h1>Welcome to my long form post blog</h1>
<p class="lead">Latest articles and insights from Raven Scott</p>
</div>
</header>
<section class="py-5">
<div class="container">
<h2>Recent Posts</h2>
<div class="row">
<% blogPosts.forEach(post => { %>
<div class="col-md-4">
<div class="card mb-4">
<div class="card-body">
<h5 class="card-title"><%= post.title %></h5>
<a href="/blog/<%= post.slug %>" class="btn btn-primary">Read More</a>
</div>
</div>
</div>
<% }) %>
</div>
</div>
</section>
<footer class="bg-dark text-white text-center py-4">
<div class="container">
<h4 class="footer-logo mb-3">Never Stop Learning</h4>
<p class="footer-links mb-3">
<a href="/" class="text-white text-decoration-none me-3">Home</a>
<a href="/about" class="text-white text-decoration-none me-3">About</a>
<a href="/contact" class="text-white text-decoration-none">Contact</a>
</p>
<p class="mb-0">&copy; 2024 Raven Scott. All rights reserved.</p>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>