diff --git a/codigo/Cadastro (collabora)/cadastro.html b/codigo/Cadastro (collabora)/cadastro.html index 302a53a..14c34d5 100644 --- a/codigo/Cadastro (collabora)/cadastro.html +++ b/codigo/Cadastro (collabora)/cadastro.html @@ -66,6 +66,27 @@

+ Já sou collabora + + + diff --git a/codigo/Cadastro (collabora)/cadastro.js b/codigo/Cadastro (collabora)/cadastro.js index f6136e4..8050427 100644 --- a/codigo/Cadastro (collabora)/cadastro.js +++ b/codigo/Cadastro (collabora)/cadastro.js @@ -56,3 +56,40 @@ function saveUser(user) { users.push(user); localStorage.setItem('users', JSON.stringify(users)); } + +// Mostrar modal de login +document.getElementById('loginLink').addEventListener('click', function(event) { + event.preventDefault(); + document.getElementById('loginModal').style.display = "block"; +}); + +// Fechar modal de login +document.getElementsByClassName('close')[0].addEventListener('click', function() { + document.getElementById('loginModal').style.display = "none"; +}); + +// Fechar modal ao clicar fora dele +window.addEventListener('click', function(event) { + if (event.target == document.getElementById('loginModal')) { + document.getElementById('loginModal').style.display = "none"; + } +}); + +// Lidar com o login +document.getElementById('loginForm').addEventListener('submit', function(event) { + event.preventDefault(); + + const email = document.getElementById('loginEmail').value.trim(); + const password = document.getElementById('loginSenha').value.trim(); + + const users = JSON.parse(localStorage.getItem('users')) || []; + const user = users.find(user => user.email === email && user.password === password); + + if (user) { + alert('Login bem-sucedido!'); + document.getElementById('loginModal').style.display = "none"; + document.getElementById('loginForm').reset(); + } else { + alert('Email ou senha incorretos.'); + } +}); diff --git a/codigo/Cadastro (collabora)/stylecadastro.css b/codigo/Cadastro (collabora)/stylecadastro.css index 96f5f56..bb54770 100644 --- a/codigo/Cadastro (collabora)/stylecadastro.css +++ b/codigo/Cadastro (collabora)/stylecadastro.css @@ -45,7 +45,7 @@ html, body { } .dados-container{ font-family: KoHo; - color: #9517E1; + color: #f3a60f; font-weight:600; font-size: 150%; margin: auto; @@ -90,3 +90,80 @@ input::placeholder{ .cadastrar input:active { transform: scale(0.95); } + +/* Estilização do link de login */ +.login-link { + text-align: center; + margin-top: 20px; +} + +.login-link a { + color: #401e88; + font-family: 'KoHo'; + font-size: 120%; + text-decoration: none; + font-weight: bold; +} + +/* Estilização do modal */ +.modal { + display: none; + position: fixed; + z-index: 1; + left: 0; + top: 0; + width: 100%; + height: 100%; + overflow: auto; + background-color: rgb(0, 0, 0); + background-color: rgba(0, 0, 0, 0.4); + padding-top: 60px; +} + +.modal-content { + background-color: #fefefe; + margin: 5% auto; + padding: 20px; + border: 1px solid #888; + width: 80%; + max-width: 400px; + border-radius: 10px; +} + +.close { + color: #aaa; + float: right; + font-size: 28px; + font-weight: bold; +} + +.close:hover, +.close:focus { + color: black; + text-decoration: none; + cursor: pointer; +} + +/* Estilização dos campos do modal */ +.modal-content input { + width: 100%; + padding: 10px; + margin: 10px 0; + border: none; + border-radius: 5px; + background-color: #fdf2db; +} + +.modal-content input[type="submit"] { + width: auto; + background-color: #401e88; + color: #f3a60f; + font-weight: bold; + cursor: pointer; + transition: background-color 0.3s ease; +} + +.modal-content input[type="submit"]:hover { + background-color: #210559; +} + diff --git a/codigo/assets/js/script.js b/codigo/assets/js/script.js index 4ea8fe5..4356a22 100644 --- a/codigo/assets/js/script.js +++ b/codigo/assets/js/script.js @@ -1,3 +1,7 @@ +document.getElementById('redirectButton1').addEventListener('click', function() { + window.location.href = 'vizu de sala/index.html'; +}); + document.getElementById('redirectButton2').addEventListener('click', function() { window.location.href = 'Cadastro (collabora)/cadastro.html'; }); diff --git a/codigo/assets/style/mainstyle.css b/codigo/assets/style/mainstyle.css index aa0e7c5..8945f36 100644 --- a/codigo/assets/style/mainstyle.css +++ b/codigo/assets/style/mainstyle.css @@ -3,11 +3,6 @@ body, html { margin: 0; } -header{ - background-color: #9517E1; - font-family: 'inter'; -} - body{ background-color: #401E88; margin: 0; @@ -15,6 +10,10 @@ body{ border: 0; } +header{ + background-color: #9517E1; + font-family: 'inter'; +} header .logo a{ text-decoration: none; diff --git a/codigo/faq/faq2.css b/codigo/faq/faq2.css new file mode 100644 index 0000000..4070bf3 --- /dev/null +++ b/codigo/faq/faq2.css @@ -0,0 +1,65 @@ +*{ + margin: 0; + padding: 0; + box-sizing: border-box; + } + + body{ + font-family: 'Open Sans', sans-serif; + color: #fff; + background-color: #9517E1; + } + + .title{ + font-size: 50px; + text-align: center; + margin-top: 80px; + margin-bottom: 40px; + text-decoration: underline 4px; + } + + + .questions-container{ + max-width: 800px; + margin: 0 auto; + } + + .question{ + border-bottom: 1px solid #fff; + } + .question button{ + width: 100%; + background-color: #9517E1; + display: flex; + justify-content: space-between; + align-items: center; + padding: 20px 15px; + border:none; + outline: none; + font-size: 22px; + color: #fff; + font-weight: 700; + cursor: pointer; + } + .question p{ + font-size: 22px; + max-height: 0; + opacity: 0; + line-height: 1.5; + overflow: hidden; + transition: all 0.6s ease; + } + .d-arrow{ + transition: transform 0.5s ease-in ; + color: #f3a60f; + } + + /*add this class when click*/ + .question p.show{ + max-height: 200px; + opacity: 1; + padding:0px 15px 30px 15px; + } + .question button .d-arrow.rotate{ + transform: rotate(180deg); + } \ No newline at end of file diff --git a/codigo/faq/faq2.html b/codigo/faq/faq2.html new file mode 100644 index 0000000..c70db4a --- /dev/null +++ b/codigo/faq/faq2.html @@ -0,0 +1,57 @@ + + + + + + FAQ ACCORDION + + + + + + + + + +
+

FAQ's

+ +
+
+ +

No Collabora você aprende com os outros! Você pode se cadastrar para ensinar ou para assistir aulas e tirar dúvidas.

+
+ +
+ +

Basta clicar em "Salas" e selecionar qual você quer entrar. Caso prefira criar sua própria sala você pode clicar em "Criar Sala".

+
+ +
+ +

Com a conta nominal a sua segurança aumenta!

+
+ +
+ +

Você pode assinar o plano premium!

+
+
+
+ + + + + \ No newline at end of file diff --git a/codigo/faq/faq2.js b/codigo/faq/faq2.js new file mode 100644 index 0000000..62ebe2c --- /dev/null +++ b/codigo/faq/faq2.js @@ -0,0 +1,11 @@ +const buttons = document.querySelectorAll("button"); + +buttons.forEach( button => { + button.addEventListener('click',()=> { + const faq = button.nextElementSibling; + const icon = button.children[1]; + + faq.classList.toggle('show'); + icon.classList.toggle('rotate'); + }) +} ) \ No newline at end of file diff --git a/codigo/foto home.jpg b/codigo/foto home.jpg new file mode 100644 index 0000000..c6ae289 Binary files /dev/null and b/codigo/foto home.jpg differ diff --git a/codigo/index.html b/codigo/index.html index c87bb35..23f9c7d 100644 --- a/codigo/index.html +++ b/codigo/index.html @@ -18,14 +18,14 @@
- collabore-se + collabore-se
@@ -33,7 +33,7 @@ - - diff --git a/codigo/meu perfil/assets/pessoa feliz.jpeg b/codigo/meu perfil/assets/pessoa feliz.jpeg new file mode 100644 index 0000000..23211b9 Binary files /dev/null and b/codigo/meu perfil/assets/pessoa feliz.jpeg differ diff --git a/codigo/meu perfil/index.html b/codigo/meu perfil/index.html new file mode 100644 index 0000000..947e491 --- /dev/null +++ b/codigo/meu perfil/index.html @@ -0,0 +1,58 @@ + + + + + + Planos + + + +
+
+ +
+ +
+ +
+
+ +
+ +
+ + + +
+
+ + +

Minhas Salas

+ +
+ +
+

Matematica

+ +
+
+

Quimica

+ +
+
+

Oficina de Redacao

+ +
+ + + + \ No newline at end of file diff --git a/codigo/meu perfil/style.css b/codigo/meu perfil/style.css new file mode 100644 index 0000000..1a0cb17 --- /dev/null +++ b/codigo/meu perfil/style.css @@ -0,0 +1,191 @@ +* { + box-sizing: border-box; + margin: 0; + padding: 0; +} + +body { + background-color: #4b238f; + color: #e9a226; +} + +h1 { + margin: 60px; + text-align: center; +} + +.main { + display: flex; + justify-content: center; + align-items: center; + flex-wrap: wrap; +} + +.card { + margin: 50px; + background-color: #e9a226; + color: #4b238f; + text-align: center; + width: 500px; + height: 160px; + border-radius: 10px; + box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.35); +} + +.card h1 { + font-size: 25px; + padding-top: 10px; +} + +.btn { + font-size: 17px; + padding: 10px 50px; + border: none; + background-color: #fff; + color: #fff; + border-radius: 10px; + font-weight: 600; + transition: 0.5s background; + cursor: pointer; +} + +.btn:hover { + transition: 0.5s background; + background-color: #e9a226; +} + +header { + text-align: center; + justify-content: center; + display: flex; + align-items: center; + color: #4b238f; + background-color: #e9a226; + height: 120px; + font-size: 50px; +} + +.search-bar { + display: flex; + flex-direction: column; + align-items: center; + margin: 90px; + width: 450px; + height: 180px; + color: black; +} + +.search-bar input { + margin-bottom: 10px; + width: 100%; + padding: 5px; +} + +.image-container { + display: flex; + align-items: flex-start; +} + +.image-container img { + width: 400px; + height: 290px; + margin: 50px; + border-radius: 250px; +} + +body, html { + height: 100%; + margin: 0; +} + +body{ + background-color: #401E88; + margin: 0; + padding: 0; + border: 0; +} + +header{ + background-color: #9517E1; + font-family: 'inter'; +} + +header .logo a{ + text-decoration: none; + font-weight: bolder; + font-size: xx-large; + font-family: 'KoHo'; + color: #f3a60f; +} + +header .menu ul{ + list-style-type: none; +} + +header .menu ul li{ + display: inline-block; + margin-right: 60px; + font-weight: bold; + font-size: 18 px; +} + +header .menu ul li a{ + text-align: center; + text-decoration: none; + color: #401E88; + display: inline; +} + +.left{ + float: left; +} + +.right{ + float: right; +} + +.container { + text-align: center; /* Centraliza as divs no contêiner */ +} + +.container { + display: flex; /* Usa Flexbox para layout */ + justify-content: space-between; /* Espaça uniformemente as divs */ + gap: 10px; /* Espaço entre as divs */ +} + +.box { + padding: 20px; /* Espaçamento interno */ + text-align: center; /* Centraliza o texto */ + margin: auto 0 auto 0; +} + +.login a{ + text-decoration: none; + background-color: #f3a60f; + color: #401E88; + font-size: 20px; + font-weight: bold; + padding: 15px; + border-radius: 16px; + border-color: transparent; + cursor: pointer; +} + + +.button { + padding: 10px 20px; + font-size: 16px; + color: #401E88; + background-color: white; + border: none; + border-radius: 5px; + cursor: pointer; + margin-top: 30px; +} + +.button:hover { + background-color: #f3a60f; +} + + diff --git a/codigo/planos/assets/prc1.png b/codigo/planos/assets/prc1.png new file mode 100644 index 0000000..6351f0f Binary files /dev/null and b/codigo/planos/assets/prc1.png differ diff --git a/codigo/planos/assets/prc2.png b/codigo/planos/assets/prc2.png new file mode 100644 index 0000000..d2d81b3 Binary files /dev/null and b/codigo/planos/assets/prc2.png differ diff --git a/codigo/planos/assets/prc3.png b/codigo/planos/assets/prc3.png new file mode 100644 index 0000000..9ed814c Binary files /dev/null and b/codigo/planos/assets/prc3.png differ diff --git a/codigo/planos/index.html b/codigo/planos/index.html new file mode 100644 index 0000000..fd214f7 --- /dev/null +++ b/codigo/planos/index.html @@ -0,0 +1,31 @@ + + + + + + Planos + + + +
+

Collabore e tenha acesso a todas as ferramentas do nosso site.

+
+
+
+ imagem1 +

Obtenha os benefícios do plano e pague mensalmente

+ +
+
+ imagem2 +

Obtendo o plano de 6 meses o valor passa a ser de R$14,98 por mês

+ +
+
+ imagem3 +

Obtendo o plano anual o valor passa a ser de R$9,15 por mês

+ +
+
+ + \ No newline at end of file diff --git a/codigo/planos/style.css b/codigo/planos/style.css new file mode 100644 index 0000000..e558fe2 --- /dev/null +++ b/codigo/planos/style.css @@ -0,0 +1,61 @@ +* { + box-sizing: border-box; + margin: 0; + padding: 0; +} + +.main { + display: flex; + justify-content: center; + +} + +.card { + margin: 50px; + background-color: #f3a60f; + color: #9517E1; + text-align: center; + width: 500px; + height: 450px; + border-radius: 10px; + box-shadow: box-shadow rgba(0, 0, 0, 0.35) 0px 5px 15px; +} + +body { + background-color: #9517E1; +} + +.card>img { + width: 100%; + border-top-left-radius: 10px; + border-top-right-radius: 10px; +} + +.card>h1 { + font-size: 25px; + padding-top: 10px; +} + +.btn { + font-size: 17px; + padding: 10px 50px; + border: none; + background-color:#fff; + color: #fff; + border-radius: 10px; + font-weight: 600px; + transition: 0.5s background; + cursor: pointer; +} + + .btn:hover { + transition: 0.5s background; + background-color: #202020; + } + +header { + text-align: center; + justify-content: center; + display: flex; + color: #fff; +} \ No newline at end of file diff --git a/codigo/pop up/popup.css b/codigo/pop up/popup.css new file mode 100644 index 0000000..9c6e619 --- /dev/null +++ b/codigo/pop up/popup.css @@ -0,0 +1,234 @@ +@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;700&family=Roboto:wght@100;300;400;500;700;900&family=Source+Sans+Pro:wght@200;300;400;600;700;900&display=swap'); + +* { + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: 'Poppins', sans-serif; +} + +body { + width: 100vw; + height: 100vh; + display: flex; + align-items: center; + justify-content: center; + background-color: rgba(0,0,0,0.1); +} + +button { + cursor: pointer; +} + +.container { + width: 90%; + height: 80%; + border-radius: 10px; + background: #f3ecf1; +} + +.header { + min-height: 70px; + display: flex; + align-items: center; + justify-content: space-between; + margin: auto 12px; +} + +.header span { + font-weight: 900; + font-size: 20px; + word-break: break-all; +} + +#new { + font-size: 16px; + padding: 8px; + border-radius: 5px; + border: none; + color: #f0eef6; + background-color: rgb(80, 27, 228); +} + +.divTable { + padding: 10px; + width: auto; + height:inherit; + overflow:auto; +} + +.divTable::-webkit-scrollbar { + width: 12px; + background-color: #f9f8fc; +} + +.divTable::-webkit-scrollbar-thumb { + border-radius: 10px; + background-color: #eeedf3; +} + +table { + width: 100%; + border-spacing: 10px; + word-break: break-all; + border-collapse: collapse; +} + +thead { + background-color: #9984e6; +} + +tr { + border-bottom: 1px solid rgb(238, 235, 235)!important; +} + +tbody tr td { + vertical-align: text-top; + padding: 6px; + max-width: 50px; +} + +thead tr th { + padding: 5px; + text-align: start; + margin-bottom: 50px; +} + +tbody tr { + margin-bottom: 50px; +} + +thead tr th.acao { + width: 100px!important; + text-align: center; +} + +tbody tr td.acao { + text-align: center; +} + +@media (max-width: 700px) { + body { + font-size: 10px; + } + + .header span { + font-size: 15px; + } + + #new { + padding: 5px; + font-size: 10px; + } + + thead tr th.acao { + width: auto!important; + } + + td button i { + font-size: 20px!important; + } + + td button i:first-child { + margin-right: 0; + } + + .modal { + width: 90%!important; + } + + .modal label { + font-size: 12px!important; + } +} + +.modal-container { + width: 100vw; + height: 100vh; + position: fixed; + top: 0; + left: 0; + background-color: rgba(0, 0, 0, 0.5); + display: none; + z-index: 999; + align-items: center; + justify-content: center; + +} + +.modal { + display: flex; + flex-direction: column; + align-items: center; + padding: 40px; + background-color: #f3f3ec; + border-radius: 10px; + width: 50%; + +} + +.modal label { + font-size: 40px; + width: 100%; + +} + +.modal input { + width: 100%; + outline: none; + padding: 5px 10px; + width: 100%; + margin-bottom: 20px; + border-top: none; + border-left: none; + border-right: none; + +} + +.modal button { + width: 100%; + margin: 10px auto; + outline: none; + border-radius: 20px; + padding: 5px 10px; + width: 100%; + border: none; + background-color: rgb(80, 27, 228); + color: #f4f0f0; +} + +.active { + display: flex; +} + +.active .modal { + animation: modal .4s; +} + +@keyframes modal { + from { + opacity: 0; + transform: translate3d(0, -60px, 0); + } + to { + opacity: 1; + transform: translate3d(0, 0, 0); + } +} + +td button { + border: none; + outline: none; + background: transparent; +} + +td button i { + font-size: 25px; +} + +td button i:first-child { + margin-right: 10px; +}html { + height: 100%; + width: 100%; +} \ No newline at end of file diff --git a/codigo/pop up/popup.html b/codigo/pop up/popup.html new file mode 100644 index 0000000..ddbc230 --- /dev/null +++ b/codigo/pop up/popup.html @@ -0,0 +1,60 @@ + + + + + + + + CRUD + + + + + +
+
+ Cadastro de Novas Matérias + +
+ +
+ + + + + + + + + + + + +
MatériaAssuntoStatusEditarExcluir
+
+ +
+
+
+ + + + + + + + + + + + + +
+
+
+ +
+ + + + \ No newline at end of file diff --git a/codigo/pop up/popup.js b/codigo/pop up/popup.js new file mode 100644 index 0000000..5c36c41 --- /dev/null +++ b/codigo/pop up/popup.js @@ -0,0 +1,98 @@ +const modal = document.querySelector('.modal-container') +const tbody = document.querySelector('tbody') +const sMateria = document.querySelector('#m-materia') +const sAssunto = document.querySelector('#m-assunto') +const sStatus = document.querySelector('#m-status') +const btnEditar = document.querySelector('#btnEditar') +const btnSalvar = document.querySelector('#btnSalvar') + +let itens +let id + +function openModal(edit = false, index = 0) { + modal.classList.add('active') + + modal.onclick = e => { + if (e.target.className.indexOf('modal-container') !== -1) { + modal.classList.remove('active') + } + } + + if (edit) { + sMateria.value = itens[index].materia + sAssunto.value = itens[index].assunto + sStatus.value = itens[index].status + id = index + } else { + sMateria.value = '' + sAssunto.value = '' + sStatus.value = '' + } + +} + +function editItem(index) { + + openModal(true, index) +} + +function deleteItem(index) { + itens.splice(index, 1) + setItensBD() + loadItens() +} + +function insertItem(item, index) { + let tr = document.createElement('tr') + + tr.innerHTML = ` + ${item.materia} + ${item.assunto} + ${item.status} + + + + + + + + ` + tbody.appendChild(tr) +} + +btnSalvar.onclick = e => { + + if (sMateria.value == '' || sAssunto.value == '' || sStatus.value == '') { + return + } + + e.preventDefault(); + + if (id !== undefined) { + itens[id].materia = sMateria.value + itens[id].assunto = sAssunto.value + itens[id].status = sStatus.value + } else { + itens.push({'materia': sMateria.value, 'assunto': sAssunto.value, 'status': sStatus.value}) + } + + setItensBD() + + modal.classList.remove('active') + loadItens() + id = undefined +} + +function loadItens() { + itens = getItensBD() + tbody.innerHTML = '' + itens.forEach((item, index) => { + insertItem(item, index) + }) + +} + +const getItensBD = () => JSON.parse(localStorage.getItem('dbfunc')) ?? [] +const setItensBD = () => localStorage.setItem('dbfunc', JSON.stringify(itens)) + +loadItens() \ No newline at end of file diff --git a/codigo/sala/mainstyle.css b/codigo/sala/mainstyle.css new file mode 100644 index 0000000..125b89b --- /dev/null +++ b/codigo/sala/mainstyle.css @@ -0,0 +1,189 @@ +body, html { + height: 100%; + margin: 0; +} + +body{ + background-color: #401E88; + margin: 0; + padding: 0; + border: 0; +} + +header{ + background-color: #9517E1; + font-family: 'inter'; +} + +header .logo a{ + text-decoration: none; + font-weight: bolder; + font-size: xx-large; + font-family: 'KoHo'; + color: #f3a60f; +} + +header .menu ul{ + list-style-type: none; +} + +header .menu ul li{ + display: inline-block; + margin-right: 60px; + font-weight: bold; + font-size: 18 px; +} + +header .menu ul li a{ + text-align: center; + text-decoration: none; + color: #401E88; + display: inline; +} + +.left{ + float: left; +} + +.right{ + float: right; +} + +.container { + text-align: center; /* Centraliza as divs no contêiner */ +} + +.container { + display: flex; /* Usa Flexbox para layout */ + justify-content: space-between; /* Espaça uniformemente as divs */ + gap: 10px; /* Espaço entre as divs */ +} + +.box { + padding: 20px; /* Espaçamento interno */ + text-align: center; /* Centraliza o texto */ + margin: auto 0 auto 0; +} + +.login a{ + text-decoration: none; + background-color: #f3a60f; + color: #401E88; + font-size: 20px; + font-weight: bold; + padding: 15px; + border-radius: 16px; + border-color: transparent; + cursor: pointer; +} + +.login a:active { + transform: scale(0.95); +} + +.box-group{ + margin: 20px; + padding: 20px; +} + +.box-container{ + width: auto; + height: auto; + background-color: #9517E1; + text-align: center; /* Centraliza o conteúdo dentro de cada box-container */ + padding: 5px 0 20px 0; + margin-top: 10px; +} + +h1, p, button { + text-align: center; /* Centraliza texto e botão dentro de .content */ + margin: 0; +} + +.button { + padding: 10px 20px; + font-size: 16px; + color: #401E88; + background-color: white; + border: none; + border-radius: 5px; + cursor: pointer; + margin-top: 30px; +} + +.button:hover { + background-color: #f3a60f; +} + +h1{ + color: #f3a60f; + font-family: 'KoHo'; +} +p{ + color: white; + font-family: 'Inter'; +} + +@import url('https://fonts.googleapis.com/css?family=Koho'); + +body { + font-family: 'Koho', sans-serif; + background-color: #f7f7f7; +} + +.chat-container { + width: 80%; + max-width: 800px; + margin: 0 auto; + border: 1px solid #666; + border-radius: 10px; + overflow: hidden; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); +} + +.chat-header { + background-color: #9517E1; + color: #fff; + padding: 15px; + text-align: center; + border-bottom: 1px solid #666; + font-family: 'Koho', sans-serif; +} + +.chat-messages { + height: 400px; + overflow-y: auto; + padding: 15px; + border-bottom: 1px solid #666; +} + +.chat-input { + display: flex; + padding: 15px; + border-top: 1px solid #666; +} + +.chat-input input[type="text"] { + flex: 1; + padding: 15px; + border: 1px solid #666; + border-radius: 10px; + margin-right: 20px; + background-color: #f7f7f7; + font-family: 'Koho', sans-serif; +} + +.chat-input button { + padding: 15px; + border: none; + border-radius: 10px; + background-color: #f3a60f; + color: #fff; + cursor: pointer; + margin-left: 20px; + font-family: 'Koho', sans-serif; +} + +.chat-input button:hover { + background-color: #ffd700; +} diff --git a/codigo/sala/sala.html b/codigo/sala/sala.html new file mode 100644 index 0000000..3ca43f6 --- /dev/null +++ b/codigo/sala/sala.html @@ -0,0 +1,49 @@ + + + + + + Home | Collabora + + + + + + + +
+
+ +
+ +
+ +
+
+
+
+

Chat da Sala

+
+
+
+ + + + + + +
+
+ + + + \ No newline at end of file diff --git a/codigo/sala/scripts.js b/codigo/sala/scripts.js new file mode 100644 index 0000000..fdac665 --- /dev/null +++ b/codigo/sala/scripts.js @@ -0,0 +1,46 @@ +document.addEventListener('DOMContentLoaded', () => { + const sendButton = document.getElementById('send-button'); + const attachButton = document.getElementById('attach-button'); + const fileInput = document.getElementById('file-input'); + const messageInput = document.getElementById('message-input'); + const chatMessages = document.getElementById('chat-messages'); + + sendButton.addEventListener('click', sendMessage); + attachButton.addEventListener('click', () => fileInput.click()); + fileInput.addEventListener('change', sendFile); + + function sendMessage() { + const message = messageInput.value; + if (message.trim() !== "") { + const messageElement = document.createElement('div'); + messageElement.textContent = message; + chatMessages.appendChild(messageElement); + messageInput.value = ""; + } + } + + function sendFile() { + const file = fileInput.files[0]; + if (file) { + const formData = new FormData(); + formData.append('file', file); + + fetch('/upload', { + method: 'POST', + body: formData + }) + .then(response => response.json()) + .then(data => { + const fileLink = document.createElement('a'); + fileLink.href = data.fileUrl; + fileLink.textContent = file.name; + chatMessages.appendChild(fileLink); + }) + .catch(error => console.error('Erro ao enviar arquivo:', error)); + } + } +}); + +function openCalculator() { + window.open('/Calculadora/calculatorindex.html', 'Calculadora', 'width=400,height=550'); +} \ No newline at end of file diff --git a/codigo/vizu de sala/index.html b/codigo/vizu de sala/index.html new file mode 100644 index 0000000..f7419cb --- /dev/null +++ b/codigo/vizu de sala/index.html @@ -0,0 +1,81 @@ + + + + + + + + + COLLABORA + + +
+ +
+ + + + +
+ + +
+
+

Escolha sua sala

+
+
+
Ciências Humanas e suas Tecnologias.
+
Ciênciasda Natureza e suas Tecnologias.
+
Linguagens, Códigos e suas Tecnologias.
+
Matemática e suas Tecnologias.
+
Redação
+
+
+
+

℗ All Rights Reserved.

+
+ + + + \ No newline at end of file diff --git a/codigo/vizu de sala/salsa.js b/codigo/vizu de sala/salsa.js new file mode 100644 index 0000000..851f144 --- /dev/null +++ b/codigo/vizu de sala/salsa.js @@ -0,0 +1,40 @@ +document.getElementById('crieumasala').addEventListener('click', function() { + window.location.href = '/pop up/popup.html'; +}); + +document.getElementById('sala1').addEventListener('click', function() { + window.location.href = '/sala/sala.html'; +}); + +document.getElementById('sala2').addEventListener('click', function() { + window.location.href = '/sala/sala.html'; +}); + +document.getElementById('sala3').addEventListener('click', function() { + window.location.href = '/sala/sala.html'; +}); + +document.getElementById('sala4').addEventListener('click', function() { + window.location.href = '/sala/sala.html'; +}); + + +document.getElementById('edit-me').addEventListener('click', function() { + window.location.href = '/index.html'; +}); + +document.getElementById('planos').addEventListener('click', function() { + window.location.href = '/planos/index.html'; +}); + +document.getElementById('minhaconta').addEventListener('click', function() { + window.location.href = '/meu perfil/index.html'; +}); + +document.getElementById('faq').addEventListener('click', function() { + window.location.href = '/faq/faq2.html'; +}); + +document.getElementById('loginbutton').addEventListener('click', function() { + window.location.href = '/Cadastro (collabora)/cadastro.html'; +}); \ No newline at end of file diff --git a/codigo/vizu de sala/style.css b/codigo/vizu de sala/style.css new file mode 100644 index 0000000..9884548 --- /dev/null +++ b/codigo/vizu de sala/style.css @@ -0,0 +1,100 @@ +body { + font-family: Arial, sans-serif; + background-color: #401E88; + color: white; + margin: 0; + padding: 0; +} + +.header { + display: flex; + justify-content: space-between; + background-color: #9517E1; + padding: 10px 0; + text-align: center; + margin-bottom: 10px; +} + +.header button { + font-size: medium; + font-family: inter; + font-weight:500; + margin: 0 5px; + padding: 10px 20px; + background-color: #9517E1; + color: #f3a60f; + border: none; + border-radius: 5px; + cursor: pointer; + transition: background-color 0.3s ease; +} + +.header button:hover { + background-color: #401E88; + color: #f3a60f; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); +} + +#edit-me { + font-family:Koho; + font-weight: bold; + font-size: large; +} + +.intro { + padding-top: 10px; + text-align: center; + font-size: xx-large; + font-weight: bold; + font-stretch: expanded; +} + +.content { + display: flex; + justify-content: space-around; + flex-wrap: wrap; + padding: 20px; +} + +.content-box { + font-size: medium; + font-weight: 500; + font-family: inter; + text-align: center; + width: 200px; + height: 145px; + background-color: #F5F5F5; + color: #401E88; + margin: 10px; + padding: 30px; + border-radius: 10px; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); + transition: transform 0.3s ease; +} + +.content-box:hover { + transform: translateY(-10px); +} + +.footer { + background: linear-gradient(to right, #401E88, #401E88); + padding: 12px 0; + text-align: center; + margin-top: 205px; +} + +h1, h2, h3, h4, h5, h6 { + font-family: 'Roboto', sans-serif; +} + +.footer p { + color: white; + text-align: center; + margin:bottom; +} + +.botao { + color: #f3a60f; + padding-left: 620px; + cursor: pointer; +} \ No newline at end of file