81 lines
5.7 KiB
HTML
81 lines
5.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="description" content="Colin Knapp - [Story Title] Case Study">
|
|
<title>[Story Title] - Colin Knapp Case Study</title>
|
|
<link rel="icon" type="image/x-icon" href="../favicon.ico">
|
|
<link rel="stylesheet" href="../styles.css" integrity="sha256-Y+6RTuKMnPfNa1TjCQCcFhxwo0G+xNy7t1MaAvn5SuU=" crossorigin="anonymous">
|
|
<script src="../theme.js" integrity="sha256-+dDNTo7WAOmn2YC875+vn9oH4UkMwlVOGlARp2uq3A4=" crossorigin="anonymous"></script>
|
|
<script src="../includes.js" integrity="sha256-q9ac7XWqnIASoBRfs4I4hpSMlnxGARofcEw0cSFfn/E=" crossorigin="anonymous"></script>
|
|
<link rel="stylesheet" href="stories.css" integrity="sha256-O+OMb48leSKvekhMTDUK1y6+WG9x33kA0eDw00wUwkY=">
|
|
</head>
|
|
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; script-src 'self' 'sha256-oRCvBUmDTuPb8XOF1vLYwhIrcj2kzMbEwX5QzUPAPQI=' 'sha256-Ue6wom48SQbpmwW9QIk7pyVDR5Bg36SetP67V2pDkxc=' 'sha256-uTJNJlctGr5GxR5DKnz1Ex31vH0TR93OFGloxbHe65g=' 'sha256-fOEWMJmrMxKbP5wElIXmDNUlfs6BSn+E9zt81T0Rysg=' 'sha256-q9ac7XWqnIASoBRfs4I4hpSMlnxGARofcEw0cSFfn/E=' 'sha256-+dDNTo7WAOmn2YC875+vn9oH4UkMwlVOGlARp2uq3A4=' 'sha256-1ZUvhca3M/N6hch4NrdPufDPLTnANOpJ4hfsZgRykgg=' 'sha256-UUDFHb6NI63nBRS2EmyJq4giwjTQGYPq7uSTB4UQnPc=' 'sha256-Ue6wom48SQbpmwW9QIk7pyVDR5Bg36SetP67V2pDkxc=' 'sha256-ryQsJ+aghKKD/CeXgx8jtsnZT3Epp3EjIw8RyHIq544=' 'sha256-8CNR2aPoRsO94LHwXXZzxijfMf15BfwUewt8hvVbPcE='; style-src 'self' 'sha256-5oTxos9Qxwhor3qIwHSM12YyIZi5E+tHuFdYER0hXoI=' 'sha256-807UZmWvd6eLc8xVckZkNX6CRP9WV8MzHURc5BgtRWo=' 'sha256-Y+6RTuKMnPfNa1TjCQCcFhxwo0G+xNy7t1MaAvn5SuU=' 'sha256-O+OMb48leSKvekhMTDUK1y6+WG9x33kA0eDw00wUwkY=' 'sha256-2EA12+9d+s6rrc0rkdIjfmjbh6p2o0ZSXs4wbZuk/tA='; img-src 'self' data:; font-src 'self' data:; connect-src 'self'; object-src 'none'; frame-ancestors 'none'; base-uri 'none'; form-action 'none';">
|
|
<body>
|
|
<!-- Header Include -->
|
|
<div id="header-include"></div>
|
|
|
|
<div class="container-fluid" role="main">
|
|
<div class="story-header">
|
|
<h1>[Story Title]</h1>
|
|
<p class="story-meta">Category: [Category] | Date: [Date Range]</p>
|
|
<hr>
|
|
</div>
|
|
|
|
<div class="story-content">
|
|
<!-- Replace with actual content -->
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vehicula, nisl vel ultricies aliquet, nisi urna posuere nibh, vel dapibus sapien libero ac nisi. Phasellus non volutpat orci, eu eleifend diam. Integer scelerisque euismod sem, vel euismod orci viverra a.</p>
|
|
|
|
<h2>The Challenge</h2>
|
|
<p>Cras consectetur dolor vel arcu luctus, a hendrerit tortor ultricies. Fusce eu eros vel mauris fermentum volutpat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Integer rhoncus tortor vitae turpis tincidunt, sed congue lacus tempor.</p>
|
|
|
|
<blockquote>
|
|
"This project represented a significant challenge that required innovative thinking and cutting-edge technology solutions."
|
|
</blockquote>
|
|
|
|
<h2>The Approach</h2>
|
|
<p>Praesent feugiat tortor non tortor maximus, at congue nibh tincidunt. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Morbi vulputate velit non enim euismod, sit amet maximus mauris consectetur. Donec placerat arcu non faucibus condimentum.</p>
|
|
|
|
<!-- Sample image placement -->
|
|
<!-- <img src="images/story-image.jpg" alt="Description of the image" class="story-image"> -->
|
|
|
|
<h2>Technical Implementation</h2>
|
|
<p>Aenean non auctor mauris, id dapibus turpis. Fusce vestibulum mi sit amet sem commodo, id aliquam magna sollicitudin. Donec vel libero cursus, venenatis justo sit amet, faucibus nisi. Vestibulum nec suscipit mi. Ut fringilla scelerisque eros, id vestibulum lectus vehicula id.</p>
|
|
|
|
<h2>Results & Impact</h2>
|
|
<p>Suspendisse potenti. Curabitur pharetra neque quis dolor pretium, nec feugiat metus varius. Nulla facilisi. Nam ut justo sed leo viverra iaculis. Aliquam eget risus vitae quam dapibus dignissim at vel lectus. Proin convallis velit non dictum faucibus.</p>
|
|
|
|
<h2>Lessons Learned</h2>
|
|
<p>Proin malesuada facilisis felis, quis placerat erat dignissim nec. Morbi hendrerit elit vitae orci interdum mattis. Curabitur imperdiet velit ut libero egestas, at accumsan arcu vehicula. Nullam ac orci et velit efficitur condimentum.</p>
|
|
</div>
|
|
|
|
<div class="story-footer">
|
|
<div class="story-nav">
|
|
<a href="#" class="story-nav-link prev">Previous Story</a>
|
|
<a href="#" class="story-nav-link next">Next Story</a>
|
|
</div>
|
|
|
|
<div class="related-stories">
|
|
<h3>Related Stories</h3>
|
|
<div class="related-stories-list">
|
|
<div class="story-card">
|
|
<h2>Related Story Title</h2>
|
|
<p class="story-excerpt">Brief description of the related story content.</p>
|
|
<a href="#" class="story-link">Read Story</a>
|
|
</div>
|
|
<div class="story-card">
|
|
<h2>Another Related Story</h2>
|
|
<p class="story-excerpt">Brief description of another related story.</p>
|
|
<a href="#" class="story-link">Read Story</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Footer Include -->
|
|
<div id="footer-include"></div>
|
|
</body>
|
|
</html>
|