Created
March 30, 2023 15:49
-
-
Save simonw/ed8f4ae3db461f168b3e596849505be1 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="group w-full text-gray-800 dark:text-gray-100 border-b border-black/10 dark:border-gray-900/50 dark:bg-gray-800"> | |
<div class="text-base gap-4 md:gap-6 md:max-w-2xl lg:max-w-xl xl:max-w-3xl p-4 md:py-6 flex lg:px-0 m-auto"> | |
<div class="w-[30px] flex flex-col relative items-end"> | |
<div class="relative flex"> | |
<span style="box-sizing: border-box; display: inline-block; overflow: hidden; width: initial; height: initial; background: none; opacity: 1; border: 0px none; margin: 0px; padding: 0px; position: relative; max-width: 100%;"> | |
<span style="box-sizing: border-box; display: block; width: initial; height: initial; background: none; opacity: 1; border: 0px none; margin: 0px; padding: 0px; max-width: 100%;"> | |
<img style="display: block; max-width: 100%; width: initial; height: initial; background: none; opacity: 1; border: 0px none; margin: 0px; padding: 0px;" alt="" aria-hidden="true" src="data:image/svg+xml,%3csvg%20 | |
xmlns=%27http://www.w3.org/2000/svg%27%20version=%271.1%27%20width=%2730%27%20height=%2730%27/%3e"> | |
</span> | |
<img alt="Warning" decoding="async" data-nimg="intrinsic" class="rounded-sm" style="position: absolute; inset: 0px; box-sizing: border-box; padding: 0px; border: medium none; margin: auto; display: block; width: 0px; height: 0px; min-width: 100%; max-width: 100%; min-height: 100%; max-height: 100%;" src="https://upload.wikimedia.org/wikipedia/commons/1/17/Warning.svg" srcset="https://upload.wikimedia.org/wikipedia/commons/1/17/Warning.svg"> | |
</span> | |
</div> | |
</div> | |
<div class="relative flex w-[calc(100%-50px)] flex-col gap-1 md:gap-3 lg:w-[calc(100%-115px)]"> | |
<div class="flex flex-grow flex-col gap-3"> | |
<div style="font-weight: bold" class="min-h-[20px] flex flex-col items-start gap-4 whitespace-pre-wrap">My data is only accurate up to September 2021 and I am unable to access or search the internet for more recent information.</div> | |
</div> | |
<div class="flex justify-between lg:block"> | |
<div class="text-xs flex items-center justify-center gap-1 self-center pt-2 !invisible"> | |
<button disabled="" class="dark:text-white disabled:text-gray-300 dark:disabled:text-gray-400"> | |
<svg stroke="currentColor" fill="none" stroke-width="1.5" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="h-3 w-3" height="1em" width="1em" | |
xmlns="http://www.w3.org/2000/svg"> | |
<polyline points="15 18 9 12 15 6"></polyline> | |
</svg> | |
</button> | |
<span class="flex-grow flex-shrink-0">1 / 1</span> | |
<button disabled="" class="dark:text-white disabled:text-gray-300 dark:disabled:text-gray-400"> | |
<svg stroke="currentColor" fill="none" stroke-width="1.5" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="h-3 w-3" height="1em" width="1em" | |
xmlns="http://www.w3.org/2000/svg"> | |
<polyline points="9 18 15 12 9 6"></polyline> | |
</svg> | |
</button> | |
</div> | |
<div class="text-gray-400 flex self-end lg:self-center justify-center mt-2 gap-2 md:gap-3 lg:gap-1 lg:absolute lg:top-0 lg:translate-x-full lg:right-0 lg:mt-0 lg:pl-2 visible"> | |
<button class="p-1 rounded-md hover:bg-gray-100 hover:text-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400"> | |
<svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4" height="1em" width="1em" | |
xmlns="http://www.w3.org/2000/svg"> | |
<path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path> | |
<path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"></path> | |
</svg> | |
</button> | |
</div> | |
</div> | |
</div> | |
</div> | |
</div> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
It looks like this: