Skip to content

Commit fa19895

Browse files
committed
Add Tailwind UI banner
1 parent 7cbdb48 commit fa19895

File tree

7 files changed

+106
-19
lines changed

7 files changed

+106
-19
lines changed

source/_assets/js/app.js

Lines changed: 19 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -19,21 +19,22 @@ Mousetrap.bind('/', function(e) {
1919
document.getElementById('docsearch').focus()
2020
})
2121

22-
fetch('//cdn.carbonads.com/carbon.js?serve=CK7DTK3E&placement=tailwindcsscom', {
23-
method: 'HEAD',
24-
mode: 'no-cors',
25-
})
26-
.then(function() {
27-
;(function() {
28-
var s = document.createElement('script')
29-
s.setAttribute('async', '')
30-
s.src = '//cdn.carbonads.com/carbon.js?serve=CK7DTK3E&placement=tailwindcsscom'
31-
s.id = '_carbonads_js'
32-
var adElement = document.getElementById('ad')
33-
adElement.innerHTML = ''
34-
adElement.appendChild(s)
35-
})()
36-
})
37-
.catch(function() {
38-
document.getElementById('refactoring-ui-widget').style.display = 'block'
39-
})
22+
// Re-enable sometime after Tailwind UI launch...
23+
// fetch('//cdn.carbonads.com/carbon.js?serve=CK7DTK3E&placement=tailwindcsscom', {
24+
// method: 'HEAD',
25+
// mode: 'no-cors',
26+
// })
27+
// .then(function() {
28+
// ;(function() {
29+
// var s = document.createElement('script')
30+
// s.setAttribute('async', '')
31+
// s.src = '//cdn.carbonads.com/carbon.js?serve=CK7DTK3E&placement=tailwindcsscom'
32+
// s.id = '_carbonads_js'
33+
// var adElement = document.getElementById('ad')
34+
// adElement.innerHTML = ''
35+
// adElement.appendChild(s)
36+
// })()
37+
// })
38+
// .catch(function() {
39+
// document.getElementById('refactoring-ui-widget').style.display = 'block'
40+
// })

source/_layouts/course-lesson.blade.php

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -263,6 +263,21 @@
263263
<table-of-contents class="mb-8"></table-of-contents>
264264
@endunless
265265
<div id="ad"></div>
266+
<div id="tailwind-ui-widget">
267+
<a href="https://tailwindui.com/book?utm_source=tailwindcss&utm_medium=sidebar-widget" class="mt-3 block">
268+
<img src="/img/tailwind-ui-sidebar.png" alt="">
269+
</a>
270+
<p class="mt-4 text-gray-700">
271+
<a href="https://tailwindui.com/book?utm_source=tailwindcss&utm_medium=sidebar-widget" class="text-gray-700">
272+
Beautiful UI components by the creators of Tailwind CSS.
273+
</a>
274+
</p>
275+
<div class="mt-2">
276+
<a href="https://tailwindui.com/book?utm_source=tailwindcss&utm_medium=sidebar-widget" class="text-sm text-gray-800 font-medium hover:underline">
277+
Learn more &rarr;
278+
</a>
279+
</div>
280+
</div>
266281
<div id="refactoring-ui-widget" style="display: none;">
267282
<a href="https://refactoringui.com/book?utm_source=tailwindcss&utm_medium=sidebar-widget" class="mt-3 block">
268283
<img src="/img/refactoring-ui-book.png" alt="">

source/_layouts/documentation.blade.php

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -237,6 +237,21 @@
237237
<table-of-contents class="mb-8"></table-of-contents>
238238
@endunless
239239
<div id="ad"></div>
240+
<div id="tailwind-ui-widget">
241+
<a href="https://tailwindui.com/book?utm_source=tailwindcss&utm_medium=sidebar-widget" class="mt-3 block">
242+
<img src="/img/tailwind-ui-sidebar.png" alt="">
243+
</a>
244+
<p class="mt-4 text-gray-700">
245+
<a href="https://tailwindui.com/book?utm_source=tailwindcss&utm_medium=sidebar-widget" class="text-gray-700">
246+
Beautiful UI components by the creators of Tailwind CSS.
247+
</a>
248+
</p>
249+
<div class="mt-2">
250+
<a href="https://tailwindui.com/book?utm_source=tailwindcss&utm_medium=sidebar-widget" class="text-sm text-gray-800 font-medium hover:underline">
251+
Learn more &rarr;
252+
</a>
253+
</div>
254+
</div>
240255
<div id="refactoring-ui-widget" style="display: none;">
241256
<a href="https://refactoringui.com/book?utm_source=tailwindcss&utm_medium=sidebar-widget" class="mt-3 block">
242257
<img src="/img/refactoring-ui-book.png" alt="">

source/_layouts/homepage.blade.php

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,6 @@
2121
@endpush
2222

2323
@section('body')
24-
2524
<div>
2625
<div id="header">
2726
<div class="bg-gray-100 pt-24 lg:pt-0">
@@ -254,6 +253,21 @@
254253
<div class="flex flex-col justify-between overflow-y-auto sticky top-0 max-h-screen pt-12 pb-4 -mt-12">
255254
<table-of-contents class="mb-8"></table-of-contents>
256255
<div id="ad"></div>
256+
<div id="tailwind-ui-widget">
257+
<a href="https://tailwindui.com/book?utm_source=tailwindcss&utm_medium=sidebar-widget" class="mt-3 block">
258+
<img src="/img/tailwind-ui-sidebar.png" alt="">
259+
</a>
260+
<p class="mt-4 text-gray-700">
261+
<a href="https://tailwindui.com/book?utm_source=tailwindcss&utm_medium=sidebar-widget" class="text-gray-700">
262+
Beautiful UI components by the creators of Tailwind CSS.
263+
</a>
264+
</p>
265+
<div class="mt-2">
266+
<a href="https://tailwindui.com/book?utm_source=tailwindcss&utm_medium=sidebar-widget" class="text-sm text-gray-800 font-medium hover:underline">
267+
Learn more &rarr;
268+
</a>
269+
</div>
270+
</div>
257271
<div id="refactoring-ui-widget" style="display: none;">
258272
<a href="https://refactoringui.com/book?utm_source=tailwindcss&utm_medium=sidebar-widget" class="mt-3 block">
259273
<img src="/img/refactoring-ui-book.png" alt="">

source/_layouts/master.blade.php

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,11 +15,48 @@
1515
<link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
1616
<link rel="stylesheet" href="{{ mix('/css/main.css', 'assets/build') }}">
1717
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css">
18+
<script src="https://cdn.jsdelivr.net/gh/alpinejs/[email protected]/dist/alpine.js" defer></script>
1819
</head>
1920
<body data-sidebar-visible="true" class="text-gray-900 leading-normal">
2021

2122
@yield('body')
2223

24+
<div style="display: none;" x-data="{ show: false }" x-show="show" x-init="localStorage.getItem('hideBanner') === null ? (setTimeout(() => show = true, 500)) : (show = false)" x-transition:enter="ease-out duration-500" x-transition:enter-start="opacity-0 scale-95 translate-y-2" x-transition:enter-end="opacity-100 scale-100 translate-y-0" x-transition:leave="ease-in duration-300" x-transition:leave-start="opacity-100 scale-100 translate-y-0" x-transition:leave-end="opacity-0 scale-95 translate-y-2" class="transition transform fixed z-100 bottom-0 inset-x-0 pb-2 sm:pb-5">
25+
<div class="max-w-screen-xl mx-auto px-2 sm:px-4">
26+
<div class="p-2 rounded-lg bg-gray-900 shadow-lg sm:p-3">
27+
<div class="flex items-center justify-between flex-wrap">
28+
<div class="w-0 flex-1 flex items-center">
29+
<img class="h-6" src="/img/tailwind-ui-logo-on-dark.svg" alt="">
30+
<p class="ml-3 font-medium text-white truncate">
31+
<span class="lg:hidden">
32+
<span class="sr-only">Tailwind UI</span> is coming next week!
33+
</span>
34+
<span class="hidden lg:inline text-gray-400">
35+
<strong class="text-white font-semibold mr-1">Coming next week!</strong>
36+
<span class="xl:hidden">Beautiful UI components by the creators of Tailwind CSS.</span>
37+
<span class="hidden xl:inline">Beautiful UI components, crafted by the creators of Tailwind CSS.</span>
38+
</span>
39+
</p>
40+
</div>
41+
<div class="order-3 mt-2 flex-shrink-0 w-full sm:order-2 sm:mt-0 sm:w-auto">
42+
<div class="rounded-md shadow-sm">
43+
<a href="#" class="flex items-center justify-center px-4 py-2 border border-transparent text-sm leading-5 font-medium rounded-md text-gray-900 bg-white hover:text-gray-800 focus:outline-none focus:underline">
44+
Learn more
45+
</a>
46+
</div>
47+
</div>
48+
<div class="order-2 flex-shrink-0 sm:order-3 sm:ml-2">
49+
<button @click="localStorage.setItem('hideBanner', true); show = false" type="button" class="-mr-1 flex p-2 rounded-md hover:bg-gray-800 focus:outline-none focus:bg-gray-800">
50+
<svg class="h-6 w-6 text-white" stroke="currentColor" fill="none" viewBox="0 0 24 24">
51+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
52+
</svg>
53+
</button>
54+
</div>
55+
</div>
56+
</div>
57+
</div>
58+
</div>
59+
2360
@if ($page->production)
2461
<!-- Google Analytics -->
2562
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-109068504-1"></script>
Lines changed: 5 additions & 0 deletions
Loading

source/img/tailwind-ui-sidebar.png

20.7 KB
Loading

0 commit comments

Comments
 (0)