mirror of
https://github.com/sethcottle/littlelink.git
synced 2025-04-21 15:56:35 -04:00
Actualización de hrefs
This commit is contained in:
Lucas
parent
2ea4fcfe31
commit
c6aa2d6a41
64
index.html
64
index.html
@ -45,25 +45,6 @@
|
||||
<div class="row">
|
||||
<div class="column" style="margin-top: 10%">
|
||||
|
||||
<!--
|
||||
|
||||
## Getting Started with LittleLink
|
||||
|
||||
This page has been built with every pre-designed button available in LittleLink by default. You can rearrange and delete as needed.
|
||||
|
||||
You can add your own brand or others brands you may need in the `css/brands.css` file.
|
||||
|
||||
You can add custom icons to `images/icons/...`. It is recommended to use a 24x24 .SVG.
|
||||
|
||||
Edit the "Your Image Here" section to add your own personal branding, like a picture of yourself or your brand logo!
|
||||
|
||||
Edit the "Title" section to change the page heading. You can use something like your name, your social handle, or your brand name.
|
||||
|
||||
Edit the "Short Bio" section tell users about yourself or your brand.
|
||||
|
||||
-->
|
||||
|
||||
<!-- Your Image Here -->
|
||||
<img src="images/avatar.svg" class="avatar" alt="Logo OSUC">
|
||||
|
||||
<!-- Title -->
|
||||
@ -73,31 +54,6 @@
|
||||
<p>Links de que te podrían interesar. De nosotros para tí 🙂</p>
|
||||
<br>
|
||||
|
||||
<!--
|
||||
|
||||
## Breaking down <a> attributes:
|
||||
|
||||
1.) class="button button-default" | The first "button" here is telling this <a> tag that it should make this element a button and applies the default styling in `css/brands.css`.
|
||||
The second portion, button-default, is declaring the specific brand style you would like to apply. Here we're applying the "default" style and color.
|
||||
If you want to make this button to use the brand colors for Discord, just change "button-default" to "button-discord". Brands are found in `css/brands.css`. You can always edit & add your own there.
|
||||
|
||||
2.) Replace the # in href="#" with the desired target URL for the button.
|
||||
|
||||
3.) target="_blank" | This attribute opens links in a new tab. Remove this attribute to prevent links from opening in a new tab.
|
||||
|
||||
4.) rel="noopener" | This attribute instructs the browser to navigate to the target resource without granting the new browsing context access to the document that opened it.
|
||||
This is especially useful when opening untrusted links. https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types/noopener
|
||||
|
||||
## Breaking down the <img> attributes:
|
||||
|
||||
1.) class="icon" | This class is telling the <img> tag that it should use the styling for icons found in `css/brands.css`.
|
||||
|
||||
2.) src="icons/[icon_name].svg" | This defines the icon you would like to display from the icons/ folder. For example, you can change this to src="icons/discord.svg" to use the Discord icon.
|
||||
Add your own 24x24 icons to the "icons" folder to reference them. We recommend providing a SVG.
|
||||
|
||||
3.) alt="Example Logo" | This alt attribute helps provides alternate text for an image, this can assist users who use screen readers.
|
||||
|
||||
-->
|
||||
<!-- Web -->
|
||||
<a class="button button-osuc" href="osuc.dev" target="_blank" rel="noopener">
|
||||
<img class="icon" src="images/icons/osuc-branch.svg" alt="Web Logo">Página Web</a>
|
||||
@ -114,16 +70,17 @@
|
||||
<br>
|
||||
|
||||
<h4>Redes Sociales</h4>
|
||||
<!-- Telegram -->
|
||||
<a class="button button-telegram" href="#" target="_blank" rel="noopener">
|
||||
<img class="icon" src="images/icons/telegram.svg" alt="Telegram Logo">Telegram</a>
|
||||
<br>
|
||||
|
||||
|
||||
<!-- Instagram -->
|
||||
<a class="button button-instagram" href="https://www.instagram.com/opensource_euc/" target="_blank" rel="noopener">
|
||||
<img class="icon" src="images/icons/instagram.svg" alt="Instagram Logo">Instagram</a>
|
||||
<br>
|
||||
|
||||
<!-- Telegram -->
|
||||
<a class="button button-telegram" href="https://t.me/+IlP7o3H_yX5hMTQx" target="_blank" rel="noopener">
|
||||
<img class="icon" src="images/icons/telegram.svg" alt="Telegram Logo">Telegram</a>
|
||||
<br>
|
||||
|
||||
<!-- YouTube -->
|
||||
<a class="button button-yt" href="https://www.youtube.com/channel/UCgomWM2oXY-XcB1s1zJs7nw" target="_blank" rel="noopener">
|
||||
<img class="icon" src="images/icons/youtube.svg" alt="YouTube Logo">YouTube</a>
|
||||
@ -135,7 +92,7 @@
|
||||
<br>
|
||||
|
||||
<!-- Twitter -->
|
||||
<a class="button button-twit" href="#" target="_blank" rel="noopener">
|
||||
<a class="button button-twit" href="https://twitter.com/OpenSource_eUC" target="_blank" rel="noopener">
|
||||
<img class="icon" src="images/icons/twitter.svg" alt="Twitter Logo">Twitter</a>
|
||||
<br>
|
||||
|
||||
@ -149,12 +106,7 @@
|
||||
<img class="icon" src="images/icons/blog.svg" alt="Blog Icon">Blog</a>
|
||||
<br>
|
||||
-->
|
||||
<!--
|
||||
Footer:
|
||||
This includes a link to privacy.html page which can be setup for your Privacy Policy.
|
||||
This also includes a link to the LittleLink repository to make forking LittleLink easier.
|
||||
You can edit or remove anything here to make your own footer.
|
||||
-->
|
||||
|
||||
<br>
|
||||
<p><a href="privacy.html">Política de Privacidad</a></p>
|
||||
<p>Creado con <a href="https://littlelink.io" target="_blank" rel="noopener">LittleLink</a> y mantenido con 💙 por la comunidad de OSUC.</p>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user