mod: стили и меню...

public/static/css/etpgrf.css

@@ -26,6 +26,9 @@
   --bs-link-color: #90caf9;
   --bs-link-hover-color: #bbdefb;
 
+  --bs-linkcolor: #14abda;
+  --bs-linkclolor-hover: #90caf9;
+
   --bs-border-color: #37474f;
   --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
 
@@ -38,11 +41,12 @@
 }
 
 /* Небольшие стили для красоты */
-html, body {
+html {
   height: 100%;
 }
 
 body {
+  min-height: 100%; /* Используем min-height вместо height */
   background-color: var(--bs-body-bg);
   display: flex;
   flex-direction: column;
@@ -76,6 +80,7 @@ body {
 }
 
 #main-navbar > #logo > .navbar-brand {
+  padding: 0; /* Убираем отступы у бренда */
   display: block; /* Блок, чтобы работали размеры */
   background: no-repeat left;
   background-size: contain;
@@ -96,6 +101,50 @@ body {
   opacity: 0;
 }
 
+/* --- Стили для ссылок в меню --- */
+.navbar {
+  /* position: fixed;  Убрал fixed, так как у нас sticky */
+  /* top: 0; */
+  /* width: 100%; */
+  /* background: var(--bs-navbar-bg); */
+  /* display: flex; */
+  /* justify-content: center; */
+  /* transition: all 0.8s; */
+}
+.nav-item {
+  color: var(--bs-body-bg);
+  padding: 10px 15px;
+  text-decoration: none;
+  position: relative;
+}
+
+/* Фикс для мобильной версии: ширина по контенту и прижатие вправо */
+@media (max-width: 991.98px) {
+    .nav-item {
+        width: fit-content;
+        margin-left: auto;
+    }
+}
+
+.nav-item:hover {
+  background-color: var(--bs-navbar-bg);
+  transition: background-color 0.8s;
+}
+.nav-item::after {
+  content: '';
+  position: absolute;
+  width: 100%;
+  height: 3px;
+  background: var(--bs-linkcolor);
+  bottom: 0;
+  left: 0;
+  transform: scaleX(0);
+  transition: transform 0.3s;
+}
+.nav-item:hover::after {
+  transform: scaleX(1);
+}
+
 /* Контент растягивается, чтобы прижать футер */
 #content-container {
   flex: 1 0 auto;
@@ -154,10 +203,8 @@ body {
   color: var(--bs-body-color);
   border: 1px solid var(--bs-border-color);
   border-radius: 0.375rem;
-  padding: 1rem;
   min-height: 300px;
-  padding-left: 1.5rem;
-  padding-right: 1.5rem;
+  padding: 1rem 1.5rem;
   white-space: pre-wrap;
   font-family: inherit;
 }
@@ -249,4 +296,45 @@ body {
 
 #cookie-accept:hover {
   background: rgba(var(--bs-primary-rgb), 0.1);
+}
+
+/* --- Стили для контента блога (Typography) --- */
+.post-page-content h1, .post-page-content h2, .post-page-content h3,
+.post-page-content h4, .post-page-content h5, .post-page-content h6 {
+  color: var(--bs-body-color);
+  opacity: 90%;
+  font-weight: 300;
+  padding-top: 1rem;
+  padding-bottom: 0.5rem;
+}
+
+
+.post-page-content p, .post-page-content li  {
+  margin-bottom: 0.5rem;
+  line-height: 1.6;
+  font-size: 1.1rem;
+}
+
+.post-page-content ul, .post-page-conten ol {
+    margin-bottom: 1.5rem;
+}
+
+.post-page-content  blockquote {
+    border-left: 4px solid var(--bs-primary);
+    padding-left: 1rem;
+    margin: 1.5rem 0;
+    font-style: italic;
+    /*color: var(--bs-secondary-color);*/
+}
+
+.post-page-content a {
+    color: var(--bs-linkcolor);
+    text-decoration: none;
+    border-bottom: 1px dotted var(--bs-linkcolor);
+}
+
+.post-page-content a:hover {
+  color: var(--bs-linkclolor-hover);
+  border-bottom: 1px solid var(--bs-linkclolor-hover);
+
 }