Compare commits
No commits in common. "main" and "feature/ace-editor" have entirely different histories.
main
...
feature/ac
@ -5,4 +5,4 @@ This is the code for [Markdown Live Preview](https://markdownlivepreview.com/).
|
||||
|
||||
|
||||
## License
|
||||
See the [LICENSE](https://github.com/tanabe/markdown-live-preview/blob/master/LICENSE) file in this repo.
|
||||
See the [LICENSE](https://github.com/tanabe/markdown-live-preview/blob/master/LICENSE) file in this repo.
|
@ -1 +1 @@
|
||||
Subproject commit afa572390de862d4bb1cf7ca0c0d4ecf2373ced9
|
||||
Subproject commit 1485dd78f5e744ef36e946e5ae44838e3906f9d8
|
6
local-server.sh
Executable file
6
local-server.sh
Executable file
@ -0,0 +1,6 @@
|
||||
#!/bin/bash
|
||||
|
||||
SCRIPT_DIR=$(cd $(dirname $0); pwd)
|
||||
pushd ./public
|
||||
python -m http.server 8000
|
||||
popd
|
File diff suppressed because it is too large
Load Diff
@ -8,12 +8,6 @@ html, body {
|
||||
font-size: 1em;
|
||||
line-height: 1.5em;
|
||||
background-color: #444;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
overscroll-behavior: none;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6, p {
|
||||
@ -40,13 +34,9 @@ img {
|
||||
}
|
||||
|
||||
#header {
|
||||
position: fixed;
|
||||
z-index: 1000;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: 10px 0 ;
|
||||
background-color: #444;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@ -56,70 +46,84 @@ img {
|
||||
}
|
||||
|
||||
#container {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
height: auto !important;
|
||||
height: 100%;
|
||||
width: 1100px;
|
||||
padding: 20px;
|
||||
margin: 0 auto;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
#editor-wrapper {
|
||||
border-right: 10px solid #eee;
|
||||
#container .section {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
#preview-wrapper {
|
||||
padding-left: 10px;
|
||||
#content .mode {
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 3px;
|
||||
width: 535px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.column {
|
||||
#content .mode .content {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
#preview {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
#leftColumn {
|
||||
float: left;
|
||||
width: 700px;
|
||||
}
|
||||
|
||||
#rightColumn {
|
||||
width: 240px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
textarea#markdown {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
white-space: nowrap;
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
vertical-align: top;
|
||||
overflow-y: scroll;
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
overflow: auto;
|
||||
font-size: 15px;
|
||||
border: none;
|
||||
/* border: 2px solid #D1D1BC;*/
|
||||
resize: vertical;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
#preview.column {
|
||||
white-space: normal;
|
||||
}
|
||||
#editor {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#footer {
|
||||
padding: 5px;
|
||||
z-index: 1001;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
clear: both;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
background-color: #444;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#footer #copyright {
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
#copyright img {
|
||||
width: 16px;
|
||||
display: block;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#footer #copyright a {
|
||||
display: block;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
font-size:0;
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
#footer #copyright a:hover {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
}
|
||||
text-decoration: underline;
|
||||
}
|
@ -1,19 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="content-language" content="en">
|
||||
<meta http-equiv="content-script-type" content="text/javascript">
|
||||
<meta http-equiv="content-style-type" content="text/css">
|
||||
<meta name="description" content="This is the online markdown editor with live preview.">
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="css/style.css">
|
||||
<link rel="stylesheet" type="text/css" href="css/github-markdown.css">
|
||||
<link rel="icon" type="image/png" href="favicon.png">
|
||||
|
||||
<script src="js/jquery-1.6.1.min.js"></script>
|
||||
<script src="js/jquery.autosize-min.js"></script>
|
||||
<script src="js/marked.min.js"></script>
|
||||
<script src="js/purify.min.js"></script>
|
||||
<script src="js/ace/ace.js"></script>
|
||||
<script src="js/main.js"></script>
|
||||
<script type="text/javascript" src="js/jquery-1.6.1.min.js"></script>
|
||||
<script type="text/javascript" src="js/jquery.autosize-min.js"></script>
|
||||
<script type="text/javascript" src="js/marked.min.js"></script>
|
||||
<script type="text/javascript" src="js/purify.min.js"></script>
|
||||
<script type="text/javascript" src="js/ace/ace.js"></script>
|
||||
<script type="text/javascript" src="js/main.js"></script>
|
||||
|
||||
<title>Markdown Live Preview</title>
|
||||
</head>
|
||||
@ -24,10 +27,12 @@
|
||||
</div>
|
||||
|
||||
<div id="container">
|
||||
<div id="content" class="section">
|
||||
|
||||
<div id="edit" class="column">
|
||||
<div id="editor-wrapper">
|
||||
<div id="editor"># Markdown syntax guide
|
||||
<div id="edit" class="mode">
|
||||
<div class="content">
|
||||
|
||||
<div id="editor"># Markdown syntax guide
|
||||
|
||||
## Headers
|
||||
|
||||
@ -51,16 +56,16 @@ _You **can** combine them_
|
||||
|
||||
* Item 1
|
||||
* Item 2
|
||||
* Item 2a
|
||||
* Item 2b
|
||||
* Item 2a
|
||||
* Item 2b
|
||||
|
||||
### Ordered
|
||||
|
||||
1. Item 1
|
||||
1. Item 2
|
||||
1. Item 3
|
||||
1. Item 3a
|
||||
1. Item 3b
|
||||
1. Item 3a
|
||||
1. Item 3b
|
||||
|
||||
## Images
|
||||
|
||||
@ -94,19 +99,32 @@ alert(message);
|
||||
## Inline code
|
||||
|
||||
This web site is using `markedjs/marked`.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- Do not insert new line here --><div id="preview" class="column">
|
||||
<div id="preview-wrapper">
|
||||
<div id="output" class="content markdown-body">
|
||||
</div>
|
||||
|
||||
<div id="preview" class="mode">
|
||||
<div id="output" class="content markdown-body">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="footer">
|
||||
<div id="copyright"><a href="https://git.a2s.su/iiiypuk/markdown-live-preview">
|
||||
<img src="image/GitHub-Mark-Light-32px.png" alt="GitHub Logo"></a>
|
||||
</div>
|
||||
<div id="copyright"><a href="https://github.com/tanabe/markdown-live-preview"><img src="image/GitHub-Mark-Light-32px.png"></a></div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', 'UA-73660-14']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
|
||||
(function() {
|
||||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
||||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
||||
})();
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
@ -1,35 +1,20 @@
|
||||
$(function() {
|
||||
let isEdited = false;
|
||||
|
||||
let adjustScreen = () => {
|
||||
let screenHeight = $(window).height();
|
||||
let headerHeight = $('#header').outerHeight();
|
||||
let footerHeight = $('#footer').outerHeight();
|
||||
let containerHeight = screenHeight - headerHeight - footerHeight;
|
||||
$('#container').css({ top: `${headerHeight}px` });
|
||||
$('.column').css({ height: `${containerHeight}px`});
|
||||
};
|
||||
|
||||
$(window).resize(() => {
|
||||
adjustScreen();
|
||||
});
|
||||
var isEdited = false;
|
||||
|
||||
// Setup editor
|
||||
let editor = ace.edit('editor');
|
||||
var editor = ace.edit('editor');
|
||||
editor.getSession().setUseWrapMode(true);
|
||||
editor.renderer.setScrollMargin(10, 10, 10, 10);
|
||||
editor.setOptions({
|
||||
maxLines: Infinity,
|
||||
indentedSoftWrap: false,
|
||||
fontSize: 14,
|
||||
autoScrollEditorIntoView: true,
|
||||
theme: 'ace/theme/github',
|
||||
// TODO consider some options
|
||||
});
|
||||
|
||||
editor.on('change', () => {
|
||||
isEdited = true;
|
||||
convert();
|
||||
adjustScreen();
|
||||
});
|
||||
|
||||
let convert = () => {
|
||||
@ -46,5 +31,4 @@ $(function() {
|
||||
});
|
||||
|
||||
convert();
|
||||
adjustScreen();
|
||||
});
|
@ -1,8 +0,0 @@
|
||||
#!/usr/bin/env bash
|
||||
set -euo pipefail
|
||||
|
||||
SCRIPT_DIR=$(cd $(dirname $0); pwd)
|
||||
|
||||
cd ${SCRIPT_DIR}/..
|
||||
|
||||
firebase deploy
|
@ -1,7 +0,0 @@
|
||||
#!/usr/bin/env bash
|
||||
set -euo pipefail
|
||||
|
||||
SCRIPT_DIR=$(cd $(dirname $0); pwd)
|
||||
|
||||
cd ${SCRIPT_DIR}/../public
|
||||
python -m http.server 8000
|
Loading…
Reference in New Issue
Block a user