Skip to content

GitLab

Commit 2bfe57ec authored by Bruno Thomazi Zanette's avatar Bruno Thomazi Zanette 🎱
Browse files

Update site-ergane/filenav.css, site-ergane/index.html, site-ergane/style.css, site-ergane/.gitkeep

parent b2cc260c
Hide whitespace changes
Inline Side-by-side
site-ergane/filenav.css 0 → 100644
View file @ 2bfe57ec
.filenav{
height: 500px;
}
.pathselector{
background-color: #290628;
}
.fileselector{
background-color:#1b071b;
}
.menu{
height: 450px;
overflow-y: scroll;
}
.menu::-webkit-scrollbar {
width: 10px;
}
/* Track */
.menu::-webkit-scrollbar-track {
background: transparent;
}
/* Handle */
.menu::-webkit-scrollbar-thumb {
background: #570c54;
}
/* Handle on hover */
.menu::-webkit-scrollbar-thumb:hover {
background: #630e60;
}
.menu a{
color: white !important;
font-size: 12pt;
width: fit-content
}
.menu p{
color: white !important;
font-size: 17pt;
margin-bottom: 4px!important;
margin-top: 4px!important;
}
.menu a.ativo{
border-radius: 0px;
border-bottom: 4px solid white;
pointer-events: none;
}
.menu a:hover{
border-radius: 0px ;
background-color: unset !important;
border-bottom: 2px solid white;
}
.audito{
width: 500px;
border-radius: 0 !important;
}
.gallery-item{
margin: 3px;
float: left;
width: 120px;
color: white;
text-align: center;
}
.gallery-item img{
width:120px;
height:120px;
}
#niceguy{
height: 470px;
overflow-y: scroll;
}
#niceguy::-webkit-scrollbar {
width: 10px;
}
/* Track */
#niceguy::-webkit-scrollbar-track {
background: transparent;
}
/* Handle */
#niceguy::-webkit-scrollbar-thumb {
background: #570c54;
}
/* Handle on hover */
#niceguy::-webkit-scrollbar-thumb:hover {
background: #630e60;
}
site-ergane/index.html 0 → 100644
View file @ 2bfe57ec
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ergane</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Heebo:wght@300&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="filenav.css">
<script type="module" src="js/script.js"></script>
<script type="module" src="js/mus.js"></script>
<script src="js/pagescript.js"></script>
</head>
<body>
<nav id="mynav" class="navbar navcolortrans">
<div class="container ">
<div id="navMenu" class="navbar-menu">
<div id="navopt" class="navbar-end">
<a href="#home" class="navbar-item navativo navtext">
Home
</a>
<a href="#sobre" class="navbar-item navtext">
Sobre
</a>
<a href="#projetos" class="navbar-item navtext">
Projetos
</a>
<a href="#arquivos" class="navbar-item navtext">
Arquivos
</a>
</div>
</div>
</div>
</nav>
<div id="home" class="container">
<img src="assets/logo.png" class="bgred" width="50%" height="50%">
</div>
<canvas class="webgl"></canvas>
</section>
<div id= "sobre"></div>
<div class="sec1">
<div class="columns mb-6">
<div class="column">
<img src="assets/vazofront.png">
</div>
<div class="column">
<div class="content is-large has-text-justified">
<h1 class="has-text-centered">Sobre Nós</h1>
<p>Homenageando a deusa Atena, cultuada sob o epíteto Ergane (dos trabalhos,
dos afazeres manuais, da técnica) em diversas cidades da Grécia Antiga, o projeto tem como primeira atuação a produção de simulações digitais tridimensionais de artefatos arqueológicos para uso na sala de aula.</p>
</div>
</div>
</div>
<div class="columns">
<div class="column">
<div class="content is-large has-text-justified">
<h1 class="has-text-centered">Nossa Casa</h1>
<p>O espaço físico do projeto está localizado no Centro de Tecnologia Acadêmica do Instituto de Física da UFRGS (<a href="https://cta.if.ufrgs.br/capa/">CTA</a>): laboratório que tem como prática o desenvolvimento e a aplicação - tanto quantitativa quanto qualitativamente - de formas de conhecimento livre e aberto, disponibilizando toda a sua criação em repositório público sob os termos de licenças permissivas.</p>
</div>
</div>
<div class="column" >
<div class="imgsloc">
<img class="" src="assets/LogoCTA.png">
<img class="" src="assets/ufrgslogo.jpg">
</div>
</div>
</div>
<div id= "projetos"></div>
</div>
<div class="content is-medium sec1 mb-6">
<h1 class="has-text-centered">Projetos</h1>
<br>
<div class="tile is-ancestor has-text-centered mb-5">
<div class="tile m-2 hov">
<div class="content">
<img class="img" src="assets/img1.jpg">
<h2>teste</h2>
<div class="overlay">
<div class="texto">
<p>Lorem ipsum dolor sit amet consectetur adipisicing aut sint</p>
</div>
</div>
</div>
</div>
<div class="tile m-2 hov">
<div class="content">
<img class="img" src="assets/img1.jpg">
<h2>teste</h2>
<div class="overlay">
<div class="texto">
<p>Lorem ipsum dolor sit amet consectetur adipisicing aut sint</p>
</div>
</div>
</div>
</div>
<div class="tile m-2 hov">
<div class="content">
<img class="img" src="assets/img1.jpg">
<h2>teste</h2>
<div class="overlay">
<div class="texto">
<p>Lorem ipsum dolor sit amet consectetur adipisicing aut sint</p>
</div>
</div>
</div>
</div>
</div>
<p id="arquivos">The quick, brown fox jumps over a lazy dog. DJs flock by when MTV
ax quiz prog. Junk MTV quiz graced by fox whelps. Bawds jog, flick
quartz, vex nymphs. Waltz, bad nymph, for quick jigs vex! Fox
nymphs grab quick-jived waltz. Brick quiz whangs</p>
</div>
<div id="myModal" class="modal">
<!-- Modal content -->
<div class="modal-content">
<span class="close">&times;</span>
<div class="columns">
<div class="column">
<canvas id="wglmus" class="webglmus"></canvas>
<div id="conteudo-modal-3d"></div>
</div>
<div id="conteudo-modal" class="column">
</div>
</div>
</div>
</div>
<div class="columns filenav ">
<div class="column is-one-third pathselector">
<aside class="menu ml-5" id="menufiles">
<p class="menu-label">
Modelos 3D
</p>
<ul class="menu-list">
<li><a id="general" class="menutem ativo">Todos</a></li>
<li><a id="a" class="menutem">Brasil</a></li>
<li><a id="b" class="menutem">Grécia</a></li>
<li><a id="c" class="menutem">Império Romano</a></li>
<li><a class="menutem"></a></li>
</ul>
<p class="menu-label">
PDFs
</p>
<ul class="menu-list">
<li><a class="menutem" >Planos de Ensino</a></li>
<li><a class="menutem">Folders</a></li>
<li><a class="menutem">Ebooks</a></li>
</ul>
<p class="menu-label">
Atividades
</p>
<ul class="menu-list">
<li><a class="menutem">Papercrafts</a></li>
<li><a class="menutem">Jogos</a></li>
</ul>
</aside>
</div>
<div class="column file fileselector">
<div class="container">
<div id="niceguy">
</div>
</div>
</div>
</div>
<div class="sec-equipe">
<div class="content">
<h1 class="has-text-centered">Equipe</h1>
</div>
<div class="tile is-ancestor">
<div class="tile is-parent">
<article class="tile tit is-child has-text-centered">
<div class="columns is-flex is-centered">
<figure class="image is-128x128">
<img class="is-rounded" src="assets/equipe/teste 1.png">
</figure></div>
<p class="title">Ana Paula Pedroso</p>
<p class="subtitle">Historiadora da Equipe</p>
<a href="#" class="bla fa fa-facebook"></a>
<a href="#" class="bla fa fa-twitter"></a>
<a href="#" class="bla fa fa-instagram"></a>
</article>
</div>
<div class="tile is-parent">
<article class="tile tit is-child has-text-centered">
<div class="columns is-flex is-centered">
<figure class="image is-128x128">
<img class="is-rounded" src="assets/equipe/teste 1.png">
</figure></div>
<p class="title">Ana Paula Pedroso</p>
<p class="subtitle">Historiadora da Equipe</p>
<a href="#" ><i class="bla fa fa-facebook"></i></a>
<a href="#" ><i class="bla fa fa-twitter"></i></a>
<a href="#" ><i class="bla fa fa-instagram"></i></a>
</article>
</div>
<div class="tile is-parent">
<article class="tile tit is-child has-text-centered">
<div class="columns is-flex is-centered">
<figure class="image is-128x128">
<img class="is-rounded" src="assets/equipe/teste 1.png">
</figure></div>
<p class="title">Ana Paula Pedroso</p>
<p class="subtitle">Historiadora da Equipe</p>
<a href="#" ><i class="bla fa fa-facebook"></i></a>
<a href="#" ><i class="bla fa fa-twitter"></i></a>
<a href="#" ><i class="bla fa fa-instagram"></i></a>
</article>
</div>
<div class="tile is-parent">
<article class="tile tit is-child has-text-centered">
<div class="columns is-flex is-centered">
<figure class="image is-128x128">
<img class="is-rounded" src="assets/equipe/teste 1.png">
</figure></div>
<p class="title">Ana Paula Pedroso</p>
<p class="subtitle">Historiadora da Equipe</p>
<a href="#" ><i class="bla fa fa-facebook"></i></a>
<a href="#" ><i class="bla fa fa-twitter"></i></a>
<a href="#" ><i class="bla fa fa-instagram"></i></a>
</article>
</div>
</div>
<div class="tile is-ancestor">
<div class="tile is-parent">
<article class="tile tit is-child has-text-centered">
<div class="columns is-flex is-centered">
<figure class="image is-128x128">
<img class="is-rounded" src="assets/equipe/teste 1.png">
</figure></div>
<p class="title">Ana Paula Pedroso</p>
<p class="subtitle">Historiadora da Equipe</p>
<a href="#" ><i class="bla fa fa-facebook"></i></a>
<a href="#" ><i class="bla fa fa-twitter"></i></a>
<a href="#" ><i class="bla fa fa-instagram"></i></a>
</article>
</div>
<div class="tile is-parent">
<article class="tile tit is-child has-text-centered">
<div class="columns is-flex is-centered">
<figure class="image is-128x128">
<img class="is-rounded" src="assets/equipe/teste 1.png">
</figure></div>
<p class="title">Ana Paula Pedroso</p>
<p class="subtitle">Historiadora da Equipe</p>
<a href="#" ><i class="bla fa fa-facebook"></i></a>
<a href="#" ><i class="bla fa fa-twitter"></i></a>
<a href="#" ><i class="bla fa fa-instagram"></i></a>
</article>
</div>
<div class="tile is-parent">
<article class="tile tit is-child has-text-centered">
<div class="columns is-flex is-centered">
<figure class="image is-128x128">
<img class="is-rounded" src="assets/equipe/teste 1.png">
</figure></div>
<p class="title">Ana Paula Pedroso</p>
<p class="subtitle">Historiadora da Equipe</p>
<a href="#" ><i class="bla fa fa-facebook"></i></a>
<a href="#" ><i class="bla fa fa-twitter"></i></a>
<a href="#" ><i class="bla fa fa-instagram"></i></a>
</article>
</div>
<div class="tile is-parent">
<article class="tile tit is-child has-text-centered">
<div class="columns is-flex is-centered">
<figure class="image is-128x128">
<img class="is-rounded" src="assets/equipe/teste 1.png">
</figure></div>
<p class="title">Ana Paula Pedroso</p>
<p class="subtitle">Historiadora da Equipe</p>
<a href="#" ><i class="bla fa fa-facebook"></i></a>
<a href="#" ><i class="bla fa fa-twitter"></i></a>
<a href="#" ><i class="bla fa fa-instagram"></i></a>
</article>
</div>
</div>
</div>
<footer class="footer">
<div class="columns">
<div class="column content is-9">
<img src="assets/logo2.png" width="30%" height="30%">
</div>
<div class="column">
<h3>Endereço:</h3>
<p>Instituto de Física da UFRGS,<br> sala 110 do Prédio 43132 (Prédio L), <br>Campus do Vale da UFRGS.</p>
<a href="#" ><i class="fa fa-envelope"></i></a>
<a href="#" ><i class="fa fa-gitlab"></i></a>
<a href="#" ><i class="fa fa-twitter"></i></a>
<a href="#" ><i class="fa fa-instagram"></i></a>
</div>
</div>
<div class="license" ><a rel="license" href="http://creativecommons.org/licenses/by/4.0/"></a>Este obra está licenciado com uma Licença <a rel="license" href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Atribuição 4.0 Internacional</a>.</div>
</footer>
</body>
</html>
site-ergane/style.css 0 → 100644
View file @ 2bfe57ec
body{
font-family: 'Heebo', sans-serif;
}
.webgl{
width: 100%;
height: 100%;
display: block;
}
.bgred{
position: absolute;
}
.navtext{
color: white;
}
.navbar{
position: fixed;
top:0;
width:100%;
}
.navbar-end{
margin: auto;
}
.navbar-end a.navativo{
border-radius: 0px;
border-bottom: 3px solid white;
}
.navbar-end a:hover{
border-radius: 0px ;
background-color: unset !important;
color: white !important;
border-bottom: 2px solid white;
}
.navcolortrans{
background:transparent ;
}
.navcolornormal{
background:#290628 ;
}
.sec1{
margin: 100px;
color: black;
}
.sec1 h1, .sec1 h2{
color: black;
}
.hov {
position: relative;
width: 50%;
}
.imgsloc{
margin-left: 60px;
width: 60%;
height: 60%;
display: block;
}
.img {
display: block;
width: 100%;
height: auto;
}
.overlay {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background-color: #49087e;
overflow: hidden;
width: 100%;
height: 0;
transition: .5s ease;
}
.hov:hover .overlay {
height: 100%;
}
.texto {
color: white;
font-size: 20px;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
text-align: center;
}
/* The Modal (background) */
.modal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 1; /* Sit on top */
padding-top: 100px; /* Location of the box */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
/* Modal Content */
.modal-content {
background-color: #fefefe;
margin: auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
}
/* The Close Button */
.close {
color: #aaaaaa;
float: right;
font-size: 28px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: #000;
text-decoration: none;
cursor: pointer;
}
.sec-equipe{
margin-top: 100px;
margin-bottom: 100px;
margin-left: 200px;
margin-right: 200px;
color: black;
}
.sec-equipe .title{
font-size: 20px;
}
.footer{
background-color: #290628;
color: white ;
height: 320px;
}
.footer h3{
font-size:30px;
}
.license{
text-align: center;
}
.fa {
padding: 20px;
font-size: 30px;
width: 50px;
text-align: center;
text-decoration: none;
margin: 5px 2px;
color: white;
}
.bla{
color: black !important;
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Os conteúdos dos repositórios estão sob licenças livres e são responsabilidade dos próprios autores, não representando as opiniões e posicionamento da UFRGS ou do CTA.