From f4ca13819cd8c861b137e44ce63ce53c205920b4 Mon Sep 17 00:00:00 2001 From: GiovannaNaves <110492330+GiovannaNaves@users.noreply.github.com> Date: Mon, 14 Oct 2024 22:57:01 -0300 Subject: [PATCH] Fix css --- db.json | 18 ++++---- docs/pages/app_createtopic.html | 10 ++--- docs/pages/index.html | 13 ++++-- docs/pages/js/custom.js | 2 +- docs/pages/login.css | 76 ++++++++++++++++++++++----------- 5 files changed, 76 insertions(+), 43 deletions(-) diff --git a/db.json b/db.json index c267f77..fbb20e5 100644 --- a/db.json +++ b/db.json @@ -143,14 +143,6 @@ "Internet", "Pesquisa" ] - }, - { - "id": "1073", - "titulo": "Como mandar um email", - "conteudo": "Passo 1: Abra seu programa de e-mail ou aplicativo de e-mail no seu computador ou dispositivo móvel.\n\nPasso 2: Clique na opção para compor um novo e-mail. Geralmente, este botão está rotulado como \"Novo e-mail\", \"Escrever\" ou \"Compor\".\n\nPasso 3: No campo \"Para\", digite o endereço de e-mail do destinatário. Certifique-se de que está correto para evitar erros.\n\nPasso 4: No campo \"Assunto\", escreva uma breve descrição do conteúdo do seu e-mail. Isso ajuda o destinatário a entender do que se trata a mensagem antes de abri-la.\n\nPasso 5: No corpo do e-mail, escreva sua mensagem de forma clara e concisa. Comece com uma saudação, como \"Olá\" ou \"Prezado\", seguido pelo conteúdo do e-mail.\n\nPasso 6: Revise sua mensagem para verificar erros de digitação ou gramática.\n\nPasso 7: Clique no botão de enviar para enviar seu e-mail.", - "imagem": "", - "link": "https://www.youtube.com/watch?v=H8rPOsT5xoA", - "categorias": [] } ], "mensagens": [ @@ -221,6 +213,16 @@ "titulo": "Como navegar na Internet", "imagem": "img/Internet.png", "categorias": [] + }, + { + "id": "1", + "UserId": 2, + "titulo": "Como enviar e-mails", + "imagem": "img/email.png", + "categorias": [ + "Comunicação", + "E-mail" + ] } ] } \ No newline at end of file diff --git a/docs/pages/app_createtopic.html b/docs/pages/app_createtopic.html index e722f06..2b08eec 100644 --- a/docs/pages/app_createtopic.html +++ b/docs/pages/app_createtopic.html @@ -215,18 +215,18 @@

Criar Tópico

- + - + - - - + + + - + diff --git a/docs/pages/js/custom.js b/docs/pages/js/custom.js index 3586431..b25ca75 100644 --- a/docs/pages/js/custom.js +++ b/docs/pages/js/custom.js @@ -25,7 +25,7 @@ if (gerarBtn) { messages: [ { role: 'user', - content: `Gere um tutorial curto de ${titulo} sem utilizar negrito ou tamanhos variados de fonte. Inicie a resposta no passo 1. Depois, escreva "Link:" e sugira um link do YouTube que ensine o tópico` + content: `Gere um tutorial curto de ${titulo} sem utilizar negrito ou tamanhos variados de fonte. Inicie a resposta no passo 1. Depois, escreva "Link:" e sugira direto um link do YouTube que ensine o tópico` } ] }) diff --git a/docs/pages/login.css b/docs/pages/login.css index 88f5111..c22ad42 100644 --- a/docs/pages/login.css +++ b/docs/pages/login.css @@ -1,51 +1,77 @@ body { font-family: Arial, Helvetica, sans-serif; - background-color: #424040; + background-color: #f4f4f9; margin: 0; display: flex; - justify-content: center; /* Centraliza o conteúdo horizontalmente */ - align-items: center; /* Centraliza o conteúdo verticalmente */ - height: 100vh; /* Para ocupar a altura total da viewport */ + flex-direction: column; + justify-content: center; + align-items: center; + height: 100vh; + padding: 20px; + box-sizing: border-box; +} + +.logo { + margin-bottom: 20px; +} + +.logo img { + width: 120px; /* Ajusta o tamanho da logo */ + height: auto; + display: block; + margin: 0 auto; } .container { - width: 400px; - padding: 20px; - background-color: #4698cb; - border-radius: 4px; + width: 100%; + max-width: 400px; + padding: 30px; + background-color: #ffffff; + border-radius: 10px; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); } -h2 { - text-align: center; /* Centraliza o texto */ - color: white; - margin-bottom: 20px; /* Espaçamento inferior para separar do formulário */ +label { + font-size: 14px; + color: #333; + margin-bottom: 5px; + display: block; } -input[type=text] { +input[type=text], input[type=password] { width: 100%; - padding: 15px; - margin: 5px 0 22px 0; - display: inline-block; - border: none; - background: #f1f1f1; + padding: 14px; + margin: 10px 0; + border: 1px solid #ddd; + border-radius: 6px; + background-color: #f9f9f9; + box-sizing: border-box; + font-size: 16px; } -input[type=text]:focus { - background-color: #ddd; +input[type=text]:focus, input[type=password]:focus { + border-color: #4698cb; outline: none; } button { - background-color: #4CAF50; + background-color: #4698cb; color: white; - padding: 14px 20px; - margin: 8px 0; + padding: 14px; border: none; + border-radius: 6px; cursor: pointer; + font-size: 16px; width: 100%; - opacity: 0.9; + transition: background-color 0.3s; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } button:hover { - opacity: 1; + background-color: #357ca5; +} + +button:active { + background-color: #2c6380; + box-shadow: none; }