Update

src/components/data/timelineItem.astro

@@ -254,32 +254,12 @@ const itemColor = item.color || "#3B82F6";
                 <!-- 技能 -->
                 {item.skills && item.skills.length > 0 && (
                     <div class="mb-4">
-                        <div class="flex flex-wrap gap-1" data-skills-container>
-                            {item.skills.slice(0, 3).map((skill) => (
+                        <div class="flex flex-wrap gap-1">
+                            {item.skills.map((skill) => (
                                 <span class={`px-2 py-1 bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300 rounded-sm ${sizeClasses.badge}`}>
                                     {skill}
                                 </span>
                             ))}
-                            {item.skills.length > 3 && (
-                                <>
-                                    {item.skills.slice(3).map((skill) => (
-                                        <span 
-                                            class={`hidden px-2 py-1 bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300 rounded-sm ${sizeClasses.badge} skills-hidden`}
-                                            data-skill-hidden
-                                        >
-                                            {skill}
-                                        </span>
-                                    ))}
-                                    <button 
-                                        type="button"
-                                        class={`px-2 py-1 bg-gray-100 text-gray-700 dark:bg-gray-900/30 dark:text-gray-400 rounded-sm cursor-pointer hover:bg-gray-200 dark:hover:bg-gray-800 transition-colors ${sizeClasses.badge}`}
-                                        data-skills-toggle
-                                        data-hidden-count={item.skills.length - 3}
-                                    >
-                                        +{item.skills.length - 3}
-                                    </button>
-                                </>
-                            )}
                         </div>
                     </div>
                 )}

src/content/albums/награждение-всероссийской-акселерационной-программы-космос-для-жизни.json

@@ -32,4 +32,4 @@
   "title": "Награждение всероссийской акселерационной программы \"Космос для жизни\"",
   "cover": "/images/photo_2026-02-04_16-47-12.jpg",
   "date": "2025-12-09T16:00:00.000+04:00"
-}
+}

src/content/projects/сертификаты-первых-онлайн-курсов.json

@@ -1,7 +1,7 @@
 {
-  "sourceCode": "https://github.com/StepanovPlaton/Certificates",
+  "sourceCode": "",
   "featured": false,
-  "liveDemo": "",
+  "liveDemo": "/albums/сертификаты-первых-онлайн-курсов-2016-2020/",
   "startDate": "2016-11-07T08:00:00.000+04:00",
   "techStack": [],
   "status": "completed",
@@ -9,4 +9,4 @@
   "tags": [],
   "description": "Это архив сертификатов первых онлайн курсов, с которых я начинал свой путь",
   "category": "history"
-}
+}

src/content/timeline/самостоятельное-обучения-на-онлайн-курсах.json

@@ -16,9 +16,9 @@
     {
       "name": "Сертификаты",
       "type": "certificate",
-      "url": "https://github.com/StepanovPlaton/Certificates"
+      "url": "/albums/сертификаты-первых-онлайн-курсов-2016-2020/"
     }
   ],
   "type": "education",
   "description": "Я начинал своё обучение с онлайн курсов на Stepik, где изучал базовые языки программирования, а так же Git, базы данных и администрирование GNU/Linux"
-}
+}

src/pages/albums/[id]/index.astro

@@ -100,29 +100,54 @@ if (!album) {
     }
 
     .grid-layout[data-columns="2"] {
-        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+        grid-template-columns: repeat(2, 1fr);
     }
 
     .grid-layout[data-columns="3"] {
-        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+        grid-template-columns: repeat(3, 1fr);
     }
 
     .grid-layout[data-columns="4"] {
-        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+        grid-template-columns: repeat(4, 1fr);
+    }
+
+    @media (max-width: 768px) {
+        .grid-layout[data-columns="2"],
+        .grid-layout[data-columns="3"],
+        .grid-layout[data-columns="4"] {
+            grid-template-columns: repeat(1, 1fr);
+        }
+    }
+
+    @media (min-width: 769px) and (max-width: 1024px) {
+        .grid-layout[data-columns="3"],
+        .grid-layout[data-columns="4"] {
+            grid-template-columns: repeat(2, 1fr);
+        }
     }
 
     .masonry-layout {
-        columns: 2;
+        columns: 1;
         column-gap: 1rem;
     }
 
     @media (min-width: 768px) {
-        .masonry-layout {
+        .masonry-layout[data-columns="2"] {
+            columns: 2;
+        }
+        .masonry-layout[data-columns="3"],
+        .masonry-layout[data-columns="4"] {
             columns: 3;
         }
     }
 
     @media (min-width: 1280px) {
+        .masonry-layout[data-columns="2"] {
+            columns: 2;
+        }
+        .masonry-layout[data-columns="3"] {
+            columns: 3;
+        }
         .masonry-layout[data-columns="4"] {
             columns: 4;
         }
@@ -136,4 +161,5 @@ if (!album) {
     .grid-layout .photo-container {
         aspect-ratio: 1;
     }
+</style>
 </style>