Skip to content
Snippets Groups Projects
Commit 525a98af authored by bfsc19's avatar bfsc19 :flushed:
Browse files

nav nova

parent 9578a4de
No related branches found
No related tags found
No related merge requests found
html/assets/css/bgfundo.jpg

6.49 MiB

......@@ -9,15 +9,15 @@
}
.bg-fundo {
background-image: url("images/fundo.jpg");
background-image: url("bgfundo.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
background-attachment: fixed;
}
.box-shadow-fundo {
box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.6);
.box-shadow-fundo:hover {
box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.3);
}
.svg-header {
......@@ -35,9 +35,10 @@
}
.borda-colorida {
border:3px solid black;
border: 3px solid rgba(0, 0, 0, 0);
resize: both;
border-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48c3R5bGU+QGtleWZyYW1lcyBzdHJva2V7MCV7c3Ryb2tlLWRhc2hhcnJheTo3MCwzNTA7c3Ryb2tlLWRhc2hvZmZzZXQ6MH0xJXtzdHJva2UtZGFzaGFycmF5OjU1LDM1MDtzdHJva2UtZGFzaG9mZnNldDowfTUle3N0cm9rZS1kYXNoYXJyYXk6NTAsMzUwO3N0cm9rZS1kYXNob2Zmc2V0OjB9OSV7c3Ryb2tlLWRhc2hhcnJheToxNSwzNTAsMzA7c3Ryb2tlLWRhc2hvZmZzZXQ6MH10b3tzdHJva2UtZGFzaG9mZnNldDo3NzZ9fTwvc3R5bGU+PGxpbmVhckdyYWRpZW50IGlkPSJwcmVmaXhfX2ciIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjMDU4ZDU5IiBzdG9wLW9wYWNpdHk9Ii41Ii8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjNjcyNmZmIiBzdG9wLW9wYWNpdHk9Ii44Ii8+PC9saW5lYXJHcmFkaWVudD48cGF0aCBkPSJNMS41IDEuNWg5N3Y5N2gtOTd2LTk3IiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIiBzdHJva2U9InVybCgjcHJlZml4X19nKSIgc3Ryb2tlLXdpZHRoPSIxMCIgc3Ryb2tlLWRhc2hhcnJheT0iNTAgNzc2IiBzdHlsZT0iYW5pbWF0aW9uOnN0cm9rZSAxLjVzIGxpbmVhciBpbmZpbml0ZSIvPjwvc3ZnPg==") 1;
border-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48c3R5bGU+QGtleWZyYW1lcyBzdHJva2V7MCV7c3Ryb2tlLWRhc2hhcnJheTo3MCwzNTA7c3Ryb2tlLWRhc2hvZmZzZXQ6MH0xJXtzdHJva2UtZGFzaGFycmF5OjU1LDM1MDtzdHJva2UtZGFzaG9mZnNldDowfTUle3N0cm9rZS1kYXNoYXJyYXk6NTAsMzUwO3N0cm9rZS1kYXNob2Zmc2V0OjB9OSV7c3Ryb2tlLWRhc2hhcnJheToxNSwzNTAsMzA7c3Ryb2tlLWRhc2hvZmZzZXQ6MH10b3tzdHJva2UtZGFzaG9mZnNldDo3NzZ9fTwvc3R5bGU+PGxpbmVhckdyYWRpZW50IGlkPSJwcmVmaXhfX2ciIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjMDU4ZDU5IiBzdG9wLW9wYWNpdHk9Ii41Ii8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjNjcyNmZmIiBzdG9wLW9wYWNpdHk9Ii44Ii8+PC9saW5lYXJHcmFkaWVudD48cGF0aCBkPSJNMS41IDEuNWg5N3Y5N2gtOTd2LTk3IiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIiBzdHJva2U9InVybCgjcHJlZml4X19nKSIgc3Ryb2tlLXdpZHRoPSIxMCIgc3Ryb2tlLWRhc2hhcnJheT0iNTAgNzc2IiBzdHlsZT0iYW5pbWF0aW9uOnN0cm9rZSAxLjVzIGxpbmVhciBpbmZpbml0ZSIvPjwvc3ZnPg==")
1;
}
.grade {
......
......@@ -10,7 +10,7 @@
<script src="assets/js/script.js" defer></script>
</head>
<body>
<header class="pt-12 mb-0 flex flex-col items-center justify-center h-[80vh] bg-black sticky top-[calc(-80vh+56px)]">
<header class="borda-colorida z-20 overflow-auto pt-12 mb-0 flex flex-col items-center justify-center h-[100vh] bg-black sticky top-[calc(-100vh+56px)]">
<svg class="absolute top-0 left-0 w-full h-full bg-fundo box-shadow-fundo opacity-50">
<rect width="1" height="1" fill="url(#background)" />
<lineargradient id="background">
......@@ -57,31 +57,38 @@
</p>
</div>
<nav
class="pt-1 pb-2 z-10 sticky top-0 flex h-[5vh] items-center justify-center bg-fixed bg-center bg-cover text-sm font-medium text-center text-gray-500 dark:text-gray-400 flex-wrap"
class=" z-10 sticky top-0 flex h-[10vh] items-center justify-center text-sm font-medium text-center text-gray-500 dark:text-gray-400 flex-wrap"
>
<a
href="#oquee"
class="z-20 borda-colorida inline-block py-3 px-4 text-white rounded-lg active"
class=" inline-block py-2 px-2 text-white rounded-lg box-shadow-fundo "
aria-current="page"
>
O que é
</a>
<a
href="#atividades"
class="inline-block py-3 px-4 rounded-lg hover:text-gray-900 hover:bg-gray-100 dark:hover:bg-gray-800 dark:hover:text-white"
class="inline-block py-2 px-2 text-white rounded-lg box-shadow-fundo "
>Atividades</a
>
<a
href="#maratonas"
class="inline-block py-3 px-4 rounded-lg hover:text-gray-900 hover:bg-gray-100 dark:hover:bg-gray-800 dark:hover:text-white"
class="inline-block py-2 px-2 text-white rounded-lg box-shadow-fundo "
>Maratonas</a
>
<a
href="#programacao"
class="inline-block py-3 px-4 rounded-lg hover:text-gray-900 hover:bg-gray-100 dark:hover:bg-gray-800 dark:hover:text-white"
class="inline-block py-2 px-2 text-white rounded-lg box-shadow-fundo "
>Programação Preliminar</a
>
<a
href="#programacao"
class="borda-colorida inline-block py-2 px-2 text-white rounded-lg box-shadow-fundo "
>INSCREVER-SE</a
>
</nav>
</header>
<img
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment