Skip to content

Commit 9ba6cd9

Browse files
duncanmccleanduncanmcclean
committed
add outdated docs banner
1 parent 7482139 commit 9ba6cd9

4 files changed

Lines changed: 76 additions & 1 deletion

File tree

‎public/css/components/promo.css‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
.c-promo {
2+
position: fixed;
3+
z-index: 50;
4+
bottom: 0;
5+
padding: .5rem;
6+
text-align: center;
7+
color: white;
8+
font-weight: bold;
9+
font-size: 0.875rem;
10+
width: 100%;
11+
-webkit-font-smoothing: antialiased;
12+
-moz-osx-font-smoothing: grayscale;
13+
}
14+
15+
.c-promo__inner {
16+
background: var(--color-gradient-purple);
17+
padding: .5rem;
18+
border-radius: .5rem;
19+
margin-inline: auto;
20+
position: relative;
21+
padding-right: 2.5rem;
22+
}
23+
24+
.c-promo__inner a {
25+
color: white;
26+
text-decoration-color: white;
27+
}
28+
29+
.c-promo:hover .c-promo__inner {
30+
background: linear-gradient(to right, var(--color-purple), var(--color-pink), var(--color-blue));
31+
background-size: 200% 100%;
32+
animation: gradient-animate 2s ease infinite;
33+
}
34+
35+
@keyframes gradient-animate {
36+
0% { background-position: 0% 50%; }
37+
50% { background-position: 100% 50%; }
38+
100% { background-position: 0% 50%; }
39+
}
40+
41+
.c-promo__close {
42+
position: absolute;
43+
top: 50%;
44+
right: 0.75rem;
45+
transform: translateY(-50%);
46+
background: none;
47+
border: none;
48+
color: white;
49+
font-size: 1.25rem;
50+
cursor: pointer;
51+
padding: 0.25rem;
52+
line-height: 1;
53+
opacity: 0.8;
54+
transition: opacity 0.2s ease;
55+
}
56+
57+
.c-promo__close:hover {
58+
opacity: 1;
59+
}

‎public/css/style.css‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@ scope;
4242
@import 'components/buttons.css';
4343
@import 'components/search-form.css';
4444
@import 'components/logos.css';
45+
@import 'components/promo.css';
4546
@import 'components/tiles-with-description.css';
4647
@import 'components/feedback-meerkat.css';
4748
@import 'components/tip.css';

‎resources/views/layout.antlers.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
{{ partial:site_header }}
55
<body>
66
{{# =jfg This is not currently in use but could be useful in future #}}
7-
{{# {{ partial:partials/promo }} #}}
7+
{{ partial:partials/promo }}
88

99
{{# Need tabindex="-1" to lock the tab focus here when using Skip to Content #}}
1010
<main tabindex="-1" id="main" class="s-main o-scroll-spy-timeline">

‎resources/views/partials/promo.antlers.html‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,18 @@
1+
<div class="c-promo"
2+
x-cloak
3+
x-data="{ dismissed: localStorage.getItem('promo-dismissed') === 'true' }"
4+
x-show="!dismissed">
5+
<div class="c-promo__inner">
6+
You are reading the docs for an old version of Statamic. Consider upgrading to <a href="https://statamic.dev/getting-started/upgrade-guide/5-to-6">Statamic 6</a>.
7+
<!-- <button-->
8+
<!-- @click="dismissed = true; localStorage.setItem('promo-dismissed', 'true')"-->
9+
<!-- class="c-promo__close"-->
10+
<!-- aria-label="Dismiss promo">-->
11+
<!-- &times;-->
12+
<!-- </button>-->
13+
</div>
14+
</div>
15+
116
{{# <a href="https://github.com/statamic/cms" class="hidden md:block sticky z-50 -top-8 bg-gradient-to-r from-purple to-blue via-pink hover:bg-gradient-animate py-2 text-center text-white font-bold text-sm antialiased">
217
⭐️ If you like Statamic, give it a star on GitHub! ⭐️
318
</a> #}}

0 commit comments

Comments
 (0)