Skip to content
/ home Public
forked from supine0703/home

基于imsyy/home的个人主页,进行了优化和新增了一些功能

License

Notifications You must be signed in to change notification settings

Lizc521/home

 
 

Repository files navigation

个人主页

基于 imsyy/home v4.1.4 进行开发的个人主页。感谢imsyy大佬!
imsyy/home在移动端上适配不那么理想,我进行了优化并且添加了一些功能。
我的 fork 更接近imsyy大佬的原生版本,也可以去我 Pull request 的看看。

👀 跳转

🎉 我的更改

更新顺序为从下往上

添加公安备案

配置.env如果不需要则为空
net

独立出Made By视图

独立出Made By视图,在项目Fork或者基于项目开发中,可以记录当前项目的各个前身项目,也方便去到各个项目查看特性等。

  • 左下角集成made-by以及提示(闪烁三次后消失)
  • made-by有三种模式
    • 默认情况下显示Made By
    • 鼠标悬浮后显示当前的层次,作者,项目以及版本
    • 点击打开,点击其他地方关闭。显示完整的表格
  • 如果当前作者不是表格末尾作者,则自动添加作者信息作为当前项目信息
  • Made By表在加载页面时会打印在控制台
  • 可以通过madeByInfos.json文件配置信息
{
  "about": [
    {
      "author": "李宗霖",
      "home": "https://imlzl.cn",
      "homeName": "李宗霖的主页",
      "project": "home",
      "version": "1.1.3",
      "github": "https://github.com/supine0703/home",
      "logo": "\n _____   __   __  __ _     _____ _\n|_   _| /  \\ |  \\/  | |   |___  | |\n  | |  / /\\ \\| \\  / | |      / /| |\n  | | | |__| | |\\/| | |     / / | |\n _| |_|  __  | |  | | |___ / /__| |___\n|_____|_|  |_|_|  |_|_____|_____|_____|"
    }
  ]
}

Made By1 Made By2 Made By3 Made By4

解决小屏移动端显示问题

问题:当(移动端)屏幕较小时,会造成组件重叠、组件在屏幕外(显示不全)等问题。

  • 对小屏移动端(手机)显示做优化,特别是横屏
    • max-hight:720px则页面固定高度720px,并使用滚轮查看
    • max-width:390px则页面固定宽度390px,……
  • 对显示滚轮做优化,使组件在出现滚轮时不产生瞬间偏移,造成视觉割裂感
  • 因为做了小屏显示的优化,我认为不必将设置界面阈值设置为990px,我降低到了720px(让移动端也可以开启),并对其做了响应式

主页1 主页2 主页3

优化 Copyright

  • 如果左界>=右界则只显示右界 eg. Copyright (c) 2025-2024->Copyright (c) 2024
  • 优化了Footer的响应式布局

添加链接悬停效果

  • 鼠标悬停链接:蓝色+下划线

蓝色下划线链接

🐞其他问题

  • 修正anthor->author, ANTHOR->AUTHOR
  • 修正TimeCapsuleel-progress:percentage值的类型错误

About

基于imsyy/home的个人主页,进行了优化和新增了一些功能

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Vue 74.1%
  • JavaScript 19.1%
  • SCSS 4.6%
  • HTML 1.8%
  • Dockerfile 0.4%