Jelajahi Sumber

样式调整

yangchaojie 1 hari lalu
induk
melakukan
c0f487ee02
2 mengubah file dengan 62 tambahan dan 6 penghapusan
  1. 4 2
      templates/_common/base.html
  2. 58 4
      templates/blog.html

+ 4 - 2
templates/_common/base.html

@@ -203,6 +203,8 @@
             height: 100px;
         }
 
+        
+
         {% block css %}
 
         {% endblock %}
@@ -287,8 +289,8 @@
 <footer style="margin-top: 50px" class="ui secondary segment">
     <div class="ui two column stackable grid">
         <div class="ten wide column">
-            <img style="width: 8rem" src="{% static '/img.png' %}">
-            <p> © 2023 - 2023 cybersicko.net - All Rights Reserved.</p>
+            <span style="font-size: 1.6rem">CyberSicko.net</span>
+            <p> © 2023 - 2025 cybersicko.net - All Rights Reserved. </p>
         </div>
         <div class="six wide column">
             <div class="ui left aligned container" style="margin-top:10px">

+ 58 - 4
templates/blog.html

@@ -228,6 +228,55 @@
             font-weight: 300;
         }
 
+                /* 让编辑器生成的表格始终填满可用宽度 */
+        #article table {
+          /* 覆盖 inline style */
+          width: 100% !important;
+          max-width: 100% !important;
+          margin: 1rem 0;             /* 上下留白,左右不需要居中 */
+          border-collapse: collapse;
+        }
+
+        /* 去掉默认 cell 间距 */
+        #article table {
+            border-spacing: 0;
+        }
+
+        /* 头部和单元格:更小的内边距和字体 */
+        #article table th,
+        #article table td {
+            padding: 0.4em 0.5em; /* 紧缩内填充 */
+            font-size: 0.88rem; /* 略微小一点的文字 */
+            line-height: 1.3; /* 行高也缩小 */
+            border: 1px solid #ddd; /* 细线框 */
+            text-align: left;
+            vertical-align: middle;
+        }
+
+        /* 表头背景:灰黑主题色 */
+        #article table th {
+            background-color: #f5f2f0;
+            font-weight: 600;
+        }
+
+        /* 斑马条纹 */
+        #article table tr:nth-child(even) td {
+            background-color: #f7f7f7;
+        }
+
+        /* 悬停高亮 */
+        #article table tr:hover td {
+            background-color: #ececec;
+        }
+
+        /* 更紧凑的响应式调整 */
+        @media (max-width: 600px) {
+            #article table th,
+            #article table td {
+                padding: 0.25em 0.4em;
+                font-size: 0.8rem;
+            }
+        }
 
         .pre {
             background-color: antiquewhite;
@@ -301,16 +350,20 @@
                     <div class="content">
                         <a class="author">{{ article.user__first_name }}{{ article.user__last_name }}</a>
                         <div class="metadata">
-                            <div class="date">发布于: {{ article.created_time|days_until }}</div>
+                            <div class="date">发布于: {{ article.created_time|days_until }}</div> {% if is_login %}
+                <a style="font-style: italic; color: #0d6678" target="_blank"  href="/management/article/to_edit/{{ article.id }}">编辑</a>
+            {% endif %}
                         </div>
                         <div class="text">hava a nice day.</div>
                     </div>
                 </div>
             </div>
 
-            {% autoescape off %}
-                {{ article.html_text }}
-            {% endautoescape %}
+            <div id="article">
+                {% autoescape off %}
+                    {{ article.html_text }}
+                {% endautoescape %}
+            </div>
             <h3 class="ui dividing header" style="margin-top: 10vh">评论</h3>
             <div class="ui comments">
                 {% if comments|length <= 0 %}
@@ -427,6 +480,7 @@
                     <i class="search icon"></i>
                 </div>
             </div>
+
             <h4 class="ui header">归档</h4>
             <div class="ui list">
                 {% for record in records %}