This repository has been archived on 2024-02-21. You can view files and clone it. You cannot open issues or pull requests or push a commit.
Files
asgard__/mdc-theme/editor.html
2021-08-20 18:07:12 +09:00

203 lines
5.8 KiB
HTML

<!--
~ Project Asgard
~
~ Copyright (c) 2021. Elex. All Rights Reserved.
~ https://www.elex-project.com/
-->
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link
href="https://fonts.googleapis.com/css?family=Roboto:300,400,500"
rel="stylesheet"
/>
<link
href="https://fonts.googleapis.com/icon?family=Material+Icons"
rel="stylesheet"
/>
<link rel="stylesheet" href="./dist/bundle.css" />
<title>Hello</title>
<script src="./dist/bundle.js"></script>
<link
rel="stylesheet"
href="https://unpkg.com/easymde/dist/easymde.min.css"
/>
<script src="https://unpkg.com/easymde/dist/easymde.min.js"></script>
<link
rel="stylesheet"
href="https://unpkg.com/@highlightjs/cdn-assets@10.7.1/styles/default.min.css"
/>
<script src="https://unpkg.com/@highlightjs/cdn-assets@10.7.1/highlight.min.js"></script>
<script>
document.addEventListener("DOMContentLoaded", function () {
let mde = new EasyMDE({
element: document.querySelector("#editor"),
renderingConfig: {
codeSyntaxHighlighting: true,
},
});
});
</script>
</head>
<body>
<aside id="layout-drawer" class="mdc-drawer mdc-drawer--dismissible">
<div class="mdc-drawer__header">
<p>Hello</p>
</div>
<div class="mdc-drawer__content">
<nav class="mdc-list mdc-list--dense">
<a
class="mdc-list-item mdc-list-item--activated"
href="#"
aria-current="page"
>
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">Inbox</span>
</a>
<a class="mdc-list-item" href="#">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">Outgoing</span>
</a>
<a class="mdc-list-item" href="#">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">Drafts Drafts Drafts Drafts</span>
</a>
<a class="mdc-list-item mdc-list-item--depth-1" href="#">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">Drafts</span>
</a>
<a class="mdc-list-item mdc-list-item--depth-1" href="#">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">Drafts Drafts Drafts Drafts</span>
</a>
<a class="mdc-list-item" href="#">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">Drafts</span>
</a>
<a class="mdc-list-item mdc-list-item--depth-2" href="#">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">Drafts</span>
</a>
<a class="mdc-list-item" href="#">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">Drafts</span>
</a>
<a class="mdc-list-item" href="#">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">Drafts</span>
</a>
<a class="mdc-list-item" href="#">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text"
>Drafts Drafts Drafts Drafts Drafts Drafts Drafts</span
>
</a>
<a class="mdc-list-item" href="#">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">Drafts</span>
</a>
<a class="mdc-list-item" href="#">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">Drafts</span>
</a>
<a class="mdc-list-item" href="#">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">Drafts</span>
</a>
</nav>
</div>
</aside>
<div id="layout-content" class="mdc-drawer-app-content">
<header class="mdc-top-app-bar mdc-top-app-bar--fixed">
<div class="mdc-elevation-overlay"></div>
<div class="mdc-top-app-bar__row">
<section
class="
mdc-top-app-bar__section mdc-top-app-bar__section--align-start
"
>
<button
class="
material-icons
mdc-top-app-bar__navigation-icon
mdc-icon-button
"
aria-label="Open navigation menu"
>
menu
</button>
<span class="mdc-top-app-bar__title">Page title.</span>
</section>
<section
class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end"
role="toolbar"
>
<button
class="
material-icons
mdc-top-app-bar__action-item
mdc-icon-button
"
aria-label="Favorite"
>
favorite
</button>
<button
class="
material-icons
mdc-top-app-bar__action-item
mdc-icon-button
"
aria-label="Search"
>
search
</button>
<div class="mdc-menu-surface--anchor">
<button
id="btn-overflow"
class="
material-icons
mdc-top-app-bar__action-item
mdc-icon-button
"
aria-label="Options"
>
more_vert
</button>
<div class="mdc-menu mdc-menu-surface">
<ul
class="mdc-list"
role="menu"
aria-hidden="true"
aria-orientation="vertical"
tabindex="-1"
>
<li class="mdc-list-item" role="menuitem">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">A Menu Item</span>
</li>
<li class="mdc-list-item" role="menuitem">
<span class="mdc-list-item__ripple"></span>
<span class="mdc-list-item__text">Another Menu Item</span>
</li>
</ul>
</div>
</div>
</section>
</div>
</header>
<div id="layout-main" class="mdc-top-app-bar--fixed-adjust">
<textarea id="editor"></textarea>
<footer class="mdc-layout-grid">
<p>Copyright &copy; 2021</p>
</footer>
</div>
</div>
</body>
</html>