1// link in media manager 2a.plugin_diagrams_create { 3 display: flex; 4 margin-bottom: 1em; 5 gap: 0.25em; 6 7 &:before { 8 content: ''; 9 width: 1.2em; 10 height: 1.2em; 11 background-image: url("img/diagramsnet.svg"); 12 background-repeat: no-repeat; 13 } 14} 15 16// in-page display 17.diagrams-svg-wrapper { 18 overflow: auto; 19 width: fit-content; 20 height: fit-content; 21 22 // these match the standard dokuwiki template's img alignment 23 &.media { 24 margin: .2em 0; 25 } 26 27 &.medialeft { 28 margin: .2em 1em .2em 0; 29 display: inline-block; 30 } 31 32 &.mediaright { 33 margin: .2em 0 .2em 1em; 34 display: inline-block; 35 } 36 37 &.mediacenter { 38 margin: .2em auto; 39 display: block; 40 } 41 42 object { 43 // fix for sometimes missing edges 44 max-width: 99%; 45 } 46} 47 48// prosemirror node view 49.ProseMirror img.diagrams-svg { 50 cursor: pointer; 51} 52 53// style for the editor itself (on top of everything) 54#plugin__diagrams-editor { 55 border: 0; 56 position: fixed; 57 top: 0; 58 left: 0; 59 right: 0; 60 bottom: 0; 61 width: 100%; 62 height: 100%; 63 z-index: 9999; 64} 65 66// buttons 67.diagrams-svg-wrapper .diagrams-buttons .diagrams-btn { 68 @media print { 69 display: none; 70 } 71 72 font-size: 0.75em; 73 74 svg { 75 margin-right: 0.25em; 76 position: relative; 77 top: 0.2em; 78 } 79} 80