HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.
How to style Cleditor anyway you want
vrijvlinder
MVP
Go to the file jquery.cleditor.css
You will find the this is the style sheet for Cleditor. You will have to add the file for the buttons background and I made a new button array png because the old one was fuzzy.
.cleditorMain {border:1px solid #999; padding:0 1px 1px; background-color:#222222;}
.cleditorMain iframe {border:none; margin:0; padding:0}
.cleditorMain textarea {border:none; margin:0; padding:0; overflow-y:scroll; font:10pt Arial,Verdana; resize:none; outline:none /* webkit grip focus */}
.cleditorToolbar {background: url('images/tealbutton.png') repeat}
.cleditorGroup {float:left; height:26px}
.cleditorButton {float:left; width:24px; height:24px; margin:1px 0 1px 0; background: url('images/buttons.png')}
.cleditorDisabled {opacity:0.3; filter:alpha(opacity=30)}
.cleditorDivider {float:left; width:1px; height:23px; margin:1px 0 1px 0; background:#222222}
.cleditorPopup {border:solid 1px #999; background-color:#666666; position:absolute; font:10pt Arial,Verdana; cursor:default; z-index:10000}
.cleditorList div {padding:2px 4px 2px 4px}
.cleditorList p,
.cleditorList h1,
.cleditorList h2,
.cleditorList h3,
.cleditorList h4,
.cleditorList h5,
.cleditorList h6,
.cleditorList font {padding:0; margin:0; background-color:#666666}
.cleditorColor {width:150px; padding:1px 0 0 1px}
.cleditorColor div {float:left; width:14px; height:14px; margin:0 1px 1px 0}
.cleditorPrompt {background-color:#F6F7F9; padding:4px; font-size:8.5pt}
.cleditorPrompt input,
.cleditorPrompt textarea {font:8.5pt Arial,Verdana;background-color: #D9D9D9}
.cleditorMsg {background-color:#666666; width:150px; padding:4px; font-size:8.5pt}
.cleditorList:focus{background-color:aqua}
Tagged:
6
Comments
Here is another style for those who like red..I included the redbutton.png for the bar
❌ ✊ ♥. ¸. ••. ¸♥¸. ••. ¸♥ ✊ ❌
OOO thanks for making the code look so nice and orderly for me !!
❌ ✊ ♥. ¸. ••. ¸♥¸. ••. ¸♥ ✊ ❌
Yep, added < pre > tags. You can just use HTML in those edit boxes too. Just don't add too much HTML junk. Most fun are the buttonbar MarkDown codes anyways.
There was an error rendering this rich post.
Thanks @UnderDog!!
❌ ✊ ♥. ¸. ••. ¸♥¸. ••. ¸♥ ✊ ❌
Awesome!
Don't forget to also alter the jquery.cleditor.min.js font if you use a dark background !
find this part it controls the input font of the rich text editor within cleditor
.
❌ ✊ ♥. ¸. ••. ¸♥¸. ••. ¸♥ ✊ ❌