It is possible to edit styles where a content type or layout has light text on a dark background which does not show clearly in the admin screen.

Last updated: 06/02/2014 09:28 by istewart

In Add/Edit Page - Content tab editing section. It is possible to customise mouse over contrast indicating editable section.

The following styles are used to govern the appearance of the editable area in the content editing section of the Sitekit CMS control panel:

For Div based layouts customise the following classes:
.editablemouseover
.editablemouseout
.editableimagemouseover
.editableimagemouseover img
.editableimagemouseout
.editableimagemouseout img

For Tabular layouts customise:
table.editableimagemouseover
table.editableimagemouseover td
table.editableimagemouseout
table.editableimagemouseout td


For instance styles can be edited as follow:

Navigate to below to page repression to "Site style or override for this page" section

Follow style sheet link – this opens "Site Templates" in "Edit Style Sheet" mode

Modify style sheet applying custom styling for instance:

.editablemouseover
{
border: solid red;
background-colour: none;
}

.editablemouseout
{
border:none;
}

.editableimagemouseover
{
border: solid red;
background-colour: none;
}

.editableimagemouseover img
{
border:none;
}

.editableimagemouseout
{
border:none;
}

.editableimagemouseout img
{
border:none;
}

And “Save Style Sheet”, you should ensure that the style naming convention is not repeated on your own layout and for simplicity you should restrict yourself to only editing the colour (emboldened in the example).