编辑区域宽度设置

如果只调整预览页面的宽度，使其居中

/* ---------------编辑器内容两侧宽度设置 Start ————————————————————————*/
/* 已放弃调整即时编辑内容两侧宽度，只调整预览模式 */
/* 调整思源编辑器内容最大宽度 */
.protyle  .b3-typography * {
    /* 如果要调整编辑器宽度只需调整下面这个值 */
    max-width: 1000px;
}

/* 居中 */
.protyle  .b3-typography *{
    margin: 0px auto !important;
}
/* ---------------编辑器内容两侧宽度设置 END ———————————————————————— */

​

+1，我真的为了调整宽度，折腾了好久，改到怀疑人生。

改了内容，还要改标题，改了标题，发现旁边的标题块图标位置又不对，改完了之后，发现标题的块引用位置也不对。

终于全改完之后 心想终于完美了，可以享受了

然后晚上就出了文档图标。。。

按我改的方式（限制最大宽度，垂直居中）再也不能让文档图标全屏后还在标题正上方了，不过忍一忍也还好。

后来又发现分屏内容的宽度会太宽，无语，于是后面就只改了预览页面

如果有需要的话可以看看，其实后面我也发现编辑区域的宽度设置其实也还好，最大的问题是预览页面实在太宽

/* ---------------编辑器内容两侧宽度设置 Start ————————————————————————*/

/* 调整思源编辑器内容最大宽度 */
.protyle-content > .protyle-wysiwyg,
.protyle  .b3-typography *,
.protyle-content > .protyle-title,
.protyle-content > .protyle-title .protyle-title__input{
    /* 如果要调整编辑器宽度只需调整下面这个值 */
    max-width: 1000px;
}

/* 居中 */
.protyle-content > .protyle-wysiwyg,
.protyle  .b3-typography *{
    margin: 0px auto !important;
}

/* 调整两侧宽度 */
/* 要调整宽度，就搜索75px 把下面是75px的全部修改 */
.protyle-content > .protyle-wysiwyg {
    /* 思源的编辑器在宽度较小的时候会主动调小编辑器内容,晕😵 */
    /* 所以我就搞固定宽度了，不然不好调整 */
    padding: 16px 75px 162px !important;

}

.protyle-content > .protyle-title {
    margin: 16px auto 0px !important;
    /* 原来title就有margin 96px，上面为了水平居中就清除了，于是改为padding，
    保证标题和内容对齐
     */
    padding: 0px 75px 0px;
}
.protyle-background__icon {
    /* 文档图标 */
    left: 75px !important;
}
.protyle-title .protyle-title__icon  {
    /* 标题的块图标还在原来的位置，也要修改 */
    margin: -15px 0 0 75px;
}
.protyle-title .protyle-attr {
    /* 然后文档右边的引用数原来是right0，要改成前面设置的宽度 */
    right: 75px;
}

/* 调整手机和平板端 */
@media screen and (max-width: 1023px) {
    /* 这里我假设平板最大宽度为1023px，小于此大小的屏幕将调整
    页面两侧宽度 */
    .protyle-content > .protyle-wysiwyg {
        padding: 16px 16px 162px !important;

    }

    .protyle-content > .protyle-title {
        margin: 16px auto 0px !important;
        /* 原来title就有margin 96px，上面为了水平居中就清除了，于是改为padding，
        保证标题和内容对齐
        */
        padding: 0px 16px 0px;
    }
    .protyle-background__icon {
        /* 文档图标 */
        left: 16px !important;
    }
    .protyle-title .protyle-title__icon  {
        /* 标题的块图标还在原来的位置，也要修改 */
        margin: -15px 0 0 16px;
    }
    .protyle-title .protyle-attr {
        /* 然后文档右边的引用数原来是right0，要改成前面设置的宽度 */
        right: 16px;
    }
}

/* ---------------编辑器内容两侧宽度设置 END ———————————————————————— */
​

这个暂时不会调整了，之前是有宽度选项的，但是加了这个选项会导致其他问题，如果一定需要的话建议自定义 CSS。

我用楼上自定义 css 文件的方法直接修改自带 midnight 主题，每次重启程序编辑器宽度会自动恢复回去。但是第三方 dark+ 主题的 css 修改之后每次开启都是窄宽度的。这可能什么缘故呢？