mods/_standard/photos/module.css

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