- use Open Sans font locally

- npm updates
- uninstall normalize.css and three-cg-ts packages
This commit is contained in:
Arno Kaimbacher 2022-08-30 17:29:00 +02:00
parent c60220d08d
commit eb0721c681
4 changed files with 4593 additions and 3521 deletions

7769
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -4,14 +4,13 @@
"description": "3D geology viewer", "description": "3D geology viewer",
"main": "dist/main.js", "main": "dist/main.js",
"dependencies": { "dependencies": {
"@fortawesome/fontawesome-free": "^5.15.2", "@fontsource/open-sans": "^4.5.11",
"@types/three": "^0.129.1", "@fortawesome/fontawesome-free": "^6.1.2",
"@types/three": "^0.143.2",
"bulma": "^0.9.2", "bulma": "^0.9.2",
"lodash": "^4.17.21", "lodash": "^4.17.21",
"normalize.css": "^8.0.1",
"proj4": "^2.6.3", "proj4": "^2.6.3",
"three": "^0.129.0", "three": "^0.143.0"
"three-csg-ts": "^3.1.3"
}, },
"author": "Arno Kaimbacher", "author": "Arno Kaimbacher",
"license": "MIT", "license": "MIT",
@ -24,15 +23,15 @@
"@babel/preset-env": "^7.12.7", "@babel/preset-env": "^7.12.7",
"@babel/preset-typescript": "^7.13.0", "@babel/preset-typescript": "^7.13.0",
"babel-loader": "^8.2.1", "babel-loader": "^8.2.1",
"concurrently": "^6.0.0", "concurrently": "^7.3.0",
"css-loader": "^6.2.0", "css-loader": "^6.2.0",
"dotenv": "^10.0.0", "dotenv": "^16.0.1",
"file-loader": "^6.2.0", "file-loader": "^6.2.0",
"http-server": "^14.1.1",
"img-loader": "^4.0.0", "img-loader": "^4.0.0",
"mini-css-extract-plugin": "^2.0.0", "mini-css-extract-plugin": "^2.0.0",
"node-sass": "^6.0.0", "node-sass": "^7.0.1",
"resolve-url-loader": "^4.0.0", "sass-loader": "^13.0.2",
"sass-loader": "^12.1.0",
"style-loader": "^3.0.0", "style-loader": "^3.0.0",
"terser-webpack-plugin": "^5.0.3", "terser-webpack-plugin": "^5.0.3",
"url-loader": "^4.1.1", "url-loader": "^4.1.1",
@ -44,7 +43,9 @@
"babel": "babel --presets es2015 js/main.js -o build/main.bundle.js", "babel": "babel --presets es2015 js/main.js -o build/main.bundle.js",
"serve": "http-server", "serve": "http-server",
"prod": "rm -rf dist && webpack --progress --mode=production", "prod": "rm -rf dist && webpack --progress --mode=production",
"watch": "concurrently \"npm run serve\" \"npx webpack --progress --mode=development --watch\" " "prod_serve": "concurrently \"npm run serve\" \"npx webpack --progress --mode=production --watch\" ",
"dev_serve": "concurrently \"npm run serve\" \"npx webpack --progress --mode=development --watch\" ",
"dev": "rm -rf dist && npx webpack --progress --mode=development --watch"
}, },
"keywords": [ "keywords": [
"3D", "3D",

View File

@ -11,12 +11,20 @@
// $fa-font-path: "../../webfonts" !default; // $fa-font-path: "../../webfonts" !default;
$fa-font-path: "~@fortawesome/fontawesome-free/webfonts" !default; $fa-font-path: "~@fortawesome/fontawesome-free/webfonts" !default;
@import '~@fortawesome/fontawesome-free/scss/solid'; @import "~@fortawesome/fontawesome-free/scss/solid";
@import '~@fortawesome/fontawesome-free/scss/fontawesome'; @import "~@fortawesome/fontawesome-free/scss/fontawesome";
// Import a Google Font // Import a Google Font
@import url('https://fonts.googleapis.com/css?family=Nunito:400,700'); // @import url('https://fonts.googleapis.com/css?family=Nunito:400,700');
@import "@fontsource/open-sans/400.css"; // Weight 500.
// @font-face {
// font-family: "Open Sans";
// font-style: normal;
// font-weight: normal;
// src: url("open-sans-greek-400-normal.woff2") format("woff2"),
// url("open-sans-greek-400-normal.woff") format("woff");
// }
// 1. Import the initial variables // 1. Import the initial variables
@import "../../node_modules/bulma/sass/utilities/_all.sass"; @import "../../node_modules/bulma/sass/utilities/_all.sass";
@ -25,18 +33,18 @@ $fa-font-path: "~@fortawesome/fontawesome-free/webfonts" !default;
// Update the blue shade, used for links // Update the blue shade, used for links
$blue: #06bcef; $blue: #06bcef;
// Add pink and its invert // Add pink and its invert
$pink: #FA7C91; $pink: #fa7c91;
$pink-invert: #fff; $pink-invert: #fff;
$purple: #8A4D76; $purple: #8a4d76;
$brown: #757763; $brown: #757763;
$beige-light: #D0D1CD; $beige-light: #d0d1cd;
$beige-lighter: #EFF0EB; $beige-lighter: #eff0eb;
$mouse-grey: #6c6e6b; $mouse-grey: #6c6e6b;
$select-green: #03a678; $select-green: #03a678;
// Update Bulma's global variables // Update Bulma's global variables
// Update the sans-serif font family // Update the sans-serif font family
$family-sans-serif: "Nunito", sans-serif; $family-sans-serif: "Open Sans", sans-serif;
// 3. Set the derived variables // 3. Set the derived variables
$grey-dark: $brown; $grey-dark: $brown;
@ -49,7 +57,6 @@ $fullhd-enabled: false;
$tabs-link-active-border-bottom-color: $select-green; $tabs-link-active-border-bottom-color: $select-green;
$tabs-link-active-color: $select-green; $tabs-link-active-color: $select-green;
// Update some of Bulma's component variables // Update some of Bulma's component variables
// $body-background-color: $beige-lighter; // $body-background-color: $beige-lighter;
$control-border-width: 2px; $control-border-width: 2px;
@ -70,7 +77,8 @@ body {
width: 100%; width: 100%;
line-height: 1.6; line-height: 1.6;
font-weight: 400; font-weight: 400;
font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; // font-family: $family-sans-serif;
font-family: 'Open Sans', sans-serif;
color: #222; color: #222;
} }
@ -232,12 +240,11 @@ ul {
display: block; display: block;
} }
.red-label { .red-label {
color: #f00; color: #f00;
padding: 2px; padding: 2px;
text-shadow: -1px -1px #fff, 0 -1px #fff, 1px -1px #fff, -1px 0 #fff, 1px 0 #fff, -1px 1px #fff, 0 1px #fff, text-shadow: -1px -1px #fff, 0 -1px #fff, 1px -1px #fff, -1px 0 #fff,
1px 1px #fff; 1px 0 #fff, -1px 1px #fff, 0 1px #fff, 1px 1px #fff;
position: absolute; position: absolute;
pointer-events: none; pointer-events: none;
-moz-user-select: none; -moz-user-select: none;
@ -249,8 +256,8 @@ ul {
.green-label { .green-label {
color: #3ad29f; color: #3ad29f;
padding: 2px; padding: 2px;
text-shadow: -1px -1px #fff, 0 -1px #fff, 1px -1px #fff, -1px 0 #fff, 1px 0 #fff, -1px 1px #fff, 0 1px #fff, text-shadow: -1px -1px #fff, 0 -1px #fff, 1px -1px #fff, -1px 0 #fff,
1px 1px #fff; 1px 0 #fff, -1px 1px #fff, 0 1px #fff, 1px 1px #fff;
position: absolute; position: absolute;
pointer-events: none; pointer-events: none;
-moz-user-select: none; -moz-user-select: none;
@ -262,8 +269,8 @@ ul {
.grey-label { .grey-label {
color: #6b716f; color: #6b716f;
padding: 2px; padding: 2px;
text-shadow: -1px -1px #fff, 0 -1px #fff, 1px -1px #fff, -1px 0 #fff, 1px 0 #fff, -1px 1px #fff, 0 1px #fff, text-shadow: -1px -1px #fff, 0 -1px #fff, 1px -1px #fff, -1px 0 #fff,
1px 1px #fff; 1px 0 #fff, -1px 1px #fff, 0 1px #fff, 1px 1px #fff;
position: absolute; position: absolute;
pointer-events: none; pointer-events: none;
-moz-user-select: none; -moz-user-select: none;
@ -291,16 +298,17 @@ ul {
/* visibility: visible; */ /* visibility: visible; */
} }
.tab-content { .tab-content {
padding:1em; padding: 1em;
} }
.tab-pane section { .tab-pane section {
padding: 0; padding: 0;
} }
// 4. Import the rest of bulma, only what you need from Bulma // 4. Import the rest of bulma, only what you need from Bulma
// @import "../../node_modules/bulma/sass/utilities/_all.sass"; // @import "../../node_modules/bulma/sass/utilities/_all.sass";
@import "../../node_modules/bulma/sass/grid/_all.sass"; @import "../../node_modules/bulma/sass/grid/_all.sass";
@import "../../node_modules/bulma/sass/base/_all.sass"; // @import "../../node_modules/bulma/sass/base/_all.sass";
@import "../../node_modules/bulma/sass/base/minireset.sass";
@import "../../node_modules/bulma/sass/elements/box.sass"; @import "../../node_modules/bulma/sass/elements/box.sass";
@import "../../node_modules/bulma/sass/elements/button.sass"; @import "../../node_modules/bulma/sass/elements/button.sass";
@import "../../node_modules/bulma/sass/elements/container.sass"; @import "../../node_modules/bulma/sass/elements/container.sass";

View File

@ -35,14 +35,14 @@ module.exports = {
// }, // },
module: { module: {
rules: [ rules: [
// { // {
// test: /\.(svg|eot|ttf|woff|woff2)$/, // test: /\.(svg|eot|ttf|woff|woff2)$/,
// loader: 'url-loader', // loader: 'url-loader',
// // include: path.resolve(__dirname, '~@fontsource/open-sans/files/'),
// options: { // options: {
// limit: 10000, // limit: 10000,
// name: 'webfonts/[name].[ext]' // name: '[name].[ext]',
// outputPath: 'assets/fonts/',
// } // }
// }, // },