still under construction

This commit is contained in:
2021-08-22 12:54:11 +09:00
parent 14af7dfe4e
commit f2a44efb88
38 changed files with 704 additions and 10646 deletions

View File

@@ -18,9 +18,9 @@
href="https://fonts.googleapis.com/icon?family=Material+Icons"
rel="stylesheet"
/>
<link rel="stylesheet" href="./dist/bundle.css" />
<link rel="stylesheet" href="./dist/app.css" />
<title>Hello</title>
<script src="./dist/bundle.js"></script>
<script src="./dist/app.js"></script>
<link
rel="stylesheet"

View File

@@ -18,9 +18,9 @@
href="https://fonts.googleapis.com/icon?family=Material+Icons"
rel="stylesheet"
/>
<link rel="stylesheet" href="./dist/bundle.css" />
<link rel="stylesheet" href="./dist/app.css" />
<title>Hello</title>
<script src="./dist/bundle.js"></script>
<script src="./dist/app.js"></script>
</head>
<body>
<aside id="layout-drawer" class="mdc-drawer mdc-drawer--dismissible">

View File

@@ -29,6 +29,6 @@
"scripts": {
"start": "webpack serve",
"build": "webpack",
"dist": "cp ./dist/*.css ./dist/*.js ../app/src/main/resources/static"
"dist": "cp ./dist/*.css ./dist/*.js ../app/src/main/resources/assets"
}
}

View File

@@ -51,12 +51,12 @@ main article {
pre {
font-size: 0.9rem;
line-height: 1.2;
word-wrap: normal;
//word-wrap: normal;
border-radius: 4px;
padding: 1rem;
//padding: 1rem;
text-overflow: ellipsis;
overflow-x: hidden;
white-space: nowrap;
//white-space: nowrap;
&.scrollable {
max-height: 280px;
@@ -160,7 +160,7 @@ main article {
pre > code {
padding: 0;
background: transparent;
white-space: pre;
white-space: normal;
word-break: normal;
}
img {

View File

@@ -1,73 +1,85 @@
import {MDCRipple} from '@material/ripple';
import {MDCDrawer} from "@material/drawer";
import {MDCTopAppBar} from "@material/top-app-bar";
import {MDCTextField} from '@material/textfield';
import {MDCList} from '@material/list';
import {MDCMenu} from '@material/menu';
import autoInit from '@material/auto-init';
import { MDCRipple } from "@material/ripple";
import { MDCDrawer } from "@material/drawer";
import { MDCTopAppBar } from "@material/top-app-bar";
import { MDCTextField } from "@material/textfield";
import { MDCList } from "@material/list";
import { MDCMenu } from "@material/menu";
import autoInit from "@material/auto-init";
const App = {
appBar:null,
drawer:null,
init: function(){
autoInit();
document.querySelectorAll('.mdc-list-item').forEach(function(item){
new MDCRipple(item);
});
document.querySelectorAll('.mdc-button').forEach(function(item){
new MDCRipple(item);
});
document.querySelectorAll('.mdc-list').forEach(function(item){
new MDCList(item);
});
document.querySelectorAll('.mdc-text-field').forEach(function(item){
new MDCTextField(item);
});
appBar: null,
drawer: null,
this.initDrawer();
init: function () {
autoInit();
document.querySelectorAll(".mdc-list-item").forEach(function (item) {
new MDCRipple(item);
});
document.querySelectorAll(".mdc-button").forEach(function (item) {
new MDCRipple(item);
});
document.querySelectorAll(".mdc-list").forEach(function (item) {
new MDCList(item);
});
document.querySelectorAll(".mdc-text-field").forEach(function (item) {
new MDCTextField(item);
});
this.appBar = MDCTopAppBar.attachTo(document.querySelector('#layout-content > header'));
this.appBar.setScrollTarget(document.querySelector('#layout-content > #layout-main'));
this.appBar.listen('MDCTopAppBar:nav', () => {
this.drawer.open = !this.drawer.open;
});
//document.querySelectorAll('.mdc-top-app-bar--fixed-adjust').forEach(function(item){
// item.style.marginTop = this.appBar.;
//});
this.initDrawer();
const menu = new MDCMenu(document.querySelector('.mdc-menu'));
document.querySelector('#btn-overflow').addEventListener('click', function(){
menu.open = true;
});
this.appBar = MDCTopAppBar.attachTo(
document.querySelector("#layout-content > header")
);
this.appBar.setScrollTarget(
document.querySelector("#layout-content > #layout-main")
);
this.appBar.listen("MDCTopAppBar:nav", () => {
this.drawer.open = !this.drawer.open;
});
//document.querySelectorAll('.mdc-top-app-bar--fixed-adjust').forEach(function(item){
// item.style.marginTop = this.appBar.;
//});
console.log('hello world.');
window.addEventListener('resize', this.initDrawer);
},
initDrawer: function(){
const drawerElement = document.querySelector('#layout-drawer');
if (document.body.offsetWidth>600){
drawerElement.classList.remove('mdc-drawer--modal');
drawerElement.classList.add('mdc-drawer--dismissible');
try {
document.removeChild(document.querySelector('mdc-drawer-scrim'));
} catch (ex){ }
const menu = new MDCMenu(document.querySelector(".mdc-menu"));
document
.querySelector("#btn-overflow")
.addEventListener("click", function () {
menu.open = true;
});
} else {
drawerElement.classList.add('mdc-drawer--modal');
drawerElement.classList.remove('mdc-drawer--dismissible');
const scrimElement = document.createElement('div');
scrimElement.classList.add('mdc-drawer-scrim');
drawerElement.parentNode.insertBefore(scrimElement, drawerElement.nextSibling);
}
//this.initEditor();
//this.initHighlightJs();
this.drawer = MDCDrawer.attachTo(document.querySelector('.mdc-drawer'));
if (document.body.offsetWidth>600) {
this.drawer.open = true;
}
}
console.log("hello world.");
window.addEventListener("resize", this.initDrawer);
},
initDrawer: function () {
const drawerElement = document.querySelector("#layout-drawer");
if (document.body.offsetWidth > 600) {
drawerElement.classList.remove("mdc-drawer--modal");
drawerElement.classList.add("mdc-drawer--dismissible");
try {
document.removeChild(document.querySelector("mdc-drawer-scrim"));
} catch (ex) {}
} else {
drawerElement.classList.add("mdc-drawer--modal");
drawerElement.classList.remove("mdc-drawer--dismissible");
const scrimElement = document.createElement("div");
scrimElement.classList.add("mdc-drawer-scrim");
drawerElement.parentNode.insertBefore(
scrimElement,
drawerElement.nextSibling
);
}
this.drawer = MDCDrawer.attachTo(document.querySelector(".mdc-drawer"));
if (document.body.offsetWidth > 600) {
this.drawer.open = true;
}
},
};
window.addEventListener('DOMContentLoaded', (event) => {
App.init();
});
window.addEventListener("DOMContentLoaded", (event) => {
App.init();
});

View File

@@ -38,11 +38,6 @@ module.exports = [
{
entry: {
app: ["./src/app.scss", "./src/app.js"],
//editor: [
// "./node_modules/easymde/src/css/easymde.css",
// "./node_modules/easymde/src/js/easymde.js",
//],
//hljs: ["./node_modules/highlight.js/lib/index.js"],
},
output: {
filename: "[name].js",