MyBB Community Forums

Full Version: SCEditor: Need to change default SCEditor template so it matches current theme?
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
SCEditor-MyBB
Need to change default SCEditor template so it matches current theme?
I don't mean the tool bar. I mean the work space.

I've installed the SCE successfully and everything works great but . . .
I have a dark coloured site. Dark slate background with pale gray text.

How can I change the default of the editor so it matches the preview and output when it's in WYSIWYG mode i.e. dark gray background with pale gray letters?

You are our last hope Obi-Wan

[Image: d3eeecf8-2b33-11e3-9f88-ec6e60fd1bf9.png]
The Confederacy of Aman | Municipal Information Systems
http://coa-mis.net/
SCeditor has its stylesheet here at the MyBB files server : /jscripts/sceditor/jquery.sceditor.mybb.css
you have to edit that stylesheet and add background for body like below
body { background: #2A2A2A;
and for html, body, p, code:before, table (line 2 of above referred stylesheet) you can add color like below
html, body, p, code:before, table {color: white;

Edit: turn on development mode at cloudflare before modifying stylesheets
Thanks .m. you are a gem.

Yeah I got happy too fast.
Glad I made a backup copy of the file before editing it.
I've made several attempts to change . . .
body { background: #2A2A2A;
}
html, body, p, code:before, table {color: #2A2A2A;
	margin: 0;
	padding: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #FFFFFF;
}
html {
	/* Needed so the cursor will be placed at the end of the content
	   when the there isn't enought content to fill the full viewport */
	height: 100%;

	/* Needed for iOS scrolling bug fix */
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}
body {
	/* Needed for iOS scrolling bug fix */
	position: relative;
	overflow: auto;

	/* Needed so the cursor will be placed at the end of the content
	   when the there isn't enought content to fill the full viewport */
	min-height: 100%;

	word-wrap: break-word;

}

table, td {
	border: 1px dotted #000;

	/* Show empty cells so they can be edited */
	empty-cells: show;
}

code:before {
	font-weight: bold;
	content: 'Code:';
	display: block;
	border-bottom: 1px solid black;
	padding: 4px 0 2px;
	margin: 0 0 4px;
}
code {
	font-family: Monaco, Consolas, Courier, monospace;
	padding: 4px;
	position: relative;
	background: #7C7877;
	border: 1px solid #ccc;
	white-space: pre;
	display: block;
}
.ie6 code, .ie7 code {margin-top: 0;}
code:before, code {
	display: block;
	text-align: left;
}

blockquote {
	position: relative;
	background: #7C7877;
	margin: .25em 0;
	border: 1px solid #ccc;
	padding: 4px;
}
blockquote cite {
	font-weight: bold;
	font-style: normal;
	display: block;
	font-size: 1em;
	border-bottom: 1px solid black;
	margin: 4px 0;
}

/* prevent divs from being collapsed */
div { min-height: 1.25em; }
h1, h2, h3, h4, h5, h6 { padding: 0; margin: 0; }

ul, ol {
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
}

I switched to the browser and did shift-reload on the page and the workspace and fonts now display as white text on white workspace.

What am I doing wrong?

Grrrrr . . . help

It appears to be working now. I guess either you fixed it for me or the change need a some time work it's way through the system. When I was reading the FAQ on the CloudFlare site it said any changes I made while development was turned on would be immediate. This change took over a half hour.
(2013-10-03, 06:28 AM)Auriel Kitsu Wrote: [ -> ]Thanks .m. you are a gem.

Yeah I got happy too fast.
Glad I made a backup copy of the file before editing it.
I've made several attempts to change . . .
body { background: #2A2A2A;
}
html, body, p, code:before, table {color: #2A2A2A;
	margin: 0;
	padding: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #FFFFFF;
}
html {
	/* Needed so the cursor will be placed at the end of the content
	   when the there isn't enough content to fill the full viewport */
	height: 100%;

	/* Needed for iOS scrolling bug fix */
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}
body {
	/* Needed for iOS scrolling bug fix */
	position: relative;
	overflow: auto;

	/* Needed so the cursor will be placed at the end of the content
	   when the there isn't enough content to fill the full viewport */
	min-height: 100%;

	word-wrap: break-word;

}

table, td {
	border: 1px dotted #000;

	/* Show empty cells so they can be edited */
	empty-cells: show;
}

code:before {
	font-weight: bold;
	content: 'Code:';
	display: block;
	border-bottom: 1px solid black;
	padding: 4px 0 2px;
	margin: 0 0 4px;
}
code {
	font-family: Monaco, Consolas, Courier, monospace;
	padding: 4px;
	position: relative;
	background: #7C7877;
	border: 1px solid #ccc;
	white-space: pre;
	display: block;
}
.ie6 code, .ie7 code {margin-top: 0;}
code:before, code {
	display: block;
	text-align: left;
}

blockquote {
	position: relative;
	background: #7C7877;
	margin: .25em 0;
	border: 1px solid #ccc;
	padding: 4px;
}
blockquote cite {
	font-weight: bold;
	font-style: normal;
	display: block;
	font-size: 1em;
	border-bottom: 1px solid black;
	margin: 4px 0;
}

/* prevent divs from being collapsed */
div { min-height: 1.25em; }
h1, h2, h3, h4, h5, h6 { padding: 0; margin: 0; }

ul, ol {
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
}

I switched to the browser and did shift-reload on the page and the workspace and fonts now display as white text on white workspace.

What am I doing wrong?

Grrrrr . . . help



It appears to be working now. I guess either you fixed it for me or the change needed some time work it's way through the system. When I was reading the FAQ on the CloudFlare site it said any changes I made while development was turned on would be immediate. This change took over a half hour.

Something that I've done causes two instances of the editor, one stacked on top of the other to appear after each post.

Can anyone see what I could have done wrong in the CSS to cause this to happen?

All I meant to do was change the background colour to dark grey and the font to white.

Thanks in advance.

have you checked it with another browser? I am getting only one editor on your forum. checked quick
reply
, new reply & new thread. the css changes have nothing to do with dual showing of the editor.
(2013-10-05, 06:51 PM).m. Wrote: [ -> ]have you checked it with another browser? I am getting only one editor on your forum. checked quick
reply
, new reply & new thread. the css changes have nothing to do with dual showing of the editor.

Yes I just checked it with Chrome and it functioned perfectly normal.

I completely forgot I'm using FireFox 25.0 Beta, updated a few days ago it's definitely the browser. I need to switch to the standard build of FireFox since I'm doing this kind of work now and for the foreseeable future.

Thank you again.
.m.



I've rolled back to build 24 and about to start test. If that doesn't work I'll remove myself from the Beta program entirely.

.m.
It's definitely the FireFox and IE browsers having the problem. There is no problem with Chrome or Safari

I'm on XP Pro SP3 and using IE 8 which is a far as I'm able to upgrade on XP.
https://github.com/samclarke/SCEditor-MyBB/issues/47