mods/photos/module.css

   1 div.topbar{\r
   2         float:left;\r
   3         width: 95%;\r
   4 }\r
   5 div.paginator{\r
   6         float: right;\r
   7         margin: 0px;\r
   8 }\r
   9 .paginator ul li{\r
  10         list-style: none;\r
  11 }\r
  12 .paginator li{\r
  13         padding-right: 0.5em;\r
  14         float: left;\r
  15 }\r
  16 \r
  17 div.summary{\r
  18         float: left;\r
  19         margin-top: 0.5em;\r
  20         width:70%;\r
  21 }\r
  22 \r
  23 div.album_panel{\r
  24         float: left;\r
  25         background: #F7F7F7;\r
  26         border: 1px solid #D2D2D2;      \r
  27         width: 95%;\r
  28 }\r
  29 div.album_panel div.photo_wrapper {\r
  30         /* This class is to fix the problem where the images shift\r
  31          * to the right when there is a border upon selection \r
  32          */\r
  33         height: 150px;\r
  34         float: left;\r
  35 }\r
  36 div.album_panel .photo_frame{\r
  37         float: left;\r
  38         margin: 0.2em;\r
  39         min-height: 140px;\r
  40         min-width: 140px;\r
  41         text-align: center;\r
  42 }\r
  43 div.album_panel .photo_frame a:focus, div.album_panel .photo_frame a:hover{\r
  44         cursor: pointer;\r
  45         float:left;\r
  46         min-width: 140px;\r
  47         min-height: 140px;\r
  48         background: #FCE6C9;\r
  49 }\r
  50 div.album_panel .photo_frame img{\r
  51         background: #FFFFFF;\r
  52         border: 1px solid #D2D2D2;\r
  53         padding: 0.2em;\r
  54 }\r
  55 div.album_panel .album_description{\r
  56         margin: 0.5em;\r
  57         width: 95%;\r
  58         float: left;\r
  59 }\r
  60 \r
  61 div.search_bar {\r
  62         background-image: url('images/search_bg.png');\r
  63         background-repeat: no-repeat;\r
  64         margin-left: 0.5em;\r
  65         margin-top: 0.5em;\r
  66         height: 31px;\r
  67         width: 180px;\r
  68         float: left;\r
  69 }\r
  70 div.search_bar .s{\r
  71         float: left;\r
  72         border: 0px;\r
  73         margin-top: 0.3em;\r
  74         margin-left: 0.5em;\r
  75         width: 148px;\r
  76 }\r
  77 div.search_bar .s_img{\r
  78         float: right;\r
  79         border: 0px;\r
  80         margin-top: 0.375em;    \r
  81         margin-right: 0.4em;\r
  82 }\r
  83 \r
  84 div.album {\r
  85         background: #FFFFFF;\r
  86         border: 1px solid #D2D2D2;      \r
  87         width: 95%;\r
  88         margin: 0.5em;\r
  89         float: left;\r
  90 }\r
  91 div.album .image{\r
  92         float: left;\r
  93         margin: 0.5em;\r
  94         min-width: 140px;\r
  95 }\r
  96 div.album img{\r
  97         border-width: 0px;\r
  98 }\r
  99 div.album .image img.no-image {\r
 100         float: left;\r
 101         width: 130px;\r
 102         height: 97px;\r
 103         background-color: #EFEFEF;\r
 104 }\r
 105 div.album .info{\r
 106         float: left;\r
 107         width: 70%;\r
 108 }\r
 109 div.album .info span{\r
 110         float: left;\r
 111         color: #666666;\r
 112 }\r
 113 div.album .info p{\r
 114         font-size: 0.85em;\r
 115         margin: 0;\r
 116 }\r
 117 div.album .search_photo_frame{\r
 118         float: left;\r
 119         margin: 0.2em;\r
 120         min-height: 160px;\r
 121         max-height: 160px;\r
 122         max-width: 140px;\r
 123         text-align: center;\r
 124         border: 1px solid #d3d3d3;\r
 125         overflow: hidden;\r
 126 }\r
 127 div.album .search_slider{\r
 128         float: left;\r
 129         overflow: hidden;\r
 130         position: relative;     /* ie7 */\r
 131 }\r
 132 div.album .search_slider_left{\r
 133         float: left;\r
 134         width: 10%;\r
 135 }\r
 136 div.album .search_slider_right{\r
 137         float: right;\r
 138         text-align: right;\r
 139         width: 10%;\r
 140 }\r
 141 div.album .search_slider ul {\r
 142         list-style-type: none;\r
 143         margin: 0;\r
 144         padding: 0;\r
 145         width: 99999px;\r
 146         position: relative;\r
 147 }\r
 148 div.album .search_slider ul li{\r
 149         float: left;\r
 150 }\r
 151 div.album .search_slider_a{\r
 152         width: 80%;\r
 153 }\r
 154 div.album .search_slider_p{\r
 155         width: 730px;   /* 146 per frame, 5 frame per row */\r
 156 }\r
 157 div.album .search_slider_p ul li{\r
 158 /*      height: 576px;  /* 144 per frame, 4 row */\r
 159         width: 730px;   /* 146 per frame, 5 frame per row */\r
 160 }\r
 161 div.album .search_paginator {\r
 162         width: 100%;\r
 163 }\r
 164 \r
 165 div.add_photo{\r
 166         float: left;\r
 167         background: #F7F7F7;\r
 168         border: 1px solid #D2D2D2;      \r
 169         width: 95%;\r
 170 }\r
 171 div.add_photo ul{\r
 172         margin: 0px;\r
 173         padding: 0px;\r
 174 }\r
 175 div.add_photo .toggle_uploader{\r
 176         width: 95%;\r
 177         margin: 0.5em;\r
 178 }\r
 179 div.add_photo div#ajax_uploader{\r
 180         display: none;\r
 181         margin-top: 0.5em;\r
 182 }\r
 183 div.add_photo .files .tn {\r
 184         max-height: 30px;\r
 185 }\r
 186 div.add_photo img{\r
 187         border: 0;\r
 188 }\r
 189 div.add_photo ul li{\r
 190         float: left;\r
 191         padding: 0.2em;\r
 192         list-style: none;\r
 193         width: 100%;\r
 194         height: 100%;\r
 195         border-bottom: 1px solid #ddd;\r
 196 /*      display: inline; */\r
 197 }\r
 198 div.add_photo p.memory_usage {\r
 199         float: right;\r
 200         font-size: 0.9em;\r
 201         color: #5B5B5B;\r
 202 }\r
 203 div.photo_panel{\r
 204         background: #F7F7F7;\r
 205         float: left;\r
 206         border: 1px solid #D2D2D2;\r
 207         text-align: center;\r
 208         width: 95%;\r
 209         padding-top: 0.5em;\r
 210 }\r
 211 div.photo_panel img{\r
 212         background: #FFFFFF;\r
 213         border: 1px solid #D2D2D2;\r
 214         padding: 0.2em;\r
 215 }\r
 216 div.photo_panel div.ordering{\r
 217         float:left;\r
 218 }\r
 219 div.photo_panel div.paginator{\r
 220         float:right;\r
 221 }\r
 222 div.photo_panel .flc-inlineEditable{\r
 223         width: 604px;\r
 224         margin: 0 auto;\r
 225         padding-top: 0.5em;\r
 226         padding-bottom: 0.5em;\r
 227 }\r
 228 div.comment_panel{\r
 229         background: #FFFFFF;\r
 230         float: left;\r
 231         border: 1px solid #D2D2D2;\r
 232         width: 95%;\r
 233 }\r
 234 div.comment_panel .comment_feeds{\r
 235         float: left;\r
 236         width: 50%;\r
 237 }\r
 238 div.comment_panel .photo_actions{\r
 239         margin: 0.5em;\r
 240         max-width: 49%;\r
 241         background: #F7F7F7;\r
 242         float:right;\r
 243 }\r
 244 \r
 245 div.comment_panel textarea{\r
 246         width:100%;\r
 247 }\r
 248 \r
 249 div.comment_box{\r
 250         float:left;\r
 251         width:100%;\r
 252         margin: 0.5em;\r
 253         padding-top: 0.5em;\r
 254         padding-bottom: 0.5em;\r
 255         background: #F7F7F7;\r
 256 }\r
 257 div.comment_box .comment_actions{\r
 258         float: left;\r
 259         margin-top: 1em;\r
 260         font-size: 0.8em; \r
 261         color: #666666;\r
 262 }\r
 263 \r
 264 div.edit_photo_frame{\r
 265         width: 95%;     \r
 266         float: left;\r
 267         padding: 0.2em;\r
 268         background: #F7F7F7;\r
 269 }\r
 270 div.edit_photo_box{     \r
 271         float: left;\r
 272         border: 1px solid #D2D2D2;\r
 273         background: white;\r
 274         margin: 0.2em;\r
 275         margin-bottom: 0.8em;\r
 276         padding: 0.8em;\r
 277         width: 94%;\r
 278 }\r
 279 div.edit_photo_box .info{\r
 280         float: left;\r
 281         width: 60%;\r
 282 }\r
 283 div.edit_photo_box .info textarea.alt_text{\r
 284         height: 2.5em;\r
 285 }\r
 286 div.edit_photo_box .info textarea{\r
 287         width: 100%;\r
 288 }\r
 289 div.edit_photo_box .action{\r
 290         float: right;\r
 291         background: #F7F7F7;\r
 292         min-width: 140px;\r
 293 }\r
 294 \r
 295 \r
 296 /* FLUID Image Reorderer */\r
 297 .fl-imageReorderer-item {\r
 298 }\r
 299 .fl-reorderer-movable-hover a{\r
 300         cursor: pointer;\r
 301         background-color: #ECEECC;\r
 302 }\r
 303 .fl-reorderer-movable-selected a{\r
 304         border: 2px solid red;\r
 305 }\r
 306 .fl-reorderer-movable-dragging a{\r
 307         background-color: #ECEECC;\r
 308 }\r
 309 .fl-reorderer-dropMarker {\r
 310         border: 2px solid red;\r
 311         min-height: 100px;\r
 312         float: left;\r
 313 }\r
 314 .fl-reorderer-avatar {\r
 315         opacity: 0.6;\r
 316         filter:alpha(opacity=60);\r
 317 }\r
 318 \r
 319 \r
 320 /* FLUID Simple Inline Editor */\r
 321 .fl-inlineEdit-invitation {\r
 322    background-color: #FFECB3 !important;\r
 323    border: 1px solid #CCC !important;\r
 324 }\r
 325 .fl-inlineEdit-focus {\r
 326     border: 2px solid #777777;\r
 327 }\r