@import "../toastui-editor-overrides.scss";
@import "../colours";
+.title,
+.title-input {
+ font-size: 2.25rem;
+ font-weight: bold;
+ line-height: 1.4;
+}
+
.title {
min-width: 300px;
white-space: nowrap;
background-color: transparent;
color: var(--colour-text);
padding: 0;
- min-width:0;
+ min-width: 0;
&:focus {
outline: none;
}
}
-
-.note {
- background-color: var(--colour-background);
-}
</style>
<script>
import { Viewer } from "@toast-ui/vue-editor";
import api from "../api";
import codeSyntaxHighlight from "@toast-ui/editor-plugin-code-syntax-highlight/dist/toastui-editor-plugin-code-syntax-highlight-all.js";
-import { extendedAutolinks } from '../autolinkParsers';
+import { extendedAutolinks } from "../autolinkParsers";
const reservedFilenameCharacters = /[<>:"/\\|?*]/;
@import "node_modules/bootstrap/scss/variables";
@import "node_modules/bootstrap/scss/mixins";
-// Google Font
-@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100&display=swap");
-
// Colours
@import "./colours";
body {
background-color: var(--colour-background);
color: var(--colour-text);
- font-family: "Inter", sans-serif;
+ font-family: "Open Sans", sans-serif;
}
a {
}
.modal-content {
- .modal-header, .modal-body, .modal-footer {
+ .modal-header,
+ .modal-body,
+ .modal-footer {
border: 0;
}
}
<!DOCTYPE html>
<html lang="en" class="h-100">
+ <head>
+ <meta charset="UTF-8" />
+ <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+ <meta
+ name="viewport"
+ content="width=device-width, initial-scale=1, shrink-to-fit=no"
+ />
-<head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+ <link
+ rel="apple-touch-icon"
+ sizes="180x180"
+ href="assets/apple-touch-icon.png"
+ />
+ <link
+ rel="icon"
+ type="image/png"
+ sizes="32x32"
+ href="assets/favicon-32x32.png"
+ />
+ <link
+ rel="icon"
+ type="image/png"
+ sizes="16x16"
+ href="assets/favicon-16x16.png"
+ />
+ <link rel="manifest" href="site.webmanifest" />
+ <link rel="mask-icon" href="assets/safari-pinned-tab.svg" color="#F8A66B" />
+ <link rel="shortcut icon" href="assets/favicon.ico" />
+ <meta name="msapplication-TileColor" content="#2b5797" />
+ <meta name="msapplication-config" content="assets/browserconfig.xml" />
+ <meta name="theme-color" content="#F8A66B" />
- <link rel="apple-touch-icon" sizes="180x180" href="assets/apple-touch-icon.png">
- <link rel="icon" type="image/png" sizes="32x32" href="assets/favicon-32x32.png">
- <link rel="icon" type="image/png" sizes="16x16" href="assets/favicon-16x16.png">
- <link rel="manifest" href="site.webmanifest">
- <link rel="mask-icon" href="assets/safari-pinned-tab.svg" color="#F8A66B">
- <link rel="shortcut icon" href="assets/favicon.ico">
- <meta name="msapplication-TileColor" content="#2b5797">
- <meta name="msapplication-config" content="assets/browserconfig.xml">
- <meta name="theme-color" content="#F8A66B">
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+ <link
+ href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400&display=swap"
+ rel="stylesheet"
+ />
- <title>flatnotes</title>
+ <title>flatnotes</title>
+ </head>
-</head>
-
-<body class="h-100 pt-3">
- <div id="app"></div>
- <script src="index.js"></script>
-</body>
-
-</html>
\ No newline at end of file
+ <body class="h-100 pt-3">
+ <div id="app"></div>
+ <script src="index.js"></script>
+ </body>
+</html>
@import "../colours";
-.ProseMirror {
- font-family: "Inter", sans-serif;
+// Disable checkboxes in view mode. See https://github.com/nhn/tui.editor/issues/1087.
+.note-viewer li.task-list-item {
+ pointer-events: none;
+ a {
+ pointer-events: auto;
+ }
}
+// Typography
+.ProseMirror,
.toastui-editor-contents {
- font-family: "Inter", sans-serif;
+ font-family: "Open Sans", sans-serif;
+ font-size: 1rem;
+}
+
+.toastui-editor-contents,
+.ProseMirror {
h1,
+ h1:first-of-type,
+ .toastui-editor-md-heading1,
h2,
+ .toastui-editor-md-heading2,
h3,
+ .toastui-editor-md-heading3,
h4,
+ .toastui-editor-md-heading4,
h5,
- h6 {
+ .toastui-editor-md-heading5,
+ h6,
+ .toastui-editor-md-heading6 {
+ font-weight: bold;
+ line-height: 1.6rem;
+ margin: 1em 0 0.5em 0;
+ padding: 0;
border-bottom: none;
}
+
+ h1,
+ .toastui-editor-md-heading1 {
+ font-size: 2.25rem;
+ }
+
+ h2,
+ .toastui-editor-md-heading2 {
+ font-size: 2rem;
+ }
+
+ h3,
+ .toastui-editor-md-heading3 {
+ font-size: 1.75rem;
+ }
+
+ h4,
+ .toastui-editor-md-heading4 {
+ font-size: 1.5rem;
+ }
+
+ h5,
+ .toastui-editor-md-heading5 {
+ font-size: 1.25rem;
+ }
+
+ h6,
+ .toastui-editor-md-heading6 {
+ font-size: 1rem;
+ }
+
+ p {
+ line-height: 1.6rem;
+ margin: 0 0 1rem 0;
+ }
}
+.ProseMirror,
.toastui-editor-defaultUI .ProseMirror {
padding: 1rem 0 0 0;
}
font-family: Consolas, "Lucida Console", Monaco, "Andale Mono", monospace;
}
-// Disable checkboxes in view mode. See https://github.com/nhn/tui.editor/issues/1087.
-.note-viewer li.task-list-item {
- pointer-events: none;
- a {
- pointer-events: auto;
- }
-}
-
// Colours
.toastui-editor-defaultUI {
border: none;