skins/portfolio_style.css.dtml

   1 /*
   2 <dtml-with base_properties>
   3 <dtml-with portfolio_properties>
   4
   5
   6 */
   7 /* Photo / Portfolio */
   8 .photo_viewer {
   9   width:100%;
  10   margin-bottom:1px;
  11 }
  12
  13 .photo_viewer #medium_image {
  14   height:603px; /* todo : paramètre */
  15   text-align:center;
  16   vertical-align:middle;
  17 }
  18
  19 #medium_image.selected {
  20   background: &dtml-medium_image_background;;
  21 }
  22
  23 .photo_viewer td {
  24   padding:0;
  25 }
  26
  27 .photo_viewer .metadata_bar {
  28   background: &dtml-metadata_bar_background;;
  29   width:20em;
  30 }
  31
  32 .image_metadata {
  33   padding: 0 1em 1em 1em;
  34 }
  35
  36 .photo_viewer .photographer {
  37   color: &dtml-photographer_font_color;;
  38 }
  39
  40 .photo_viewer .title_summary {
  41   color: &dtml-title_font_color;;
  42 }
  43
  44 .photo_viewer .description {
  45   padding-top:1.5em;
  46   max-height:22em;
  47   overflow-y:hidden;
  48 }
  49
  50 .photo_viewer .description:hover {
  51   max-height:none;
  52 }
  53
  54 .photo_viewer ul.keywords {
  55   padding: 0 0 1em 0;
  56   margin:0;
  57   text-align:left;
  58 }
  59
  60 .photo_viewer .keywords li {
  61   display: inline;
  62   padding-left: 10px;
  63   background: url(&dtml-portal_url;/keyword_sep.gif) left no-repeat;
  64 }
  65
  66 .photo_viewer .keywords li:first-child {
  67   padding-left:0;
  68   background:none;
  69 }
  70
  71
  72 table.metadata_category {
  73   color: &dtml-metadata_edit_label_color;;
  74   background: &dtml-metadata_edit_panel_background;;
  75   font-size: 11px;
  76   margin-top:1px;
  77 }
  78
  79 table.metadata_category th {
  80   text-align:right;
  81   vertical-align:top;
  82   font-weight:normal;
  83 }
  84
  85 table.metadata_category tr.last td,
  86 table.metadata_category tr.last th {
  87   padding-bottom:4px;
  88 }
  89
  90 table.metadata_category tr.name td,
  91 table.metadata_category tr.name th {
  92   margin-top: 4px;
  93   border-top:1px solid &dtml-metadata_panel_border_sep_color;;
  94   text-align:left;
  95   padding: 4px 0 2px 10px;
  96 }
  97
  98 table.metadata_category td {
  99   padding:1px 8px;
 100 }
 101
 102
 103 table.metadata_category input,
 104 table.metadata_category textarea,
 105 table.metadata_category select {
 106   width:100%;
 107   color:&dtml-metadata_input_font_color;;
 108   font-size:11px;
 109   font-family: Arial,Helvetica,Geneva,Swiss,SunSans-Regular,sans-serif;
 110   border:1px solid &dtml-metadata_input_border_color;;
 111   background: &dtml-metadata_input_background;;
 112 }
 113
 114 table.metadata_category input:hover,
 115 table.metadata_category textarea:hover,
 116 table.metadata_category select:hover {
 117   background: &dtml-metadata_input_hover_background;;
 118 }
 119
 120 table.metadata_category input:focus,
 121 table.metadata_category textarea:focus,
 122 table.metadata_category select:focus {
 123   background: &dtml-metadata_input_focus_background;;
 124   color: &dtml-metadata_input_focus_font_color;;
 125   border: 1px solid &dtml-metadata_input_border_focus_color;;
 126 }
 127
 128 .portfolio_lightbox a {
 129   background: &dtml-portfolio_slide_background;;
 130   color: &dtml-fontColor;;
 131   display:block;
 132   width: <dtml-var expr="thumb_width + 16">px;/*&dtml-slide_size;px;*/
 133   height: 256px;
 134   display:block;
 135   text-align:center;
 136   float:left;
 137   padding-top:8px;
 138   margin-top : 6px;
 139   margin-left : 6px;
 140   overflow:hidden;
 141 }
 142
 143 .portfolio_lightbox a:hover {
 144   background:&dtml-portfolio_slide_hover_background;;
 145   color: &dtml-linkHoverColor;;
 146 }
 147
 148 .portfolio_lightbox img {
 149   border:none;
 150 }
 151
 152 .portfolio_lightbox h3 {
 153   margin:5px 0;
 154   padding:0 8px;
 155   text-align:left;
 156 }
 157 .portfolio_lightbox div {
 158   padding:0 8px;
 159   text-align:left;
 160   font-size: &dtml-fontSmallSize;;
 161 }
 162
 163 div.lightbox { /*the lightbox itself*/
 164   min-height:300px;
 165 }
 166
 167 .photo-drop-target {
 168   background: url('&dtml-portal_url;/image-upload-dd-target.png') no-repeat center center;
 169 }
 170
 171 .lightbox span {
 172     width: &dtml-slide_size;px;
 173     height: &dtml-slide_size;px;
 174     display:block;
 175     float:left;
 176 }
 177
 178 .lightbox a.slide {
 179   position:absolute;
 180   display:block;
 181   width: &dtml-slide_size;px;
 182   height: &dtml-slide_size;px;
 183   background:&dtml-slide_background;;
 184   border: 1px solid &dtml-backgroundColor;;
 185 }
 186
 187 .lightbox a.slide:hover {
 188   background:&dtml-slide_hover_background;;
 189 }
 190
 191 .lightbox .selected a.slide,
 192 .lightbox a.selected:hover {
 193   background:&dtml-slide_selected_background;;
 194 }
 195
 196 .lightbox .hidden-slide a.slide,
 197 .lightbox a.hidden-slide:hover {
 198   background:url(&dtml-portal_url;/hidden-slide-bg.png);
 199 }
 200
 201 .lightbox .slide img {
 202   position:absolute;
 203   border: 1px solid black;
 204 }
 205
 206 .lightbox span.button {
 207   background:none;
 208   position: absolute;
 209 }
 210
 211 .lightbox span[class].button {
 212   visibility:hidden;
 213 }
 214
 215 .lightbox span:hover span.button {
 216   visibility:visible;
 217 }
 218
 219 .lightbox .slide-select,
 220 .lightbox .slide-deselect {
 221   margin-left:10px;
 222   margin-top:7px;
 223   width:12px;
 224   height:17px;
 225 }
 226
 227 .lightbox .slide-select img {
 228   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='&dtml-portal_url;/slide-select-btn.png');
 229 }
 230
 231 .lightbox .slide-select[class] img {
 232   background: url(&dtml-portal_url;/slide-select-btn.png);
 233 }
 234
 235 .lightbox .slide-deselect img {
 236   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='&dtml-portal_url;/slide-deselect-btn.png');
 237 }
 238
 239 .lightbox .slide-deselect[class] img {
 240   background: url(&dtml-portal_url;/slide-deselect-btn.png);
 241 }
 242
 243 .lightbox .slide-cart {
 244   margin-left:30px;
 245   margin-top:7px;
 246   width:12px;
 247   height:17px;
 248 }
 249
 250 .lightbox .slide-cart img {
 251   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='&dtml-portal_url;/slide-cart-btn.png');
 252 }
 253
 254 .lightbox .slide-cart[class] img {
 255   background: url(&dtml-portal_url;/slide-cart-btn.png);
 256 }
 257
 258 /* slide del */
 259 .lightbox .slide-del {
 260   margin-left:200px;
 261   margin-top:5px;
 262   width:18px;
 263   height:19px;
 264 }
 265
 266 .lightbox .slide-del img {
 267   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='&dtml-portal_url;/slide-del-btn.png');
 268 }
 269
 270 .lightbox .slide-del[class] img {
 271   background: url(&dtml-portal_url;/slide-del-btn.png);
 272 }
 273
 274
 275 .lightbox .slide-hide,
 276 .lightbox .slide-show {
 277   width:16px;
 278   height:15px;
 279 }
 280
 281 .lightbox .slide-hide img {
 282   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='&dtml-portal_url;/slide-eye-open-btn.png');
 283 }
 284
 285 .lightbox .slide-hide[class] img {
 286   background: url(&dtml-portal_url;/slide-eye-open-btn.png);
 287 }
 288
 289 .lightbox .slide-show img {
 290   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='&dtml-portal_url;/slide-eye-closed.png');
 291 }
 292
 293 .lightbox .slide-show[class] img {
 294   background: url(&dtml-portal_url;/slide-eye-closed.png);
 295 }
 296
 297 .lightbox span.upload-progress {
 298   display: block;
 299   position:relative;
 300   background:#ef8e32;
 301   height:5px;
 302   border-radius:3px;
 303   width:0;
 304   margin-left:11px;
 305   top:208px;
 306 }
 307
 308 .image_toolbar {
 309   background: url(&dtml-portal_url;/image_toolbar_bg.gif) repeat-x;
 310   position:relative;
 311   z-index:3;
 312   font-size:27px;
 313   white-space:nowrap;
 314 }
 315
 316 /*
 317 .image_toolbar img {
 318   margin-left: 4px;
 319   border:0;
 320 }*/
 321
 322 #film_bar {
 323   background:#555;
 324   overflow:hidden;
 325   position:relative;
 326   width:100%;
 327   height: <dtml-var expr="thumb_height/2 + 12">px;;
 328 }
 329
 330 #film_bar table {
 331   position:absolute;
 332   border-collapse:collapse;
 333 }
 334
 335 #film_bar td {
 336   padding:0;
 337   border:1px solid #484848;
 338 }
 339
 340 #film_bar a {
 341   width: <dtml-var expr="thumb_width/2 + 10">px;;
 342   height: <dtml-var expr="thumb_height/2 + 10">px;;
 343   display:block;
 344   text-align:center;
 345   vertical-align:middle;
 346 }
 347
 348 #film_bar a:hover,
 349 #film_bar a.selected {
 350   background:#727272;
 351 }
 352
 353 #film_bar a.displayed {
 354   background:#bfbfbf;
 355 }
 356
 357 #film_bar img{
 358   border:none;
 359 }
 360
 361 .jsslider {
 362   position:absolute;
 363   height:13px;
 364   width:0px;
 365   background: #000;
 366 }
 367
 368 .jsslider span {
 369   position:absolute;
 370   width:0px;
 371   height:11px;
 372   background:url(&dtml-portal_url;/slider_bg.gif);
 373   margin:1px 0;
 374   font-size:0;  /*IE 6 hack */
 375 }
 376
 377 #cart_slide {
 378   position:absolute;
 379   top:25px;
 380   left:-190px;
 381   width:226px;
 382   height:237px;
 383   visibility:hidden;
 384   font-size:15px;
 385   line-height:18px;
 386   padding-top:11px;
 387   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='&dtml-portal_url;/cart-slide-background.png');
 388 }
 389
 390 #cart_slide[id] {
 391   background:no-repeat url(&dtml-portal_url;/cart-slide-background.png);;
 392 }
 393
 394 .wdgt-buyable-items {
 395   white-space:normal;
 396   width: &dtml-slide_size;px;
 397   height: &dtml-slide_size;px;
 398   position:absolute;
 399   margin:2px;
 400   color:#fff;
 401 }
 402
 403 .wdgt-buyable-items input {
 404   font-size:70%;
 405 }
 406
 407 .ppt-description {
 408   color:white;
 409   text-align:left;
 410   visibility:hidden;
 411   display:none;
 412   padding-right:45px;
 413   padding-top:0.5em;
 414 }
 415 .panel-background {
 416   width: &dtml-slide_size;px;
 417   height: &dtml-slide_size;px;
 418   background:#3e2b14;
 419   position:absolute;
 420   opacity:0.9;
 421   filter: alpha(opacity='90');
 422 }
 423
 424 .confirm-message {
 425   position:absolute;
 426   color: &dtml-messageFontColor;;
 427   padding:3px;
 428   background: &dtml-messageBackgroundColor;;
 429 }
 430
 431 #cart_slide .confirm-message {
 432   position:static;
 433   margin:2px;
 434   text-align:center;
 435   vertical-align:middle;
 436 }
 437
 438
 439 input.add-to-cart-btn {
 440   position:absolute;
 441   background:transparent;
 442   width:45px;
 443   height:43px;
 444   border:none;
 445   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='&dtml-portal_url;/add_to_cart.png');
 446   left:<dtml-var expr="slide_size - 47">px;
 447   top:2.5em;;
 448 }
 449
 450 input.add-to-cart-btn[class] {
 451   background:url(&dtml-portal_url;/add_to_cart.png);
 452 }
 453
 454 tbody.total th {
 455   color:#fff;
 456 }
 457
 458 tbody.total td {
 459   font-weight:bold;
 460   font-size:110%;
 461   background:#151515;
 462 }
 463
 464 td.num,
 465 th.num {
 466   text-align:right;
 467   padding-right:0.5em;
 468   border-left:1px solid black;
 469 }
 470
 471 .sell_steps_bar td {
 472   font-size:120%;
 473   background:#000 url(&dtml-portal_url;/sellbar-arrow.gif) no-repeat right;
 474   height:40px;
 475   vertical-align:middle;
 476   padding:0 1em 0 0.5em;
 477 }
 478
 479 .sell_steps_bar td.done {
 480   color: &dtml-messageFontColor;;
 481 }
 482
 483 /*
 484 </dtml-with>
 485 </dtml-with>
 486 */