| 1 | .jstEditor { |
|---|
| 2 | border-width : 0 1px 1px 1px; |
|---|
| 3 | border-style : solid; |
|---|
| 4 | border-color : #ddd; |
|---|
| 5 | background : #f7f7f7; |
|---|
| 6 | } |
|---|
| 7 | .jstEditor textarea, .jstEditor iframe { |
|---|
| 8 | -webkit-box-sizing: border-box; |
|---|
| 9 | -moz-box-sizing: border-box; |
|---|
| 10 | box-sizing: border-box; |
|---|
| 11 | margin: 0; |
|---|
| 12 | border: 1px solid #fbfbfb; |
|---|
| 13 | width: 100%; |
|---|
| 14 | padding: .5em 0 0 0; |
|---|
| 15 | min-height: 100px; |
|---|
| 16 | } |
|---|
| 17 | .jstHandle { |
|---|
| 18 | height: 8px; |
|---|
| 19 | background: #ccc url(resize.png) no-repeat center center; |
|---|
| 20 | font-size: 0.1em; |
|---|
| 21 | cursor: s-resize; |
|---|
| 22 | border-color: #ccc #ccc #ccc #000; |
|---|
| 23 | border-width: 0 1px 1px 1px; |
|---|
| 24 | border-style: solid; |
|---|
| 25 | } |
|---|
| 26 | .jstEditor textarea:focus, .jstEditor iframe:focus { |
|---|
| 27 | border-color: #bee74b; |
|---|
| 28 | } |
|---|
| 29 | .jstElements { |
|---|
| 30 | padding: 0 1rem; |
|---|
| 31 | border: 1px solid #dfdfdf; |
|---|
| 32 | overflow: hidden; |
|---|
| 33 | background: #f5f5f5; |
|---|
| 34 | -moz-border-radius: 4px 4px 0 0; |
|---|
| 35 | -webkit-border-radius: 4px 4px 0 0; |
|---|
| 36 | border-radius: 4px 4px 0 0; |
|---|
| 37 | position: relative; |
|---|
| 38 | } |
|---|
| 39 | .jstElements select, .jstElements button { |
|---|
| 40 | vertical-align: middle; |
|---|
| 41 | } |
|---|
| 42 | .jstElements select { |
|---|
| 43 | width: 12em; |
|---|
| 44 | margin-right: .6rem; |
|---|
| 45 | border: 1px solid #ddd; |
|---|
| 46 | } |
|---|
| 47 | .jstElements button { |
|---|
| 48 | width : 30px; |
|---|
| 49 | height: 28px; |
|---|
| 50 | border-style: solid; |
|---|
| 51 | border-width: 0 1px 0 0; |
|---|
| 52 | border-color: #e7e7e7; |
|---|
| 53 | background-color : #f7f7f7; |
|---|
| 54 | background-position : 50% 50%; |
|---|
| 55 | background-repeat: no-repeat; |
|---|
| 56 | } |
|---|
| 57 | .jstElements button:hover, .jstElements button:focus { |
|---|
| 58 | border-color : #ddd; |
|---|
| 59 | background-color: #fff; |
|---|
| 60 | } |
|---|
| 61 | .jstElements button span { |
|---|
| 62 | display : none; |
|---|
| 63 | } |
|---|
| 64 | .jstElements span { |
|---|
| 65 | display : inline-block; |
|---|
| 66 | vertical-align: top; |
|---|
| 67 | background: #e5e5e5; |
|---|
| 68 | } |
|---|
| 69 | span.jstSpacer { |
|---|
| 70 | width : 6px; |
|---|
| 71 | height: 28px; |
|---|
| 72 | margin-right: 0; |
|---|
| 73 | } |
|---|
| 74 | .jstSwitcher { |
|---|
| 75 | display: block; |
|---|
| 76 | list-style: none; |
|---|
| 77 | margin: 0; |
|---|
| 78 | padding: 0 0 5px 0; |
|---|
| 79 | background: #dfdfdf; |
|---|
| 80 | border-top: 1px solid #999; |
|---|
| 81 | } |
|---|
| 82 | .jstSwitcher li { |
|---|
| 83 | display: inline; |
|---|
| 84 | margin: 0 0 0 5px; |
|---|
| 85 | padding: 2px 8px; |
|---|
| 86 | } |
|---|
| 87 | .jstSwitcher li.jstSwitcherCurrent { |
|---|
| 88 | color: #fff; |
|---|
| 89 | background: #677374; |
|---|
| 90 | border-radius: 0 0 2px 2px; |
|---|
| 91 | } |
|---|
| 92 | .jstSwitcher a { |
|---|
| 93 | font-weight: normal; |
|---|
| 94 | border-bottom: none !important; |
|---|
| 95 | } |
|---|
| 96 | |
|---|
| 97 | /* Buttons |
|---|
| 98 | -------------------------------------------------------- */ |
|---|
| 99 | button.jstb_strong { |
|---|
| 100 | background-image: url(bt_strong.png); |
|---|
| 101 | } |
|---|
| 102 | button.jstb_em { |
|---|
| 103 | background-image: url(bt_em.png); |
|---|
| 104 | } |
|---|
| 105 | button.jstb_ins { |
|---|
| 106 | background-image: url(bt_ins.png); |
|---|
| 107 | } |
|---|
| 108 | button.jstb_del { |
|---|
| 109 | background-image: url(bt_del.png); |
|---|
| 110 | } |
|---|
| 111 | button.jstb_quote { |
|---|
| 112 | background-image: url(bt_quote.png); |
|---|
| 113 | } |
|---|
| 114 | button.jstb_code { |
|---|
| 115 | background-image: url(bt_code.png); |
|---|
| 116 | } |
|---|
| 117 | button.jstb_paragraph { |
|---|
| 118 | background-image: url(bt_paragraph.png); |
|---|
| 119 | } |
|---|
| 120 | button.jstb_br { |
|---|
| 121 | background-image: url(bt_br.png); |
|---|
| 122 | } |
|---|
| 123 | button.jstb_blockquote { |
|---|
| 124 | background-image: url(bt_bquote.png); |
|---|
| 125 | } |
|---|
| 126 | button.jstb_pre { |
|---|
| 127 | background-image: url(bt_pre.png); |
|---|
| 128 | } |
|---|
| 129 | button.jstb_ul { |
|---|
| 130 | background-image: url(bt_ul.png); |
|---|
| 131 | } |
|---|
| 132 | button.jstb_ol { |
|---|
| 133 | background-image: url(bt_ol.png); |
|---|
| 134 | } |
|---|
| 135 | button.jstb_link { |
|---|
| 136 | background-image: url(bt_link.png); |
|---|
| 137 | } |
|---|
| 138 | button.jstb_img { |
|---|
| 139 | background-image: url(bt_img.png); |
|---|
| 140 | } |
|---|
| 141 | button.jstb_img_select { |
|---|
| 142 | background-image: url(bt_img_select.png); |
|---|
| 143 | } |
|---|
| 144 | button.jstb_post_link { |
|---|
| 145 | background-image: url(bt_post.png); |
|---|
| 146 | } |
|---|
| 147 | button.jstb_removeFormat { |
|---|
| 148 | background-color: #e5e5e5; |
|---|
| 149 | background-image: url(bt_clean.png); |
|---|
| 150 | position: absolute; |
|---|
| 151 | right: 0; |
|---|
| 152 | } |
|---|
| 153 | |
|---|
| 154 | /* WYSIWYG Iframe */ |
|---|
| 155 | .wysiwygIframe { |
|---|
| 156 | border-width : 1px; |
|---|
| 157 | border-style : solid; |
|---|
| 158 | border-color : #000 #ccc #ccc #000; |
|---|
| 159 | width : 100%; |
|---|
| 160 | } |
|---|
| 161 | |
|---|
| 162 | /* WYSIWYG Document */ |
|---|
| 163 | body.wysiwygDoc { |
|---|
| 164 | font: 12px "DejaVu Sans","Lucida Grande","Lucida Sans Unicode",Arial,sans-serif; |
|---|
| 165 | color : #000; |
|---|
| 166 | background: #f9f9f9; |
|---|
| 167 | margin: 0; |
|---|
| 168 | padding : 2px; |
|---|
| 169 | border: none; |
|---|
| 170 | } |
|---|
| 171 | .wysiwygDoc pre, .wysiwygDoc code, .wysiwygDoc kbd, .wysiwygDoc samp { |
|---|
| 172 | font-family:"Courier New",Courier,monospace; |
|---|
| 173 | font-size : 1.1em; |
|---|
| 174 | } |
|---|
| 175 | .wysiwygDoc code { |
|---|
| 176 | color : #666; |
|---|
| 177 | font-weight : bold; |
|---|
| 178 | } |
|---|
| 179 | body.wysiwygDoc > p:first-child { |
|---|
| 180 | margin-top: 0; |
|---|
| 181 | } |
|---|