diff --git a/.gitattributes b/.gitattributes new file mode 100644 index 0000000..dfe0770 --- /dev/null +++ b/.gitattributes @@ -0,0 +1,2 @@ +# Auto detect text files and perform LF normalization +* text=auto diff --git a/imagens/bugdroid.png b/imagens/bugdroid.png new file mode 100644 index 0000000..e3b31fb Binary files /dev/null and b/imagens/bugdroid.png differ diff --git a/imagens/dan-droids-pq.png b/imagens/dan-droids-pq.png new file mode 100644 index 0000000..96da3a7 Binary files /dev/null and b/imagens/dan-droids-pq.png differ diff --git a/imagens/dan-droids.png b/imagens/dan-droids.png new file mode 100644 index 0000000..cdc956c Binary files /dev/null and b/imagens/dan-droids.png differ diff --git a/imagens/favicon.ico b/imagens/favicon.ico new file mode 100644 index 0000000..e4cae2e Binary files /dev/null and b/imagens/favicon.ico differ diff --git a/imagens/irina-blok-pq.jpg b/imagens/irina-blok-pq.jpg new file mode 100644 index 0000000..22847ab Binary files /dev/null and b/imagens/irina-blok-pq.jpg differ diff --git a/imagens/irina-blok.jpg b/imagens/irina-blok.jpg new file mode 100644 index 0000000..2c250b1 Binary files /dev/null and b/imagens/irina-blok.jpg differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..85211df --- /dev/null +++ b/index.html @@ -0,0 +1,148 @@ + + + + + + Curiosidades de Tecnologia + + + + +
+

Curiosidades de Tecnologia

+

+ Tudo aquilo que você sempre quis saber sobre o mundo Tech, em um único lugar +

+ +
+
+
+

+ História do Mascote do Android +

+

+ Provavelmente você sabe que o sistema operacional Android, mantido pelo Google é um dos mais utilizados para dispositivos móveis em todo o mundo. Mas tavez você não saiba que o seu simpático mascote tem um nome e uma história muito curiosa? Pois acompanhe esse artigo para aprender muita coisa sobre esse robozinho. +

+

+ A primeira versão +

+

+ A primeira tentativa de criar um mascote surgiu em 2007 e veio de um desenvolvedor chamado + Dan Morrill + . Ele conta que abriu o + Inkscape + (software livre para vetorização de imagens) e criou sua própria versão de robô. O objetivo era apenas personificar o sistema apenas para a a sua equipe, não existia nenhuma solicitação da empresa para a criação de um mascote. +

+ + + dan-droid.png + +

+ Essa primeira versão bizarra até foi batizada em homenagem ao seu criador: seriam os Dandroids. +

+

+ Surge um novo mascote +

+

+ A ideia de ter um mascote foi amadurecendo e a missão foi passada para uma profissional da área. A ilustradora Russa + Irina Blok, + também funcionária do Google, ficou com a missão de representar o pequeno robô de uma maneira mais agradável. + +

+ + + irina-blok.jpg + +

+ + A ideia principal da Irina era representar tudo graficamente com poucos traços e de forma mais chapada. O desenho também deveria gerar identificação rápida com quem o olha. Surgiu então o Bugdroid, o novo mascote do Android. + +

+ bug-droid.png + +

+ A principal inspiração para os traços do novo Bugdroid veio daqueles bonequinhos que ilustram portas de banheiro para indicar o gênero de cada porta. Conta a lenda que a artista estava criando em sua mesa no escritório do Google e olhou para o lado dos banheiros e a identificação foi imediata: simples, limpo, objetivo. +

+ +
+ +
+ + +

+ Então é isso! Espero que você tenha gostado do nosso artigo com essa curiosidade sobre o sistema Android e seu simpático mascote. +

+
+
+ + + \ No newline at end of file diff --git a/pacote-projeto-d010/fontes/idroid.otf b/pacote-projeto-d010/fontes/idroid.otf new file mode 100644 index 0000000..5633cbd Binary files /dev/null and b/pacote-projeto-d010/fontes/idroid.otf differ diff --git a/style.css b/style.css new file mode 100644 index 0000000..315136d --- /dev/null +++ b/style.css @@ -0,0 +1,186 @@ +@charset "UTF-8"; +@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap'); + +@font-face { + font-family:'idroid'; + src: url('/HTML-CSS/Exercicios/Modulo02/DESAFIO10/pacote-projeto-d010/fontes/idroid.otf') format('opentype'); + font-weight: normal; + font-style: normal; +} +@font-face{ + font-family: 'Bebas'; + src: url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap') format('opentype'); + font-weight: normal; + font-style: normal; +} +*{ + margin: 0px; + padding: 0px; +} +:root { + --cor0:#c5ebd6; + --cor1:#83e1ad; + --cor3:#3ddc84; + --cor4:#2fa866; + --cor5:#1a5c37; + --cor6:#063d1e; + --fonte-padrao: Arial,Verdana,Helvetica,sans-serif; + --fonte-destaque: 'Bebas Neus', cursive; + --fonte-android:'idroid', cursive; +} +*{ + margin: 0px; + padding: 0px; +} +body{ + background-color: var(--cor1); +} +a.externo:after{ + content: '\00A0\1F517'; +} +p{ + margin: 15px 0px; + text-align: justify; + text-indent: 30px; + font-size: 1em; + line-height: 2em; +} +header{ + min-height: 150px; + padding-top: 35px; + margin: auto; + background-image: linear-gradient(to bottom, var(--cor3),var(--cor5)); + color: white; + text-align: center; +} +header > h1{ + margin-bottom: 20px; + font-family: var(--fonte-destaque); + font-size: 3em; + margin-bottom: 20px; + text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.148); + font-weight: normal; +} +header > p{ + font-family: var(--fonte-padrao); + font-size: 1.2em; + padding: 15px; + max-width: 500px; + margin: auto; + padding-left: 10px; + padding-right: 10px; + text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.148); + margin-bottom: 20px; +} +nav{ + background-color: var(--cor5); + padding: 10px; + box-shadow: 0px 7px 7px rgba(0, 0, 0, 0.361); + text-align: left; +} +nav > a{ + color:var(--cor1); + padding: 10px; + text-decoration: none; + font-weight: bold; + border-radius: 5px; + transition-duration: .5s; +} +nav > a:hover { + background-color: var(--cor3); + color: var(--cor5); +} +main{ + background-color: white; + min-width: 300px; + max-width: 1000px; + margin: auto; + margin-bottom: 30px; + padding: 20px; + box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.404); + border-bottom-left-radius: 10px; + border-bottom-right-radius: 10px; +} +main h1{ + color: var(--cor5); + font-family: var(--fonte-android); +} +main h2 { + color: var(--cor4); + font-family: var(--fonte-android); + background-image: linear-gradient(to right, var(--cor3),transparent); + font-size: 1.3em; + text-indent: 10px; + font-weight: normal; +} +main img{ + width: 100%; +} +main img.pequena{ + max-width:350px; + display: block; + margin: auto; +} +div.video{ + background-color:var(--cor5) ; + margin: 0px -20px 30px -20px; + padding: 20px; + padding-bottom: 50%; + position: relative; +} +div.video > iframe{ + position: absolute; + top: 5%; + left: 5%; + width:90% ; + right: 90%; +} +main strong{ + color: var(--cor4); + font-weight: bold; + padding: 2px 6px; +} +main a{ + text-decoration: none; + font-weight: bold; + color: var(--cor5); + background-color: var(--cor1); + padding: 2xp 6px; +} +main a:hover{ + text-decoration: underline; + color: var(--cor4); +} +aside{ + background-color: var(--cor1); + padding: 10px; + border-radius: 10px; + box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.276); +} +aside > ul{ + list-style-type: '\2714\00A0\00A0'; + list-style-position: inside; + columns: 2; + +} +aside > h3{ + background-color: var(--cor4); + color: white; + padding: 10px; + margin: -10px -10px 0px -10px; + border-radius: 10px 10px 0px 0px; +} +footer{ + text-align: center; + font-size: 0.8em; + padding: 5px; +} +footer a{ + color: white; + font-weight: bolder; + text-decoration: none; +} +footer a:hover{ + text-decoration: underline; + color: var(--cor1); +} \ No newline at end of file