Color scheme settings for PatternSkin

Use this topic to change the color settings of PatternSkin. When this topic is saved, the attachment my_colors.css will be updated with new color values. This method relies on Foswiki:Extensions.AttachContentPlugin to work.

AttachContentPlugin is not installed.

Usage

Step 1

Let PatternSkin point to the custom-made colors style sheet. In Main.SitePreferences copy this line:
   * Set USERCOLORSURL = %PUBURLPATH%/%SYSTEMWEB%/PatternSkinTheme/my_colors.css

Step 2

Edit this topic, and change the color as you like.

Step 3

Install AttachContentPlugin to be able to save this topic. On saving, an attachment will be created to topic PatternSkinTheme.

HELP For more help on customizing styles, see PatternSkinCustomization.

Color preference settings

On this page:

Logical groupings

Text

MAIN_TEXT Main text color

LIGHT_ON_DARK_TEXT Light on dark text color

GRAYED_TEXT

GENERAL_TEXT General text (black)

H1_HEADER_TEXT Header text

HEADER_TEXT Header text

CODE_TEXT Code text, left bar text and links

MUTED_TEXT Muted text (dark gray)

GRAYED_OUT_TEXT Grayed out text

SEPARATOR Separator

SIDEBAR_TEXT Side bar text

Links

LINK_TEXT_NORMAL Link normal text

LINK_BACKGROUND_NORMAL Link normal background

LINK_TEXT_NORMAL_VISITED Link normal text visited

LINK_TEXT_ACTION_BUTTON Link text red (same as LINK_BACKGROUND_HOVER)

LINK_TEXT_HOVER Link hover text

LINK_BACKGROUND_HOVER Link background hover

SIDE_BAR_LINK_TEXT Side bar link text

BUTTON_TEXT_NORMAL Button text

Disabled

DISABLED_BORDER Disabled border

DISABLED_TEXT Disabled text

DISABLED_BACKGROUND Disabled background

BUTTON_BORDERS_DISABLED Disabled button borders

Search results bottom

SEARCH_RESULTS_INFO_TEXT Search results info (green)

Alert

ALERT_TEXT Alert text (red)

ALERT_TEXT_MUTED Muted alert text (dark red)

ALERT_BORDER Alert border

Buttons

BUTTON_TEXT Button text color (dark gray)

BUTTON_BORDERS Button borders

BUTTON_BACKGROUND Button background

BUTTON_CANCEL_BACKGROUND Cancel button background

SUBMIT_BUTTON_BACKGROUND Submit button background

SUBMIT_BUTTON_BORDER_TEXT Submit button text color

SELECT_BORDER Select border

Background colors

PAGE_BACKGROUND General background color

MAIN_TEXT_BACKGROUND Main background color

NEUTRAL_BACKGROUND

SIDE_BAR_BACKGROUND Side bar background

TOP_BAR_BACKGROUND Top bar background

ATTACHMENT_AND_FORM_BACKGROUND Attachment, form

BACKGROUND_ON_FORM_BACKGROUND Table background on a form

TOPIC_ACTION_BACKGROUND Topic action row

CODE_BACKGROUND code, pre and verbatim

NOTIFICATION_BACKGROUND Info, broadcast message and notifications

INFO_BACKGROUND

Border colors

NEUTRAL_BORDER Info (light gray)

SEPARATOR_BORDER

STRONG_BORDER

ATTACHMENT_AND_FORM_BORDER Attachment, form

LAYOUT_ELEMENT_BORDER Main layout elements (neutral tone)

IMAGE_BORDER Image border

FORM_STEP_BORDER Form step border

NOTIFICATION_BORDER Notification messages

TOPIC_ACTION_BORDER Topic action border

INFO_BORDER Info border

Table colors

TABLE_DATA_BACKGROUND Table data background
TABLE_HEADER_BACKGROUND Table header background
TABLE_SELECTED_COLUMN_HEADER_BACKGROUND Sorted table column accent background
TABLE_DATA_ODD_BACKGROUND Table data background (odd row)
TABLE_DATA_EVEN_BACKGROUND Table data background (even row)
TABLE_DATA_ODD_SELECTED_BACKGROUND Table data background (odd row, selected column)
TABLE_DATA_EVEN_SELECTED_BACKGROUND Table data background (even row, selected column)
TABLE_DATA_MIX_BACKGROUND Table data background (mix between even and odd)

TABLE_BORDER Table border, sup (light neutral tone)

LINK_TEXT_NORMAL_TABLE_HEADER Table header link text

LINK_TEXT_NORMAL_BORDER_TABLE_HEADER Table header link border

LINK_TEXT_SORTED_TABLE_HEADER Sorted table header link text

LINK_TEXT_HOVER_TABLE_HEADER Table header link hover text

LINK_BORDER_TABLE_SELECTED_COLUMN_HEADER Link border in selected column header

Forms

INPUT_FIELD_BORDERS Input field borders

FORM_INPUT_BORDER Textarea, input and select (darker gray)

FORM_BORDER Form (same as foswikiTable border)

ACTIVE_FORM_BACKGROUND Edit form, form steps

FORMFIELD_ACTIVE Active form field

FORM_HEADER_TEXT Header text on form background

Do not change the text below this line unless you know what you are doing!
%STARTATTACH{"my_colors.css" web="%SYSTEMWEB%" topic="PatternSkinTheme"}%
/* PatternSkin colors */
/* Generated by AttachContentPlugin from %WEB%.PatternSkinColorSettings */

/* LAYOUT ELEMENTS */

#patternScreen {
    background:%PAGE_BACKGROUND%;
}
#patternPage {
    border-color:%STRONG_BORDER%;
}
#patternTopBar {
   border-color:%SEPARATOR_BORDER%;
   background:%PAGE_BACKGROUND%;
   /* color can be overridden with WEBHEADERBGCOLOR in System/DefaultPreferences */
}
#patternMain { /* don't set a background here; use patternOuter */ }
#patternOuter {
   background:none;
   border-color:%LAYOUT_ELEMENT_BORDER%;
}
#patternSideBar,
#patternWrapper {
   background:%SIDE_BAR_BACKGROUND%;
}
#patternBottomBar {
   border-color:%STRONG_BORDER%;
   background-color:%PAGE_BACKGROUND%;
}
#patternBottomBarContents,
#patternBottomBarContents a:link,
#patternBottomBarContents a:visited {
   color:%GRAYED_OUT_TEXT%;
}
#patternBottomBarContents a:hover {
   color:%LINK_TEXT_HOVER%;
}

/* GENERAL HTML ELEMENTS */

html body {
   background-color:%PAGE_BACKGROUND%;
   color:%MAIN_TEXT%;
}
html body.patternEditPage,
.mceContentBody {
   background-color:%MAIN_TEXT_BACKGROUND%;
}

/* be kind to netscape 4 that doesn't understand inheritance */
body, p, li, ul, ol, dl, dt, dd, acronym, h1, h2, h3, h4, h5, h6 {
   background-color:transparent;
}
hr {
   color:%SEPARATOR_BORDER%;
   background-color:%SEPARATOR_BORDER%;
}
pre, code, tt {
   color:%CODE_TEXT%;
}
pre {
   background:%CODE_BACKGROUND%;
   border-color:%NEUTRAL_BORDER%;
}
blockquote {
   background-color:%NEUTRAL_BACKGROUND%;
   border-color:%NEUTRAL_BORDER%;
}
blockquote h2 {
   background:none;
}
h1 {
   color:%H1_HEADER_TEXT%;
}
h2, h3, h4, h5, h6 {
   color:%HEADER_TEXT%;
}

/* to override old Render.pm coded font color style */
.foswikiNewLink font {
   color:inherit;
}
.foswikiNewLink a:link sup,
.foswikiNewLink a:visited sup {
   color:%MUTED_TEXT%;
   border-color:%NEUTRAL_BORDER%;
}
.foswikiNewLink a:hover sup {
   background-color:%LINK_BACKGROUND_HOVER%;
   color:%LINK_TEXT_HOVER%;
   border-color:%LINK_BACKGROUND_HOVER%;
}
.foswikiNewLink {
   border-color:%NEUTRAL_BORDER%;
}
:link:focus,
:visited:focus,
:link,
:visited,
:link:active,
:visited:active {
   color:%LINK_TEXT_NORMAL%;
   background-color:transparent;
}
:link:hover,
:visited:hover {
   color:%LINK_TEXT_HOVER%;
   background-color:%LINK_BACKGROUND_HOVER%;
   background-image:none;
}
:link:hover img,
:visited:hover img {
   background-color:transparent;
}
.foswikiTopic a:visited {
   color:%LINK_TEXT_NORMAL_VISITED%;
}
.foswikiTopic a:hover {
   color:%LINK_TEXT_HOVER%;
}
.foswikiUnvisited a:visited {
   color:%LINK_TEXT_NORMAL%;
}
.foswikiUnvisited a:hover {
   color:%LINK_TEXT_HOVER%;
}

/* Form elements */

textarea,
input,
select {
   border-color:%FORM_INPUT_BORDER%;
   color:%MAIN_TEXT%;
   background-color:%MAIN_TEXT_BACKGROUND%;
}
.foswikiSubmit,
.foswikiButton {
   border-color:%BUTTON_BORDERS%;
}
.foswikiSubmit {
   color:%SUBMIT_BUTTON_BORDER_TEXT%;
   background-color:%SUBMIT_BUTTON_BACKGROUND%;
}
.foswikiButton {
   color:%BUTTON_TEXT%;
   background-color:%BUTTON_BACKGROUND%;
}
.foswikiButtonCancel {
   color:%BUTTON_TEXT%;
   background-color:%BUTTON_CANCEL_BACKGROUND%;
}
.foswikiSubmitDisabled,
.foswikiSubmitDisabled:active {
   border-color:%BUTTON_BORDERS_DISABLED%;
   color:%DISABLED_TEXT%;
   background-color:%ACTIVE_FORM_BACKGROUND%;
}
.foswikiTextarea,
.foswikiInputField,
.foswikiInputFieldDisabled,
.foswikiInputFieldReadOnly,
.foswikiSelect {
   border-color:%INPUT_FIELD_BORDERS%;
}
.foswikiTextarea,
.foswikiInputField,
.foswikiSelect {
   color:%MAIN_TEXT%;
   background-color:%MAIN_TEXT_BACKGROUND%;
}
.foswikiInputField:active,
.foswikiInputField:focus,
.foswikiInputFieldFocus {
   background-color:%FORMFIELD_ACTIVE%;
}

.foswikiTextareaRawView {
   color:%GENERAL_TEXT%;
}
.foswikiInputFieldDisabled {
   color:%DISABLED_TEXT%;
   background-color:%DISABLED_BACKGROUND%;
}
.foswikiInputFieldReadOnly {
   color:%GRAYED_TEXT%;
}
.foswikiSelect {
   border-color:%INPUT_FIELD_BORDERS%;
   color:%MAIN_TEXT%;
   background-color:%MAIN_TEXT_BACKGROUND%;
}
.foswikiInputFieldDisabled,
.foswikiSelectDisabled {
   color:%DISABLED_TEXT%;
   border-color:%INPUT_FIELD_BORDERS%;
   background-color:%DISABLED_BACKGROUND%;
}
.foswikiInputFieldBeforeFocus {
   color:%MUTED_TEXT%;
}

/*   -----------------------------------------------------------
   Plugin elements
   -----------------------------------------------------------   */

/* TablePlugin */
.foswikiTable,
.foswikiTable td,
.foswikiTable th {
   border-color:%TABLE_BORDER%;
}
.foswikiTable th {
   background:%TABLE_HEADER_BACKGROUND%;
}
.foswikiTable th,
.foswikiTable th a:link,
.foswikiTable th a:visited {
   color:%LINK_TEXT_NORMAL_TABLE_HEADER%;
}

/* TwistyContrib */
.twistyPlaceholder {
   color:%GRAYED_OUT_TEXT%;
}
a:hover.twistyTrigger {
   color:%LINK_TEXT_HOVER%;
}

/* TipsContrib */
.tipsOfTheDay {
   background-color:%ATTACHMENT_AND_FORM_BACKGROUND%;
}

/* RevCommentPlugin */
.revComment .patternTopicAction {
   background-color:%ATTACHMENT_AND_FORM_BACKGROUND%;
}

/*   -----------------------------------------------------------
   Foswiki styles
   -----------------------------------------------------------   */

.foswikiGrayText {
   color:%GRAYED_OUT_TEXT%;
}
.foswikiGrayText a:link,
.foswikiGrayText a:visited {
   color:%GRAYED_OUT_TEXT%;
}
.foswikiGrayText a:hover {
   color:%LINK_TEXT_HOVER%;
}

.foswikiEditForm .foswikiFormTable,
.foswikiEditForm .foswikiFormTable th,
.foswikiEditForm .foswikiFormTable td {
   border-color:%TABLE_BORDER%;
}
.foswikiAttachments table {
   border-color:%TABLE_BORDER%;
   background-color:%MAIN_TEXT_BACKGROUND%;
}
table.foswikiFormTable,
.foswikiAttachments table,
.foswikiAttachments th,
.foswikiAttachments td {
   border-color:%TABLE_BORDER%;
   background-color:%BACKGROUND_ON_FORM_BACKGROUND% !important;
}
.foswikiForm td,
.foswikiForm th,
.foswikiAttachments td, 
.foswikiAttachments th {
   border-color:%TABLE_BORDER%;
}
.foswikiFormSteps {
   background-color:%ACTIVE_FORM_BACKGROUND%;
   border-color:%FORM_STEP_BORDER%;
}
.foswikiFormStep,
.patternPreviewFormStep {
   border-color:%FORM_STEP_BORDER%;
}
.foswikiFormStep h2 {
   color:%H1_HEADER_TEXT%;
}
.foswikiFormStep h3,
.foswikiFormStep h4 {
   color:%FORM_HEADER_TEXT%;
}
.foswikiFormStep h3,
.foswikiFormStep h4 {
   background-color:transparent;
}
.foswikiActionFormStepSign {
   color:%DISABLED_TEXT%;
}
.foswikiFormStep .foswikiHelp,
.foswikiFormStep .foswikiAllowNonWikiWord {
   background:%MAIN_TEXT_BACKGROUND%;
}
.foswikiToc .foswikiTocTitle {
   color:%MUTED_TEXT%;
}
.foswikiBroadcastMessage,
.foswikiNotification {
   background-color:%NOTIFICATION_BACKGROUND%;
   border-color:%NOTIFICATION_BORDER%;
}
.foswikiMessage {
   background-color:%NOTIFICATION_BACKGROUND%;
}
#foswikiLogin .patternLoginNotification {
   background-color:%MAIN_TEXT_BACKGROUND%;
   border-color:%ALERT_BORDER%;
}
.foswikiHelp {
   background-color:%INFO_BACKGROUND%;
   border-color:%INFO_BORDER%;
}
.foswikiBroadcastMessage b,
.foswikiBroadcastMessage strong {
   color:%ALERT_TEXT%;
}
.foswikiAlert,
.foswikiAlert code {
   color:%ALERT_TEXT%;
}
.foswikiEmulatedLink {
   color:%LINK_TEXT_NORMAL%;
}
.foswikiPageForm table {
   border-color:%TABLE_BORDER%;
   background:%MAIN_TEXT_BACKGROUND%;
}
.foswikiPageForm hr {
   border-color:%FORM_BORDER%;
   background-color:%FORM_BORDER%;
   color:%FORM_BORDER%;
}
.foswikiAccessKey {
   color:inherit;
   border-color:%GRAYED_OUT_TEXT%;
}
a:link .foswikiAccessKey,
a:visited .foswikiAccessKey {
   color:inherit;
}
a:hover .foswikiAccessKey {
   color:inherit;
}
.foswikiImage {
   background-color:%MAIN_TEXT_BACKGROUND%;
}
.foswikiImage img,
.foswikiImage a:link img,
.foswikiImage a:visited img {
   border-color:%IMAGE_BORDER%;
   background-color:%MAIN_TEXT_BACKGROUND%;
}
#patternTopBar .foswikiImage,
#patternTopBar .foswikiImage img {
   background-color:transparent;
}
.foswikiImage a:hover img {
   border-color:%LINK_TEXT_HOVER%;
}
.foswikiSeparator {
   color:%SEPARATOR%;
}
.foswikiHorizontalList ul li {
   border-color:%SEPARATOR%;
}
.foswikiAllowNonWikiWord {
   border-color:%LAYOUT_ELEMENT_BORDER%;
}

/*   -----------------------------------------------------------
   Pattern skin specific elements
   -----------------------------------------------------------   */
#patternPage {
   background-color:%MAIN_TEXT_BACKGROUND%;
}
.patternHomePathTitle,
.patternRevInfo,
.patternHomePath a:link,
.patternHomePath a:visited {
   color:%GRAYED_TEXT%;
}
.patternHomePath:hover a:link,
.patternHomePath:hover a:visited {
   color:%LINK_TEXT_NORMAL%;
}

/* Left bar */
#patternSideBarContents {
   color:%GENERAL_TEXT%;
}
#patternSideBarContents hr {
   color:%FORM_STEP_BORDER%;
   background-color:%FORM_STEP_BORDER%;
}
#patternSideBarContents a:link,
#patternSideBarContents a:visited {
   color:%SIDE_BAR_LINK_TEXT%;
}
#patternSideBarContents a:hover {
   color:%LINK_TEXT_HOVER%;
}
#patternSideBarContents .patternLeftBarPersonal,
#patternSideBarContents .patternWebIndicator {
    border-color:%LAYOUT_ELEMENT_BORDER%;
}
#patternSideBarContents b,
#patternSideBarContents strong {
    color:%SIDEBAR_TEXT%;
}

.patternTopicActions {
   background-color:%TOPIC_ACTION_BACKGROUND%;
   color:%MAIN_TEXT%;
}
.patternActionButtons a:link,
.patternActionButtons a:visited,
.patternActionButtons a:hover {
   color:%LINK_TEXT_NORMAL%;
}
.patternTopicAction s,
.patternTopicAction strike {
   color:%DISABLED_TEXT%;
}
.patternTopicAction .foswikiAccessKey {
   color:%LINK_TEXT_NORMAL%;
   border-color:%LINK_TEXT_NORMAL%;
}
.patternTopicAction a:hover .foswikiAccessKey {
   color:%LINK_TEXT_HOVER%;
}
.patternTopicAction label {
   color:%GENERAL_TEXT%;
}
.patternHelpCol {
   color:%GRAYED_OUT_TEXT%;
}
.patternSigLine {
   color:%MUTED_TEXT%;
}
.patternToolBar a:link .foswikiAccessKey,
.patternToolBar a:visited .foswikiAccessKey {
   color:inherit;
   border-color:%LINK_TEXT_NORMAL_VISITED%;
}
.patternToolBar a:hover .foswikiAccessKey {
   background-color:transparent;
   color:inherit;
   border-color:%LINK_TEXT_NORMAL_VISITED%;
}
.patternInfo,
.patternInfo a:link,
.patternInfo a:visited {
   color:%GRAYED_TEXT%;
}
.patternInfo:hover a:link,
.patternInfo:hover a:visited,
.patternInfo a:hover {
   color:%LINK_TEXT_NORMAL%;
}
.patternTwistyButton {
   color:%LINK_TEXT_NORMAL%;
}
.patternAttachmentHeader .foswikiSmall {
   color:%GRAYED_OUT_TEXT%;
}

/* WebSearch, WebSearchAdvanced */

table#foswikiSearchTable {
   border-color:%FORM_STEP_BORDER%;
   background-color:%PAGE_BACKGROUND%;
}
table#foswikiSearchTable th,
table#foswikiSearchTable td {
   background-color:%MAIN_TEXT_BACKGROUND%;
   border-color:%FORM_STEP_BORDER%;
}
table#foswikiSearchTable hr {
   border-color:%FORM_STEP_BORDER%;
   background-color:%FORM_STEP_BORDER%;
}
table#foswikiSearchTable th {
   color:%MAIN_TEXT%;
}

/*   -----------------------------------------------------------
   Search results
   styles and overridden styles used in search.pattern.tmpl
   -----------------------------------------------------------   */

.foswikiSearchResult .foswikiAlert {
   color:%ALERT_TEXT%;
}
.foswikiSearchResult .foswikiSummary .foswikiAlert {
   color:%ALERT_TEXT_MUTED%;
}
.foswikiSearchResult .foswikiBottomRow,
.foswikiSearchResult .foswikiBottomRow a:link,
.foswikiSearchResult .foswikiBottomRow a:visited {
   color:%SEARCH_RESULTS_INFO_TEXT%;
}
.foswikiSearchResult .foswikiBottomRow:hover a:link,
.foswikiSearchResult .foswikiBottomRow:hover a:visited {
   color:%LINK_TEXT_NORMAL%;
}
.patternViewPage .patternSearchResultsBegin {
   border-color:%TABLE_BORDER%;
}

/* preview.pattern.tmpl */

.foswikiPreviewArea {
   background:%MAIN_TEXT_BACKGROUND%;
}

/* rdiff.pattern.tmpl */

.patternDiff,
.patternDiffPage .foswikiDiffTable {
   border-color:%STRONG_BORDER%;
}
.patternDiff .foswikiTopRow {
   background-color:%NEUTRAL_BACKGROUND%;
}
tr.foswikiDiffDebug td {
   border-color:%NEUTRAL_BACKGROUND%;
}
.foswikiDiffTable table th {
   background-color:%NEUTRAL_BACKGROUND%;
}
.foswikiDiffTable th {
   background-color:%NEUTRAL_BACKGROUND%;
}
/* Changed */
.foswikiDiffChangedHeader {
   /* violet - do not change */
   background:#ccf !important;
}
.foswikiDiffChangedText {
   /* violet - do not change */
   border-color:#99f !important;
   background-color:#fff !important;
}
/* Deleted */
.foswikiDiffDeletedHeader {
   background-color:#ffd6d6 !important;
}
.foswikiDiffDeletedMarker {
   /* red - do not change */
   border-color:#f33 !important;
   background-color:#fff !important;
}
/* Added */
.foswikiDiffAddedHeader {
   background-color:#ccf5d6 !important;
}
.foswikiDiffAddedMarker {
   /* green - do not change */
   border-color:#0c3 !important;
   background-color:#fff !important;
}
/* Unchanged */
.foswikiDiffUnchangedMarker {
   border-color:%NEUTRAL_BACKGROUND% !important;
   background-color:#fff !important;
}
.foswikiDiffUnchangedText {
   color:%GRAYED_OUT_TEXT%;
}
.foswikiDiffUnchangedTextContents { }
.foswikiDiffLineNumberHeader th {
   background-color:%NEUTRAL_BACKGROUND% !important;
}




/* IMAGES */
/* image positions are set here as well as these are dependent on the image */

#patternTopBar {
    /* image is defined as WEBHEADERART in System/DefaultPreferences */
}
.foswikiToc li {
   background-image:url(bullet-toc.gif);
   background-repeat:no-repeat;
   background-position:0 .4em;
}
.patternPrintPage #patternOuter {
   background:#fff; /* white - do not change */
}
.foswikiSubmit,
.foswikiSubmitDisabled {
   background-image:url(bg_submit_gradient.gif);
   background-repeat:repeat-x;
}
.foswikiSubmit,
a.foswikiSubmit:link,
a.foswikiSubmit:visited {
   background-position:0px 0px;
   background-color:#06c;
   border-color:#94cce2 #0e66a2 #0e66a2 #94cce2;
   color:#fff;
}
.foswikiSubmit:hover,
a.foswikiSubmit:hover {
   background-position:0px -80px;
   background-color:#0047b7;
   border-color:#0e66a2 #94cce2 #94cce2 #0e66a2;
   color:#fff;
}
.foswikiSubmit:active,
a.foswikiSubmit:active {
   background-position:0px -160px;
   background-color:#73ace6;
   border-color:#0e66a2 #94cce2 #94cce2 #0e66a2;
   color:#fff;
}
.foswikiSubmitDisabled,
.foswikiSubmitDisabled:hover,
.foswikiSubmitDisabled:active {
   background-position:0px -240px;
   background-color:#d9e8f7;
   border-color:#ccc #ccc #ccc #ccc;
   color:#ccc;
}
.foswikiButton,
a.foswikiButton:link,
a.foswikiButton:visited {
   background-image:url(bg_button_gradient.gif);
   background-repeat:repeat-x;
   background-position:0px 0px;
   border-color:#fff #94cce2 #94cce2 #fff;
   background-color:#cce7f1;
   color:%BUTTON_TEXT_NORMAL%;
}
.foswikiButton:hover,
.foswikiButton:active,
a.foswikiButton:hover,
a.foswikiButton:active {
   background-position:0px -160px;
   border-color:#94cce2 #94cce2 #94cce2 #94cce2;
   background-color:#cce7f1;
   color:%BUTTON_TEXT_NORMAL%;
}
.foswikiButtonDisabled,
.foswikiButtonDisabled:hover,
.foswikiButtonDisabled:active {
   background-image:url(bg_button_gradient.gif);
   background-repeat:repeat-x;
   background-position:0px -240px;
   border-color:#ccc #ccc #ccc #ccc;
   background-color:#edece6;
   color:#bbb;
}
.foswikiButtonCancel {
   background-image:url(bg_buttoncancel_gradient.gif);
   background-repeat:repeat-x;
   background-position:0px 0px;
   border-color:#f3ddd7 #ce5232 #ce5232 #f3ddd7;
   background-color:#dd724d;
   color:#fff;
}
.foswikiButtonCancel:hover {
   background-position:0px -80px;
   border-color:#ce5232 #f3ddd7 #f3ddd7 #ce5232;
   background-color:#dd724d;
   color:#fff;
}
.foswikiButtonCancel:active {
   background-position:0px -160px;
   border-color:#ce5232 #f3ddd7 #f3ddd7 #ce5232;
   background-color:#dd724d;
   color:#fff;
}
.patternToolBar span a:link,
.patternToolBar span a:visited,
.patternToolBar span s,
.patternToolBar span strike {
   background-image:url(bg_button_gradient.gif);
   background-repeat:repeat-x;
}
.patternToolBar span a:link,
.patternToolBar span a:visited {
   background-position:0px 0px;
   border-color:#fff #94cce2 #94cce2 #fff;
   background-color:#cce7f1;
   color:%BUTTON_TEXT_NORMAL%;
}
.patternToolBar span a:hover {
   background-position:0px -80px;
   border-color:#94cce2 #94cce2 #94cce2 #94cce2;
   background-color:#cce7f1;
   color:#222;
}
.patternToolBar span a:active {
   background-position:0px -160px;
   border-color:#94cce2 #94cce2 #94cce2 #94cce2;
   background-color:#e8e5d7;
   color:#222;
}
.patternToolBar span s,
.patternToolBar span strike {
   background-position:0px -240px;
   border-color:#eae9e7 #eae9e7 #eae9e7 #eae9e7;
   background-color:#edece6;
   color:#bbb;
}
.patternTextareaButton {
   border-color:#fffefd #b8b6ad #b8b6ad #fffefd;
   overflow:hidden;
}
.patternButtonFontSelector {
   background-image:url(button_font_selector.gif);
   width:33px;
   height:16px;
}
.patternButtonFontSelectorProportional {
   background-position:0 0;
}
.patternButtonFontSelectorMonospace {
   background-position:0 -16px;
}
.patternButtonEnlarge,
.patternButtonShrink {
   background-image:url(button_arrow.gif);
   width:16px;
   height:16px;
}
.patternButtonEnlarge {
   background-position:0 0;
}
.patternButtonEnlarge:hover {
   background-position:0 -42px;
}
.patternButtonEnlarge:active {
   background-position:0 -84px;
}
.patternButtonShrink {
   background-position:16px 0;
}
.patternButtonShrink:hover {
   background-position:16px -42px;
}
.patternButtonShrink:active {
   background-position:16px -84px;
}

/* common settings */
.patternLeftBarPersonal li,
li.patternLogOut,
li.patternLogIn {
   padding-left:13px;
   background-position:0 .4em;
   background-repeat:no-repeat;
}
.patternLeftBarPersonal li {
   background-image:url(bullet-personal_sidebar.gif);
}
.patternLeftBarPersonal li.patternLogOut {
   background-image:url(bullet-lock.gif);
}
.patternLeftBarPersonal li.patternLogIn {
   background-image:url(bullet-lock.gif);
}
#foswikiLogin,
.patternShadow {
   border:10px solid %MAIN_TEXT_BACKGROUND%;
   margin-top:10px;
   margin-bottom:10px;
   -moz-box-shadow: 0 0 10px %STRONG_BORDER%;
   -webkit-box-shadow: 0 0 10px %STRONG_BORDER%;
   box-shadow: 0 0 10px %STRONG_BORDER%;
}
.patternBorder {
   border-color:%NEUTRAL_BORDER%;
}
.foswikiJs a.jqPopUpWindow:link,
.foswikiJs a.jqPopUpWindow:visited,
.foswikiJs a.jqPopUpWindow:hover {
   background-image:url(popup.gif);
   background-repeat:no-repeat;
   background-position:right;
   padding-right:14px;
   margin-right:3px;
}
%ENDATTACH%


This topic: System > Skins > PatternSkin > PatternSkinColorSettings
Topic revision: 02 Nov 2011, UnknownUser
This site is powered by FoswikiCopyright © by the contributing authors. All material on this site is the property of the contributing authors.
Ideas, requests, problems regarding Foswiki? Send feedback