css/dashboard.css

   1 /**
   2 * @file
   3 *    CSS for the jQuery.dashboard() plugin.
   4 *
   5 * Released under the GNU General Public License.  See LICENSE.txt.
   6 */
   7
   8 #crm-container .column {
   9   float: left;
  10   margin: 0;
  11   /* padding-bottom and min-height make sure that there is always a sizable drop zone. */
  12   min-height: 400px;
  13   height: 400px;
  14   height: auto !important;
  15   padding: 0 0 250px;
  16   list-style-type: none;
  17 }
  18
  19 #crm-container .column-0 {
  20   width: 40%;
  21 }
  22
  23 #crm-container .column-1 {
  24   width: 60%;
  25 }
  26
  27 /* The placeholder that indicates where a dragged widget will land if dropped now. */
  28 #crm-container .placeholder {
  29   margin: 5px;
  30   border: 3px dashed pink;
  31 }
  32
  33 /* Spacing between widgets. */
  34 #crm-container li.widget, #crm-container li.empty-placeholder { margin: 6px 3px; }
  35 #crm-container li.widget {
  36   padding: 0px;
  37 }
  38
  39 /* Spacing inside widgets. */
  40 #crm-container .widget-wrapper {
  41   padding: 0px;
  42   overflow-x:auto;
  43   margin-right: .25em
  44 }
  45
  46 /* wodget header / title */
  47 #crm-container .widget-header {
  48   background:#CDE8FE none repeat scroll 0 0;
  49   color:#000;
  50   cursor:move;
  51   display:inline;
  52   font-size:1.2em;
  53   margin:0;
  54 }
  55
  56 /* widget content / body*/
  57 #crm-container .widget-content {
  58   background-color: #ffffff;
  59   padding:0.5em;
  60 }
  61
  62 /* Standards-browsers do this anyway because all inner block elements are floated.  IE doesn't because it's crap. */
  63 #crm-container .widget-controls {
  64   background-color:#CDE8FE;
  65   display:block;
  66   padding:5px 0px;
  67 }
  68
  69 #crm-container .widget-icon, #crm-container .full-screen-close-icon img {
  70   display: block;
  71   float: right;
  72   margin-left: 2px;
  73   margin-top: 2px;
  74   cursor: pointer;
  75 }
  76
  77 #full-screen-header {
  78   display: block;
  79   padding: .2em .4em;
  80   background: #F0F0E8;
  81   /* Although this is an <a> link, it doesn't have an href="" attribute. */
  82   cursor: pointer;
  83 }
  84
  85 /* Make the throbber in-yer-face. */
  86 #crm-container .throbber {
  87   text-align: right;
  88   background:url("../packages/jquery/css/images/throbber.gif") no-repeat scroll 0 0 transparent;
  89   height:20px;
  90   width:20px;
  91 }
  92
  93 #crm-container p.loadtext {
  94   margin:1.6em 0 0 26px;
  95 }
  96
  97 #crm-container .widget-controls .crm-i {
  98   font-size: 14px;
  99   padding: 0 6px;
 100   font-weight: normal;
 101   float: left;
 102   cursor: pointer;
 103   color: #222222;
 104   opacity: .7;
 105 }
 106
 107 #crm-container .widget-controls .crm-i:hover {
 108   opacity: 1;
 109 }
 110
 111 #crm-container .widget-controls .crm-i.fa-expand,
 112 #crm-container .widget-controls .crm-i.fa-times {
 113   float:right;
 114 }
 115
 116 /* CSS for Dashlets */
 117
 118 #crm-container #available-dashlets {
 119   width: 98%;
 120   border: 2px dashed pink;
 121   background-color: #999999;
 122   min-height:40px;
 123 }
 124
 125 #crm-container .dash-column {
 126   border: 2px solid #696969;
 127   min-height: 100px;
 128   background-color: #EEEEEE
 129 }
 130
 131 #crm-container .dashlets-header {
 132   font-weight: bold;
 133 }
 134
 135 #crm-container #dashlets-header-col-0 {
 136   float: left;
 137   width: 40%;
 138 }
 139
 140 #crm-container #dashlets-header-col-1 {
 141   margin-left: 42%;
 142   width: 56%;
 143 }
 144
 145 #crm-container #existing-dashlets-col-0 {
 146   float: left;
 147   width: 40%;
 148 }
 149
 150 #crm-container #existing-dashlets-col-1 {
 151   margin-left: 42%;
 152   width: 56%;
 153 }
 154
 155 #crm-container .portlet {
 156   margin: .5em;
 157   width: 75%;
 158   display: inline-block;
 159 }
 160
 161 #crm-container .portlet-header {
 162   margin: 0.3em;
 163   padding: 0.5em;
 164   cursor: pointer;
 165 }
 166
 167 #crm-container #available-dashlets .portlet {
 168   width: auto;
 169 }
 170
 171 #crm-container .portlet-header .crm-i {
 172   float: right;
 173   color: #52534D;
 174 }
 175
 176 #crm-container .portlet-content {
 177   padding: 0.4em;
 178 }
 179
 180 #crm-container .ui-sortable-placeholder {
 181   border: 1px dotted black;
 182   visibility: visible !important;
 183   height: 50px !important;
 184 }
 185
 186 #crm-container .ui-sortable-placeholder * {
 187   visibility: hidden;
 188 }