-
-
Notifications
You must be signed in to change notification settings - Fork 322
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add responsive footer element #1122
Closed
Closed
Changes from all commits
Commits
Show all changes
2 commits
Select commit
Hold shift + click to select a range
File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
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
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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,6 +1,82 @@ | ||
| --- | ||
| import { Icon } from 'astro-icon' | ||
| --- | ||
|
|
||
| <footer> | ||
| Footer | ||
| <style> | ||
| .nixlogo { | ||
| content: ""; | ||
| background-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20viewBox%3D%220%200%20550.416%20484.317%22%20height%3D%22516.604%22%20width%3D%22587.11%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22a%22%3E%3Cstop%20offset%3D%220%22%20style%3D%22stop-color%3A%23fff%3Bstop-opacity%3A1%22/%3E%3Cstop%20style%3D%22stop-color%3A%23fff%3Bstop-opacity%3A1%22%20offset%3D%22.243%22/%3E%3Cstop%20offset%3D%221%22%20style%3D%22stop-color%3A%23fff%3Bstop-opacity%3A1%22/%3E%3C/linearGradient%3E%3ClinearGradient%20id%3D%22b%22%3E%3Cstop%20offset%3D%220%22%20style%3D%22stop-color%3A%23fff%3Bstop-opacity%3A1%22/%3E%3Cstop%20style%3D%22stop-color%3A%23fff%3Bstop-opacity%3A1%22%20offset%3D%22.232%22/%3E%3Cstop%20offset%3D%221%22%20style%3D%22stop-color%3A%23fff%3Bstop-opacity%3A1%22/%3E%3C/linearGradient%3E%3ClinearGradient%20y2%3D%22506.188%22%20x2%3D%22290.087%22%20y1%3D%22351.411%22%20x1%3D%22200.597%22%20gradientTransform%3D%22translate%2870.65%20-1055.151%29%22%20gradientUnits%3D%22userSpaceOnUse%22%20id%3D%22c%22%20xlink%3Ahref%3D%22%23a%22/%3E%3ClinearGradient%20y2%3D%22937.714%22%20x2%3D%22-496.297%22%20y1%3D%22782.336%22%20x1%3D%22-584.199%22%20gradientTransform%3D%22translate%28864.696%20-1491.34%29%22%20gradientUnits%3D%22userSpaceOnUse%22%20id%3D%22e%22%20xlink%3Ahref%3D%22%23b%22/%3E%3C/defs%3E%3Cg%20transform%3D%22translate%28-132.651%20958.04%29%22%20style%3D%22display%3Ainline%3Bopacity%3A1%22%3E%3Cpath%20style%3D%22opacity%3A1%3Bfill%3Aurl%28%23c%29%3Bfill-opacity%3A1%3Bfill-rule%3Aevenodd%3Bstroke%3Anone%3Bstroke-width%3A3%3Bstroke-linecap%3Abutt%3Bstroke-linejoin%3Around%3Bstroke-miterlimit%3A4%3Bstroke-dasharray%3Anone%3Bstroke-opacity%3A1%22%20d%3D%22m309.549-710.388%20122.197%20211.675-56.157.527-32.624-56.87-32.856%2056.566-27.903-.011-14.29-24.69%2046.81-80.49-33.23-57.826z%22%20id%3D%22d%22/%3E%3Cuse%20xlink%3Ahref%3D%22%23d%22%20transform%3D%22rotate%2860%20407.112%20-715.787%29%22%20width%3D%22100%25%22%20height%3D%22100%25%22/%3E%3Cuse%20xlink%3Ahref%3D%22%23d%22%20transform%3D%22rotate%28-60%20407.312%20-715.7%29%22%20width%3D%22100%25%22%20height%3D%22100%25%22/%3E%3Cuse%20xlink%3Ahref%3D%22%23d%22%20transform%3D%22rotate%28180%20407.419%20-715.756%29%22%20width%3D%22100%25%22%20height%3D%22100%25%22/%3E%3Cpath%20id%3D%22f%22%20d%3D%22m309.549-710.388%20122.197%20211.675-56.157.527-32.624-56.87-32.856%2056.566-27.903-.011-14.29-24.69%2046.81-80.49-33.23-57.826z%22%20style%3D%22color%3A%23fff%3Bclip-rule%3Anonzero%3Bdisplay%3Ainline%3Boverflow%3Avisible%3Bvisibility%3Avisible%3Bopacity%3A1%3Bisolation%3Aauto%3Bmix-blend-mode%3Anormal%3Bcolor-interpolation%3AsRGB%3Bcolor-interpolation-filters%3AlinearRGB%3Bsolid-color%3A%23fff%3Bsolid-opacity%3A1%3Bfill%3Aurl%28%23e%29%3Bfill-opacity%3A1%3Bfill-rule%3Aevenodd%3Bstroke%3Anone%3Bstroke-width%3A3%3Bstroke-linecap%3Abutt%3Bstroke-linejoin%3Around%3Bstroke-miterlimit%3A4%3Bstroke-dasharray%3Anone%3Bstroke-dashoffset%3A0%3Bstroke-opacity%3A1%3Bcolor-rendering%3Aauto%3Bimage-rendering%3Aauto%3Bshape-rendering%3Aauto%3Btext-rendering%3Aauto%3Benable-background%3Aaccumulate%22/%3E%3Cuse%20style%3D%22display%3Ainline%22%20xlink%3Ahref%3D%22%23f%22%20transform%3D%22rotate%28120%20407.34%20-716.084%29%22%20width%3D%22100%25%22%20height%3D%22100%25%22/%3E%3Cuse%20style%3D%22display%3Ainline%22%20xlink%3Ahref%3D%22%23f%22%20transform%3D%22rotate%28-120%20407.288%20-715.87%29%22%20width%3D%22100%25%22%20height%3D%22100%25%22/%3E%3C/g%3E%3C/svg%3E'); | ||
| } | ||
| </style> | ||
| <div class="bg-nixdarkerblue text-white font-light"> | ||
| <div class="mx-4 md:mx-auto md:max-w-screen-md lg:max-w-screen-lg xl:max-w-screen-xl"> | ||
| <div class="flex flex-col sm:flex-row flex-wrap py-8 gap-y-8"> | ||
| <div class="basis-1/2 lg:basis-1/4"> | ||
| <h4 class="text-xl font-bold text-nixdarkblue mb-4">The Project</h4> | ||
| <ul class="space-y-2"> | ||
| <li><a href="https://status.nixos.org/">Channel Status</a></li> | ||
| <li><a href="https://search.nixos.org/packages">Packages search</a></li> | ||
| <li><a href="https://search.nixos.org/options">Options search</a></li> | ||
| <li><a href="https://reproducible.nixos.org/">Reproducible Builds Status</a></li> | ||
| <li><a href="/community/teams/security">Security</a></li> | ||
| </ul> | ||
| </div> | ||
| <div class="basis-1/2 lg:basis-1/4"> | ||
| <h4 class="text-xl font-bold text-nixdarkblue mb-4">Get in Touch</h4> | ||
| <ul class="space-y-2"> | ||
| <li><a href="https://discourse.nixos.org/">Forum</a></li> | ||
| <li><a href="https://matrix.to/#/#community:nixos.org">Matrix Chat</a></li> | ||
| <li><a href="/community/commercial-support">Commercial support</a></li> | ||
| </ul> | ||
| </div> | ||
| <div class="basis-1/2 lg:basis-1/4"> | ||
| <h4 class="text-xl font-bold text-nixdarkblue mb-4">Contribute</h4> | ||
| <ul class="space-y-2"> | ||
| <li><a href="https://nix.dev/contributing/how-to-contribute">Contributing Guide</a></li> | ||
| <li><a href="/donate">Donate</a></li> | ||
| </ul> | ||
| </div> | ||
| <div class="basis-1/2 lg:basis-1/4"> | ||
| <h4 class="text-xl font-bold text-nixdarkblue mb-4">Stay up to Date</h4> | ||
| <ul class="space-y-2"> | ||
| <li><a href="/blog/">Blog</a></li> | ||
| <li><a href="https://weekly.nixos.org/">Newsletter</a></li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| <hr class="border-nixlightblue"> | ||
| <div class="flex flex-col lg:flex-row flex-wrap py-8 gap-8 lg:gap-0"> <!-- needs some border-bottom with #7ebae4 color and 0.0625rem solid border-bottom --> | ||
| <div class="basis-1/2 flex flex-row flex flex-row gap-2"> | ||
| <h4 class="nixlogo w-16 h-16 inline-block bg-contain bg-no-repeat bg-center -indent-96">NixOS</h4> | ||
| <div class="flex flex-col justify-center"> | ||
| <div>Copyright © 2023 NixOS contributors</div> | ||
| <a href="https://github.com/NixOS/nixos-homepage/blob/master/LICENSES/CC-BY-SA-4.0.txt"> | ||
| <abbr title="Creative Commons Attribution Share Alike 4.0 International"> | ||
| CC-BY-SA-4.0 | ||
| </abbr> | ||
| </a> | ||
| </div> | ||
| </div> | ||
| <hr class="lg:hidden border-nixlightblue"> | ||
| <div class="basis-1/2 flex flex-row justify-between lg:justify-end gap-4"> | ||
| <h4 class="my-auto">Connect with us:</h4> | ||
| <div class="my-auto flex flex-row gap-2"> | ||
| <a href="https://chaos.social/@nixos_org"> | ||
| <Icon alt="Mastodon" class="w-8" pack="mdi" name="mastodon" /> | ||
| </a> | ||
| <a href="https://twitter.com/nixos_org"> | ||
| <Icon alt="Twitter" class="w-8" pack="mdi" name="twitter" /> | ||
| </a> | ||
| <a href="https://www.youtube.com/channel/UC3vIimi9q4AT8EgxYp_dWIw"> | ||
| <Icon alt="Youtube" class="w-8" pack="mdi" name="youtube" /> | ||
| </a> | ||
| <a href="https://github.com/NixOS"> | ||
| <Icon alt="GitHub" class="w-8" pack="mdi" name="github" /> | ||
| </a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </footer> | ||
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
not sure what's the best way to do this. The good part about this is that it is defined in the same file as it's used. but if we need this svg somewhere else too, we would need a more central place.![]()
tag that links to an svg file... not sure why it is like this in the original nixos.org implementation?
Of course, it could also just be an
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think we should create a custom icon set as described in astro-icon.