修复pjax问题

themes/Ying/layouts/partials/head.html

@@ -9,7 +9,109 @@
   <link rel="stylesheet" href="/css/remixicon.css">
   <link rel="stylesheet" href="/css/uikit.min.css">
   <link rel="stylesheet" href="/css/nprogress.min.css">
-  <link rel="stylesheet" href="/css/Artalk.css"/>
+  <link rel="stylesheet" href="/css/Artalk.css" />
+  <style>
+    @media only screen and (max-width: 768px) {
+
+      /* 针对宽度小于768px的设备(通常是平板和手机) */
+      .items {
+        grid-template-columns: repeat(1, 1fr) !important;
+        grid-gap: 10px;
+      }
+    }
+
+    /* 新版友链样式 */
+    .items {
+      /* padding: 10px; */
+      width: 100%;
+      height: 100%;
+      /* background-color: #f5f5f6; */
+      display: grid;
+      grid-template-columns: repeat(2, 1fr);
+      grid-gap: 10px;
+      /* 网格之间的间距 */
+      justify-content: space-between;
+    }
+
+    .item-box {
+      background-color: white;
+      border-radius: 5px;
+      padding: 8px;
+      /* width: 47%; */
+      height: 300px;
+      /* border: 1px solid #333; */
+      box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px;
+    }
+
+    .website-img {
+      margin: 0 auto;
+      width: 90%;
+    }
+
+    .website-img img {
+      width: 100%;
+      height: 150px;
+      object-fit: contain;
+    }
+
+    .website-go-button {
+      margin: 0 auto;
+      width: 95%;
+      border-radius: 5px;
+      font-size: 14px;
+      padding: 5px;
+      text-align: center;
+      background-color: black;
+      color: white;
+    }
+
+    .link-info {
+      padding: 8px;
+      width: 100%;
+      height: 90px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
+
+    .link-avatar {
+      width: 40%;
+      /* 设置弹性布局 */
+      display: flex;
+      /* justify-content: center; */
+      align-items: center;
+    }
+
+    .link-avatar img {
+      position: relative;
+      left: 5px;
+      width: 50px;
+      height: 50px;
+    }
+
+    .link-text-main {
+      width: 55%;
+      display: flex;
+      flex-direction: column;
+    }
+
+    .link-name {
+      position: relative;
+      right: 10px;
+      bottom: 5px;
+      width: 100%;
+      height: 50%;
+      font-weight: 600;
+    }
+
+    .link-des {
+      position: relative;
+      right: 10px;
+      top: 1px;
+      width: 100%;
+      height: 50%;
+    }
+  </style>
   <script src="/js/jquery.min.js"></script>
   <script src="/js/barrage.min.js"></script>
   <script src="/js/jquery.scrollUp.min.js"></script>