Incomplete redesign.
This commit is contained in:
parent
3f5d90b8ae
commit
25ea17f0f8
3 changed files with 36 additions and 26 deletions
|
|
@ -1,26 +1,28 @@
|
||||||
---
|
---
|
||||||
layout: "skeleton.njk"
|
layout: "skeleton.njk"
|
||||||
---
|
---
|
||||||
<div id="projectHeader">
|
<div>
|
||||||
{% if logo %}
|
<div id="projectHeader">
|
||||||
<img src="{{ page.dir }}{{ logo }}">
|
{% if logo %}
|
||||||
{% endif %}
|
<img src="{{ page.dir }}{{ logo }}">
|
||||||
<div id="projectTitleSubtitle">
|
{% endif %}
|
||||||
<div id="projectTitleAuthor">
|
<div id="projectTitleSubtitle">
|
||||||
<h1 id="projectTitle">{{ name }}</h1>
|
<div id="projectTitleAuthor">
|
||||||
<p id="projectAuthor">by <a href="/authors/{{ author }}">{{ author }}</a></p>
|
<h1 id="projectTitle">{{ name }}</h1>
|
||||||
|
<p id="projectAuthor">by <a href="/authors/{{ author }}">{{ author }}</a></p>
|
||||||
|
</div>
|
||||||
|
<p id="projectSubtitle">{{ subtitle }}</p>
|
||||||
</div>
|
</div>
|
||||||
<p id="projectSubtitle">{{ subtitle }}</p>
|
<a id="downloadLink" href="{{ downloadLink }}"><button id="downloadButton">{% if downloadLink %}Download{% else %}Unavailable{% endif %}</button></a>
|
||||||
</div>
|
</div>
|
||||||
<a id="downloadLink" href="{{ downloadLink }}"><button id="downloadButton">{% if downloadLink %}Download{% else %}Unavailable{% endif %}</button></a>
|
{% include "project_image.njk" %}
|
||||||
|
<main id="projectDescription">
|
||||||
|
{% if content %}
|
||||||
|
{{ content | safe }}
|
||||||
|
{% else %}
|
||||||
|
<h2>Oopsie! :<</h2>
|
||||||
|
<p>Seems like we don't have a description for this project.</p>
|
||||||
|
<p class="errorQuote"><i>"If only the clockworks could speak<br>I wouldn't be so alone"</i></p>
|
||||||
|
{% endif %}
|
||||||
|
</main>
|
||||||
</div>
|
</div>
|
||||||
{% include "project_image.njk" %}
|
|
||||||
<main id="projectDescription">
|
|
||||||
{% if content %}
|
|
||||||
{{ content | safe }}
|
|
||||||
{% else %}
|
|
||||||
<h2>Oopsie! :<</h2>
|
|
||||||
<p>Seems like we don't have a description for this project.</p>
|
|
||||||
<p class="errorQuote"><i>"If only the clockworks could speak<br>I wouldn't be so alone"</i></p>
|
|
||||||
{% endif %}
|
|
||||||
</main>
|
|
||||||
|
|
@ -8,7 +8,9 @@
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="everythingHelper">
|
<div id="everythingHelper">
|
||||||
{% include "header.njk" %}
|
<aside>
|
||||||
|
{% include "header.njk" %}
|
||||||
|
</aside>
|
||||||
{{ content | safe }}
|
{{ content | safe }}
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|
|
||||||
|
|
@ -25,6 +25,11 @@ header {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
aside {
|
||||||
|
width: fit-content;
|
||||||
|
min-width: 20vw;
|
||||||
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: var(--accent-color);
|
color: var(--accent-color);
|
||||||
|
|
@ -53,13 +58,10 @@ button:hover {
|
||||||
code {
|
code {
|
||||||
background-color: darkslategray;
|
background-color: darkslategray;
|
||||||
color: var(--accent-color);
|
color: var(--accent-color);
|
||||||
/* outline: 1px solid white; */
|
|
||||||
padding-left: .2em;
|
padding-left: .2em;
|
||||||
padding-right: .2em;
|
padding-right: .2em;
|
||||||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
/* margin-left: 2px;
|
|
||||||
margin-right: 2px; */
|
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -80,6 +82,7 @@ img {
|
||||||
#linksBox {
|
#linksBox {
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: black;
|
background-color: black;
|
||||||
outline: 2px solid gray;
|
outline: 2px solid gray;
|
||||||
|
|
@ -94,9 +97,11 @@ img {
|
||||||
}
|
}
|
||||||
|
|
||||||
#everythingHelper {
|
#everythingHelper {
|
||||||
max-width: 60%;
|
max-width: 80%;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
transform: .2s;
|
transform: .2s;
|
||||||
|
display: flex;
|
||||||
|
gap: 3em;
|
||||||
}
|
}
|
||||||
|
|
||||||
#headerLinks {
|
#headerLinks {
|
||||||
|
|
@ -107,6 +112,7 @@ img {
|
||||||
#title {
|
#title {
|
||||||
margin-top: auto;
|
margin-top: auto;
|
||||||
margin-bottom: auto;
|
margin-bottom: auto;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.searchItemImage {
|
.searchItemImage {
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue