侧边栏壁纸

memos笔记系统美化

  • bokequ 转载分享 1个月前
  • 笔记 日记分享
  • 272阅读5评论0点赞
  • 界面美化

    1. 字体修改为霞鹜文楷
    2. 接入 bing 的每日壁纸,这样每天打开背景都不同
    3. 半透效果
    4. 一些无用选项的隐藏
    /* 修改字体 */
    body{font-family: "LXGW WenKai Screen", sans-serif !important;}
    /* 修改Memo字号 */
    .memo-wrapper .text-base { font-size: 0.95rem}
    /* 修改代码块字号 */
    .text-sm { font-size: 0.85rem; }
    /* 隐藏 通知 选项卡 */
    #header-inbox { display: none;}
    /* 隐藏 个人资料 选项卡 */
    #header-profile { display: none; }
    /* 隐藏 探索 选项卡 */
    /* #header-explore { display: none;} */
    /* 隐藏 about 选项卡 */
    #header-about { display: none; }
    /* 修改编辑器字体为等宽 */
    textarea { font-family: 'Courier New', Courier, monospace;}
    /* 隐藏via memos */
    body .flex.flex-row.justify-between.items-center > .text-gray-500.dark:text-gray-400 { display: none;}
    /* share memos width */
    .share-memo-dialog>.dialog-container { width: auto; }
    
    /* sidebar */
    .w-56 { width: 12rem;}
    /* comment */
    .pt-16 { padding-top: 2rem; }
    
    blockquote{
        border: 1px solid #246ad1 !important;
        border-left: 4px solid #246ad1 !important;
        position:relative;
     }
     .blockquote-center{ background: none; }
    
     /* #root>div:nth-child(1)  */
     body
     {
        background-image: url('https://bing.immmmm.com/img/bing?region=zh-CN&type=image');
        background-position: buttom;
        backdrop-filter: blur(10px);
        background-size: contain;
    }
    
    
    #root main,#root header,#root aside {
        background-color: rgba(244 244 245 / 60%) !important;
        background: content-box !important;
        border-radius: 5px !important;
    }
    
    #root main,#root header,#root aside>div:nth-child(2),#root aside>div:nth-child(3)
    {
        background-color: white;
        border-radius: 5px;
    }
    
    .px-2{
        background: content-box !important;
    }
    .border-r {
        border-right-width: 0px !important;
    }
    
    /* 移动端顶栏 */
    .sm\:pt-2 {
        background: unset !important;
        --tw-backdrop-blur: auto !important
    }
    /* 顶栏文字 */
    /* .text-gray-700{
        color: snow !important;
    }*/
    
    /* 设置滚动条的样式 */
    ::-webkit-scrollbar {
      width: 5px !important;
      height: 5px !important;
    }
    /* 滚动槽 */
    ::-webkit-scrollbar-track {
      background: #eee !important;
    }
    /* 滚动条滑块 */
    ::-webkit-scrollbar-thumb {
      border-radius: 5px !important;
      background-color: #ccc !important;
    }
    ::-webkit-scrollbar-thumb:hover {
      background-color: rgb(247, 149, 51) !important;
    }
    function changeFont() {
      const link = document.createElement("link");
      link.rel = "stylesheet";
      link.type = "text/css";
      link.href = "https://cdn.staticfile.org/lxgw-wenkai-screen-webfont/1.7.0/lxgwwenkaiscreen.css";
      document.head.append(link);
    };
    changeFont()
    0

    —— 评论区 ——

    昵称*
    邮箱*
    网址
    取消
    1. 头像
      大峰 游客
      Windows 10   Firefox
      回复

      我也弃用memos了。感觉不稳定。QQ

    2. 头像
      LiuShen 云云
      Windows 10   Google Chrome
      回复

      我已经逃离Memos哩QQ

      1. 头像
        bokequ 博主博主
        Android 13   OPPO浏览器
        回复
        @LiuShen

        😄感觉memos哪里用起来不爽呢?

        1. 头像
          LiuShen 云云
          Windows 10   Google Chrome
          回复
          @bokequ

          API超级不爽,因为我是静态站点,所以需要通过API在前端展示,但是Memos的API一变再变,所以就逃离了,现在用的是Moments,有点类似于之前你那个blog域名的微博,不过我现在看好像成WordPress了哈哈,为啥给换掉了

          1. 头像
            bokequ 博主博主
            Android 13   OPPO浏览器
            回复
            @LiuShen

            厉害,你是专业技术大神👍。
            moments我也搭建了一个,感觉又快又好看。blog原来用的是一个Lan独立朋友圈程序,全部文件加密的,现在换成了zblog程序。