Adjust page width, CSS Code

[touro411]

Hello,

I want to adjust the page width on the main page. The solutions I've found online don't work.

I tried:

section.max-w-5xl { max-width: 100%; }

also

`.memo-editor-dialog .dialog-container {
width: 100%;
}

.memo-editor-dialog .dialog-container .w-[40rem] {
width: 100%;
}`

But this don't work for the main page, only for the admin page.

What is the correct CSS code for the main page? I have installed the latest version of memos.

Kind Regards

[Seevil]

<div class="min-w-0 mx-auto w-full max-w-2xl"> 的 max-w-2xl 修改为 max-w-full

[Seevil]

(＾Ｕ＾)ノ~ＹＯ 想到一个方法可以使用自定义脚本用js来修改div内的class增加个max-w-full完美解决

const callback = function(mutationsList, observer) {
    const targetDiv = document.querySelector('.min-w-0.mx-auto.w-full.max-w-2xl');
    if (targetDiv && !targetDiv.classList.contains('max-w-full')) {
        console.log('adding class...');
        targetDiv.classList.add('max-w-full');
        observer.disconnect(); 
    }
};
const observer = new MutationObserver(callback);
const config = { childList: true, subtree: true };
observer.observe(document.body, config);

[sdisaacson]

非常感谢你！我并非很擅长开发，自己无法完成这件事。这对我来说无比有帮助。

[Hoss83]

Add this to the Additional Style section in System Settings:

.min-w-0.mx-auto.w-full.max-w-2xl { max-width: 1200px !important; width: 100% !important; }

You can play around with the max-width values. I use an ultrawide monitor and have mine set to 1800px.