generated from nhcarrigan/template
This commit is contained in:
@@ -1,20 +1,10 @@
|
|||||||
# New Repository Template
|
# Silly Sites
|
||||||
|
|
||||||
This template contains all of our basic files for a new GitHub repository. There is also a handy workflow that will create an issue on a new repository made from this template, with a checklist for the steps we usually take in setting up a new repository.
|
Just a collection of fun li'l static pages I've built. A lot of these will come from things like programming events I run.
|
||||||
|
|
||||||
If you're starting a Node.JS project with TypeScript, we have a [specific template](https://github.com/naomi-lgbt/nodejs-typescript-template) for that purpose.
|
|
||||||
|
|
||||||
## Readme
|
|
||||||
|
|
||||||
Delete all of the above text (including this line), and uncomment the below text to use our standard readme template.
|
|
||||||
|
|
||||||
<!-- # Project Name
|
|
||||||
|
|
||||||
Project Description
|
|
||||||
|
|
||||||
## Live Version
|
## Live Version
|
||||||
|
|
||||||
This page is currently deployed. [View the live website.]
|
This page is currently deployed. [View the live website.](https://silly.nhcarrigan.com)
|
||||||
|
|
||||||
## Feedback and Bugs
|
## Feedback and Bugs
|
||||||
|
|
||||||
|
|||||||
+468
@@ -0,0 +1,468 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>🎪 Naomi's Silly Sites Carnival 🎪</title>
|
||||||
|
<style>
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=Bungee+Shade&family=Fredoka:wght@400;700&display=swap');
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Fredoka', cursive;
|
||||||
|
background: linear-gradient(45deg, #ff6b6b, #4ecdc4, #45b7d1, #96ceb4, #feca57, #ff9ff3);
|
||||||
|
background-size: 300% 300%;
|
||||||
|
animation: gradientShift 10s ease infinite;
|
||||||
|
min-height: 100vh;
|
||||||
|
overflow-x: hidden;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes gradientShift {
|
||||||
|
0% { background-position: 0% 50%; }
|
||||||
|
50% { background-position: 100% 50%; }
|
||||||
|
100% { background-position: 0% 50%; }
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Floating background elements */
|
||||||
|
.floating-emoji {
|
||||||
|
position: absolute;
|
||||||
|
font-size: 2rem;
|
||||||
|
animation: float 15s infinite ease-in-out;
|
||||||
|
opacity: 0.7;
|
||||||
|
user-select: none;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: transform 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.floating-emoji:hover {
|
||||||
|
transform: scale(1.5) rotate(360deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes float {
|
||||||
|
0%, 100% {
|
||||||
|
transform: translateY(0) translateX(0) rotate(0deg);
|
||||||
|
}
|
||||||
|
25% {
|
||||||
|
transform: translateY(-100px) translateX(50px) rotate(90deg);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
transform: translateY(-50px) translateX(-50px) rotate(180deg);
|
||||||
|
}
|
||||||
|
75% {
|
||||||
|
transform: translateY(-150px) translateX(100px) rotate(270deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Main container */
|
||||||
|
.container {
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 2rem;
|
||||||
|
position: relative;
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Header */
|
||||||
|
.header {
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
animation: bounceIn 1s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes bounceIn {
|
||||||
|
0% {
|
||||||
|
transform: scale(0);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
60% {
|
||||||
|
transform: scale(1.2);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-family: 'Bungee Shade', cursive;
|
||||||
|
font-size: clamp(2.5rem, 8vw, 5rem);
|
||||||
|
color: #fff;
|
||||||
|
text-shadow: 3px 3px 0 #ff6b6b, 6px 6px 0 #4ecdc4, 9px 9px 0 #45b7d1;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
animation: wiggle 2s ease-in-out infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes wiggle {
|
||||||
|
0%, 100% { transform: rotate(-3deg); }
|
||||||
|
50% { transform: rotate(3deg); }
|
||||||
|
}
|
||||||
|
|
||||||
|
.subtitle {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
color: #fff;
|
||||||
|
text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tagline {
|
||||||
|
font-size: 1.2rem;
|
||||||
|
color: #fff;
|
||||||
|
text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Site cards */
|
||||||
|
.sites-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
margin-top: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-card {
|
||||||
|
background: rgba(255, 255, 255, 0.9);
|
||||||
|
border-radius: 20px;
|
||||||
|
padding: 2rem;
|
||||||
|
text-align: center;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
cursor: pointer;
|
||||||
|
animation: slideUp 0.6s ease-out;
|
||||||
|
animation-fill-mode: backwards;
|
||||||
|
box-shadow: 0 10px 30px rgba(0,0,0,0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-card::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: -50%;
|
||||||
|
left: -50%;
|
||||||
|
width: 200%;
|
||||||
|
height: 200%;
|
||||||
|
background: linear-gradient(45deg, transparent, rgba(255,255,255,0.3), transparent);
|
||||||
|
transform: rotate(45deg);
|
||||||
|
transition: all 0.6s;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-card:hover::before {
|
||||||
|
animation: shine 0.6s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes shine {
|
||||||
|
0% {
|
||||||
|
top: -50%;
|
||||||
|
left: -50%;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
top: 150%;
|
||||||
|
left: 150%;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-card:hover {
|
||||||
|
transform: translateY(-10px) scale(1.05);
|
||||||
|
box-shadow: 0 20px 40px rgba(0,0,0,0.3);
|
||||||
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-card:hover .site-icon,
|
||||||
|
.site-card:hover .site-title,
|
||||||
|
.site-card:hover .site-description {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes slideUp {
|
||||||
|
from {
|
||||||
|
transform: translateY(30px);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
transform: translateY(0);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-card:nth-child(1) { animation-delay: 0.1s; }
|
||||||
|
.site-card:nth-child(2) { animation-delay: 0.2s; }
|
||||||
|
.site-card:nth-child(3) { animation-delay: 0.3s; }
|
||||||
|
.site-card:nth-child(4) { animation-delay: 0.4s; }
|
||||||
|
|
||||||
|
.site-icon {
|
||||||
|
font-size: 3rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
animation: bounce 2s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes bounce {
|
||||||
|
0%, 100% { transform: translateY(0); }
|
||||||
|
50% { transform: translateY(-10px); }
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-title {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
font-weight: 700;
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-description {
|
||||||
|
color: #666;
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Coming soon card */
|
||||||
|
.coming-soon {
|
||||||
|
background: repeating-linear-gradient(
|
||||||
|
45deg,
|
||||||
|
#f0f0f0,
|
||||||
|
#f0f0f0 10px,
|
||||||
|
#e0e0e0 10px,
|
||||||
|
#e0e0e0 20px
|
||||||
|
);
|
||||||
|
border: 3px dashed #999;
|
||||||
|
cursor: not-allowed;
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.coming-soon:hover {
|
||||||
|
transform: none;
|
||||||
|
background: repeating-linear-gradient(
|
||||||
|
45deg,
|
||||||
|
#f0f0f0,
|
||||||
|
#f0f0f0 10px,
|
||||||
|
#e0e0e0 10px,
|
||||||
|
#e0e0e0 20px
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Fun cursor trail effect */
|
||||||
|
.cursor-trail {
|
||||||
|
position: fixed;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
background: radial-gradient(circle, rgba(255,255,255,0.8) 0%, transparent 70%);
|
||||||
|
border-radius: 50%;
|
||||||
|
pointer-events: none;
|
||||||
|
z-index: 9999;
|
||||||
|
transition: transform 0.1s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Footer */
|
||||||
|
.footer {
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 4rem;
|
||||||
|
padding: 2rem;
|
||||||
|
color: #fff;
|
||||||
|
text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer a {
|
||||||
|
color: #fff;
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: 700;
|
||||||
|
border-bottom: 2px solid transparent;
|
||||||
|
transition: border-color 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer a:hover {
|
||||||
|
border-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Responsive */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.sites-grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Accessibility */
|
||||||
|
.site-card:focus-visible {
|
||||||
|
outline: 3px solid #4ecdc4;
|
||||||
|
outline-offset: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Fun loading animation */
|
||||||
|
.loading-dots {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-dots span {
|
||||||
|
display: inline-block;
|
||||||
|
animation: loadingDot 1.4s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-dots span:nth-child(1) { animation-delay: 0s; }
|
||||||
|
.loading-dots span:nth-child(2) { animation-delay: 0.2s; }
|
||||||
|
.loading-dots span:nth-child(3) { animation-delay: 0.4s; }
|
||||||
|
|
||||||
|
@keyframes loadingDot {
|
||||||
|
0%, 80%, 100% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
40% {
|
||||||
|
transform: scale(1.3);
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<!-- Floating background elements -->
|
||||||
|
<div class="floating-emoji" style="top: 10%; left: 10%; animation-delay: 0s;">🎈</div>
|
||||||
|
<div class="floating-emoji" style="top: 20%; left: 80%; animation-delay: 2s;">🎪</div>
|
||||||
|
<div class="floating-emoji" style="top: 60%; left: 5%; animation-delay: 4s;">🎨</div>
|
||||||
|
<div class="floating-emoji" style="top: 70%; left: 90%; animation-delay: 6s;">🌈</div>
|
||||||
|
<div class="floating-emoji" style="top: 30%; left: 50%; animation-delay: 8s;">✨</div>
|
||||||
|
<div class="floating-emoji" style="top: 80%; left: 40%; animation-delay: 10s;">🎭</div>
|
||||||
|
<div class="floating-emoji" style="top: 50%; left: 70%; animation-delay: 12s;">🎯</div>
|
||||||
|
<div class="floating-emoji" style="top: 15%; left: 30%; animation-delay: 14s;">🎡</div>
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
<header class="header">
|
||||||
|
<h1>Silly Sites Carnival</h1>
|
||||||
|
<p class="subtitle">Welcome to Naomi's Collection of Delightfully Ridiculous Web Pages!</p>
|
||||||
|
<p class="tagline">Where serious coding meets silly ideas 🎉</p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main class="sites-grid">
|
||||||
|
<a href="/travel-agency/" class="site-card" tabindex="0">
|
||||||
|
<div class="site-icon">✈️</div>
|
||||||
|
<h2 class="site-title">Dubious Travel Agency</h2>
|
||||||
|
<p class="site-description">Book your next adventure to places that definitely exist! We promise!</p>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<div class="site-card coming-soon" tabindex="0">
|
||||||
|
<div class="site-icon">🔮</div>
|
||||||
|
<h2 class="site-title">Mystery Project</h2>
|
||||||
|
<p class="site-description">Coming soon<span class="loading-dots"><span>.</span><span>.</span><span>.</span></span> What could it be?</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="site-card coming-soon" tabindex="0">
|
||||||
|
<div class="site-icon">🎲</div>
|
||||||
|
<h2 class="site-title">Random Nonsense Generator</h2>
|
||||||
|
<p class="site-description">Future home of absolutely meaningless content!</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="site-card coming-soon" tabindex="0">
|
||||||
|
<div class="site-icon">🦄</div>
|
||||||
|
<h2 class="site-title">Unicorn University</h2>
|
||||||
|
<p class="site-description">Learn skills that don't exist yet!</p>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer class="footer">
|
||||||
|
<p>Made with 💜 and a healthy dose of silliness by <a href="https://www.nhcarrigan.com">Naomi</a></p>
|
||||||
|
<p>Found a bug? It's probably a feature! But you can <a href="https://support.nhcarrigan.com">report it anyway</a>.</p>
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// Add some interactive silliness!
|
||||||
|
const emojis = ['🎈', '🎪', '🎨', '🌈', '✨', '🎭', '🎯', '🎡', '🎉', '🎊', '🎠', '🎢'];
|
||||||
|
|
||||||
|
// Click floating emojis to change them
|
||||||
|
document.querySelectorAll('.floating-emoji').forEach(emoji => {
|
||||||
|
emoji.addEventListener('click', function() {
|
||||||
|
const randomEmoji = emojis[Math.floor(Math.random() * emojis.length)];
|
||||||
|
this.textContent = randomEmoji;
|
||||||
|
|
||||||
|
// Burst effect
|
||||||
|
const burst = document.createElement('div');
|
||||||
|
burst.style.position = 'absolute';
|
||||||
|
burst.style.left = '50%';
|
||||||
|
burst.style.top = '50%';
|
||||||
|
burst.style.transform = 'translate(-50%, -50%)';
|
||||||
|
burst.style.fontSize = '3rem';
|
||||||
|
burst.textContent = randomEmoji;
|
||||||
|
burst.style.animation = 'burst 0.6s ease-out forwards';
|
||||||
|
this.appendChild(burst);
|
||||||
|
|
||||||
|
setTimeout(() => burst.remove(), 600);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Create cursor trail on mouse move
|
||||||
|
let mouseX = 0, mouseY = 0;
|
||||||
|
const trails = [];
|
||||||
|
const maxTrails = 10;
|
||||||
|
|
||||||
|
document.addEventListener('mousemove', (e) => {
|
||||||
|
mouseX = e.clientX;
|
||||||
|
mouseY = e.clientY;
|
||||||
|
|
||||||
|
if (trails.length >= maxTrails) {
|
||||||
|
const oldTrail = trails.shift();
|
||||||
|
oldTrail.remove();
|
||||||
|
}
|
||||||
|
|
||||||
|
const trail = document.createElement('div');
|
||||||
|
trail.className = 'cursor-trail';
|
||||||
|
trail.style.left = mouseX + 'px';
|
||||||
|
trail.style.top = mouseY + 'px';
|
||||||
|
trail.style.background = `hsl(${Math.random() * 360}, 100%, 70%)`;
|
||||||
|
document.body.appendChild(trail);
|
||||||
|
trails.push(trail);
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
trail.style.transform = 'scale(0)';
|
||||||
|
setTimeout(() => {
|
||||||
|
const index = trails.indexOf(trail);
|
||||||
|
if (index > -1) trails.splice(index, 1);
|
||||||
|
trail.remove();
|
||||||
|
}, 300);
|
||||||
|
}, 100);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Add burst animation
|
||||||
|
const style = document.createElement('style');
|
||||||
|
style.textContent = `
|
||||||
|
@keyframes burst {
|
||||||
|
0% {
|
||||||
|
transform: translate(-50%, -50%) scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: translate(-50%, -50%) scale(3);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
document.head.appendChild(style);
|
||||||
|
|
||||||
|
// Console easter egg
|
||||||
|
console.log('%c🎪 Welcome to the Silly Sites Carnival! 🎪', 'font-size: 24px; color: #ff6b6b; font-weight: bold; text-shadow: 2px 2px 4px rgba(0,0,0,0.3);');
|
||||||
|
console.log('%cYou found the secret console message! Here\'s a joke:', 'font-size: 16px; color: #4ecdc4;');
|
||||||
|
console.log('%cWhy do programmers prefer dark mode?\n\nBecause light attracts bugs! 🐛', 'font-size: 14px; color: #45b7d1;');
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
<script defer="" src="https://analytics.nhcarrigan.com/js/pa-YUXAn1vhhRttySUAw_LMN.js"></script>
|
||||||
|
<script>
|
||||||
|
window.plausible=window.plausible||function(){(plausible.q=plausible.q||[]).push(arguments)},plausible.init=plausible.init||function(i){plausible.o=i||{}};
|
||||||
|
plausible.init({
|
||||||
|
customProperties: {
|
||||||
|
domain: "silly.nhcarrigan.com",
|
||||||
|
page: "NHCarrigan - Software Engineering & Community Management",
|
||||||
|
path: "/",
|
||||||
|
},
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<script async="" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3569924701890974" crossorigin="anonymous"></script>
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,68 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="description" content="Book a trip through NHCarrigan today!" />
|
||||||
|
<title>NHCarrigan Travel Agency</title>
|
||||||
|
<link rel="stylesheet" href="./style.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<h1>NHCarrigan Travel Agency</h1>
|
||||||
|
<p>
|
||||||
|
Book your first class travel experience through NHCarrigan and visit far-off lands like Cyrodil, Hyrule, Night
|
||||||
|
City, and the Mushroom Kingdom!
|
||||||
|
</p>
|
||||||
|
<h2>Packages</h2>
|
||||||
|
<p>
|
||||||
|
Adventure alone with our solo experiences, or join your friends for a proper raid!
|
||||||
|
</p>
|
||||||
|
<ul>
|
||||||
|
<div class="bullet" aria-hidden="true">•</div>
|
||||||
|
<li>
|
||||||
|
Group Travels
|
||||||
|
</li>
|
||||||
|
<div class="bullet" aria-hidden="true">•</div>
|
||||||
|
<li>
|
||||||
|
Private Tours
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<h2>Top Itineraries</h2>
|
||||||
|
<figure>
|
||||||
|
<img src="https://cdn.nhcarrigan.com/hero/history.png"
|
||||||
|
alt="A woman with long hair and glasses sits relaxed in an armchair, barefoot, in a cozy library. A steaming teacup and open book are on a nearby table, creating a serene atmosphere." />
|
||||||
|
<figcaption>
|
||||||
|
Acquire endless knowledge by exploring vast collections of lore.
|
||||||
|
</figcaption>
|
||||||
|
</figure>
|
||||||
|
<figure>
|
||||||
|
<img src="https://cdn.nhcarrigan.com/hero/donate.png"
|
||||||
|
alt="A smiling woman in a blue robe sits in a library with a treasure chest overflowing with gold and jewels. She holds a bowl of coins. Money bags and books surround her." />
|
||||||
|
<figcaption>
|
||||||
|
Discover countless riches among ancient treasure.
|
||||||
|
</figcaption>
|
||||||
|
</figure>
|
||||||
|
<figure>
|
||||||
|
<img src="https://cdn.nhcarrigan.com/lore/misc/after-hours.png"
|
||||||
|
alt="An anime-style illustration depicting four young women having a cozy evening together on a large beige sectional sofa in a dimly lit living room. From left to right: a blonde woman with glasses wearing a light blue top is lying down asleep with a pillow and blanket; a silver-haired woman in a dark shirt and shorts sits reading a book; a white-haired woman in pink pajamas sits in the middle holding a bowl of popcorn with a cheerful expression; and a green-haired woman in a green oversized shirt sits cross-legged on the right side of the couch. The coffee table in front holds snack packages, two blue mugs, and appears to have some books or magazines. A large flat-screen TV is visible on the left side of the image, and the room features dark blue walls with curtained windows and soft lighting creating an intimate, comfortable atmosphere perfect for a girls' night in." />
|
||||||
|
<figcaption>
|
||||||
|
Give your group a chance to unwind with our luxury accommodations.
|
||||||
|
</figcaption>
|
||||||
|
</figure>
|
||||||
|
</body>
|
||||||
|
<script defer="" src="https://analytics.nhcarrigan.com/js/pa-YUXAn1vhhRttySUAw_LMN.js"></script>
|
||||||
|
<script>
|
||||||
|
window.plausible = window.plausible || function () { (plausible.q = plausible.q || []).push(arguments) }, plausible.init = plausible.init || function (i) { plausible.o = i || {} };
|
||||||
|
plausible.init({
|
||||||
|
customProperties: {
|
||||||
|
domain: "silly.nhcarrigan.com",
|
||||||
|
page: "NHCarrigan Travel Agency",
|
||||||
|
path: "/travel-agency",
|
||||||
|
},
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<script async="" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3569924701890974"
|
||||||
|
crossorigin="anonymous"></script>
|
||||||
|
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,58 @@
|
|||||||
|
* {
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
text-align: center;
|
||||||
|
background: url("https://cdn.nhcarrigan.com/splash.png");
|
||||||
|
background-size: cover;
|
||||||
|
background-position: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
width: 95%;
|
||||||
|
max-width: 750px;
|
||||||
|
margin: auto;
|
||||||
|
text-align: left;
|
||||||
|
background-color: #ffddddaa;
|
||||||
|
text-align: center;
|
||||||
|
padding: 10px 20px;
|
||||||
|
margin: 15px auto;
|
||||||
|
border-radius: 30px;
|
||||||
|
color: #117799;
|
||||||
|
}
|
||||||
|
|
||||||
|
figure {
|
||||||
|
border: 10px inset #553300;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
background: linear-gradient(90deg, #664400, yellow, #664400);
|
||||||
|
filter: drop-shadow(10px 10px 10px);
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
display: grid;
|
||||||
|
list-style-type: none;
|
||||||
|
grid-template-areas: "marker text" "marker text";
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
li {
|
||||||
|
grid-area: text;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bullet {
|
||||||
|
grid-area: marker;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user