panels_ipe.css in Panels 7.3
body.panels-ipe {
margin-bottom: 60px !important;
}
/* Hide the IPE toolbar on print output. */
@media print {
#panels-ipe-control-container {
display: none !important;
}
body.panels-ipe {
margin-top: 0 !important;
}
}
/* Hide the control container when the overlay is open. */
html.overlay-open #panels-ipe-control-container {
display: none !important;
}
html.overlay-open body.panels-ipe {
margin-top: 0 !important;
}
div.panels-ipe-handlebar-wrapper {
border-bottom: 1px solid #ccc;
}
.panels-ipe-editing div.panels-ipe-portlet-wrapper {
margin-top: 1em;
border: 1px solid #ccc;
width: 100%;
}
/* Hide empty panes when not editing them. */
.panels-ipe-empty-pane {
display: none;
}
.panels-ipe-editing .panels-ipe-empty-pane {
display: block;
}
.panels-ipe-editing div.panels-ipe-portlet-wrapper:hover {
border: 1px dashed #ccc;
}
.panels-ipe-editing .panels-ipe-sort-container {
min-height: 40px;
}
.panels-ipe-editing .panels-ipe-sort-container .ui-sortable-helper {
background: white;
}
.panels-ipe-editing div.panel-pane div.admin-links {
display: none !important;
}
.panels-ipe-editing .panels-ipe-sort-container .ui-sortable-placeholder {
border: 2px dashed #999;
background-color: #ffff99;
margin: 1em 0;
-moz-border-radius: 0;
-khtml-border-radius: 0;
-webkit-border-radius: 0;
border-radius: 0;
}
div.panels-ipe-handlebar-wrapper ul {
float: left;
margin: 0;
padding: 0;
text-align: right;
}
div.panels-ipe-handlebar-wrapper li {
background: none;
list-style-type: none;
list-style-image: none;
margin: 0 .5em 0 0;
padding: 0;
float: left;
}
div.panels-ipe-draghandle,
div.panels-ipe-nodraghandle {
background: #e9e9e9;
background-image: linear-gradient(bottom, #d5d5d5 0%, #fcfcfc 100%);
background-image: -o-linear-gradient(bottom, #d5d5d5 0%, #fcfcfc 100%);
background-image: -moz-linear-gradient(bottom, #d5d5d5 0%, #fcfcfc 100%);
background-image: -webkit-linear-gradient(bottom, #d5d5d5 0%, #fcfcfc 100%);
background-image: -ms-linear-gradient(bottom, #d5d5d5 0%, #fcfcfc 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, #d5d5d5),
color-stop(1, #fcfcfc)
);
padding: 8px 7px;
}
div.panels-ipe-draghandle span.panels-ipe-draghandle-icon {
display: block;
float: right;
cursor: move;
width: 34px;
height: 34px;
padding: 0 !important; /* override button defaults */
}
span.panels-ipe-draghandle-icon-inner {
display: block;
width: 34px;
height: 34px;
background: url(../images/icon-draggable.png) no-repeat 3px 3px;
}
div.panels-ipe-placeholder {
border: 2px dashed #999;
padding: .5em;
position: relative;
margin-top: .5em;
background-color: #ecfaff;
color: #999;
font: 15px/1.3em "Open Sans", "Lucida Grande", Tahoma, Verdana, sans-serif;
text-transform: none;
letter-spacing: 0;
text-align: left;
word-spacing: 0;
}
div.panels-ipe-placeholder h3 {
font-weight: normal;
font-size: 15px;
width: 75px; /* In order to prevent the region title from running into the button, set a width. Initital width only--this will be changed by jQuery */
margin: 1.154em 0;
}
/* Hide editor-state-on elements initially */
.panels-ipe-on {
display: none;
}
.panels-ipe-editing .panels-ipe-on {
display: block;
}
/* Show editor-state-off elements initially */
.panels-ipe-off {
display: block;
}
div.panels-ipe-newblock {
-webkit-box-shadow: 0px 0 5px 5px #ecfaff;
-moz-box-shadow: 0px 0 5px 5px #ecfaff;
box-shadow: 0px 0 5px 5px #ecfaff;
position: absolute;
right: 10px;
top: 50%;
margin-top: -18px; /* some initial guesses to help center the add button
panels_ipe.js will evaluate the width and get this pixel-perfect */
margin-left: -30px;
z-index: 99;
}
div.panels-ipe-newblock li {
padding: 0;
}
div.panels-ipe-handlebar-wrapper li a,
div.panels-ipe-dragtitle span,
div.panels-ipe-newblock a,
span.panels-ipe-draghandle-icon {
display: inline-block;
border: 1px solid #ccc;
padding: 0 8px 1px;
font: bold 12px/32px 'Open Sans', 'Lucida Sans', 'Lucida Grande', verdana sans-serif;
text-decoration: none;
height: 33px;
color: #666;
cursor: pointer;
outline: none;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
background: #fafafa;
background-image: linear-gradient(bottom, #e9eaec 0%, #fafafa 100%);
background-image: -o-linear-gradient(bottom, #e9eaec 0%, #fafafa 100%);
background-image: -moz-linear-gradient(bottom, #e9eaec 0%, #fafafa 100%);
background-image: -webkit-linear-gradient(bottom, #e9eaec 0%, #fafafa 100%);
background-image: -ms-linear-gradient(bottom, #e9eaec 0%, #fafafa 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, #e9eaec),
color-stop(1, #fafafa)
);
-webkit-box-shadow: 0px 3px 3px 0px #d2d2d2;
-moz-box-shadow: 0px 3px 3px 0px #d2d2d2;
box-shadow: 0px 3px 3px 0px #d2d2d2;
}
div.panels-ipe-handlebar-wrapper li a span,
div.panels-ipe-newblock a span {
display: block;
height: 32px;
width: 18px;
background-position: center center;
background-repeat: no-repeat;
text-align: left;
text-indent: -9999em;
}
div.panels-ipe-handlebar-wrapper li.edit a span {
background-image: url(../images/icon-settings.png);
}
div.panels-ipe-handlebar-wrapper li.css a span {
background-image: url(../images/icon-css.png);
}
div.panels-ipe-handlebar-wrapper li.style a span,
div.panels-ipe-newblock a.style span {
background-image: url(../images/icon-style.png);
}
div.panels-ipe-newblock a.style {
margin-right: .5em;
}
div.panels-ipe-newblock a.add span {
background-image: url(../images/icon-add.png);
}
div.panels-ipe-handlebar-wrapper li.delete a span {
background-image: url(../images/icon-delete.png);
}
div.panels-ipe-handlebar-wrapper li a:hover,
div.panels-ipe-dragtitle span:hover,
div.panels-ipe-newblock a:hover,
span.panels-ipe-draghandle-icon:hover,
div.panels-ipe-handlebar-wrapper li a:focus,
div.panels-ipe-newblock a:focus {
background: #e6e6e6;
background-image: linear-gradient(bottom, #c5c5c5 0%, #fafafa 100%);
background-image: -o-linear-gradient(bottom, #c5c5c5 0%, #fafafa 100%);
background-image: -moz-linear-gradient(bottom, #c5c5c5 0%, #fafafa 100%);
background-image: -webkit-linear-gradient(bottom, #c5c5c5 0%, #fafafa 100%);
background-image: -ms-linear-gradient(bottom, #c5c5c5 0%, #fafafa 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, #c5c5c5),
color-stop(1, #fafafa)
);
}
div.panels-ipe-handlebar-wrapper li a:active,
div.panels-ipe-dragtitle span:active,
div.panels-ipe-newblock a:active,
span.panels-ipe-draghandle-icon:active {
outline: none;
background-image: linear-gradient(bottom, #ffffff 0%, #e9eaec 100%);
background-image: -o-linear-gradient(bottom, #ffffff 0%, #e9eaec 100%);
background-image: -moz-linear-gradient(bottom, #ffffff 0%, #e9eaec 100%);
background-image: -webkit-linear-gradient(bottom, #ffffff 0%, #e9eaec 100%);
background-image: -ms-linear-gradient(bottom, #ffffff 0%, #e9eaec 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, #ffffff),
color-stop(1, #e9eaec)
);
-webkit-box-shadow: 0px 0px 0px 0px #fff;
-moz-box-shadow: 0px 0px 0px 0px #fff;
box-shadow: 0px 0px 0px 0px #fff;
}
.panels-ipe-editing .panels-ipe-portlet-content {
margin: 10px 3px;
overflow: hidden;
}
.panels-ipe-editing .panels-ipe-region {
border: transparent dotted 1px;
float: left;
width: 100%;
margin-bottom: 5px;
}
div.panels-ipe-draghandle {
border: none;
}
.ui-sortable-placeholder {
margin: 1em;
border: 1px dotted black;
visibility: visible !important;
height: 50px !important;
}
.ui-sortable-placeholder * {
visibility: hidden;
}
/** ============================================================================
* Controller form markup
*/
div#panels-ipe-control-container {
z-index: 99999;
position: fixed;
bottom: 0;
display: none;
background-color: #000;
padding: 0.5em 0;
width: 100%;
overflow: hidden;
-moz-box-shadow: 0 3px 20px #000;
-webkit-box-shadow: 0 3px 20px #000;
box-shadow: 0 3px 20px #000;
}
.ipe-throbber {
background-color: #232323;
background-image: url("../images/loading-small.gif");
background-position: center center;
background-repeat: no-repeat;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
height: 24px;
opacity: .9;
padding: 4px;
width: 24px;
/* Can't do center:50% middle: 50%, so approximate it for a typical window size. */
left: 49%;
position: fixed;
top: 48.5%;
z-index: 1001;
}
/* Hide the drupal system throbber image */
.ipe-throbber .throbber {
display: none;
}
div.panels-ipe-pseudobutton-container,
div.panels-ipe-control .form-submit {
cursor: pointer;
background: #666666;
background-image: linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: -o-linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: -moz-linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: -webkit-linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: -ms-linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, #383838),
color-stop(1, #666666)
);
border: 0;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
color: #ccc;
display: inline-block;
font: bold 12px/33px "Open Sans", "Lucida Grande", Tahoma, Verdana, sans-serif;
height: 33px;
margin: 0 10px;
}
div.panels-ipe-control .form-submit {
padding: 0 0.8em 2px 34px;
}
div.panels-ipe-control input.panels-ipe-save,
div.panels-ipe-control input.panels-ipe-cancel,
div.panels-ipe-control input.panels-ipe-save:hover,
div.panels-ipe-control input.panels-ipe-cancel:hover,
div.panels-ipe-control input.panels-ipe-save:focus,
div.panels-ipe-control input.panels-ipe-cancel:focus,
div.panels-ipe-control input.panels-ipe-save:active,
div.panels-ipe-control input.panels-ipe-cancel:active {
background-repeat: no-repeat;
}
div.panels-ipe-pseudobutton-container a {
height: 33px;
padding: 0 0.8em;
display: inline-block;
color: #ccc;
text-decoration: none;
}
div.panels-ipe-control .panels-ipe-save {
background-image: url(../images/icon-save.png);
background-image: url(../images/icon-save.png), linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: url(../images/icon-save.png), -o-linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: url(../images/icon-save.png), -moz-linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: url(../images/icon-save.png), -webkit-linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: url(../images/icon-save.png), -ms-linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: url(../images/icon-save.png), -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, #383838),
color-stop(1, #666666)
);
}
div.panels-ipe-control .panels-ipe-cancel {
background-image: url(../images/icon-close.png);
background-image: url(../images/icon-close.png), linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: url(../images/icon-close.png), -o-linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: url(../images/icon-close.png), -moz-linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: url(../images/icon-close.png), -webkit-linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: url(../images/icon-close.png), -ms-linear-gradient(bottom, #383838 0%, #666666 100%);
background-image: url(../images/icon-close.png), -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, #383838),
color-stop(1, #666666)
);
}
div.panels-ipe-pseudobutton-container:hover,
div.panels-ipe-control .form-submit:hover,
div.panels-ipe-pseudobutton-container:focus,
div.panels-ipe-control .form-submit:focus {
background: #999999;
background-image: linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: -o-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: -moz-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: -webkit-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: -ms-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, #3d3d3d),
color-stop(1, #999999)
);
color: #fff;
}
div.panels-ipe-pseudobutton-container a:hover,
div.panels-ipe-pseudobutton-container a:focus {
color: #fff;
}
div.panels-ipe-control .panels-ipe-cancel:hover,
div.panels-ipe-control .panels-ipe-cancel:focus {
background-image: url(../images/icon-close.png), linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: url(../images/icon-close.png), -o-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: url(../images/icon-close.png), -moz-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: url(../images/icon-close.png), -webkit-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: url(../images/icon-close.png), -ms-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: url(../images/icon-close.png), -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, #3d3d3d),
color-stop(1, #999999)
);
}
div.panels-ipe-control .panels-ipe-save:hover,
div.panels-ipe-control .panels-ipe-save:focus {
background-image: url(../images/icon-save.png), linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: url(../images/icon-save.png), -o-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: url(../images/icon-save.png), -moz-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: url(../images/icon-save.png), -webkit-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: url(../images/icon-save.png), -ms-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
background-image: url(../images/icon-save.png), -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, #3d3d3d),
color-stop(1, #999999)
);
}
div.panels-ipe-pseudobutton-container:active,
div.panels-ipe-control .form-submit:active {
background: #333;
background-image: linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: -o-linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: -moz-linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: -webkit-linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: -ms-linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, #616161),
color-stop(1, #333333)
);
color: #ccc;
}
div.panels-ipe-pseudobutton-container a:active {
color: #ccc;
}
div.panels-ipe-control .panels-ipe-cancel:active {
background-image: url(../images/icon-close.png), linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: url(../images/icon-close.png), -o-linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: url(../images/icon-close.png), -moz-linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: url(../images/icon-close.png), -webkit-linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: url(../images/icon-close.png), -ms-linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: url(../images/icon-close.png), -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, #616161),
color-stop(1, #333333)
);
}
div.panels-ipe-control .panels-ipe-save:active {
background-image: url(../images/icon-save.png), linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: url(../images/icon-save.png), -o-linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: url(../images/icon-save.png), -moz-linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: url(../images/icon-save.png), -webkit-linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: url(../images/icon-save.png), -ms-linear-gradient(bottom, #616161 0%, #333333 100%);
background-image: url(../images/icon-save.png), -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, #616161),
color-stop(1, #333333)
);
}
div.panels-ipe-control .panels-ipe-save,
div.panels-ipe-control .panels-ipe-cancel,
div.panels-ipe-control .panels-ipe-save:hover,
div.panels-ipe-control .panels-ipe-cancel:hover,
div.panels-ipe-control .panels-ipe-save:active,
div.panels-ipe-control .panels-ipe-cancel:active {
background-repeat: no-repeat;
}
div.panels-ipe-pseudobutton-container a.panels-ipe-startedit {
padding-left: 34px;
background: url(../images/icon-configure.png) no-repeat 10px 9px;
}
div.panels-ipe-pseudobutton-container a.panels-ipe-change-layout {
padding-left: 34px;
background: url(../images/icon-change-layout.png) no-repeat 10px 9px;
}
div.panels-ipe-button-container {
margin: 0.3em 0.5em;
text-align: center;
}
form#panels-ipe-edit-control-form {
text-align: center;
}
.panels-ipe-dragbar-admin-title {
font-size: 0.9em;
}
File
panels_ipe/css/panels_ipe.css
View source
- body.panels-ipe {
- margin-bottom: 60px !important;
- }
-
- /* Hide the IPE toolbar on print output. */
- @media print {
- #panels-ipe-control-container {
- display: none !important;
- }
- body.panels-ipe {
- margin-top: 0 !important;
- }
- }
-
- /* Hide the control container when the overlay is open. */
- html.overlay-open #panels-ipe-control-container {
- display: none !important;
- }
- html.overlay-open body.panels-ipe {
- margin-top: 0 !important;
- }
-
- div.panels-ipe-handlebar-wrapper {
- border-bottom: 1px solid #ccc;
- }
-
- .panels-ipe-editing div.panels-ipe-portlet-wrapper {
- margin-top: 1em;
- border: 1px solid #ccc;
- width: 100%;
- }
-
- /* Hide empty panes when not editing them. */
- .panels-ipe-empty-pane {
- display: none;
- }
-
- .panels-ipe-editing .panels-ipe-empty-pane {
- display: block;
- }
-
- .panels-ipe-editing div.panels-ipe-portlet-wrapper:hover {
- border: 1px dashed #ccc;
- }
-
- .panels-ipe-editing .panels-ipe-sort-container {
- min-height: 40px;
- }
-
- .panels-ipe-editing .panels-ipe-sort-container .ui-sortable-helper {
- background: white;
- }
-
- .panels-ipe-editing div.panel-pane div.admin-links {
- display: none !important;
- }
-
- .panels-ipe-editing .panels-ipe-sort-container .ui-sortable-placeholder {
- border: 2px dashed #999;
- background-color: #ffff99;
- margin: 1em 0;
- -moz-border-radius: 0;
- -khtml-border-radius: 0;
- -webkit-border-radius: 0;
- border-radius: 0;
- }
-
- div.panels-ipe-handlebar-wrapper ul {
- float: left;
- margin: 0;
- padding: 0;
- text-align: right;
- }
-
- div.panels-ipe-handlebar-wrapper li {
- background: none;
- list-style-type: none;
- list-style-image: none;
- margin: 0 .5em 0 0;
- padding: 0;
- float: left;
- }
-
- div.panels-ipe-draghandle,
- div.panels-ipe-nodraghandle {
- background: #e9e9e9;
- background-image: linear-gradient(bottom, #d5d5d5 0%, #fcfcfc 100%);
- background-image: -o-linear-gradient(bottom, #d5d5d5 0%, #fcfcfc 100%);
- background-image: -moz-linear-gradient(bottom, #d5d5d5 0%, #fcfcfc 100%);
- background-image: -webkit-linear-gradient(bottom, #d5d5d5 0%, #fcfcfc 100%);
- background-image: -ms-linear-gradient(bottom, #d5d5d5 0%, #fcfcfc 100%);
- background-image: -webkit-gradient(
- linear,
- left bottom,
- left top,
- color-stop(0, #d5d5d5),
- color-stop(1, #fcfcfc)
- );
- padding: 8px 7px;
- }
-
- div.panels-ipe-draghandle span.panels-ipe-draghandle-icon {
- display: block;
- float: right;
- cursor: move;
- width: 34px;
- height: 34px;
- padding: 0 !important; /* override button defaults */
- }
-
- span.panels-ipe-draghandle-icon-inner {
- display: block;
- width: 34px;
- height: 34px;
- background: url(../images/icon-draggable.png) no-repeat 3px 3px;
- }
-
- div.panels-ipe-placeholder {
- border: 2px dashed #999;
- padding: .5em;
- position: relative;
- margin-top: .5em;
- background-color: #ecfaff;
- color: #999;
- font: 15px/1.3em "Open Sans", "Lucida Grande", Tahoma, Verdana, sans-serif;
- text-transform: none;
- letter-spacing: 0;
- text-align: left;
- word-spacing: 0;
- }
-
- div.panels-ipe-placeholder h3 {
- font-weight: normal;
- font-size: 15px;
- width: 75px; /* In order to prevent the region title from running into the button, set a width. Initital width only--this will be changed by jQuery */
- margin: 1.154em 0;
- }
-
- /* Hide editor-state-on elements initially */
- .panels-ipe-on {
- display: none;
- }
-
- .panels-ipe-editing .panels-ipe-on {
- display: block;
- }
-
- /* Show editor-state-off elements initially */
- .panels-ipe-off {
- display: block;
- }
-
- div.panels-ipe-newblock {
- -webkit-box-shadow: 0px 0 5px 5px #ecfaff;
- -moz-box-shadow: 0px 0 5px 5px #ecfaff;
- box-shadow: 0px 0 5px 5px #ecfaff;
- position: absolute;
- right: 10px;
- top: 50%;
- margin-top: -18px; /* some initial guesses to help center the add button
- panels_ipe.js will evaluate the width and get this pixel-perfect */
- margin-left: -30px;
- z-index: 99;
- }
-
- div.panels-ipe-newblock li {
- padding: 0;
- }
-
- div.panels-ipe-handlebar-wrapper li a,
- div.panels-ipe-dragtitle span,
- div.panels-ipe-newblock a,
- span.panels-ipe-draghandle-icon {
- display: inline-block;
- border: 1px solid #ccc;
- padding: 0 8px 1px;
- font: bold 12px/32px 'Open Sans', 'Lucida Sans', 'Lucida Grande', verdana sans-serif;
- text-decoration: none;
- height: 33px;
- color: #666;
- cursor: pointer;
- outline: none;
- -moz-border-radius: 3px;
- -khtml-border-radius: 3px;
- -webkit-border-radius: 3px;
- border-radius: 3px;
- background: #fafafa;
- background-image: linear-gradient(bottom, #e9eaec 0%, #fafafa 100%);
- background-image: -o-linear-gradient(bottom, #e9eaec 0%, #fafafa 100%);
- background-image: -moz-linear-gradient(bottom, #e9eaec 0%, #fafafa 100%);
- background-image: -webkit-linear-gradient(bottom, #e9eaec 0%, #fafafa 100%);
- background-image: -ms-linear-gradient(bottom, #e9eaec 0%, #fafafa 100%);
- background-image: -webkit-gradient(
- linear,
- left bottom,
- left top,
- color-stop(0, #e9eaec),
- color-stop(1, #fafafa)
- );
- -webkit-box-shadow: 0px 3px 3px 0px #d2d2d2;
- -moz-box-shadow: 0px 3px 3px 0px #d2d2d2;
- box-shadow: 0px 3px 3px 0px #d2d2d2;
- }
-
- div.panels-ipe-handlebar-wrapper li a span,
- div.panels-ipe-newblock a span {
- display: block;
- height: 32px;
- width: 18px;
- background-position: center center;
- background-repeat: no-repeat;
- text-align: left;
- text-indent: -9999em;
- }
-
- div.panels-ipe-handlebar-wrapper li.edit a span {
- background-image: url(../images/icon-settings.png);
- }
-
- div.panels-ipe-handlebar-wrapper li.css a span {
- background-image: url(../images/icon-css.png);
- }
-
- div.panels-ipe-handlebar-wrapper li.style a span,
- div.panels-ipe-newblock a.style span {
- background-image: url(../images/icon-style.png);
- }
-
- div.panels-ipe-newblock a.style {
- margin-right: .5em;
- }
-
- div.panels-ipe-newblock a.add span {
- background-image: url(../images/icon-add.png);
- }
-
- div.panels-ipe-handlebar-wrapper li.delete a span {
- background-image: url(../images/icon-delete.png);
- }
-
-
- div.panels-ipe-handlebar-wrapper li a:hover,
- div.panels-ipe-dragtitle span:hover,
- div.panels-ipe-newblock a:hover,
- span.panels-ipe-draghandle-icon:hover,
- div.panels-ipe-handlebar-wrapper li a:focus,
- div.panels-ipe-newblock a:focus {
- background: #e6e6e6;
- background-image: linear-gradient(bottom, #c5c5c5 0%, #fafafa 100%);
- background-image: -o-linear-gradient(bottom, #c5c5c5 0%, #fafafa 100%);
- background-image: -moz-linear-gradient(bottom, #c5c5c5 0%, #fafafa 100%);
- background-image: -webkit-linear-gradient(bottom, #c5c5c5 0%, #fafafa 100%);
- background-image: -ms-linear-gradient(bottom, #c5c5c5 0%, #fafafa 100%);
- background-image: -webkit-gradient(
- linear,
- left bottom,
- left top,
- color-stop(0, #c5c5c5),
- color-stop(1, #fafafa)
- );
- }
-
- div.panels-ipe-handlebar-wrapper li a:active,
- div.panels-ipe-dragtitle span:active,
- div.panels-ipe-newblock a:active,
- span.panels-ipe-draghandle-icon:active {
- outline: none;
- background-image: linear-gradient(bottom, #ffffff 0%, #e9eaec 100%);
- background-image: -o-linear-gradient(bottom, #ffffff 0%, #e9eaec 100%);
- background-image: -moz-linear-gradient(bottom, #ffffff 0%, #e9eaec 100%);
- background-image: -webkit-linear-gradient(bottom, #ffffff 0%, #e9eaec 100%);
- background-image: -ms-linear-gradient(bottom, #ffffff 0%, #e9eaec 100%);
- background-image: -webkit-gradient(
- linear,
- left bottom,
- left top,
- color-stop(0, #ffffff),
- color-stop(1, #e9eaec)
- );
- -webkit-box-shadow: 0px 0px 0px 0px #fff;
- -moz-box-shadow: 0px 0px 0px 0px #fff;
- box-shadow: 0px 0px 0px 0px #fff;
- }
-
- .panels-ipe-editing .panels-ipe-portlet-content {
- margin: 10px 3px;
- overflow: hidden;
- }
-
- .panels-ipe-editing .panels-ipe-region {
- border: transparent dotted 1px;
- float: left;
- width: 100%;
- margin-bottom: 5px;
- }
-
- div.panels-ipe-draghandle {
- border: none;
- }
-
- .ui-sortable-placeholder {
- margin: 1em;
- border: 1px dotted black;
- visibility: visible !important;
- height: 50px !important;
- }
- .ui-sortable-placeholder * {
- visibility: hidden;
- }
-
- /** ============================================================================
- * Controller form markup
- */
-
- div#panels-ipe-control-container {
- z-index: 99999;
- position: fixed;
- bottom: 0;
- display: none;
- background-color: #000;
- padding: 0.5em 0;
- width: 100%;
- overflow: hidden;
- -moz-box-shadow: 0 3px 20px #000;
- -webkit-box-shadow: 0 3px 20px #000;
- box-shadow: 0 3px 20px #000;
- }
-
- .ipe-throbber {
- background-color: #232323;
- background-image: url("../images/loading-small.gif");
- background-position: center center;
- background-repeat: no-repeat;
- -moz-border-radius: 7px;
- -webkit-border-radius: 7px;
- border-radius: 7px;
- height: 24px;
- opacity: .9;
- padding: 4px;
- width: 24px;
- /* Can't do center:50% middle: 50%, so approximate it for a typical window size. */
- left: 49%;
- position: fixed;
- top: 48.5%;
- z-index: 1001;
- }
-
- /* Hide the drupal system throbber image */
- .ipe-throbber .throbber {
- display: none;
- }
-
- div.panels-ipe-pseudobutton-container,
- div.panels-ipe-control .form-submit {
- cursor: pointer;
- background: #666666;
- background-image: linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: -o-linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: -moz-linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: -webkit-linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: -ms-linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: -webkit-gradient(
- linear,
- left bottom,
- left top,
- color-stop(0, #383838),
- color-stop(1, #666666)
- );
- border: 0;
- -moz-border-radius: 3px;
- -webkit-border-radius: 3px;
- border-radius: 3px;
- color: #ccc;
- display: inline-block;
- font: bold 12px/33px "Open Sans", "Lucida Grande", Tahoma, Verdana, sans-serif;
- height: 33px;
- margin: 0 10px;
- }
-
- div.panels-ipe-control .form-submit {
- padding: 0 0.8em 2px 34px;
- }
-
- div.panels-ipe-control input.panels-ipe-save,
- div.panels-ipe-control input.panels-ipe-cancel,
- div.panels-ipe-control input.panels-ipe-save:hover,
- div.panels-ipe-control input.panels-ipe-cancel:hover,
- div.panels-ipe-control input.panels-ipe-save:focus,
- div.panels-ipe-control input.panels-ipe-cancel:focus,
- div.panels-ipe-control input.panels-ipe-save:active,
- div.panels-ipe-control input.panels-ipe-cancel:active {
- background-repeat: no-repeat;
- }
-
- div.panels-ipe-pseudobutton-container a {
- height: 33px;
- padding: 0 0.8em;
- display: inline-block;
- color: #ccc;
- text-decoration: none;
- }
-
- div.panels-ipe-control .panels-ipe-save {
- background-image: url(../images/icon-save.png);
- background-image: url(../images/icon-save.png), linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: url(../images/icon-save.png), -o-linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: url(../images/icon-save.png), -moz-linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: url(../images/icon-save.png), -webkit-linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: url(../images/icon-save.png), -ms-linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: url(../images/icon-save.png), -webkit-gradient(
- linear,
- left bottom,
- left top,
- color-stop(0, #383838),
- color-stop(1, #666666)
- );
- }
-
- div.panels-ipe-control .panels-ipe-cancel {
- background-image: url(../images/icon-close.png);
- background-image: url(../images/icon-close.png), linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: url(../images/icon-close.png), -o-linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: url(../images/icon-close.png), -moz-linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: url(../images/icon-close.png), -webkit-linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: url(../images/icon-close.png), -ms-linear-gradient(bottom, #383838 0%, #666666 100%);
- background-image: url(../images/icon-close.png), -webkit-gradient(
- linear,
- left bottom,
- left top,
- color-stop(0, #383838),
- color-stop(1, #666666)
- );
- }
-
- div.panels-ipe-pseudobutton-container:hover,
- div.panels-ipe-control .form-submit:hover,
- div.panels-ipe-pseudobutton-container:focus,
- div.panels-ipe-control .form-submit:focus {
- background: #999999;
- background-image: linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: -o-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: -moz-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: -webkit-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: -ms-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: -webkit-gradient(
- linear,
- left bottom,
- left top,
- color-stop(0, #3d3d3d),
- color-stop(1, #999999)
- );
- color: #fff;
- }
-
- div.panels-ipe-pseudobutton-container a:hover,
- div.panels-ipe-pseudobutton-container a:focus {
- color: #fff;
- }
-
- div.panels-ipe-control .panels-ipe-cancel:hover,
- div.panels-ipe-control .panels-ipe-cancel:focus {
- background-image: url(../images/icon-close.png), linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: url(../images/icon-close.png), -o-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: url(../images/icon-close.png), -moz-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: url(../images/icon-close.png), -webkit-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: url(../images/icon-close.png), -ms-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: url(../images/icon-close.png), -webkit-gradient(
- linear,
- left bottom,
- left top,
- color-stop(0, #3d3d3d),
- color-stop(1, #999999)
- );
- }
-
- div.panels-ipe-control .panels-ipe-save:hover,
- div.panels-ipe-control .panels-ipe-save:focus {
- background-image: url(../images/icon-save.png), linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: url(../images/icon-save.png), -o-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: url(../images/icon-save.png), -moz-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: url(../images/icon-save.png), -webkit-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: url(../images/icon-save.png), -ms-linear-gradient(bottom, #3d3d3d 0%, #999999 100%);
- background-image: url(../images/icon-save.png), -webkit-gradient(
- linear,
- left bottom,
- left top,
- color-stop(0, #3d3d3d),
- color-stop(1, #999999)
- );
- }
-
- div.panels-ipe-pseudobutton-container:active,
- div.panels-ipe-control .form-submit:active {
- background: #333;
- background-image: linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: -o-linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: -moz-linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: -webkit-linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: -ms-linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: -webkit-gradient(
- linear,
- left bottom,
- left top,
- color-stop(0, #616161),
- color-stop(1, #333333)
- );
- color: #ccc;
- }
-
- div.panels-ipe-pseudobutton-container a:active {
- color: #ccc;
- }
-
- div.panels-ipe-control .panels-ipe-cancel:active {
- background-image: url(../images/icon-close.png), linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: url(../images/icon-close.png), -o-linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: url(../images/icon-close.png), -moz-linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: url(../images/icon-close.png), -webkit-linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: url(../images/icon-close.png), -ms-linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: url(../images/icon-close.png), -webkit-gradient(
- linear,
- left bottom,
- left top,
- color-stop(0, #616161),
- color-stop(1, #333333)
- );
- }
-
- div.panels-ipe-control .panels-ipe-save:active {
- background-image: url(../images/icon-save.png), linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: url(../images/icon-save.png), -o-linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: url(../images/icon-save.png), -moz-linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: url(../images/icon-save.png), -webkit-linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: url(../images/icon-save.png), -ms-linear-gradient(bottom, #616161 0%, #333333 100%);
- background-image: url(../images/icon-save.png), -webkit-gradient(
- linear,
- left bottom,
- left top,
- color-stop(0, #616161),
- color-stop(1, #333333)
- );
- }
-
- div.panels-ipe-control .panels-ipe-save,
- div.panels-ipe-control .panels-ipe-cancel,
- div.panels-ipe-control .panels-ipe-save:hover,
- div.panels-ipe-control .panels-ipe-cancel:hover,
- div.panels-ipe-control .panels-ipe-save:active,
- div.panels-ipe-control .panels-ipe-cancel:active {
- background-repeat: no-repeat;
- }
-
- div.panels-ipe-pseudobutton-container a.panels-ipe-startedit {
- padding-left: 34px;
- background: url(../images/icon-configure.png) no-repeat 10px 9px;
- }
-
- div.panels-ipe-pseudobutton-container a.panels-ipe-change-layout {
- padding-left: 34px;
- background: url(../images/icon-change-layout.png) no-repeat 10px 9px;
- }
-
- div.panels-ipe-button-container {
- margin: 0.3em 0.5em;
- text-align: center;
- }
-
- form#panels-ipe-edit-control-form {
- text-align: center;
- }
-
- .panels-ipe-dragbar-admin-title {
- font-size: 0.9em;
- }