Skip to content

Commit

Permalink
Merge branch 'main' into 563-converter-update-for-opco-home
Browse files Browse the repository at this point in the history
  • Loading branch information
rgravitvl authored Dec 8, 2023
2 parents 183b473 + d493fda commit 7496f62
Show file tree
Hide file tree
Showing 3 changed files with 138 additions and 64 deletions.
120 changes: 57 additions & 63 deletions 404.html
Original file line number Diff line number Diff line change
@@ -1,67 +1,61 @@
<!DOCTYPE html>
<html>
<head>
<title>Page not found</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:title" content="Page not found">
<script src="/scripts/scripts.js" type="module" crossorigin="use-credentials"></script>
<script type="text/javascript">
window.isErrorPage = true;
window.errorCode = '404';
</script>
<script type="module">
import { sampleRUM } from '/scripts/lib-franklin.js';
window.addEventListener('load', () => sampleRUM('404', { source: document.referrer, target: window.location.href }));
</script>
<style>
main.error {
min-height: calc(100vh - var(--nav-height));
display: flex;
align-items: center;
}

<head>
<title>Page not found</title>
<script type="text/javascript">
window.isErrorPage = true;
window.errorCode = '404';
</script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:title" content="Page not found">
<script src="/scripts/scripts.js" type="module" crossorigin="use-credentials"></script>
<script type="module">
import { sampleRUM } from '/scripts/lib-franklin.js';

window.addEventListener('load', () => {
if (document.referrer) {
const { origin, pathname } = new URL(document.referrer);
if (origin === window.location.origin) {
const backBtn = document.createElement('a');
backBtn.classList.add('button', 'error-button-back');
backBtn.href = pathname;
backBtn.textContent = 'Go back';
backBtn.title = 'Go back';
const btnContainer = document.querySelector('.button-container');
btnContainer.append(backBtn);
}
}
sampleRUM('404', { source: document.referrer, target: window.location.href });
});
</script>
<link rel="stylesheet" href="/styles/styles.css">
<style>
main.error {
min-height: calc(100vh - var(--nav-height));
display: flex;
align-items: center;
}

main.error .error-number {
width: 100%;
}

main.error .error-number text {
font-family: var(--fixed-font-family);
}
</style>
<link rel="stylesheet" href="/styles/lazy-styles.css">
</head>

<body>
<header></header>
<main class="error">
<div class="section">
<svg viewBox="1 0 38 18" class="error-number">
<text x="0" y="17">404</text>
</svg>
<h2 class="error-message">Page Not Found</h2>
<p class="button-container">
<a href="/" class="button secondary error-button-home">Go home</a>
</p>
</div>
</main>
<footer></footer>
</body>

main.error .section {
padding: 0;
}
</style>
<link rel="stylesheet" href="/styles/styles.css">
<link rel="stylesheet" href="/styles/lazy-styles.css">
</head>
<body>
<header></header>
<main class="error">
<div class="max-w-7xl mx-auto w-full">
<div class="errors relative bg-white grid lg:grid-cols-7" data-request-status="404">
<div class="lg:col-span-3 px-4 sm:px-6 lg:max-w-7xl lg:px-8">
<div class="relative sm:pt-8 lg:pt-14 pt-12 md:pb-24 lg:pb-80 xl:col-start-1">
<h2 class="text-sm font-semibold text-indigo-300 tracking-wide uppercase"></h2>
<p class="text-sm font-semibold text-danaherblue-600 uppercase tracking-wide">404 error</p>
<h1 class="mt-2 text-4xl font-extrabold text-gray-900 tracking-tight sm:text-5xl">Page not found</h1>
<p class="mt-2 text-base text-gray-500">Sorry, we couldn’t find the page you’re looking for.</p>
<div class="mt-6">
<a href="https://lifesciences.danaher.com" title="Go back" class="group inline-flex items-center font-medium text-danaherblue-600 hover:text-danaherblue-500">Go back home
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4 ml-2 group-hover:translate-x-1 group-hover:tracking-wide group-hover:font-semibold transition" fill="currentColor" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8"/>
</svg>
</a>
</div>
<div class="mt-12 grid grid-cols-1 gap-y-12 gap-x-6 sm:grid-cols-2"></div>
</div>
</div>
<img
class="h-full w-full object-cover lg:col-span-4"
src="https://lifesciences.danaher.com/content/dam/danaher/backgrounds/group-gathered-large.jpg"
alt="Danaher Background"
/>
</div>
</div>
</main>
<footer></footer>
</body>
</html>
80 changes: 80 additions & 0 deletions styles/styles.css
Original file line number Diff line number Diff line change
Expand Up @@ -2547,6 +2547,10 @@ main .default-content-wrapper ul {
margin-top: 2.5rem;
}

.mt-12 {
margin-top: 3rem;
}

.mt-2 {
margin-top: 0.5rem;
}
Expand All @@ -2559,6 +2563,10 @@ main .default-content-wrapper ul {
margin-top: 1rem;
}

.mt-6 {
margin-top: 1.5rem;
}

.mt-8 {
margin-top: 2rem;
}
Expand Down Expand Up @@ -3052,6 +3060,10 @@ main .default-content-wrapper ul {
column-gap: 1.5rem;
}

.gap-y-12 {
row-gap: 3rem;
}

.gap-y-8 {
row-gap: 2rem;
}
Expand Down Expand Up @@ -3620,6 +3632,10 @@ main .default-content-wrapper ul {
padding-top: 2.5rem;
}

.pt-12 {
padding-top: 3rem;
}

.pt-2 {
padding-top: 0.5rem;
}
Expand Down Expand Up @@ -3877,6 +3893,11 @@ main .default-content-wrapper ul {
color: rgb(199 210 254 / var(--tw-text-opacity));
}

.text-indigo-300 {
--tw-text-opacity: 1;
color: rgb(165 180 252 / var(--tw-text-opacity));
}

.text-lightblue-500 {
--tw-text-opacity: 1;
color: rgb(59 199 229 / var(--tw-text-opacity));
Expand Down Expand Up @@ -4145,6 +4166,11 @@ main .default-content-wrapper ul {
color: rgb(8 145 178 / var(--tw-text-opacity));
}

.hover\:text-danaherblue-500:hover {
--tw-text-opacity: 1;
color: rgb(0 74 89 / var(--tw-text-opacity));
}

.hover\:text-danaherpurple-50:hover {
--tw-text-opacity: 1;
color: rgb(234 222 255 / var(--tw-text-opacity));
Expand Down Expand Up @@ -4180,6 +4206,11 @@ main .default-content-wrapper ul {
--tw-ring-color: rgb(209 213 219 / var(--tw-ring-opacity));
}

.group:hover .group-hover\:translate-x-1 {
--tw-translate-x: 0.25rem;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.group:hover .group-hover\:rotate-180 {
--tw-rotate: 180deg;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
Expand All @@ -4190,6 +4221,14 @@ main .default-content-wrapper ul {
background-color: rgb(117 35 255 / var(--tw-bg-opacity));
}

.group:hover .group-hover\:font-semibold {
font-weight: 600;
}

.group:hover .group-hover\:tracking-wide {
letter-spacing: 0.025em;
}

.peer.show ~ .peer-\[\.show\]\:block {
display: block;
}
Expand Down Expand Up @@ -4222,11 +4261,20 @@ main .default-content-wrapper ul {
padding-right: 1.5rem;
}

.sm\:pt-8 {
padding-top: 2rem;
}

.sm\:text-3xl {
font-size: 1.875rem;
line-height: 2.25rem;
}

.sm\:text-5xl {
font-size: 3rem;
line-height: 1;
}

.sm\:text-lg {
font-size: 1.125rem;
line-height: 1.75rem;
Expand Down Expand Up @@ -4395,6 +4443,10 @@ main .default-content-wrapper ul {
padding-bottom: 1rem;
}

.md\:pb-24 {
padding-bottom: 6rem;
}

.md\:pr-8 {
padding-right: 2rem;
}
Expand All @@ -4406,6 +4458,14 @@ main .default-content-wrapper ul {

@media (min-width: 1024px) {

.lg\:col-span-3 {
grid-column: span 3 / span 3;
}

.lg\:col-span-4 {
grid-column: span 4 / span 4;
}

.lg\:my-4 {
margin-top: 1rem;
margin-bottom: 1rem;
Expand Down Expand Up @@ -4483,6 +4543,10 @@ main .default-content-wrapper ul {
max-width: 56rem;
}

.lg\:max-w-7xl {
max-width: 80rem;
}

.lg\:grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
Expand All @@ -4499,6 +4563,10 @@ main .default-content-wrapper ul {
grid-template-columns: repeat(6, minmax(0, 1fr));
}

.lg\:grid-cols-7 {
grid-template-columns: repeat(7, minmax(0, 1fr));
}

.lg\:grid-rows-2 {
grid-template-rows: repeat(2, minmax(0, 1fr));
}
Expand Down Expand Up @@ -4548,6 +4616,10 @@ main .default-content-wrapper ul {
padding-bottom: 0.25rem;
}

.lg\:pb-80 {
padding-bottom: 20rem;
}

.lg\:pl-0 {
padding-left: 0px;
}
Expand All @@ -4560,6 +4632,10 @@ main .default-content-wrapper ul {
padding-right: 0px;
}

.lg\:pt-14 {
padding-top: 3.5rem;
}

.lg\:pt-4 {
padding-top: 1rem;
}
Expand All @@ -4571,6 +4647,10 @@ main .default-content-wrapper ul {

@media (min-width: 1280px) {

.xl\:col-start-1 {
grid-column-start: 1;
}

.xl\:w-1\/4 {
width: 25%;
}
Expand Down
2 changes: 1 addition & 1 deletion tailwind.config.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ['./blocks/**/*.js', './scripts/*.js', '!./scripts/at-lsig.js', './fragments/*.html'], // https://tailwindcss.com/docs/content-configuration#class-detection-in-depth
content: ['./blocks/**/*.js', './scripts/*.js', '!./scripts/at-lsig.js', './fragments/*.html', './404.html'], // https://tailwindcss.com/docs/content-configuration#class-detection-in-depth
darkMode: 'media', // or 'media' or 'class'
variants: {
extend: {
Expand Down

0 comments on commit 7496f62

Please sign in to comment.