From fd9b72d6d0d88ac6f2ea7d2054775b5840b43a8e Mon Sep 17 00:00:00 2001 From: DarkShyMW Date: Thu, 16 Jan 2025 21:09:16 +0300 Subject: [PATCH] Linux look like --- css/style.css | 147 ++++++++++++++++++++++++++++++++------------------ index.html | 29 ++++++---- 2 files changed, 115 insertions(+), 61 deletions(-) diff --git a/css/style.css b/css/style.css index 5feb6b5..d8d410a 100644 --- a/css/style.css +++ b/css/style.css @@ -1,51 +1,104 @@ -/* Основные настройки */ body { - background-color: #1e1e1e; - color: chartreuse; - font-family: 'Courier New', monospace; + background-color: #000; + color: #0f0; + font-family: "Courier New", Courier, monospace; margin: 0; padding: 0; } -/* Заголовки */ .header { text-align: center; - padding: 20px 0; + padding: 10px; } -.subtitle { - font-size: 1.2rem; - display: inline; +.terminal { + max-width: 800px; + margin: 20px auto; + border: 2px solid #0f0; + border-radius: 5px; + background-color: #111; + box-shadow: 0 0 10px rgba(0, 255, 0, 0.5); +} + +.terminal-header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 10px; + background-color: #222; + border-bottom: 2px solid #0f0; +} + +.circle { + display: inline-block; + width: 12px; + height: 12px; + border-radius: 50%; + margin-right: 5px; +} + +.red { + background-color: #ff4d4d; +} + +.yellow { + background-color: #ffcc00; +} + +.green { + background-color: #4dff4d; +} + +.terminal-title { + color: #0f0; + font-weight: bold; +} + +.terminal-body { + padding: 15px; + text-align: center; } #blink { - animation: blink 1.5s infinite; + animation: blink 1s step-start infinite; } -/* Обо мне */ -.about, .projects { - margin: 20px auto; +@keyframes blink { + 50% { + opacity: 0; + } +} + +h1.dark { + margin: 0; + padding: 0; +} + +main { max-width: 800px; - padding: 20px; - background-color: #282828; - border: 1px solid chartreuse; - border-radius: 10px; + margin: 20px auto; + padding: 10px; + background-color: #111; + border: 2px solid #0f0; + border-radius: 5px; +} + +section { + margin-bottom: 20px; } -/* Картинка */ .image-section { - display: flex; - justify-content: center; - margin: 20px auto; + text-align: center; } .centered-image { - max-width: 500px; - width: 100%; - border-radius: 10px; + max-width: 100%; + height: auto; + border: 2px solid #0f0; + border-radius: 5px; + box-shadow: 0 0 10px rgba(0, 255, 0, 0.5); } -/* Проекты */ .project-links { display: flex; flex-wrap: wrap; @@ -54,45 +107,35 @@ body { } .btn { + display: inline-block; padding: 10px 15px; - color: #1e1e1e; - background-color: chartreuse; + color: #0f0; text-decoration: none; - border-radius: 5px; - font-weight: bold; + border: 1px solid #0f0; + border-radius: 3px; + background-color: #222; transition: background-color 0.3s; } .btn:hover { - background-color: #8bda8b; + background-color: #0f0; + color: #000; } -/* Подвал */ footer { + max-width: 800px; + margin: 20px auto; text-align: center; - padding: 20px; - font-size: 0.9rem; - color: #d3d3d3; + padding: 10px; + background-color: #111; + border: 2px solid #0f0; + border-radius: 5px; } -footer a { - color: chartreuse; - text-decoration: none; +footer p { + margin: 5px 0; } -/* Анимация */ -@keyframes blink { - 50% { opacity: 0; } -} - -/* Адаптивность */ -@media (max-width: 768px) { - .about, .projects { - padding: 10px; - } - - .btn { - width: 100%; - text-align: center; - } +footer img { + margin-top: 10px; } diff --git a/index.html b/index.html index 13ff2b3..6b39e0f 100644 --- a/index.html +++ b/index.html @@ -12,10 +12,19 @@
-

darkshy@bronyfurry:~ DarkShy

-

Просто серая пегаска..|

+
+
+ + + + darkshy@bronyfurry:~ +
+
+

Просто серая пегаска..|

+
+
- +

Обо мне

@@ -38,13 +47,15 @@
- +