Переглянути джерело

style(ArchivesView): 调整归档视图的样式布局

移除网格容器的flex居中属性,调整卡片的内边距和间距
修改悬停状态的字体加粗效果,优化整体视觉一致性
Sakulin 2 місяців тому
батько
коміт
0dfefbfb37
1 змінених файлів з 4 додано та 7 видалено
  1. 4 7
      src/views/ArchivesView.vue

+ 4 - 7
src/views/ArchivesView.vue

@@ -54,9 +54,6 @@ const handleTagClick = (tag: Tag) => {
 
 .archive-items-grid {
   width: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
 }
 
 .archive-item-wrapper {
@@ -75,14 +72,13 @@ const handleTagClick = (tag: Tag) => {
   gap: 24px;
   background-color: var(--secondary-background-color);
   color: var(--text-color);
-  font-weight: bold;
-  font-size: large;
+  font-size: larger;
   fill: var(--text-color);
   padding: 20px 0;
-  width: calc(100% - 40px);
+  width: calc(100% - 20px);
   border-radius: 12px;
   align-items: center;
-  margin: 10px 0;
+  margin: 20px 10px;
   cursor: pointer;
   transition: all .3s;
 }
@@ -92,6 +88,7 @@ const handleTagClick = (tag: Tag) => {
   background-color: var(--text-color);
   color: var(--secondary-background-color);
   fill: var(--secondary-background-color);
+  font-weight: bold;
 }
 
 </style>