Skip to content

Commit

Permalink
hello world
Browse files Browse the repository at this point in the history
  • Loading branch information
medeirosinacio committed Mar 16, 2024
1 parent cf8bae9 commit 4fd7dff
Show file tree
Hide file tree
Showing 3 changed files with 217 additions and 208 deletions.
1 change: 1 addition & 0 deletions assets/css/default.scss
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ html {
font-family: "Open Sans", sans-serif;
min-height: 100%;
position: relative;
height: 100vh;
}

// reset text
Expand Down
316 changes: 216 additions & 100 deletions index.html
Original file line number Diff line number Diff line change
@@ -1,108 +1,224 @@
---
layout: default
title: V0
layout: blank
title: 404
---
<style>

<!-- Page Content-->
<div class="py-4">
<div class="container px-3">
<div class="row">
<div class="col-md-9">
{% for post in paginator.posts %}
<article class="card py-4">
<header class="card-header">
<h4 class="card-title">
<a class="text-inherit fw-bolder fs-1 color-hover" href="{{ site.srcurl }}{{ post.url }}">
{{ post.title }}
</a>
</h4>
</header>
<div class="card-body">
<a class="card-img-top d-block" style="background-image: url('{{ site.srcurl }}{{ site.image_path }}{{ post.image }}')" href="{{ site.srcurl }}{{ post.url }}"></a>
<p class="card-text pt-2">
{{ post.introduction | strip_html | strip_newlines | truncate: 500 }}
</p>
/*[404 error page]
--------------------------*/

.error-content {
padding: 0 0 70px;
}

.error-text {
text-align: center;
}

.error {
font-size: 6em;
font-weight: 100;
}

@media (max-width: 900px) {
.error {
font-size: 6em !important;
margin-top: 20%;
}
}

@keyframes bob {
0% {
top: 0;
}
50% {
top: 0.2em;
}
}

.im-sheep {
display: inline-block;
position: relative;
font-size: 1em;
margin-bottom: 70px;
}

.im-sheep * {
transition: transform 0.3s;
}

.im-sheep .top {
position: relative;
top: 0;
animation: bob 1s infinite;
}

.im-sheep:hover .head {
transform: rotate(0deg);
}

.im-sheep:hover .head .im-eye {
width: 1.25em;
height: 1.25em;
}

.im-sheep:hover .head .im-eye:before {
right: 30%;
}

.im-sheep:hover .top {
animation-play-state: paused;
}

.im-sheep .head {
display: inline-block;
width: 5em;
height: 5em;
border-radius: 100%;
background: #253858;
vertical-align: middle;
position: relative;
top: 1em;
transform: rotate(30deg);
}

.im-sheep .head:before {
content: '';
display: inline-block;
width: 80%;
height: 50%;
background: #253858;
position: absolute;
bottom: 0;
right: -10%;
border-radius: 50% 40%;
}

.im-sheep .head:hover .im-ear.one, .im-sheep .head:hover .im-ear.two {
transform: rotate(0deg);
}

.im-sheep .head .im-eye {
display: inline-block;
width: 1em;
height: 1em;
border-radius: 100%;
background: white;
position: absolute;
overflow: hidden;
}

.im-sheep .head .im-eye:before {
content: '';
display: inline-block;
background: black;
width: 50%;
height: 50%;
border-radius: 100%;
position: absolute;
right: 10%;
bottom: 10%;
transition: all 0.3s;
}

.im-sheep .head .im-eye.one {
right: -2%;
top: 1.7em;
}

.im-sheep .head .im-eye.two {
right: 2.5em;
top: 1.7em;
}

.im-sheep .head .im-ear {
background: #253858;
width: 50%;
height: 30%;
border-radius: 100%;
position: absolute;
}

.im-sheep .head .im-ear.one {
left: -10%;
top: 5%;
transform: rotate(-30deg);
}

.im-sheep .head .im-ear.two {
top: 2%;
right: -5%;
transform: rotate(20deg);
}

.im-sheep .body {
display: inline-block;
width: 7em;
height: 7em;
border-radius: 100%;
background: #0054D1;
position: relative;
vertical-align: middle;
margin-right: -3em;
}

.im-sheep .im-legs {
display: inline-block;
position: absolute;
top: 80%;
left: 10%;
z-index: -1;
}

.im-sheep .im-legs .im-leg {
display: inline-block;
background: #141214;
width: 0.5em;
height: 2.5em;
margin: 0.2em;
}

.im-sheep::before {
left: 0;
content: '';
display: inline-block;
position: absolute;
top: 112%;
width: 100%;
height: 18%;
border-radius: 100%;
background: rgba(0, 0, 0, 0.2);
}
</style>
<div class="error-content mt-md-5 pt-3">
<div class="container">
<div class="row justify-content-center">
<div class="col-sm-10 ">
<div class="error-text">
<h2 class="error error-404 w-100">204 No Content</h2>
<div class="im-sheep">
<div class="top">
<div class="body"></div>
<div class="head">
<div class="im-eye one"></div>
<div class="im-eye two"></div>
<div class="im-ear one"></div>
<div class="im-ear two"></div>
</div>
</div>
<div class="im-legs">
<div class="im-leg"></div>
<div class="im-leg"></div>
<div class="im-leg"></div>
<div class="im-leg"></div>
</div>
</div>
<footer class="card-footer">
<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
</footer>
</article>
<!-- <div class="card border-0 shadow rounded-3 overflow-hidden mb-4">-->
<!-- <div class="card-body p-0 link-hover-blue">-->
<!-- <a class="text-decoration-none link-dark stretched-link h2 fw-bolder" href="{{ site.srcurl }}{{ post.url }}">-->
<!-- <h3 class="card-title mb-3">{{ post.title }}</h3>-->
<!-- </a>-->
<!-- <div class="row gx-0">-->
<!-- <div class="col-lg-6 col-xl-5 py-lg-5">-->
<!-- <div class="p-4 p-md-5">-->
<!-- {% for tag in post.tags limit:3 %}-->
<!-- <div class="badge bg-primary bg-gradient rounded-pill mb-2">#{{ tag }} &nbsp</div>-->
<!-- {% endfor %}-->
<!-- <a class="text-decoration-none link-dark stretched-link h2 fw-bolder" href="{{ site.srcurl }}{{ post.url }}">-->
<!-- <h3 class="card-title mb-3">{{ post.title }}</h3>-->
<!-- </a>-->
<!-- <p> {{ post.introduction | strip_html | strip_newlines | truncate: 150 }}</p>-->
<!-- <a class="stretched-link text-decoration-none" href="{{ site.srcurl }}{{ post.url }}">-->
<!-- Ler mais-->
<!-- <i class="bi bi-arrow-right"></i>-->
<!-- </a>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="col-lg-6 col-xl-7">-->
<!-- <div class="bg-featured-blog" style="background-image: url('{{ site.srcurl }}{{ site.image_path }}{{ post.image }}')"></div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
{% endfor %}
</div>
<div class="col-md-3 pt-5">
{% include aside.html %}
<h4>Oops! Este blog está em construção, volte em breve :)</h4>
<p>O blog está sendo cuidadosamente construído por mim, um back-end esforçado no front, então pode
levar um tempinho kk.</p>
<a href="https://douglasmedeiros.dev" class="btn btn-primary">Site principal</a>
</div>
</div>
</div>
</div>
<nav aria-label="Page navigation" class="py-5">
<ul class="pagination justify-content-center">
{% if paginator.previous_page %}
<li class="page-item">
<a class="page-link" href="{{ site.srcurl }}{{ paginator.previous_page_path }}" tabindex="-1"
aria-disabled="true">Anterior</a>
</li>
{% else %}
<li class="page-item disabled">
<a class="page-link" href="#" tabindex="-1" aria-disabled="true">Anterior</a>
</li>
{% endif %}
{% for page in (1..paginator.total_pages) %}
{% if page == paginator.page %}
<li class="page-item active">
<a class="page-link"
href="{{ site.srcurl }}{{ site.paginate_path | relative_url | replace: ':num', page }}">
{{ page }}
</a>
</li>
{% elsif page == 1 %}
<li class="page-item">
<a class="page-link" href="{{site.srcurl}}/blog">1</a>
</li>
{% else %}
<li class="page-item">
<a class="page-link"
href="{{ site.srcurl }}{{ site.paginate_path | relative_url | replace: ':num', page }}">
{{ page }}
</a>
</li>
{% endif %}
{% endfor %}
{% if paginator.next_page %}
<li class="page-item">
<a class="page-link" href="{{ site.srcurl }}{{ paginator.next_page_path }}">Proxima</a>
</li>
{% else %}
<li class="page-item disabled">
<a class="page-link" href="#" tabindex="-1" aria-disabled="true">Proxima</a>
</li>
{% endif %}
</ul>
</nav>
</div>
Loading

0 comments on commit 4fd7dff

Please sign in to comment.