You are here

Home » API reference » Geysir 8

geysir.dialog.css in Geysir 8

Default styling for Geysir dialogs.

See also

core/themes/classy/css/components/dialog.css

core/themes/bartik/css/components/ui-dialog.css

File

css/geysir.dialog.css
View source 
  1. /**

  2.  * @file

  3.  * Default styling for Geysir dialogs.

  4.  *

  5.  * @see core/themes/classy/css/components/dialog.css

  6.  * @see core/themes/bartik/css/components/ui-dialog.css

  7.  */

  8. 

  9. .ui-dialog.geysir-dialog {

  10.     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;

  11.     border-radius: 0;

  12.     position: absolute;

  13.     z-index: 1260;

  14.     overflow: visible;

  15.     color: #000;

  16.     background: #fff;

  17.     border: solid 1px #ccc;

  18.     padding: 0;

  19. }

  20. 

  21. @media all and (max-width: 48em) { /* 768px */

  22.     .ui-dialog.geysir-dialog {

  23.         width: 92% !important;

  24.     }

  25. }

  26. 

  27. .ui-dialog.geysir-dialog .ui-dialog-titlebar {

  28.     font-weight: bold;

  29.     background: #f3f4ee;

  30.     border-style: solid;

  31.     border-radius: 0;

  32.     border-width: 0 0 1px 0;

  33.     border-color: #ccc;

  34. }

  35. 

  36. .ui-dialog.geysir-dialog .ui-dialog-titlebar-close {

  37.     border: 0;

  38.     background: none;

  39. }

  40. 

  41. .ui-dialog.geysir-dialog .ui-dialog-buttonpane {

  42.     margin-top: 0;

  43.     background: #f3f4ee;

  44.     padding: .3em 1em;

  45.     border-width: 1px 0 0 0;

  46.     border-color: #ccc;

  47. }

  48. 

  49. .ui-dialog.geysir-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {

  50.     margin: 0;

  51.     padding: 0;

  52. }

  53. 

  54. .ui-dialog.geysir-dialog .ui-dialog-buttonpane .ui-button-text-only .ui-button-text {

  55.     padding: 0;

  56. }

  57. 

  58. /* Form action buttons are moved in dialogs. Remove empty space. */

  59. .ui-dialog.geysir-dialog .ui-dialog-content .form-actions {

  60.     padding: 0;

  61.     margin: 0;

  62. }

  63. 

  64. .ui-dialog.geysir-dialog .geysir-field-paragraph-links .ajax-progress-throbber {

  65.     /* Can't do center:50% middle: 50%, so approximate it for a typical window size. */

  66.     left: 49%;

  67.     position: fixed;

  68.     top: 48.5%;

  69.     z-index: 1000;

  70.     background-color: #232323;

  71.     background-image: url(../../../../misc/loading-small.gif);

  72.     background-position: center center;

  73.     background-repeat: no-repeat;

  74.     border-radius: 7px;

  75.     height: 24px;

  76.     opacity: 0.9;

  77.     padding: 4px;

  78.     width: 24px;

  79. }

  80. 

  81. .ui-dialog.geysir-dialog .geysir-field-paragraph-links .ajax-progress-throbber .throbber,

  82. .ui-dialog.geysir-dialog .geysir-field-paragraph-links .ajax-progress-throbber .message {

  83.     display: none;

  84. }

  85. 

  86. .ui-dialog.geysir-dialog input,

  87. .ui-dialog.geysir-dialog select,

  88. .ui-dialog.geysir-dialog textarea {

  89.     font-size: 0.9em;

  90. }

  91. 

  92. .ui-dialog.geysir-dialog .button {

  93.     background-color: #fff;

  94.     background-image: -webkit-linear-gradient(top,#f3f3f3,#e8e8e8);

  95.     background-image: linear-gradient(to bottom,#f3f3f3,#e8e8e8);

  96.     border: 1px solid #e4e4e4;

  97.     border-bottom-color: #b4b4b4;

  98.     border-left-color: #d2d2d2;

  99.     border-right-color: #d2d2d2;

  100.     color: #3a3a3a;

  101.     cursor: pointer;

  102.     font-size: 0.929em;

  103.     font-weight: normal;

  104.     text-align: center;

  105.     padding: 0.250em 1.063em;

  106.     border-radius: 1em;

  107. }

  108. 

  109. .ui-widget-overlay {

  110.     background: #000;

  111.     opacity: 0.7;

  112. }

  113. 

  114. .geysir-modal-add-select-type-form .geysir-add-type {

  115.     border: 2px solid #ffffff;

  116.     display: inline-block;

  117.     margin-right: 30px;

  118.     min-width: 100px;

  119.     padding: 10px;

  120.     width: 100px;

  121. }

  122. 

  123. .geysir-modal-add-select-type-form .geysir-add-type:hover {

  124.     border: 2px solid rgb(85, 142, 213);

  125. }

  126. 

  127. .geysir-modal-add-select-type-form .geysir-add-type input {

  128.     border: none;

  129.     padding: 0;

  130. }

  131. 

  132. .geysir-modal-add-select-type-form .geysir-add-type span {

  133.     display: block;

  134.     text-align: center;

  135.     width: 100%;

  136. }