Differential D16844 Diff 40566 webroot/rsrc/css/aphront/lightbox-attachment.css

Changeset View

Standalone View

webroot/rsrc/css/aphront/lightbox-attachment.css

Show All 11 Lines	.lightbox-attachment {
top: 0;		top: 0;
left: 0;		left: 0;
bottom: 0;		bottom: 0;
right: 0;		right: 0;
overflow-y: auto;		overflow-y: auto;
}		}

.lightbox-attachment img {		.lightbox-attachment img {
margin: 3% auto 0;		max-width: calc(100% - 44px);
max-height: 90%;		max-height: calc(100% - 44px);
max-width: 90%;		position: absolute;
		top: 44px;
		right: 0;
		bottom: 0;
		left: 0;
		margin: auto;
		}

		.jx-mask + .lightbox-attachment {
		background: {$lightgreybackground};
}		}

.lightbox-attachment .loading {		.lightbox-attachment .loading {
position: absolute;		position: absolute;
top: -9999px;		top: -9999px;
}		}

.lightbox-attachment .attachment-name {		.lightbox-attachment .attachment-name {
width: 100%;		width: 100%;
color: #F2F2F2;
line-height: 30px;		line-height: 30px;
text-align: center;		text-align: center;
}		}

.lightbox-attachment .lightbox-status {		.lightbox-attachment .lightbox-status {
background: #010101;		background: #fff;
color: #F2F2F2;
line-height: 30px;
position: fixed;		position: fixed;
bottom: 0px;		top: 0;
width: 100%;		left: 0;
}		right: 0;
		height: 44px;
.lightbox-attachment .lightbox-status .lightbox-status-txt {		padding: 0 20px;
padding: 0px 0px 0px 20px;		line-height: 44px;
		border-bottom: 1px solid {$thinblueborder};
}		}

.lightbox-attachment .lightbox-status .lightbox-download {		.lightbox-attachment .lightbox-status .lightbox-download {
padding: 0px 20px 0px 0px;
float: right;		float: right;
}		}

.lightbox-attachment .lightbox-status .lightbox-download		.lightbox-attachment .lightbox-status .lightbox-download
.lightbox-download-form {		.lightbox-download-form {
display: inline;		display: inline;
}		}
.lightbox-attachment .lightbox-status .lightbox-download
.lightbox-download-form button {
border: 0;
background: #010101;
}
.lightbox-attachment .lightbox-status .lightbox-download
.lightbox-download-form button:hover {
background: #333;
}

.lightbox-attachment .lightbox-close {		.lightbox-attachment .lightbox-close {
top: 22px;		float: right;
right: 20px;		margin: 9px 0 0px 8px;
position: fixed;
display: block;
height: 26px;
width: 26px;
background: url('/rsrc/image/icon/lightbox/close-2.png');
}
.lightbox-attachment .lightbox-close:hover {
background: url('/rsrc/image/icon/lightbox/close-hover-2.png');
}		}

.lightbox-attachment .lightbox-left {		.lightbox-attachment .lightbox-left {
top: 46%;		top: 46%;
left: 20px;		left: 12px;
position: fixed;		position: fixed;
display: block;		display: block;
height: 38px;		height: 40px;
width: 21px;		width: 40px;
background: url('/rsrc/image/icon/lightbox/left-arrow-2.png');		}

		.lightbox-attachment .lightbox-left .phui-icon-view {
		font-size: 40px;
}		}
.lightbox-attachment .lightbox-left:hover {
background: url('/rsrc/image/icon/lightbox/left-arrow-hover-2.png');		.lightbox-attachment .lightbox-left:hover .phui-icon-view {
		color: {$sky};
}		}

.lightbox-attachment .lightbox-right {		.lightbox-attachment .lightbox-right .phui-icon-view {
top: 46%;		top: 46%;
right: 20px;		right: 12px;
position: fixed;		position: fixed;
display: block;		display: block;
height: 38px;		height: 38px;
width: 21px;		width: 21px;
background: url('/rsrc/image/icon/lightbox/right-arrow-2.png');
}		}
.lightbox-attachment .lightbox-right:hover {
background: url('/rsrc/image/icon/lightbox/right-arrow-hover-2.png');		.lightbox-attachment .lightbox-right .phui-icon-view {
		font-size: 40px;
		}

		.lightbox-attachment .lightbox-right:hover .phui-icon-view {
		color: {$sky};
}		}