avo.base.css in avo-3.0.0.pre13

- old
+ new

@@ -1,23 +1,26 @@
 @charset "UTF-8";
 
 /**
- * simplemde v1.11.2
- * Copyright Next Step Webs, Inc.
- * @link https://github.com/NextStepWebs/simplemde-markdown-editor
+ * easymde v2.18.0
+ * Copyright Jeroen Akkerman
+ * @link https://github.com/ionaru/easy-markdown-editor
  * @license MIT
  */
 
 .CodeMirror{
-  color:#000
+  font-family:monospace;
+  height:300px;
+  color:#000;
+  direction:ltr
 }
 
 .CodeMirror-lines{
   padding:4px 0
 }
 
-.CodeMirror pre{
+.CodeMirror pre.CodeMirror-line,.CodeMirror pre.CodeMirror-line-like{
   padding:0 4px
 }
 
 .CodeMirror-gutter-filler,.CodeMirror-scrollbar-filler{
   background-color:#fff
@@ -63,17 +66,22 @@
 
 .cm-fat-cursor div.CodeMirror-cursors{
   z-index:1
 }
 
-.cm-animate-fat-cursor{
-  width:auto;
-  border:0;
-  animation:blink 1.06s steps(1) infinite;
-  background-color:#7e7
+.cm-fat-cursor .CodeMirror-line::selection,.cm-fat-cursor .CodeMirror-line>span::selection,.cm-fat-cursor .CodeMirror-line>span>span::selection{
+  background:0 0
 }
 
+.cm-fat-cursor .CodeMirror-line::-moz-selection,.cm-fat-cursor .CodeMirror-line>span::-moz-selection,.cm-fat-cursor .CodeMirror-line>span>span::-moz-selection{
+  background:0 0
+}
+
+.cm-fat-cursor{
+  caret-color:transparent
+}
+
 @keyframes blink{
   50%{
     background-color:transparent
   }
 }
@@ -81,12 +89,23 @@
 .cm-tab{
   display:inline-block;
   text-decoration:inherit
 }
 
+.CodeMirror-rulers{
+  position:absolute;
+  left:0;
+  right:0;
+  top:-50px;
+  bottom:0;
+  overflow:hidden
+}
+
 .CodeMirror-ruler{
   border-left:1px solid #ccc;
+  top:0;
+  bottom:0;
   position:absolute
 }
 
 .cm-s-default .cm-header{
   color:#00f
@@ -138,11 +157,11 @@
 
 .cm-s-default .cm-variable-2{
   color:#05a
 }
 
-.cm-s-default .cm-variable-3{
+.cm-s-default .cm-type,.cm-s-default .cm-variable-3{
   color:#085
 }
 
 .cm-s-default .cm-comment{
   color:#a50
@@ -154,14 +173,18 @@
 
 .cm-s-default .cm-string-2{
   color:#f50
 }
 
-.cm-s-default .cm-meta,.cm-s-default .cm-qualifier{
+.cm-s-default .cm-meta{
   color:#555
 }
 
+.cm-s-default .cm-qualifier{
+  color:#555
+}
+
 .cm-s-default .cm-builtin{
   color:#30a
 }
 
 .cm-s-default .cm-bracket{
@@ -182,24 +205,28 @@
 
 .cm-s-default .cm-link{
   color:#00c
 }
 
-.cm-invalidchar,.cm-s-default .cm-error{
+.cm-s-default .cm-error{
   color:red
 }
 
+.cm-invalidchar{
+  color:red
+}
+
 .CodeMirror-composing{
   border-bottom:2px solid
 }
 
 div.CodeMirror span.CodeMirror-matchingbracket{
-  color:#0f0
+  color:#0b0
 }
 
 div.CodeMirror span.CodeMirror-nonmatchingbracket{
-  color:#f22
+  color:#a22
 }
 
 .CodeMirror-matchingtag{
   background:rgba(255,150,0,.3)
 }
@@ -214,27 +241,29 @@
   background:#fff
 }
 
 .CodeMirror-scroll{
   overflow:scroll!important;
-  margin-bottom:-30px;
-  margin-right:-30px;
-  padding-bottom:30px;
+  margin-bottom:-50px;
+  margin-right:-50px;
+  padding-bottom:50px;
   height:100%;
   outline:0;
-  position:relative
+  position:relative;
+  z-index:0
 }
 
 .CodeMirror-sizer{
   position:relative;
-  border-right:30px solid transparent
+  border-right:50px solid transparent
 }
 
 .CodeMirror-gutter-filler,.CodeMirror-hscrollbar,.CodeMirror-scrollbar-filler,.CodeMirror-vscrollbar{
   position:absolute;
   z-index:6;
-  display:none
+  display:none;
+  outline:0
 }
 
 .CodeMirror-vscrollbar{
   right:0;
   top:0;
@@ -270,20 +299,18 @@
 .CodeMirror-gutter{
   white-space:normal;
   height:100%;
   display:inline-block;
   vertical-align:top;
-  margin-bottom:-30px
+  margin-bottom:-50px
 }
 
 .CodeMirror-gutter-wrapper{
   position:absolute;
   z-index:4;
   background:0 0!important;
-  border:none!important;
-  -webkit-user-select:none;
-  user-select:none
+  border:none!important
 }
 
 .CodeMirror-gutter-background{
   position:absolute;
   top:0;
@@ -295,16 +322,24 @@
   position:absolute;
   cursor:default;
   z-index:4
 }
 
+.CodeMirror-gutter-wrapper ::selection{
+  background-color:transparent
+}
+
+.CodeMirror-gutter-wrapper ::-moz-selection{
+  background-color:transparent
+}
+
 .CodeMirror-lines{
   cursor:text;
   min-height:1px
 }
 
-.CodeMirror pre{
+.CodeMirror pre.CodeMirror-line,.CodeMirror pre.CodeMirror-line-like{
   border-radius:0;
   border-width:0;
   background:0 0;
   font-family:inherit;
   font-size:inherit;
@@ -315,14 +350,14 @@
   color:inherit;
   z-index:2;
   position:relative;
   overflow:visible;
   -webkit-tap-highlight-color:transparent;
-  font-variant-ligatures:none
+  font-variant-ligatures:contextual
 }
 
-.CodeMirror-wrap pre{
+.CodeMirror-wrap pre.CodeMirror-line,.CodeMirror-wrap pre.CodeMirror-line-like{
   word-wrap:break-word;
   white-space:pre-wrap;
   word-break:normal
 }
 
@@ -336,13 +371,17 @@
 }
 
 .CodeMirror-linewidget{
   position:relative;
   z-index:2;
-  overflow:auto
+  padding:.1px
 }
 
+.CodeMirror-rtl pre{
+  direction:rtl
+}
+
 .CodeMirror-code{
   outline:0
 }
 
 .CodeMirror-gutter,.CodeMirror-gutters,.CodeMirror-linenumber,.CodeMirror-scroll,.CodeMirror-sizer{
@@ -356,11 +395,12 @@
   overflow:hidden;
   visibility:hidden
 }
 
 .CodeMirror-cursor{
-  position:absolute
+  position:absolute;
+  pointer-events:none
 }
 
 .CodeMirror-measure pre{
   position:static
 }
@@ -369,33 +409,41 @@
   visibility:hidden;
   position:relative;
   z-index:3
 }
 
-.CodeMirror-focused div.CodeMirror-cursors,div.CodeMirror-dragcursors{
+div.CodeMirror-dragcursors{
   visibility:visible
 }
 
+.CodeMirror-focused div.CodeMirror-cursors{
+  visibility:visible
+}
+
 .CodeMirror-selected{
   background:#d9d9d9
 }
 
-.CodeMirror-focused .CodeMirror-selected,.CodeMirror-line::selection,.CodeMirror-line>span::selection,.CodeMirror-line>span>span::selection{
+.CodeMirror-focused .CodeMirror-selected{
   background:#d7d4f0
 }
 
 .CodeMirror-crosshair{
   cursor:crosshair
 }
 
+.CodeMirror-line::selection,.CodeMirror-line>span::selection,.CodeMirror-line>span>span::selection{
+  background:#d7d4f0
+}
+
 .CodeMirror-line::-moz-selection,.CodeMirror-line>span::-moz-selection,.CodeMirror-line>span>span::-moz-selection{
   background:#d7d4f0
 }
 
 .cm-searching{
-  background:#ffa;
-  background:rgba(255,255,0,.4)
+  background-color:#ffa;
+  background-color:rgba(255,255,0,.4)
 }
 
 .cm-force-border{
   padding-right:.1px
 }
@@ -412,78 +460,88 @@
 
 span.CodeMirror-selectedtext{
   background:0 0
 }
 
-.CodeMirror{
+.EasyMDEContainer{
+  display:block
+}
+
+.CodeMirror-rtl pre{
+  direction:rtl
+}
+
+.EasyMDEContainer.sided--no-fullscreen{
+  display:flex;
+  flex-direction:row;
+  flex-wrap:wrap
+}
+
+.EasyMDEContainer .CodeMirror{
+  box-sizing:border-box;
   height:auto;
-  min-height:300px;
-  border:1px solid #ddd;
+  border:1px solid #ced4da;
   border-bottom-left-radius:4px;
   border-bottom-right-radius:4px;
   padding:10px;
   font:inherit;
-  z-index:1
+  z-index:0;
+  word-wrap:break-word
 }
 
-.CodeMirror-scroll{
-  min-height:300px
+.EasyMDEContainer .CodeMirror-scroll{
+  cursor:text
 }
 
-.CodeMirror-fullscreen{
+.EasyMDEContainer .CodeMirror-fullscreen{
   background:#fff;
   position:fixed!important;
   top:50px;
   left:0;
   right:0;
   bottom:0;
   height:auto;
-  z-index:9
+  z-index:8;
+  border-right:none!important;
+  border-bottom-right-radius:0!important
 }
 
-.CodeMirror-sided{
+.EasyMDEContainer .CodeMirror-sided{
   width:50%!important
 }
 
+.EasyMDEContainer.sided--no-fullscreen .CodeMirror-sided{
+  border-right:none!important;
+  border-bottom-right-radius:0;
+  position:relative;
+  flex:1 1 auto
+}
+
+.EasyMDEContainer .CodeMirror-placeholder{
+  opacity:.5
+}
+
+.EasyMDEContainer .CodeMirror-focused .CodeMirror-selected{
+  background:#d9d9d9
+}
+
 .editor-toolbar{
   position:relative;
-  opacity:.6;
   -webkit-user-select:none;
   -o-user-select:none;
   user-select:none;
-  padding:0 10px;
-  border-top:1px solid #bbb;
-  border-left:1px solid #bbb;
-  border-right:1px solid #bbb;
+  padding:9px 10px;
+  border-top:1px solid #ced4da;
+  border-left:1px solid #ced4da;
+  border-right:1px solid #ced4da;
   border-top-left-radius:4px;
   border-top-right-radius:4px
 }
 
-.editor-toolbar:after,.editor-toolbar:before{
-  display:block;
-  content:' ';
-  height:1px
-}
-
-.editor-toolbar:before{
-  margin-bottom:8px
-}
-
-.editor-toolbar:after{
-  margin-top:8px
-}
-
-.editor-toolbar:hover,.editor-wrapper input.title:focus,.editor-wrapper input.title:hover{
-  opacity:.8
-}
-
 .editor-toolbar.fullscreen{
   width:100%;
   height:50px;
-  overflow-x:auto;
-  overflow-y:hidden;
-  white-space:nowrap;
   padding-top:10px;
   padding-bottom:10px;
   box-sizing:border-box;
   background:#fff;
   border:0;
@@ -495,98 +553,103 @@
 }
 
 .editor-toolbar.fullscreen::before{
   width:20px;
   height:50px;
-  background:linear-gradient(to right,rgba(255,255,255,1) 0,rgba(255,255,255,0) 100%);
+  background:linear-gradient(to right,#fff 0,rgba(255,255,255,0) 100%);
   position:fixed;
   top:0;
   left:0;
   margin:0;
   padding:0
 }
 
 .editor-toolbar.fullscreen::after{
   width:20px;
   height:50px;
-  background:linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,1) 100%);
+  background:linear-gradient(to right,rgba(255,255,255,0) 0,#fff 100%);
   position:fixed;
   top:0;
   right:0;
   margin:0;
   padding:0
 }
 
-.editor-toolbar a{
+.EasyMDEContainer.sided--no-fullscreen .editor-toolbar{
+  width:100%
+}
+
+.editor-toolbar .easymde-dropdown,.editor-toolbar button{
+  background:0 0;
   display:inline-block;
   text-align:center;
   text-decoration:none!important;
-  color:#2c3e50!important;
-  width:30px;
   height:30px;
   margin:0;
+  padding:0;
   border:1px solid transparent;
   border-radius:3px;
   cursor:pointer
 }
 
-.editor-toolbar a.active,.editor-toolbar a:hover{
+.editor-toolbar button{
+  font-weight:700;
+  min-width:30px;
+  padding:0 6px;
+  white-space:nowrap
+}
+
+.editor-toolbar button.active,.editor-toolbar button:hover{
   background:#fcfcfc;
   border-color:#95a5a6
 }
 
-.editor-toolbar a:before{
-  line-height:30px
-}
-
 .editor-toolbar i.separator{
   display:inline-block;
   width:0;
   border-left:1px solid #d9d9d9;
   border-right:1px solid #fff;
   color:transparent;
   text-indent:-10px;
   margin:0 6px
 }
 
-.editor-toolbar a.fa-header-x:after{
+.editor-toolbar button:after{
   font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;
   font-size:65%;
   vertical-align:text-bottom;
   position:relative;
   top:2px
 }
 
-.editor-toolbar a.fa-header-1:after{
+.editor-toolbar button.heading-1:after{
   content:"1"
 }
 
-.editor-toolbar a.fa-header-2:after{
+.editor-toolbar button.heading-2:after{
   content:"2"
 }
 
-.editor-toolbar a.fa-header-3:after{
+.editor-toolbar button.heading-3:after{
   content:"3"
 }
 
-.editor-toolbar a.fa-header-bigger:after{
+.editor-toolbar button.heading-bigger:after{
   content:"▲"
 }
 
-.editor-toolbar a.fa-header-smaller:after{
+.editor-toolbar button.heading-smaller:after{
   content:"▼"
 }
 
-.editor-toolbar.disabled-for-preview a:not(.no-disable){
-  pointer-events:none;
-  background:#fff;
-  border-color:transparent;
-  text-shadow:inherit
+.editor-toolbar.disabled-for-preview button:not(.no-disable){
+  opacity:.6;
+  pointer-events:none
 }
 
 @media only screen and (max-width:700px){
-  .editor-toolbar a.no-mobile{
+  .editor-toolbar i.no-mobile{
     display:none
   }
 }
 
 .editor-statusbar{
@@ -594,24 +657,20 @@
   font-size:12px;
   color:#959694;
   text-align:right
 }
 
+.EasyMDEContainer.sided--no-fullscreen .editor-statusbar{
+  width:100%
+}
+
 .editor-statusbar span{
   display:inline-block;
   min-width:4em;
   margin-left:1em
 }
 
-.editor-preview,.editor-preview-side{
-  padding:10px;
-  background:#fafafa;
-  overflow:auto;
-  display:none;
-  box-sizing:border-box
-}
-
 .editor-statusbar .lines:before{
   content:'lines: '
 }
 
 .editor-statusbar .words:before{
@@ -620,104 +679,171 @@
 
 .editor-statusbar .characters:before{
   content:'characters: '
 }
 
-.editor-preview{
+.editor-preview-full{
   position:absolute;
   width:100%;
   height:100%;
   top:0;
   left:0;
-  z-index:7
+  z-index:7;
+  overflow:auto;
+  display:none;
+  box-sizing:border-box
 }
 
 .editor-preview-side{
   position:fixed;
   bottom:0;
   width:50%;
   top:50px;
   right:0;
   z-index:9;
-  border:1px solid #ddd
+  overflow:auto;
+  display:none;
+  box-sizing:border-box;
+  border:1px solid #ddd;
+  word-wrap:break-word
 }
 
-.editor-preview-active,.editor-preview-active-side{
+.editor-preview-active-side{
   display:block
 }
 
-.editor-preview-side>p,.editor-preview>p{
+.EasyMDEContainer.sided--no-fullscreen .editor-preview-active-side{
+  flex:1 1 auto;
+  height:auto;
+  position:static
+}
+
+.editor-preview-active{
+  display:block
+}
+
+.editor-preview{
+  padding:10px;
+  background:#fafafa
+}
+
+.editor-preview>p{
   margin-top:0
 }
 
-.editor-preview pre,.editor-preview-side pre{
+.editor-preview pre{
   background:#eee;
   margin-bottom:10px
 }
 
-.editor-preview table td,.editor-preview table th,.editor-preview-side table td,.editor-preview-side table th{
+.editor-preview table td,.editor-preview table th{
   border:1px solid #ddd;
   padding:5px
 }
 
-.CodeMirror .CodeMirror-code .cm-tag{
+.cm-s-easymde .cm-tag{
   color:#63a35c
 }
 
-.CodeMirror .CodeMirror-code .cm-attribute{
+.cm-s-easymde .cm-attribute{
   color:#795da3
 }
 
-.CodeMirror .CodeMirror-code .cm-string{
+.cm-s-easymde .cm-string{
   color:#183691
 }
 
-.CodeMirror .CodeMirror-selected{
-  background:#d9d9d9
+.cm-s-easymde .cm-header-1{
+  font-size:calc(1.375rem + 1.5vw)
 }
 
-.CodeMirror .CodeMirror-code .cm-header-1{
-  font-size:200%;
-  line-height:200%
+.cm-s-easymde .cm-header-2{
+  font-size:calc(1.325rem + .9vw)
 }
 
-.CodeMirror .CodeMirror-code .cm-header-2{
-  font-size:160%;
-  line-height:160%
+.cm-s-easymde .cm-header-3{
+  font-size:calc(1.3rem + .6vw)
 }
 
-.CodeMirror .CodeMirror-code .cm-header-3{
-  font-size:125%;
-  line-height:125%
+.cm-s-easymde .cm-header-4{
+  font-size:calc(1.275rem + .3vw)
 }
 
-.CodeMirror .CodeMirror-code .cm-header-4{
-  font-size:110%;
-  line-height:110%
+.cm-s-easymde .cm-header-5{
+  font-size:1.25rem
 }
 
-.CodeMirror .CodeMirror-code .cm-comment{
+.cm-s-easymde .cm-header-6{
+  font-size:1rem
+}
+
+.cm-s-easymde .cm-header-1,.cm-s-easymde .cm-header-2,.cm-s-easymde .cm-header-3,.cm-s-easymde .cm-header-4,.cm-s-easymde .cm-header-5,.cm-s-easymde .cm-header-6{
+  margin-bottom:.5rem;
+  line-height:1.2
+}
+
+.cm-s-easymde .cm-comment{
   background:rgba(0,0,0,.05);
   border-radius:2px
 }
 
-.CodeMirror .CodeMirror-code .cm-link{
+.cm-s-easymde .cm-link{
   color:#7f8c8d
 }
 
-.CodeMirror .CodeMirror-code .cm-url{
+.cm-s-easymde .cm-url{
   color:#aab2b3
 }
 
-.CodeMirror .CodeMirror-code .cm-strikethrough{
-  text-decoration:line-through
+.cm-s-easymde .cm-quote{
+  color:#7f8c8d;
+  font-style:italic
 }
 
-.CodeMirror .CodeMirror-placeholder{
-  opacity:.5
+.editor-toolbar .easymde-dropdown{
+  position:relative;
+  background:linear-gradient(to bottom right,#fff 0,#fff 84%,#333 50%,#333 100%);
+  border-radius:0;
+  border:1px solid #fff
 }
 
+.editor-toolbar .easymde-dropdown:hover{
+  background:linear-gradient(to bottom right,#fff 0,#fff 84%,#333 50%,#333 100%)
+}
+
+.easymde-dropdown-content{
+  display:block;
+  visibility:hidden;
+  position:absolute;
+  background-color:#f9f9f9;
+  box-shadow:0 8px 16px 0 rgba(0,0,0,.2);
+  padding:8px;
+  z-index:2;
+  top:30px
+}
+
+.easymde-dropdown:active .easymde-dropdown-content,.easymde-dropdown:focus .easymde-dropdown-content,.easymde-dropdown:focus-within .easymde-dropdown-content{
+  visibility:visible
+}
+
+.easymde-dropdown-content button{
+  display:block
+}
+
+span[data-img-src]::after{
+  content:'';
+  background-image:var(--bg-image);
+  display:block;
+  max-height:100%;
+  max-width:100%;
+  background-size:contain;
+  height:0;
+  padding-top:var(--height);
+  width:var(--width);
+  background-repeat:no-repeat
+}
+
 .CodeMirror .cm-spell-error:not(.cm-url):not(.cm-comment):not(.cm-tag):not(.cm-word){
   background:rgba(255,0,0,.15)
 }
 
 .tippy-box[data-animation=fade][data-state=hidden]{
@@ -6680,10 +6806,14 @@
 
 .mb-4{
   margin-bottom:1rem
 }
 
+.me-1{
+  margin-inline-end:0.25rem
+}
+
 .ml-1{
   margin-left:0.25rem
 }
 
 .ml-1\/12{
@@ -7048,14 +7178,10 @@
 
 .w-2{
   width:0.5rem
 }
 
-.w-2\/3{
-  width:66.666667%
-}
-
 .w-24{
   width:6rem
 }
 
 .w-4{
@@ -7807,10 +7933,15 @@
 .bg-blue-400{
   --tw-bg-opacity:1;
   background-color:rgb(57 158 229 / var(--tw-bg-opacity))
 }
 
+.bg-blue-50{
+  --tw-bg-opacity:1;
+  background-color:rgb(230 243 252 / var(--tw-bg-opacity))
+}
+
 .bg-blue-500{
   --tw-bg-opacity:1;
   background-color:rgb(8 134 222 / var(--tw-bg-opacity))
 }
 
@@ -8198,14 +8329,10 @@
 
 .pb-6{
   padding-bottom:1.5rem
 }
 
-.pe-48{
-  padding-inline-end:12rem
-}
-
 .pl-1{
   padding-left:0.25rem
 }
 
 .pl-4{
@@ -8226,10 +8353,14 @@
 
 .pt-0\.5{
   padding-top:0.125rem
 }
 
+.pt-1{
+  padding-top:0.25rem
+}
+
 .pt-16{
   padding-top:4rem
 }
 
 .pt-2{
@@ -10147,9 +10278,13 @@
     display:none
   }
 
   .sm\:w-1\/3{
     width:33.333333%
+  }
+
+  .sm\:w-2\/3{
+    width:66.666667%
   }
 
   .sm\:w-auto{
     width:auto
   }