Skip to content
This repository has been archived by the owner on Feb 11, 2021. It is now read-only.

Commit

Permalink
Basic paragraph history
Browse files Browse the repository at this point in the history
  • Loading branch information
bastianallgeier committed Jul 31, 2019
1 parent e75fd02 commit 9ad8d25
Show file tree
Hide file tree
Showing 9 changed files with 26,491 additions and 9 deletions.
395 changes: 394 additions & 1 deletion index.css
Original file line number Diff line number Diff line change
@@ -1 +1,394 @@
.k-editor-block-options{position:absolute;left:0;display:flex;top:-3px;width:4rem;padding:.25rem 0;align-items:center;justify-content:center}.k-editor-block-option{cursor:pointer}.k-editor-block-option span{display:flex;width:1.5rem;height:1.5rem;border-radius:3px;align-items:center;justify-content:center;color:#999}.k-editor-block-option:hover{background:#efefef}.k-editor-block-option:focus{outline:0}.k-editor-block-options .k-sort-handle{padding:0;width:auto;height:auto}.k-editor-block-option-dropdown ul{display:grid;grid-template-columns:1fr 1fr 1fr}.k-editor-block-option-dropdown h4{padding:.75rem 1rem;font-size:.875rem;font-weight:600}.k-editor{position:relative;background:#fff;margin-bottom:1.5rem;box-shadow:0 2px 5px rgba(0,0,0,.05)}.k-editor-blocks{padding:1.5rem 0}.k-editor-block{position:relative;padding:0 4rem}.k-editor-block:last-child{margin-bottom:0}.k-editor-block .ProseMirror:focus{outline:0}.k-editor-block .ProseMirror a{color:#4271ae;text-decoration:underline}.k-editable-toolbar{position:absolute;display:flex;border-bottom:1px solid #ddd;background:#000;height:37px;transform:translateX(-50%) translateY(-.75rem);z-index:1;box-shadow:0 2px 5px rgba(0,0,0,.05);border-bottom:1px solid rgba(0,0,0,.1);color:#fff;border-radius:3px}.k-editable-toolbar-button{display:flex;align-items:center;height:36px;padding:0 .75rem;font-size:.875rem!important;color:currentColor}.k-editable-toolbar-button.k-editable-toolbar-button-active{color:#81a2be}.k-editable{position:relative}.k-editable-placeholder{position:absolute;top:0;left:0;color:#bbb;pointer-events:none}.k-editor-paragraph-block{margin-bottom:.75rem}.k-editor-paragraph-block .ProseMirror{line-height:1.5em}.k-editor-paragraph-block .ProseMirror strong{font-weight:600}.k-editor-paragraph-block .ProseMirror code{position:relative;font-size:.875rem;display:inline-block;line-height:1.325;padding:.05em .5em;background:rgba(0,0,0,.1);border-radius:3px;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace}.k-editor-blockquote-block{margin-top:1.5rem;margin-bottom:1.5rem}.k-editor-blockquote-block .k-editable-placeholder,.k-editor-blockquote-block .ProseMirror{font-size:1.25rem;line-height:1.5em;padding:0 0 0 1rem;border-left:3px solid #000}.k-editor-blockquote-block .ProseMirror code{position:relative;font-size:.875em;display:inline-block;line-height:1.325;padding:.05em .5em;background:rgba(0,0,0,.1);border-radius:3px;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace}.k-editor-blockquote-block .k-editor-block-options{top:0}.k-editor-code-block{margin:1.5rem 0}.k-editor-code-block pre{background:#000;color:#fff;font-size:.875rem;padding:1rem;line-height:2em;border-radius:3px;overflow-y:scroll;margin-bottom:.75rem;white-space:pre}.k-editor-code-block code{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace}.k-editor-h1-block{margin-bottom:.75rem}.k-editor-h1-block .k-editable-placeholder,.k-editor-h1-block .ProseMirror{font-size:1.75rem;font-weight:600;line-height:1.5em}.k-editor-h1-block .ProseMirror code,.k-editor-h2-block .ProseMirror code,.k-editor-h3-block .ProseMirror code{position:relative;font-size:.925em;display:inline-block;line-height:1;padding:.15em .25em;background:rgba(0,0,0,.1);border-radius:3px;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace}.k-editor-h1-block .k-editor-block-options{top:8px}.k-editor-h2-block{margin-bottom:.75rem}.k-editor-h2-block .k-editable-placeholder,.k-editor-h2-block .ProseMirror{font-size:1.25rem;font-weight:600;line-height:1.5em}.k-editor-h2-block .k-editor-block-options{top:-1px}.k-editor-h3-block{margin-bottom:.75rem}.k-editor-h3-block .k-editable-placeholder,.k-editor-h3-block .ProseMirror{font-size:1rem;font-weight:600;line-height:1.5em}.k-editor-hr-block-divider{position:relative;height:1.5rem;border:0;margin-bottom:.75rem;color:#ddd}.k-editor-hr-block-divider:focus{outline:0}.k-editor-hr-block-divider:after{position:absolute;top:50%;left:0;right:0;content:"";height:1px;background:currentColor}.k-editor-hr-block-divider:focus{color:#b5d7fe}.k-editor-hr-block-divider:focus:after{outline:1px solid #b5d7fe}.k-editor-image-block{margin:1.5rem 0}.k-editor-image-block figure{line-height:0;text-align:center}.k-editor-image-block img:focus{outline:2px solid rgba(66,113,174,.25);outline-offset:2px}.k-editor-image-block img{display:block;max-width:100%;max-height:30rem}.k-editor-image-block-wrapper{display:inline-block;position:relative;margin:0 auto}.k-editor-image-block figcaption{display:block;line-height:1.5em;font-size:.875rem;padding-top:.75rem;text-align:center}.k-editor-image-block-placeholder{line-height:1;width:100%}.k-editor-image-block-placeholder button{padding:.75rem;display:block;width:100%;border-radius:3px;border:1px dashed #ddd}.k-editor-image-block-options{position:absolute;top:.75rem;right:.75rem;background:#fff;width:1.75rem;height:1.75rem;border-radius:2px}.k-editor-ul-block .k-editable{position:relative;margin-left:1.25rem;margin-bottom:.75rem;line-height:1.5em}.k-editor-ul-block .k-editable:before{position:absolute;content:"";top:.55em;left:-1.25rem;width:6px;height:6px;border-radius:50%;background:currentColor}.k-editor-ol-block{counter-increment:list}.k-editor-block:not(.k-editor-ol-block){counter-reset:list}.k-editor-ol-block .k-editable{position:relative;margin-left:1.25rem;line-height:1.5em;margin-bottom:.75rem}.k-editor-ol-block .k-editable:before{position:absolute;content:counter(list) ".";top:.025rem;left:-1.25rem;color:#999;font-size:.875rem}.k-editor-video-block{margin:1.5rem 0}.k-editor-video-block figure{outline:0;line-height:0;background:#fff}.k-editor-video-block iframe{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:0}.k-editor-video-block-embed{position:relative;padding-bottom:56.25%;width:100%}.k-editor-video-block-embed iframe{pointer-events:none}.k-editor-video-block .k-editor-video-block-embed:focus{outline:2px solid #b5d7fe;outline-offset:2px;pointer-events:all}.k-editor-video-block-placeholder{line-height:1}.k-editor-video-block-placeholder button{padding:.75rem;display:block;width:100%;border-radius:3px;border:1px dashed #ddd}
.k-editor-block-options {
position: absolute;
left: 0;
display: flex;
top: -3px;
width: 4rem;
padding: 0.25rem 0;
align-items: center;
justify-content: center;
}

.k-editor-block-option {
cursor: pointer;
}

.k-editor-block-option span {
display: flex;
width: 1.5rem;
height: 1.5rem;
border-radius: 3px;
align-items: center;
justify-content: center;
color: #999;
}

.k-editor-block-option:hover {
background: #efefef;
}

.k-editor-block-option:focus {
outline: 0;
}

.k-editor-block-options .k-sort-handle {
padding: 0;
width: auto;
height: auto;
}

.k-editor-block-option-dropdown ul {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
}

.k-editor-block-option-dropdown h4 {
padding: 0.75rem 1rem;
font-size: 0.875rem;
font-weight: 600;
}.k-editor {
position: relative;
background: #fff;
margin-bottom: 1.5rem;
box-shadow: rgba(0, 0, 0, 0.05) 0 2px 5px;
}

.k-editor:focus-within {
/* border-color: #4271ae;
outline: 2px solid rgba(#4271ae, 0.25); */
}

.k-editor-blocks {
position: relative;
padding: 1.5rem 0;
max-width: 50rem;
margin: 0 auto;
}

.k-editor-block {
position: relative;
padding: 0 4rem;
}

.k-editor-block:last-child {
margin-bottom: 0;
}

.k-editor-block .ProseMirror:focus {
outline: 0;
}

.k-editor-block .ProseMirror a {
color: #4271ae;
text-decoration: underline;
}/** put your css here **/.k-editable-toolbar {
position: absolute;
display: flex;
border-bottom: 1px solid #ddd;
background: #000;
height: 37px;
transform: translateX(-50%) translateY(-0.75rem);
z-index: 1;
box-shadow: rgba(0, 0, 0, 0.05) 0 2px 5px;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
color: #fff;
border-radius: 3px;
}

.k-editable-toolbar-button {
display: flex;
align-items: center;
height: 36px;
padding: 0 0.75rem;
font-size: 0.875rem !important;
color: currentColor;
}

.k-editable-toolbar-button.k-editable-toolbar-button-active {
color: #81a2be;
}.k-editable {
position: relative;
}
.k-editable-placeholder {
position: absolute;
top: 0;
left: 0;
color: #bbb;
pointer-events: none;
}.k-editor-paragraph-block {
margin-bottom: 0.75rem;
}

.k-editor-paragraph-block .ProseMirror {
line-height: 1.5em;
}

.k-editor-paragraph-block .ProseMirror strong {
font-weight: 600;
}

.k-editor-paragraph-block .ProseMirror code {
position: relative;
font-size: 0.875rem;
display: inline-block;
line-height: 1.325;
padding: 0.05em 0.5em;
background: rgba(0, 0, 0, 0.1);
border-radius: 3px;
font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;
}.k-editor-blockquote-block {
margin-top: 1.5rem;
margin-bottom: 1.5rem;
}

.k-editor-blockquote-block .k-editable-placeholder,
.k-editor-blockquote-block .ProseMirror {
font-size: 1.25rem;
line-height: 1.5em;
padding: 0 0 0 1rem;
border-left: 3px solid #000;
}

.k-editor-blockquote-block .ProseMirror code {
position: relative;
font-size: 0.875em;
display: inline-block;
line-height: 1.325;
padding: 0.05em 0.5em;
background: rgba(0, 0, 0, 0.1);
border-radius: 3px;
font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;
}

.k-editor-blockquote-block .k-editor-block-options {
top: 0;
}.k-editor-code-block {
margin: 1.5rem 0;
}

.k-editor-code-block pre {
background: #000;
color: #fff;
font-size: 0.875rem;
padding: 1rem;
line-height: 2em;
border-radius: 3px;
overflow-y: scroll;
margin-bottom: 0.75rem;
white-space: pre;
}

.k-editor-code-block code {
font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;
}.k-editor-h1-block {
margin-bottom: 0.75rem;
}

.k-editor-h1-block .k-editable-placeholder,
.k-editor-h1-block .ProseMirror {
font-size: 1.75rem;
font-weight: 600;
line-height: 1.5em;
}

.k-editor-h1-block .ProseMirror code,
.k-editor-h2-block .ProseMirror code,
.k-editor-h3-block .ProseMirror code {
position: relative;
font-size: 0.925em;
display: inline-block;
line-height: 1;
padding: 0.15em 0.25em;
background: rgba(0, 0, 0, 0.1);
border-radius: 3px;
font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;
}

.k-editor-h1-block .k-editor-block-options {
top: 8px;
}.k-editor-h2-block {
margin-bottom: 0.75rem;
}

.k-editor-h2-block .k-editable-placeholder,
.k-editor-h2-block .ProseMirror {
font-size: 1.25rem;
font-weight: 600;
line-height: 1.5em;
}

.k-editor-h2-block .k-editor-block-options {
top: -1px;
}.k-editor-h3-block {
margin-bottom: 0.75rem;
}

.k-editor-h3-block .k-editable-placeholder,
.k-editor-h3-block .ProseMirror {
font-size: 1rem;
font-weight: 600;
line-height: 1.5em;
}.k-editor-hr-block-divider {
position: relative;
height: 1.5rem;
border: 0;
margin-bottom: 0.75rem;
color: #ddd;
}
.k-editor-hr-block-divider:focus {
outline: 0;
}
.k-editor-hr-block-divider:after {
position: absolute;
top: 50%;
left: 0;
right: 0;
content: "";
height: 1px;
background: currentColor;
}
.k-editor-hr-block-divider:focus {
color: #b5d7fe;
}
.k-editor-hr-block-divider:focus:after {
outline: 1px solid #b5d7fe;
}.k-editor-image-block {
margin: 1.5rem 0;
}

.k-editor-image-block figure {
line-height: 0;
text-align: center;
}

.k-editor-image-block img:focus {
outline: 2px solid rgba(66, 113, 174, 0.25);
outline-offset: 2px;
}

.k-editor-image-block img {
display: block;
max-width: 100%;
}

.k-editor-image-block-wrapper {
display: inline-block;
position: relative;
margin: 0 auto;
}

.k-editor-image-block figcaption {
display: block;
line-height: 1.5em;
font-size: 0.875rem;
padding-top: 0.75rem;
text-align: center;
}

.k-editor-image-block-placeholder {
line-height: 1;
width: 100%;
}

.k-editor-image-block-placeholder button {
padding: 0.75rem;
display: block;
width: 100%;
border-radius: 3px;
border: 1px dashed #ddd;
}

.k-editor-image-block-options {
position: absolute;
top: 0.75rem;
right: 0.75rem;
background: #fff;
width: 1.75rem;
height: 1.75rem;
border-radius: 2px;
}.k-editor-ul-block .k-editable {
position: relative;
margin-left: 1.25rem;
margin-bottom: 0.75rem;
line-height: 1.5em;
}

.k-editor-ul-block .k-editable:before {
position: absolute;
content: "";
top: 0.55em;
left: -1.25rem;
width: 6px;
height: 6px;
border-radius: 50%;
background: currentColor;
}.k-editor-ol-block {
counter-increment: list;
}

.k-editor-block:not(.k-editor-ol-block) {
counter-reset: list;
}

.k-editor-ol-block .k-editable {
position: relative;
margin-left: 1.25rem;
line-height: 1.5em;
margin-bottom: 0.75rem;
}

.k-editor-ol-block .k-editable:before {
position: absolute;
content: counter(list) ".";
top: 0.025rem;
left: -1.25rem;
color: #999;
font-size: 0.875rem;
}.k-editor-video-block {
margin: 1.5rem 0;
}

.k-editor-video-block figure {
outline: 0;
line-height: 0;
background: #fff;
}

.k-editor-video-block iframe {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
}

.k-editor-video-block-embed {
position: relative;
padding-bottom: 56.25%;
width: 100%;
}

.k-editor-video-block-embed iframe {
pointer-events: none;
}

.k-editor-video-block .k-editor-video-block-embed:focus {
outline: 2px solid #b5d7fe;
outline-offset: 2px;
pointer-events: all;
}

.k-editor-video-block-placeholder {
line-height: 1;
}

.k-editor-video-block-placeholder button {
padding: 0.75rem;
display: block;
width: 100%;
border-radius: 3px;
border: 1px dashed #ddd;
}
26,072 changes: 26,071 additions & 1 deletion index.js

Large diffs are not rendered by default.

Loading

0 comments on commit 9ad8d25

Please sign in to comment.