個人博客網站的第一次修改

前言

今天講博客網站的部分功能修改了一下,在這裏記錄下來,說不定以後看起來還有點意義。

數據

首先是數據層的修復。

根據分類獲取到的文章列表並沒有按照事件降序排列的BUG,這個之前沒有注意,使用過程中才發現。

關於瀏覽量和評論數的字段我並沒有消除,即使現在不做,以後還是有可能會做的,先留着吧。

後臺

後臺的更新稍微多了些,解決的過程中也深受耦合代碼的荼毒,關於這方面還有很多知識要學。

首先是分類,之前的分類導致basic分類太爲寬泛,這次重做之後分成了CSS, JavaScript, Basic三個部分。當然也沒有這麼簡單,聯繫的前臺的代碼也需要做相應的修改,工作量還是有的。

因爲之前對日期並沒有太過在意,因爲有時候想要手動調一下日期,所以這次乾脆把日期做成可輸入的,同時又飽受日期降序排列需要加0的影響,也不可能簡單的toLocalString()就完事,這次就先和Life模塊一樣做成了全部輸入字符串的形式,以後再修改吧。

雖然後檯布局不重要,這次加了新的輸入字段後還是稍微更改了一下佈局,不然顯得太過臃腫了。

由於之前設置markdown編譯的時候會有一塊區域莫名突出導致了水平的滾動條出現,因此使用了:

body {
  overflow-x: hidden;
}

做隱藏,同時還給markdown做了80vw的寬度,其實後者已經沒有用了,也會導致使用antd的導航欄時一些樣式的不恰當,因此這次將這個屬性去除掉。

前臺

最後回到前臺, 因爲之前Nprogress寫過一篇文章,這裏就不單獨講了。

後臺和數據改起來都很簡單,前臺在這方面算是最麻煩的了,所有的效果都要最後由他來彙總顯示,一步一步來。

首先是文章列表的佈局,想來想去,還是覺得前者比後者好看:
在這裏插入圖片描述
在這裏插入圖片描述
所以到最後還是換回去了。

之前的導航欄問題也很大:
在這裏插入圖片描述
後來換成:
在這裏插入圖片描述
同時對於顏色也進行了一定的更新:
在這裏插入圖片描述
先這樣吧,下一次可能要有些設計概念來驅動修改了。

發佈了386 篇原創文章 · 獲贊 411 · 訪問量 3萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章