Skip to content

Instantly share code, notes, and snippets.

@fleimisch
Last active September 22, 2015 22:28
Show Gist options
  • Save fleimisch/036f9ff1b53819bff08f to your computer and use it in GitHub Desktop.
Save fleimisch/036f9ff1b53819bff08f to your computer and use it in GitHub Desktop.
SCE Default CSS Names
/* Header Main Navigation Links */
.headermainnav a {}
.headermainnav a:hover {}
.headermainnavHighlight a {}
.headermainnavHighlight a:hover {}
/* Default Input Boxes */
.DefaultInput {border:1px solid #ccc; font-size:13px; line-height:16px; padding:5px 3px; height:28px; background:white; -moz-border-radius: 2px;-webkit-border-radius: 2px;-khtml-border-radius: 2px;border-radius: 2px;}
.DefaultSelect {border:1px solid #ccc; font-size:13px; line-height:24px; padding:2px 1px; height:24px; background:white; -moz-border-radius: 2px;-webkit-border-radius: 2px;-khtml-border-radius: 2px;border-radius: 2px; height:28px;}
.DefaultTextArea {border:1px solid #ccc; font-size:13px; line-height:13px; padding:3px; background:white; -moz-border-radius: 2px;-webkit-border-radius: 2px;-khtml-border-radius: 2px;border-radius: 2px;}
/* INPUTS DEFAULT FOCUS STYLE */
.DefaultInput:focus, input.SCELoginInputReq:focus, html body .riSingle .riTextBox[type="text"]:focus, html body input.riFocused, input[type="password"]:focus, input[type="email"]:focus, .DefaultTextArea:focus, .rightBox input.text2:focus, .rightBox input.text:focus, .textCartQty:focus, .riTextBox:focus, .text3:focus {background:#fff5e3 !important; border:1px solid #fb9b2a !important;}
select:focus, select.SCELoginInputReq:focus, select.text3:focus {background:white !important; border:1px solid #fb9b2a !;}
/* ==========================================================================
BUTTON STYLES
========================================================================== */
.btn { display: inline-block; padding: 8px 12px; margin-bottom: 0; font-size: 14px; font-weight: normal; line-height: 1.428571429; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; background-image: none; border: 1px solid transparent; border-radius: 2px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; }
.btn:focus { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; }
.btn:hover, .btn:focus { color: #555555; text-decoration: none; }
.btn:active, .btn.active { background-image: none; outline: 0; -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); }
.btn.disabled, .btn[disabled], fieldset[disabled] .btn, select[disabled], input[disabled] { pointer-events: none; cursor: not-allowed; opacity: 0.65; filter: alpha(opacity=65); -webkit-box-shadow: none; box-shadow: none; }
.btn .caret { border-top-color: #fff; }
.btn-default:hover { color: #555555; }
.btn-default .caret { border-top-color: #555555; }
.btn i {font-size:13px; line-height:13px; display: block; margin-top: 3px;}
/* DEFAULT STYLE
========================================================================== */
.btn-default {
background:#f3f3f3;
border:none;
}
.btn-default { color: #555555;}
.btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default.active, .open .dropdown-toggle.btn-default { color: #555555; background-color: #dfdfdf; }
.btn-default:active, .btn-default.active, .open .dropdown-toggle.btn-default { background-color: #dfdfdf; }
.btn-default.disabled, .btn-default[disabled], fieldset[disabled] .btn-default, .btn-default.disabled:hover, .btn-default[disabled]:hover, fieldset[disabled] .btn-default:hover, .btn-default.disabled:focus, .btn-default[disabled]:focus, fieldset[disabled] .btn-default:focus, .btn-default.disabled:active, .btn-default[disabled]:active, fieldset[disabled] .btn-default:active, .btn-default.disabled.active, .btn-default[disabled].active, fieldset[disabled] .btn-default.active { background-color: #f3f3f3; }
.btn-default .badge { color: #ffffff; background-color: #fff; }
.btn-default.dropdown-toggle {border-left:1px solid #cacaca}
/* DEFAULT WIRE */
.btn-default.wire {
background:white;
border: 2px solid #0c2b3f;
color:#0c2b3f;
font-weight:bold;
text-shadow:none;
}
.btn-default.wire:hover {
background:#0c2b3f;
border: 2px solid #0c2b3f;
color:white;
font-weight:bold;
text-shadow:none;
}
/* PRIMARY STYLE
========================================================================== */
.btn-primary {
background:#0c2b3f;
background-repeat: no-repeat;
border: none;
}
.btn-primary { color: #ffffff; background-color: #0c2b3f; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {
color: #ffffff;
background:#3d5967;
border: none;
}
.btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary { background:#3d5967; }
.btn-primary.disabled, .btn-primary[disabled], fieldset[disabled] .btn-primary, .btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled:active, .btn-primary[disabled]:active, fieldset[disabled] .btn-primary:active, .btn-primary.disabled.active, .btn-primary[disabled].active, fieldset[disabled] .btn-primary.active { background-color: #3d5967; }
.btn-primary .badge { color: #0c2b3f; background-color: #fff; }
/* PRIMARY WIRE */
.btn-primary.wire {
background:white;
border: 2px solid #0c2b3f;
color:#0c2b3f;
font-weight:bold;
text-shadow:none;
}
.btn-primary.wire:hover {
background:#0c2b3f;
border: 2px solid #0c2b3f;
color:white;
font-weight:bold;
text-shadow:none;
}
/* SECONDARY STYLE
========================================================================== */
.btn-secondary {
background:#59423a;
border:none;
}
.btn-secondary { color: #ffffff; background-color: #59423a; }
.btn-secondary:hover, a.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active, .btn-secondary.active, .open .dropdown-toggle.btn-secondary { color: #ffffff; background-color: #aa9a8d; background-image:none; }
.btn-secondary:active, .btn-secondary.active, .open .dropdown-toggle.btn-secondary { background-color: #aa9a8d; }
.btn-secondary.disabled, .btn-secondary[disabled], fieldset[disabled] .btn-secondary, .btn-secondary.disabled:hover, .btn-secondary[disabled]:hover, fieldset[disabled] .btn-secondary:hover, .btn-secondary.disabled:focus, .btn-secondary[disabled]:focus, fieldset[disabled] .btn-secondary:focus, .btn-secondary.disabled:active, .btn-secondary[disabled]:active, fieldset[disabled] .btn-secondary:active, .btn-secondary.disabled.active, .btn-secondary[disabled].active, fieldset[disabled] .btn-secondary.active { background-color: #59423a;}
.btn-secondary .badge { color: #59423a; background-color: #fff; }
/* SECONDARY WIRE */
.btn-secondary.wire {
background:transparent;
border: 2px solid #59423a;
color:#59423a;
font-weight:bold;
text-shadow:none;
}
.btn-secondary.wire:hover {
background:transparent;
border: 2px solid #aa9a8d;
color:#59423a;
font-weight:bold;
text-shadow:none;
}
/* INFO STYLE
========================================================================== */
.btn-info {
background:#52b3d9;
border:none;
}
.btn-info { color: #ffffff; background-color: #52b3d9; }
.btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active, .open .dropdown-toggle.btn-info { color: #ffffff; background-color: #419fc4; }
.btn-info:active, .btn-info.active, .open .dropdown-toggle.btn-info { background:#419fc4;}
.btn-info.disabled, .btn-info[disabled], fieldset[disabled] .btn-info, .btn-info.disabled:hover, .btn-info[disabled]:hover, fieldset[disabled] .btn-info:hover, .btn-info.disabled:focus, .btn-info[disabled]:focus, fieldset[disabled] .btn-info:focus, .btn-info.disabled:active, .btn-info[disabled]:active, fieldset[disabled] .btn-info:active, .btn-info.disabled.active, .btn-info[disabled].active, fieldset[disabled] .btn-info.active { background-color: #52b3d9; }
.btn-info .badge { color: #52b3d9; background-color: #fff; }
/* INFO WIRE */
.btn-info.wire {
background:transparent;
border: 2px solid #52b3d9;
color:#52b3d9;
font-weight:bold;
text-shadow:none;
}
.btn-info.wire:hover {
background:transparent;
border: 2px solid #2d80a1;
color:#52b3d9;
font-weight:bold;
text-shadow:none;
}
/* LINK STYLE
========================================================================== */
.btn-link {
background:transparent;
border:none;
}
.btn-link { color: #0c2b3f; }
.btn-link:hover, .btn-link:focus, .btn-link:active, .btn-link.active, .open .dropdown-toggle.btn-link { color: #0c2b3f; background:#fafafa;}
.btn-link:active, .btn-link.active, .open .dropdown-toggle.btn-link { background:#fafafa;}
.btn-link.disabled, .btn-link[disabled], fieldset[disabled] .btn-link, .btn-link.disabled:hover, .btn-link[disabled]:hover, fieldset[disabled] .btn-link:hover, .btn-link.disabled:focus, .btn-link[disabled]:focus, fieldset[disabled] .btn-link:focus, .btn-link.disabled:active, .btn-link[disabled]:active, fieldset[disabled] .btn-link:active, .btn-link.disabled.active, .btn-link[disabled].active, fieldset[disabled] .btn-link.active { background:transparent;}
.btn-link .badge { color: #52b3d9; }
/* LINK WIRE */
.btn-link.wire {
background:transparent;
border: 2px solid #ececec;
color:#3d3d3d;
font-weight:bold;
text-shadow:none;
}
.btn-link.wire:hover {
background:transparent;
border: 2px solid #c6c6c6;
color:#3d3d3d;
font-weight:bold;
text-shadow:none;
}
/* WARNING STYLE
========================================================================== */
.btn-warning {
background:#F89406;
border:none;
}
.btn-warning { color: #ffffff; background-color: #F89406; }
.btn-warning:hover, .btn-warning:focus, .btn-warning:active, .btn-warning.active, .open .dropdown-toggle.btn-warning { color: #ffffff; background-color: #f57b03;}
.btn-warning:active, .btn-warning.active, .open .dropdown-toggle.btn-warning { background-image: none; }
.btn-warning.disabled, .btn-warning[disabled], fieldset[disabled] .btn-warning, .btn-warning.disabled:hover, .btn-warning[disabled]:hover, fieldset[disabled] .btn-warning:hover, .btn-warning.disabled:focus, .btn-warning[disabled]:focus, fieldset[disabled] .btn-warning:focus, .btn-warning.disabled:active, .btn-warning[disabled]:active, fieldset[disabled] .btn-warning:active, .btn-warning.disabled.active, .btn-warning[disabled].active, fieldset[disabled] .btn-warning.active { background-color: #F89406; }
.btn-warning .badge { color: #F89406; background-color: #fff; }
/* WARNING WIRE */
.btn-warning.wire {
background:transparent;
border: 2px solid #F89406;
color:#F89406;
font-weight:bold;
text-shadow:none;
}
.btn-warning.wire:hover {
background:transparent;
border: 2px solid #d15f02;
color:#F89406;
font-weight:bold;
text-shadow:none;
}
/* DANGER STYLE
========================================================================== */
.btn-danger {
background:#ef4836;
border:none;
}
.btn-danger { color: #ffffff; background-color: #ef4836; }
.btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active, .open .dropdown-toggle.btn-danger { color: #ffffff; background-color: #d52310; }
.btn-danger:active, .btn-danger.active, .open .dropdown-toggle.btn-danger { background-image: none; }
.btn-danger.disabled, .btn-danger[disabled], fieldset[disabled] .btn-danger, .btn-danger.disabled:hover, .btn-danger[disabled]:hover, fieldset[disabled] .btn-danger:hover, .btn-danger.disabled:focus, .btn-danger[disabled]:focus, fieldset[disabled] .btn-danger:focus, .btn-danger.disabled:active, .btn-danger[disabled]:active, fieldset[disabled] .btn-danger:active, .btn-danger.disabled.active, .btn-danger[disabled].active, fieldset[disabled] .btn-danger.active { background-color: #ef4836; }
.btn-danger .badge { color: #ef4836; background-color: #fff; }
/* DANGER WIRE */
.btn-danger.wire {
background:transparent;
border: 2px solid #ef4836;
color:#ef4836;
font-weight:bold;
text-shadow:none;
}
.btn-danger.wire:hover {
background:transparent;
border: 2px solid #bf2514;
color:#ef4836;
font-weight:bold;
text-shadow:none;
}
/* Default Text Variations */
.text-muted {
color: #888;
}
.text-primary {
color: #0c2b3f;
}
a.text-primary:hover {
color: #3d5967;
}
.text-success {
color: #2ecc71;
}
a.text-success:hover {
color: #1eb960;
}
.text-info {
color: #52b3d9;
}
a.text-info:hover {
color: #419fc4;
}
.text-warning {
color: #F89406;
}
a.text-warning:hover {
color: #f57b03;
}
.text-danger {
color: #ef4836;
}
a.text-danger:hover {
color: #d52310;
}
.bg-primary {
color: #fff;
background-color: #0c2b3f;
}
a.bg-primary:hover {
background-color: #3d5967;
}
.bg-success {
background-color: #2ecc71;
}
a.bg-success:hover {
background-color: #1eb960;
}
.bg-info {
background-color: #52b3d9;
}
a.bg-info:hover {
background-color: #419fc4;
}
.bg-warning {
background-color: #F89406;
}
a.bg-warning:hover {
background-color: #f57b03;
}
.bg-danger {
background-color: #ef4836;
}
a.bg-danger:hover {
background-color: #d52310;
}
.btn-lg { padding: 14px 16px; font-size: 18px; line-height: 1.33; border-radius: 2px; }
.btn-sm { padding: 4px 10px; font-size: 12px; line-height: 20px; height:28px; border-radius: 2px; }
.btn-xs { padding: 2px 5px; font-size: 12px; line-height: 1.5; border-radius: 2px; }
.btn-xxs { padding: 4px 5px; font-size: 11px; line-height: 11px; border-radius: 2px; font-weight: 500; letter-spacing: 0.3px; }
.btn-block { display: block; width: 100%; padding-right: 0; padding-left: 0; }
.btn-block + .btn-block { margin-top: 5px; }
input[type="submit"].btn-block, input[type="reset"].btn-block, input[type="button"].btn-block { width: 100%; }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment