How can I get rid of the max width 1280 without using the wide class in Minimal Mistakes?

Question

I'm working on the Jekyll Theme Minimal Mistakes and trying various ways to expand the page. But I'm really trying to get rid of max-width: 1280 which appears when I inspect the page.

I've tried the wide class but I don't want to push the Toc (table of contents) up to the top of the page. In _variables.scss I found the x-large variable set to 1280 but it didn't make a difference when I changed it.

I understand that it is recommended adjusting _page.scss from

.page {
  width: calc(100% - #{$right-sidebar-width-narrow});
}

to

.page {
@include breakpoint($large){
  padding-right: 0;
}
@include breakpoint($x-large){
  padding-right: 0;
}
}

When I check the page using the inspection tool there is a piece that pops up showing max-width: 1280. When I uncheck it the page expands the way I want it to but I can't seem to figure out where in the code I can prevent from setting the width to 1280. Is there another calculation other than the one listed above that I should change?

Answer 1

You can try to add property to your main.scss file:

   $max-width:1440px;

Of course, you can specify any value. It will change your main content width and automatically adopt the sidebar and table of content to it.

Answer 2

I narrowed down the right margin using the below code in _variable.scss. Intersting, now I don't have huge margin on the right.

$right-sidebar-width-narrow: 100px !default;
$right-sidebar-width: 100px !default;
$right-sidebar-width-wide: 100px !default;