mirror of
https://github.com/grey-cat-1908/website.git
synced 2024-11-13 19:47:27 +03:00
layout update
This commit is contained in:
parent
37933e7db2
commit
ae5680d95c
3 changed files with 20 additions and 141 deletions
|
@ -1,12 +1,12 @@
|
||||||
{
|
{
|
||||||
"title": "Arbuz?",
|
"title": "Arbuz?",
|
||||||
"tags": {
|
"tags": {
|
||||||
"description": "The personal internet portal of Marakarka",
|
"description": "The personal internet portal of mrkrk",
|
||||||
"author": "Viktor K. (Marakarka)",
|
"author": "Viktor K. (mrkrk)",
|
||||||
"keywords": "Marakarka, Arbuz, Programming, Journal, Science, Blog, Experiments, Маракарка, Арбуз, Программирование, Журнал, Наука, Блог, Эксперименты"
|
"keywords": "Marakarka, Arbuz, Programming, Journal, Science, Blog, Experiments, mrkrk, Маракарка, Арбуз, Программирование, Журнал, Наука, Блог, Эксперименты"
|
||||||
},
|
},
|
||||||
"og": {
|
"og": {
|
||||||
"title": "Arbuz?",
|
"title": "Arbuz?",
|
||||||
"description": "The personal internet portal of Marakarka"
|
"description": "The personal internet portal of mrkrk"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,9 +1,9 @@
|
||||||
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@200;400;600&display=swap');
|
|
||||||
:root {
|
:root {
|
||||||
--font: 'Onest', sans-serif;
|
--font: 'Onest', sans-serif;
|
||||||
--bg-color: #15171f;
|
--bg-color: #15171f;
|
||||||
--font-color: #dadada;
|
--font-color: #dadada;
|
||||||
--font-size: 17px;
|
--nav-font-color: white;
|
||||||
|
--font-size: 1.2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
|
@ -26,13 +26,15 @@
|
||||||
|
|
||||||
|
|
||||||
body {
|
body {
|
||||||
padding: 0;
|
margin: 1rem auto;
|
||||||
margin: 0;
|
|
||||||
background-color: var(--bg-color);
|
background-color: var(--bg-color);
|
||||||
font-family: var(--font);
|
font-family: var(--font);
|
||||||
color: var(--font-color);
|
color: var(--font-color);
|
||||||
font-size: var(--font-size);
|
font-size: var(--font-size);
|
||||||
font-weight: 200;
|
font-weight: 200;
|
||||||
|
line-height: 1.8;
|
||||||
|
max-width: 64rem;
|
||||||
|
padding: 0 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
button, a {
|
button, a {
|
||||||
|
@ -45,10 +47,9 @@ button, a {
|
||||||
font-size: var(--font-size);
|
font-size: var(--font-size);
|
||||||
}
|
}
|
||||||
|
|
||||||
nav {
|
nav * {
|
||||||
/* ground-color: #0d0e13; */
|
margin-right: 1rem;
|
||||||
|
color: var(--nav-font-color);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
img {
|
img {
|
||||||
|
@ -59,58 +60,9 @@ img {
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav .container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
padding: 10px 20px;
|
|
||||||
border-bottom: 1px solid #9f9f9f;
|
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
|
||||||
max-width: 1300px;
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 0 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-avatar {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-avatar img {
|
|
||||||
width: 60px;
|
|
||||||
border-radius: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-name {
|
|
||||||
font-size: 20px;
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-toggle-button {
|
|
||||||
display: none;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-list {
|
|
||||||
list-style: none;
|
|
||||||
display: flex;
|
|
||||||
gap: 10px 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-button {
|
|
||||||
transition: .12s ease-in-out;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-button:hover {
|
|
||||||
color: #c7c7c7;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mc {
|
.mc {
|
||||||
margin-top: 50px;
|
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
|
text-align: justify;
|
||||||
}
|
}
|
||||||
/* РАЗМЕТКА */
|
/* РАЗМЕТКА */
|
||||||
.mc h1, .mc h2, .mc h3, .mc h4, .mc h5 {
|
.mc h1, .mc h2, .mc h3, .mc h4, .mc h5 {
|
||||||
|
@ -151,54 +103,10 @@ nav .container {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.mc table td, table th {
|
.mc table td, table th {
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
border-bottom: 1px solid #d6d6d6;
|
border-bottom: 1px solid #d6d6d6;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@media (max-width: 520px) {
|
|
||||||
.nav-toggle-button {
|
|
||||||
display: block;
|
|
||||||
font-size: 25px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-toggle {
|
|
||||||
max-height: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
transition: max-height .5s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-toggle.active {
|
|
||||||
max-height: 200px;
|
|
||||||
}
|
|
||||||
|
|
||||||
nav .container {
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
.nav-toggle .nav-list {
|
|
||||||
flex-direction: column;
|
|
||||||
padding: 0;
|
|
||||||
gap: 15px 0;
|
|
||||||
}
|
|
||||||
.nav-toggle {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.nav-main {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
img[alt=play_button_exp] { width: 120px; }
|
img[alt=play_button_exp] { width: 120px; }
|
||||||
|
|
|
@ -15,23 +15,6 @@
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/languages/go.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/languages/go.min.js"></script>
|
||||||
|
|
||||||
<!-- Yandex.Metrika counter -->
|
|
||||||
<script type="text/javascript" >
|
|
||||||
(function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
|
|
||||||
m[i].l=1*new Date();
|
|
||||||
for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }}
|
|
||||||
k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
|
|
||||||
(window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
|
|
||||||
|
|
||||||
ym(97207042, "init", {
|
|
||||||
clickmap:true,
|
|
||||||
trackLinks:true,
|
|
||||||
accurateTrackBounce:true
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<noscript><div><img src="https://mc.yandex.ru/watch/97207042" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
|
|
||||||
<!-- /Yandex.Metrika counter -->
|
|
||||||
|
|
||||||
<script src="/javascript/navbar.js" async=""></script>
|
<script src="/javascript/navbar.js" async=""></script>
|
||||||
<script>hljs.highlightAll();</script>
|
<script>hljs.highlightAll();</script>
|
||||||
|
|
||||||
|
@ -41,25 +24,13 @@
|
||||||
<body>
|
<body>
|
||||||
<div class="layout">
|
<div class="layout">
|
||||||
<main>
|
<main>
|
||||||
<nav class="">
|
<nav>
|
||||||
<div class="container">
|
<b>mrkrk</b>
|
||||||
<div class="nav-main">
|
<a href="/">Home</a>
|
||||||
<div class="nav-avatar">
|
<a href="/projects">Projects</a>
|
||||||
<div class="nav-name">Marakarka</div>
|
|
||||||
</div>
|
|
||||||
<button onclick="getNavbar()" class="nav-toggle-button"><i class="fa-solid fa-bars"></i></button>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="nav-toggle" id="nav-toggle">
|
|
||||||
<ul class="nav-list">
|
|
||||||
<li class="nav-item"><a href="/" class="nav-button">Home</a></li>
|
|
||||||
<li class="nav-item"><a href="/projects" class="nav-button">Projects</a></li>
|
|
||||||
<li class="nav-item"><a href="/blog" class="nav-button">Journal</a></li>
|
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</nav>
|
</nav>
|
||||||
<div class="container mc">
|
<div class="mc">
|
||||||
{{%CONTENT%}}
|
{{%CONTENT%}}
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
|
Loading…
Reference in a new issue