wanhose/cookie-dialog-monster
wanhose/cookie-dialog-monster
2
5
Fork 0
Code Issues 304 Pull Requests Releases 18 Wiki Activity

fix(web): some responsive issues after the new download button

Browse Source
This commit is contained in:
wanhose 2024-04-15 20:03:36 +02:00
parent 4128bec4c4
commit 4cc6168578
2 changed files with 22 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
packages/web/src/index.css
View File

@ -10,7 +10,16 @@
@layer components { @layer components {
.button { .button {
@apply font-bold gap-2 inline-flex items-center md:bg-2x md:hover:shadow-md rounded-lg text-white px-8 py-4; @apply block font-bold items-center md:bg-2x md:hover:shadow-md lg:px-8 overflow-x-hidden rounded-lg text-ellipsis text-white px-4 py-4 whitespace-nowrap;
}
.button > img,
.button > span {
@apply mr-2;
}
.button > svg {
@apply float-right;
} }
.icon { .icon {

17
packages/web/src/index.html
View File

@ -385,7 +385,7 @@
</div> </div>
<div class="md:text-center md:pb-20 pb-10 pt-10" id="downloads"> <div class="md:text-center md:pb-20 pb-10 pt-10" id="downloads">
<h2>Available now on</h2> <h2>Available now on</h2>
<div class="flex flex-col gap-4 justify-center md:flex-row md:gap-8 mt-16"> <div class="grid gap-4 grid-cols-1 justify-center md:gap-8 md:grid-cols-4 mt-16">
<a <a
class="bg-gradient-to-r button from-chrome-1 md:hover:animate-gradient to-chrome-3 via-chrome-2" class="bg-gradient-to-r button from-chrome-1 md:hover:animate-gradient to-chrome-3 via-chrome-2"
href="https://chrome.google.com/webstore/detail/djcbfpkdhdkaflcigibkbpboflaplabg" href="https://chrome.google.com/webstore/detail/djcbfpkdhdkaflcigibkbpboflaplabg"
@ -434,7 +434,7 @@
target="_blank" target="_blank"
> >
<img aria-hidden="true" class="icon" src="/images/firefox.svg" /> <img aria-hidden="true" class="icon" src="/images/firefox.svg" />
Firefox Add-ons<sup>1</sup> Firefox Add-ons <sup>1</sup>
<svg <svg
aria-hidden="true" aria-hidden="true"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
@ -455,7 +455,7 @@
target="_blank" target="_blank"
> >
<span aria-hidden="true" class="icon" role="img">📦</span> <span aria-hidden="true" class="icon" role="img">📦</span>
Packed version<sup>2</sup> Packed version <sup>2</sup>
<svg <svg
aria-hidden="true" aria-hidden="true"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
@ -481,7 +481,14 @@
<sup>2</sup> This version is not recommended for regular users. It is intended for <sup>2</sup> This version is not recommended for regular users. It is intended for
advanced users who want to test the latest features before they are released to the advanced users who want to test the latest features before they are released to the
public, or for Mozilla (or other not supported browsers) users who want to run a public, or for Mozilla (or other not supported browsers) users who want to run a
development copy of the last version of the extension. development copy of the last version of the extension. We recommend you to follow
<a
class="underline"
href="https://github.com/wanhose/cookie-dialog-monster/tree/main/packages/browser-extension#installation-for-mozilla-firefox-and-non-listed-browser-users"
target="_blank"
>
this guide</a
>.
</p> </p>
</div> </div>
</main> </main>
@ -489,7 +496,7 @@
<div class="max-w-5xl mx-auto"> <div class="max-w-5xl mx-auto">
<p class="text-center text-white text-sm"> <p class="text-center text-white text-sm">
An open source project built by you and An open source project built by you and
<a class="hover:underline" href="https://github.com/wanhose" target="_blank"> wanhose</a> <a class="underline" href="https://github.com/wanhose" target="_blank"> wanhose</a>
</p> </p>
</div> </div>
</footer> </footer>