├── img ├── perfil.png ├── exemplo.png ├── favicon.ico └── external-link.png ├── css ├── reset.css └── style.css ├── LICENSE ├── README.md └── index.html /img/perfil.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/levxyca/links/HEAD/img/perfil.png -------------------------------------------------------------------------------- /img/exemplo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/levxyca/links/HEAD/img/exemplo.png -------------------------------------------------------------------------------- /img/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/levxyca/links/HEAD/img/favicon.ico -------------------------------------------------------------------------------- /img/external-link.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/levxyca/links/HEAD/img/external-link.png -------------------------------------------------------------------------------- /css/reset.css: -------------------------------------------------------------------------------- 1 | /* ========================================================================== 2 | Reset 3 | ========================================================================== */ 4 | 5 | /** 6 | * Remove anchor tex-decoration 7 | */ 8 | 9 | a { 10 | text-decoration: none; 11 | } 12 | 13 | /** 14 | * Remove list-style 15 | */ 16 | 17 | ol, ul { 18 | list-style: none; 19 | } 20 | 21 | html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, a, em, img, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, article, footer, header, nav, section, main { 22 | margin: 0; 23 | padding: 0; 24 | border: 0; 25 | vertical-align: baseline; 26 | } 27 | 28 | h1, h2, h3, h4, h5, h6, p, a, ul { 29 | font-size: 1em; 30 | font-weight: normal; 31 | } -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2021 Leticia Caroline Leonardo 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /css/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: monospace; 3 | color: #FFF6FF; 4 | background-color: #252525; 5 | height: 100vh; 6 | display: flex; 7 | flex-direction: column; 8 | justify-content: center; 9 | align-items: center; 10 | } 11 | 12 | .container { 13 | max-width: 450px; 14 | padding: 0.625rem 0.938rem; 15 | box-shadow: 10px 10px 0em #5F4B64; 16 | border: 1px solid #5F4B64; 17 | } 18 | 19 | .header { 20 | text-align: center; 21 | margin: 2rem 0; 22 | } 23 | 24 | .header__img { 25 | border-radius: 50%; 26 | width: 100px; 27 | height: 100px; 28 | margin-bottom: 1rem; 29 | } 30 | 31 | .header__title, .header__subtitle { 32 | font-size: 2rem; 33 | } 34 | 35 | .header__subtitle { 36 | margin-bottom: 1rem; 37 | } 38 | 39 | .header__description { 40 | max-width: 350px; 41 | } 42 | 43 | .links { 44 | font-size: 0.8rem; 45 | } 46 | 47 | .links__menu-item-a { 48 | display: block; 49 | color: #FFF6FF; 50 | text-align: center; 51 | text-decoration: underline; 52 | padding: 0.5rem; 53 | } 54 | 55 | .links a:hover { 56 | display: block; 57 | background-color: #5F4B64; 58 | animation: mouseHover 1.5s; 59 | } 60 | 61 | ion-icon:hover { 62 | color: #5F4B64; 63 | animation: mouseHover 1.5s; 64 | } 65 | 66 | @keyframes mouseHover { 67 | from { 68 | opacity: 0; 69 | } 70 | to { 71 | opacity: 1; 72 | } 73 | } 74 | 75 | .social { 76 | margin: 1rem; 77 | font-size: 1.5rem; 78 | } 79 | 80 | .social__menu { 81 | display: flex; 82 | justify-content: center; 83 | margin: 2rem 0; 84 | } 85 | 86 | .social__menu-item { 87 | padding: 0.5rem; 88 | } 89 | 90 | .social__menu-item-a { 91 | color: #FFF6FF; 92 | } 93 | 94 | @media only screen and (max-width: 600px) { 95 | .container { 96 | max-width: 300px; 97 | } 98 | } 99 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Links 2 | 3 | ![GitHub repo size](https://img.shields.io/github/repo-size/levxyca/links?style=for-the-badge) 4 | ![GitHub language count](https://img.shields.io/github/languages/count/levxyca/links?style=for-the-badge) 5 | ![GitHub forks](https://img.shields.io/github/forks/levxyca/links?style=for-the-badge) 6 | 7 | Imagem de exemplo do site 8 | 9 | > Esse é um template que pode ser todo personalizado por quem for usar. 10 | 11 | ## 🚀 Instalando 'Links' 12 | 13 | Para instalar, siga estas etapas: 14 | 15 | ``` 16 | git clone https://github.com/levxyca/links.git 17 | ``` 18 | 19 | ou 20 | 21 | 1. Fork este repositório. 22 | 2. Crie um branch: `git checkout -b `. 23 | 3. Faça suas alterações e confirme-as: `git commit -m ''` 24 | 25 | ## ☕ Usando 'Links' 26 | 27 | Para ver o tutorial de como usar um template no GitHub, [clique aqui](https://docs.github.com/pt/repositories/creating-and-managing-repositories/creating-a-repository-from-a-template). 28 | 29 | ## ✍🏻 Personalizando 30 | 31 | ### Título 32 | 33 | Para personalizar o título da página, basta você ir na tag ``title`` e alterar o "**Seu nome - links**" para o que você desejar. 34 | 35 | ### Nome 36 | 37 | A tag ``h1`` é a responsável pelo nome. 38 | 39 | ### Subtítulo 40 | 41 | A tag ``h2`` é a responsável pelo subtítulo. Ali você pode optar por colocar o seu sobrenome, ou algo diferente, como o seu cargo por exmeplo. 42 | 43 | ### Descrição 44 | 45 | A tag ``p`` com a classe ``header__description`` é a responsável pela descrição. 46 | 47 | ### Imagem 48 | 49 | Para alterar a imagem, basta buscar pela tag ``img`` com a classe ``header__img``. Você pode inserir um link de onde a sua imagem esteja hospedada, ou subir uma imagem local, adicionando a imagem desejada na pasta ``img`` e passando o caminho da pasta no lugar do link. 50 | 51 | ### Links 52 | Você pode alterar os links e os nomes que aparecem no site, para isso basta ir na section ``links``. 53 | 54 | ### Redes Sociais 55 | Para alterar os links das redes sociais busque pela section ``social``. 56 | 57 | --------------------------- 58 | 59 |

60 | Feito com :hearts: por levxyca 61 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | Seu nome - links 12 | 13 | 14 |

15 |
16 | 17 |

Nome

18 |

Sobrenome/Cargo

19 |

20 | Lorem Ipsum is simply dummy text of the printing and typesetting 21 | industry. Lorem Ipsum has been the industry's standard dummy text ever 22 | since the 1500s, when an unknown printer took a galley of type and 23 | scrambled it to make a type specimen book. 24 |

25 |
26 |
27 | 74 |
75 | 133 |
134 | 135 | 136 | 137 | --------------------------------------------------------------------------------