Skip to content

Commit

Permalink
MAINT: upgrade to webpack5 (#265)
Browse files Browse the repository at this point in the history
* maint: upgrade to webpack5

* feat: enable source maps

* chore: don't need sourceMap (devtool sets this)
  • Loading branch information
agoose77 authored Oct 25, 2024
1 parent aeebe8d commit 3d0b162
Show file tree
Hide file tree
Showing 8 changed files with 4,286 additions and 18,637 deletions.
22,752 changes: 4,202 additions & 18,550 deletions package-lock.json

Large diffs are not rendered by default.

25 changes: 10 additions & 15 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,20 +5,15 @@
"build": "webpack"
},
"devDependencies": {
"css-loader": "^3.4.2",
"dedent": "^0.7.0",
"extract-loader": "^4.0.3",
"file-loader": "^5.0.2",
"html-webpack-plugin": "^4.3.0",
"node-sass": "^6.0.1",
"optimize-css-assets-webpack-plugin": "^5.0.3",
"sass-loader": "^10.1.1",
"style-loader": "^1.1.3",
"webpack": "^4.41.6",
"webpack-cli": "^3.3.11",
"webpack-dev-server": "^3.10.3"
},
"dependencies": {
"optimize-css-assets-webpack-plugin": "^5.0.3"
"css-loader": "^6.8.1",
"css-minimizer-webpack-plugin": "^4.2.2",
"dedent": "^0.7.0",
"html-webpack-plugin": "^5.0.0",
"mini-css-extract-plugin": "^2.7.5",
"sass": "^1.59.3",
"sass-loader": "^10.3.1",
"webpack": "^5.0.0",
"webpack-cli": "^5.0.0",
"webpack-dev-server": "^5.0.0"
}
}
4 changes: 4 additions & 0 deletions src/quantecon_book_theme/assets/styles/_breakpoints.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
$xl: 1200px;
$lg: 992px;
$md: 768px;
$sm: 576px;
4 changes: 4 additions & 0 deletions src/quantecon_book_theme/assets/styles/_colors.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
$primary: #0072bc;
$secondary: #d8655e;
$body: #444444;
$body-light: #888888;
16 changes: 9 additions & 7 deletions src/quantecon_book_theme/assets/styles/_margin.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
@use "breakpoints";

/**
* Margin content
* This is the area to the right of the main content
Expand Down Expand Up @@ -32,7 +34,7 @@ $margin-offset: -$margin-width-relative-to-content;
margin-left: 0.5rem;

// Wide screens and printing should force margin behavior
@media (min-width: $breakpoint-xl), print {
@media (min-width: breakpoints.$xl), print {
width: $margin-width-width-gutter;
margin: 0 $margin-offset 0 0;

Expand Down Expand Up @@ -69,7 +71,7 @@ label.margin-toggle {
sup {
user-select: none;
}
@media (max-width: $breakpoint-xl) {
@media (max-width: breakpoints.$xl) {
cursor: pointer;
color: rgb(0, 113, 188);
&.marginnote-label {
Expand All @@ -83,7 +85,7 @@ label.margin-toggle {

input.margin-toggle {
display: none;
@media (max-width: $breakpoint-xl) {
@media (max-width: breakpoints.$xl) {
&:checked + .sidenote,
&:checked + .marginnote {
display: block;
Expand All @@ -102,12 +104,12 @@ input.margin-toggle {
span.marginnote {
z-index: 2;
position: relative;
border-left: none;
sup {
user-select: none;
}
@include margin-content();
border-left: none;
@media (max-width: $breakpoint-xl) {
@media (max-width: breakpoints.$xl) {
display: none;
}
}
Expand Down Expand Up @@ -150,7 +152,7 @@ input.margin-toggle {
}
}

@media (min-width: $breakpoint-xl) {
@media (min-width: breakpoints.$xl) {
// No border for margin sidebars on wide screen
border: none;

Expand Down Expand Up @@ -205,7 +207,7 @@ input.margin-toggle {
div.full-width {
z-index: 2;
position: relative;
@media (min-width: $breakpoint-xl) {
@media (min-width: breakpoints.$xl) {
max-width: $content-fullwidth-width;
width: $content-fullwidth-width;
}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
@use "colors";

body {
div.cell div.cell_input {
border-left-color: $color-primary;
border-left-color: colors.$primary;
}
}

Expand Down
79 changes: 37 additions & 42 deletions src/quantecon_book_theme/assets/styles/index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -4,24 +4,17 @@ IMPORTS
-----------------------------------
*/

@import url("https://fonts.googleapis.com/css2?family=PT+Serif:ital,wght@0,700;1,400&family=Source+Sans+Pro:ital,wght@0,400;0,700;1,400;1,700&display=swap");

$breakpoint-xl: 1200px;
$breakpoint-lg: 992px;
$breakpoint-md: 768px;
$breakpoint-sm: 576px;
@use "colors";
@use "breakpoints";

$color-primary: #0072bc;
$color-secondary: #d8655e;
$color-body: #444444;
$color-body-light: #888888;
@forward "normalize";
@forward "html5boilerplate";
@forward "quantecon-defaults";
@forward "syntax";
@forward "tippy-themes";
@forward "margin";

@import "normalize";
@import "html5boilerplate";
@import "quantecon-defaults";
@import "syntax";
@import "tippy-themes";
@import "margin";
@import url("https://fonts.googleapis.com/css2?family=PT+Serif:ital,wght@0,700;1,400&family=Source+Sans+Pro:ital,wght@0,400;0,700;1,400;1,700&display=swap");

* {
-webkit-font-smoothing: antialiased;
Expand All @@ -41,7 +34,7 @@ html {
font-size: 0.9rem;
}

@media (min-width: $breakpoint-md) {
@media (min-width: breakpoints.$md) {
font-size: 16px;

&.font-plus {
Expand All @@ -53,7 +46,7 @@ html {
}
}

@media (min-width: $breakpoint-lg) {
@media (min-width: breakpoints.$lg) {
font-size: 18px;

&.font-plus {
Expand All @@ -65,7 +58,7 @@ html {
}
}

@media (min-width: $breakpoint-xl) {
@media (min-width: breakpoints.$xl) {
font-size: 18px;

&.font-plus {
Expand Down Expand Up @@ -473,7 +466,7 @@ tt {
}

a {
color: $color-body;
color: colors.$body;
}
path {
fill: inherit;
Expand Down Expand Up @@ -553,7 +546,7 @@ tt {
transform: none;

input {
border-color: $color-body;
border-color: colors.$body;
}
}
}
Expand All @@ -580,7 +573,7 @@ tt {
height: 20px;
}

@media (max-width: $breakpoint-sm) {
@media (max-width: breakpoints.$sm) {
&.btn__plus,
&.btn__minus,
&.btn__fullscreen,
Expand All @@ -597,21 +590,21 @@ tt {
max-width: 800px;
position: relative;
flex-grow: 1;
@media (max-width: $breakpoint-md) {
@media (max-width: breakpoints.$md) {
max-width: 100%;
}
&__toc {
@media (max-width: 1350px) {
display: none;
}

position: absolute;
right: calc(-200px - 3rem);
top: 0;
margin: 0;
height: 100%;
width: 200px;

@media (max-width: 1350px) {
display: none;
}

.inner {
height: 100%;
}
Expand All @@ -638,11 +631,11 @@ tt {
padding: 0;

a {
color: $color-body;
color: colors.$body;
opacity: 0.8;

&.active {
color: $color-primary;
color: colors.$primary;
opacity: 1;
}
}
Expand All @@ -666,12 +659,12 @@ tt {
font-size: 0.9rem;

a {
color: $color-body;
color: colors.$body;
opacity: 0.8;
text-decoration: none;

&:hover {
color: $color-primary;
color: colors.$primary;
opacity: 1;
}
}
Expand All @@ -691,15 +684,15 @@ tt {
display: none;
}

border-bottom: 5px solid $color-primary;
border-bottom: 5px solid colors.$primary;
margin: 0 0 4rem 0;
padding: 0 0 1rem 0;

&-copy {
display: flex;
//justify-content: space-between;

@media (max-width: $breakpoint-md) {
@media (max-width: breakpoints.$md) {
flex-direction: column-reverse;
}
}
Expand All @@ -710,10 +703,10 @@ tt {
flex-shrink: 0;

a {
color: $color-body;
color: colors.$body;
}

@media (max-width: $breakpoint-md) {
@media (max-width: breakpoints.$md) {
font-weight: 400;
font-size: 0.9rem;
}
Expand All @@ -722,7 +715,7 @@ tt {
&-subheading {
margin: 0;

@media (max-width: $breakpoint-md) {
@media (max-width: breakpoints.$md) {
margin: 0 0 0.5rem 0;
font-weight: 700;
}
Expand All @@ -732,7 +725,7 @@ tt {
margin: 0.25rem 0 0 0;
font-size: 0.9rem;

@media (max-width: $breakpoint-md) {
@media (max-width: breakpoints.$md) {
font-size: 0.8rem;
}
}
Expand Down Expand Up @@ -837,11 +830,11 @@ tt {
margin: 0.25rem 0;
padding: 0;
a {
color: $color-body;
color: colors.$body;
opacity: 0.8;

&.active {
color: $color-primary;
color: colors.$primary;
opacity: 1;
}
}
Expand Down Expand Up @@ -1199,7 +1192,9 @@ div.admonition,
margin: 1.5rem auto;
padding: 0 1rem 0.5rem 1rem;
page-break-inside: avoid;
box-shadow: 0 0.2rem 0.5rem rgba(0, 0, 0, 0.1), 0 0 0.05rem rgba(0, 0, 0, 0.1);
box-shadow:
0 0.2rem 0.5rem rgba(0, 0, 0, 0.1),
0 0 0.05rem rgba(0, 0, 0, 0.1);
> .admonition-title {
position: relative;
margin: 0 -1rem;
Expand Down Expand Up @@ -1337,13 +1332,13 @@ blockquote {
display: block;
text-decoration: none;
font-weight: normal;
background: $color-primary;
background: colors.$primary;
color: #fff;
padding: 0.25rem 0.5rem;
border-radius: 2px;
text-align: center;
&:hover {
background: $color-body;
background: colors.$body;
}
}
}
Expand Down
Loading

1 comment on commit 3d0b162

@github-actions
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.