mirror of
https://github.com/YunoHost-Apps/piwigo_ynh.git
synced 2024-09-03 20:06:03 +02:00
176 lines
3.6 KiB
CSS
176 lines
3.6 KiB
CSS
/*
|
|
* photoswipe.css
|
|
* Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
|
|
* Licensed under the MIT license
|
|
*
|
|
* Default styles for PhotoSwipe
|
|
* Avoid any position or dimension based styles
|
|
* where possible, unless specified already here.
|
|
* The gallery automatically works out gallery item
|
|
* positions etc.
|
|
*/
|
|
|
|
|
|
body.ps-active, body.ps-building, div.ps-active, div.ps-building
|
|
{
|
|
background: #000;
|
|
overflow: hidden;
|
|
}
|
|
body.ps-active *, div.ps-active *
|
|
{
|
|
-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
|
|
display: none;
|
|
}
|
|
body.ps-active *:focus, div.ps-active *:focus
|
|
{
|
|
outline: 0;
|
|
}
|
|
|
|
|
|
/* Document overlay */
|
|
div.ps-document-overlay
|
|
{
|
|
background: #000;
|
|
}
|
|
|
|
|
|
/* UILayer */
|
|
div.ps-uilayer {
|
|
|
|
background: #000;
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
|
|
/* Zoom/pan/rotate layer */
|
|
div.ps-zoom-pan-rotate{
|
|
background: #000;
|
|
}
|
|
div.ps-zoom-pan-rotate * { display: block; }
|
|
|
|
|
|
/* Carousel */
|
|
div.ps-carousel-item-loading
|
|
{
|
|
background: url(images/loader.gif) no-repeat center center;
|
|
}
|
|
|
|
div.ps-carousel-item-error
|
|
{
|
|
background: url(images/error.gif) no-repeat center center;
|
|
}
|
|
|
|
|
|
/* Caption */
|
|
div.ps-caption
|
|
{
|
|
background: #000000;
|
|
background: -moz-linear-gradient(top, #303130 0%, #000101 100%);
|
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#303130), color-stop(100%,#000101));
|
|
border-bottom: 1px solid #42403f;
|
|
color: #ffffff;
|
|
font-size: 13px;
|
|
font-family: "Lucida Grande", Helvetica, Arial,Verdana, sans-serif;
|
|
text-align: center;
|
|
}
|
|
div.ps-caption * { display: inline; }
|
|
|
|
div.ps-caption-bottom
|
|
{
|
|
border-top: 1px solid #42403f;
|
|
border-bottom: none;
|
|
min-height: 44px;
|
|
}
|
|
|
|
div.ps-caption-content
|
|
{
|
|
padding: 13px;
|
|
display: block;
|
|
}
|
|
|
|
|
|
/* Toolbar */
|
|
div.ps-toolbar
|
|
{
|
|
background: #000000;
|
|
background: -moz-linear-gradient(top, #303130 0%, #000101 100%);
|
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#303130), color-stop(100%,#000101));
|
|
border-top: 1px solid #42403f;
|
|
color: #ffffff;
|
|
font-size: 13px;
|
|
font-family: "Lucida Grande", Helvetica, Arial,Verdana, sans-serif;
|
|
text-align: center;
|
|
height: 44px;
|
|
display: table;
|
|
table-layout: fixed;
|
|
}
|
|
div.ps-toolbar * {
|
|
display: block;
|
|
}
|
|
|
|
div.ps-toolbar-top
|
|
{
|
|
border-bottom: 1px solid #42403f;
|
|
border-top: none;
|
|
}
|
|
|
|
div.ps-toolbar-close, div.ps-toolbar-previous, div.ps-toolbar-next, div.ps-toolbar-play
|
|
{
|
|
cursor: pointer;
|
|
display: table-cell;
|
|
}
|
|
|
|
div.ps-toolbar div div.ps-toolbar-content
|
|
{
|
|
width: 44px;
|
|
height: 44px;
|
|
margin: 0 auto 0;
|
|
background-image: url(images/icons.png);
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
div.ps-toolbar-close div.ps-toolbar-content
|
|
{
|
|
background-position: 0 0;
|
|
}
|
|
|
|
div.ps-toolbar-previous div.ps-toolbar-content
|
|
{
|
|
background-position: -44px 0;
|
|
}
|
|
|
|
div.ps-toolbar-previous-disabled div.ps-toolbar-content
|
|
{
|
|
background-position: -44px -44px;
|
|
}
|
|
|
|
div.ps-toolbar-next div.ps-toolbar-content
|
|
{
|
|
background-position: -132px 0;
|
|
}
|
|
|
|
div.ps-toolbar-next-disabled div.ps-toolbar-content
|
|
{
|
|
background-position: -132px -44px;
|
|
}
|
|
|
|
div.ps-toolbar-play div.ps-toolbar-content
|
|
{
|
|
background-position: -88px 0;
|
|
}
|
|
|
|
/* Hi-res display */
|
|
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
|
|
only screen and (min--moz-device-pixel-ratio: 1.5),
|
|
only screen and (min-resolution: 240dpi)
|
|
{
|
|
div.ps-toolbar div div.ps-toolbar-content
|
|
{
|
|
-moz-background-size: 176px 88px;
|
|
-o-background-size: 176px 88px;
|
|
-webkit-background-size: 176px 88px;
|
|
background-size: 176px 88px;
|
|
background-image: url(images/icons@2x.png);
|
|
}
|
|
}
|