You are here

Home » API reference » Modal Frame API 7

modalframe.parent.css in Modal Frame API 7

Same filename and directory in other branches
  1. 6 css/modalframe.parent.css
/**
 * jQuery UI Dialog classes.
 */
.modalframe {
  color: #000000;
  background-color: #ffffff;
  border: 2px solid #1b5084;
}
.modalframe .ui-dialog-titlebar {
  position: relative;
  cursor: move;
  height: 26px;
  background-color: #336699;
  border: 1px solid #6694c6;
  white-space: nowrap;
}
.modalframe .ui-dialog-title {
  display: block;
  position: absolute;
  top: 0; left: 0;
  margin: 0.2em 0.5em;
  padding: 0;
  color: #d9d9d9;
}
.modalframe .ui-dialog-titlebar-close {
  display: block;
  position: absolute;
  top: 0; right: 0;
  margin: 2px 2px 2px 0.5em;
  padding: 0;
  width: 23px;
  height: 20px;
  background: url(../images/close.gif) no-repeat 0 0;
}
.modalframe .ui-dialog-titlebar a.ui-state-hover,
.modalframe .ui-dialog-titlebar a.ui-state-focus {
  background-position: 0 -20px;
}
.modalframe .ui-dialog-titlebar-close span {
  display: none;
}
.modalframe .ui-dialog-content {
  color: #292929;
  background-color: #f8f8f8;
}

/**
 * ui-dialog overlay.
 */
.ui-widget-overlay {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background-color: #aaaaaa;
  opacity: 0.4;
  filter: alpha(opacity=40);
}

/**
 * Dialog content.
 */
#modalframe-container {
  margin: 0;
  padding: 0;
  background: url(../images/loading.gif) no-repeat 50% 50%;
  overflow: visible;
}
#modalframe-container.modalframe-loaded {
  background: none;
}
#modalframe-element {
  margin: 0;
  padding: 0;
  border: none;
  border-bottom: 1px solid #1b5084;
}

/**
 * Helpers to enhance the Modal Frame API.
 */
.modalframe-throbber {
  display: inline-block;
  width: 13px;
  height: 13px;
  background: transparent url(../images/throbber.gif) no-repeat 0 0;
}

File

css/modalframe.parent.css
View source 
  1. 

  2. /**

  3.  * jQuery UI Dialog classes.

  4.  */

  5. .modalframe {

  6.   color: #000000;

  7.   background-color: #ffffff;

  8.   border: 2px solid #1b5084;

  9. }

  10. .modalframe .ui-dialog-titlebar {

  11.   position: relative;

  12.   cursor: move;

  13.   height: 26px;

  14.   background-color: #336699;

  15.   border: 1px solid #6694c6;

  16.   white-space: nowrap;

  17. }

  18. .modalframe .ui-dialog-title {

  19.   display: block;

  20.   position: absolute;

  21.   top: 0; left: 0;

  22.   margin: 0.2em 0.5em;

  23.   padding: 0;

  24.   color: #d9d9d9;

  25. }

  26. .modalframe .ui-dialog-titlebar-close {

  27.   display: block;

  28.   position: absolute;

  29.   top: 0; right: 0;

  30.   margin: 2px 2px 2px 0.5em;

  31.   padding: 0;

  32.   width: 23px;

  33.   height: 20px;

  34.   background: url(../images/close.gif) no-repeat 0 0;

  35. }

  36. .modalframe .ui-dialog-titlebar a.ui-state-hover,

  37. .modalframe .ui-dialog-titlebar a.ui-state-focus {

  38.   background-position: 0 -20px;

  39. }

  40. .modalframe .ui-dialog-titlebar-close span {

  41.   display: none;

  42. }

  43. .modalframe .ui-dialog-content {

  44.   color: #292929;

  45.   background-color: #f8f8f8;

  46. }

  47. 

  48. /**

  49.  * ui-dialog overlay.

  50.  */

  51. .ui-widget-overlay {

  52.   position: absolute;

  53.   top: 0; left: 0;

  54.   width: 100%; height: 100%;

  55.   background-color: #aaaaaa;

  56.   opacity: 0.4;

  57.   filter: alpha(opacity=40);

  58. }

  59. 

  60. /**

  61.  * Dialog content.

  62.  */

  63. #modalframe-container {

  64.   margin: 0;

  65.   padding: 0;

  66.   background: url(../images/loading.gif) no-repeat 50% 50%;

  67.   overflow: visible;

  68. }

  69. #modalframe-container.modalframe-loaded {

  70.   background: none;

  71. }

  72. #modalframe-element {

  73.   margin: 0;

  74.   padding: 0;

  75.   border: none;

  76.   border-bottom: 1px solid #1b5084;

  77. }

  78. 

  79. /**

  80.  * Helpers to enhance the Modal Frame API.

  81.  */

  82. .modalframe-throbber {

  83.   display: inline-block;

  84.   width: 13px;

  85.   height: 13px;

  86.   background: transparent url(../images/throbber.gif) no-repeat 0 0;

  87. }