Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Try Vanilla Forums Cloud product

How to style Cleditor anyway you want

vrijvlindervrijvlinder Papillon-Sauvage MVP
edited August 2013 in Tutorials

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}


Sign In or Register to comment.