diff --git a/assets/css/style.css b/assets/css/style.css index 62a98f5..6298430 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -12,6 +12,10 @@ margin: 0; padding: 0; box-sizing: border-box; + -webkit-user-select: text; + -moz-user-select: text; + -ms-user-select: text; + user-select: text; } body { @@ -76,10 +80,14 @@ ol li::marker { font-weight: bold; } -/* Original Headings */ +/* Headings */ h1, h2, h3 { font-family: 'MedievalSharp', cursive; color: var(--accent-gold); + -webkit-user-select: text; + -moz-user-select: text; + -ms-user-select: text; + user-select: text; } /* Links Enhancement */ @@ -108,9 +116,9 @@ blockquote p { margin: 0; } -/* Enhanced Hero Section */ +/* Enhanced Hero Section with Selection Fix */ .hero { - min-height: 70vh; /* Increased height for more impact */ + min-height: 70vh; background-image: linear-gradient(rgba(0,0,0,0.8), rgba(0,0,0,0.8)), url('/assets/images/hero-bg.jpg'); background-size: cover; @@ -119,23 +127,29 @@ blockquote p { align-items: center; justify-content: center; text-align: center; - padding: 3rem; /* Increased padding for better spacing */ + padding: 3rem; color: var(--text-light); - position: relative; /* Added for pseudo-elements */ + position: relative; + -webkit-user-select: text; + -moz-user-select: text; + -ms-user-select: text; + user-select: text; } .hero h1 { - font-size: 4rem; /* Increased font size for the title */ + font-size: 4rem; margin-bottom: 1rem; - text-shadow: 3px 3px 6px var(--shadow-color); /* Enhanced shadow for better readability */ - z-index: 1; /* Ensure the text is above background */ + text-shadow: 3px 3px 6px var(--shadow-color); + position: relative; + z-index: 2; } .hero p { - font-size: 1.5rem; /* Increased font size for better readability */ - max-width: 800px; /* Wider max width for longer text */ + font-size: 1.5rem; + max-width: 800px; margin: 0 auto 2rem; - z-index: 1; /* Ensure the text is above background */ + position: relative; + z-index: 2; } /* Overlay for Hero Section */ @@ -146,9 +160,10 @@ blockquote p { left: 0; right: 0; bottom: 0; - background: rgba(0, 0, 0, 0.5); /* Dark overlay for better contrast */ - z-index: 0; /* Behind the text */ - border-radius: 8px; /* Rounded corners for a softer look */ + background: rgba(0, 0, 0, 0.5); + z-index: 1; + border-radius: 8px; + pointer-events: none; } /* Button Styling */ @@ -161,14 +176,16 @@ blockquote p { text-decoration: none; transition: background 0.3s ease; margin-top: 1rem; + position: relative; + z-index: 2; } .hero .button:hover { - background: var(--accent-gold); /* Change color on hover */ - transform: translateY(-2px); /* Slight lift effect */ + background: var(--accent-gold); + transform: translateY(-2px); } -/* Original Layout Classes */ +/* Layout Classes */ .main-content { max-width: 1200px; margin: 0 auto; @@ -186,7 +203,7 @@ blockquote p { box-shadow: 0 0 20px rgba(0,0,0,0.5); } -/* Original Component Classes */ +/* Component Classes */ .story-list, .episode-list { padding: 1rem; } @@ -215,7 +232,7 @@ blockquote p { transform: translateX(5px); } -/* Original Content Display */ +/* Content Display */ .content-display { padding: 2rem; background: rgba(0,0,0,0.2); @@ -229,7 +246,7 @@ blockquote p { padding: 1rem; } -/* Original Layout Modifiers */ +/* Layout Modifiers */ .both-contents .episode-content { grid-template-columns: 1fr 2fr; } @@ -247,7 +264,7 @@ blockquote p { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } -/* Original Utility Classes */ +/* Utility Classes */ .error-message { color: #ff6b6b; padding: 1rem; @@ -262,6 +279,7 @@ blockquote p { color: var(--accent-gold); } +/* Illustrations Section */ .illustrations-section { margin-top: 2rem; padding: 1rem; @@ -302,6 +320,7 @@ blockquote p { font-style: italic; } +/* Button Styles */ .rss-button { background: var(--accent-purple); color: white; @@ -342,25 +361,7 @@ blockquote p { border-bottom: none; } -/* Add these styles to ensure text is selectable */ -.hero { - user-select: text; /* Explicitly enable text selection */ - position: relative; -} - -.hero h1, -.hero p { - position: relative; - z-index: 2; /* Ensure text is above the overlay */ - user-select: text; /* Explicitly enable text selection */ -} - -.hero::before { - z-index: 1; /* Keep overlay below the text */ - pointer-events: none; /* Prevent overlay from blocking interactions */ -} - -/* Original Animations */ +/* Animations */ @keyframes slideIn { from { opacity: 0; @@ -372,7 +373,7 @@ blockquote p { } } -/* Original Responsive Design */ +/* Responsive Design */ @media (max-width: 768px) { .both-contents .episode-content { grid-template-columns: 1fr; diff --git a/feed.xml b/feed.xml index 9eb9dbb..ceb9e66 100644 --- a/feed.xml +++ b/feed.xml @@ -4,7 +4,7 @@ https://opd-ai.github.io An epic D&D campaign following heroes as they uncover ancient mysteries and battle dark forces. (The DM) - Mon, 11 Nov 2024 14:49:40 -0500 + Mon, 11 Nov 2024 14:52:01 -0500 Cult: Chapter 01 - Temple https://opd-ai.github.io/Cult/01-Temple/01_Episode/index.html