Initial commit after re-install
This commit is contained in:
66
css/basic.css
Normal file
66
css/basic.css
Normal file
@@ -0,0 +1,66 @@
|
||||
html, body {
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
body{
|
||||
text-align: center;
|
||||
font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, Helvetica, Arial, sans-serif;
|
||||
background-color: #eee;
|
||||
color: #444;
|
||||
font-size: 75%;
|
||||
}
|
||||
a{
|
||||
color: #27D;
|
||||
text-decoration: none;
|
||||
}
|
||||
a:focus, a:hover, a:active {
|
||||
text-decoration: underline;
|
||||
}
|
||||
p, li {
|
||||
line-height: 1.8em;
|
||||
}
|
||||
h1, h2 {
|
||||
font-family: "Trebuchet MS", Verdana, sans-serif;
|
||||
margin: 0 0 10px 0;
|
||||
letter-spacing:-1px;
|
||||
}
|
||||
h1 {
|
||||
padding: 0;
|
||||
font-size: 3em;
|
||||
color: #333;
|
||||
}
|
||||
h2 {
|
||||
padding-top: 10px;
|
||||
font-size:2em;
|
||||
}
|
||||
pre {
|
||||
font-size: 1.2em;
|
||||
line-height: 1.2em;
|
||||
overflow-x: auto;
|
||||
}
|
||||
div#page {
|
||||
/* Full-width, responsive container */
|
||||
width: 100%;
|
||||
max-width: none;
|
||||
background-color: #fff;
|
||||
margin: 0 auto;
|
||||
text-align: left;
|
||||
border-color: #ddd;
|
||||
border-style: none solid solid;
|
||||
border-width: medium 1px 1px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
div#container {
|
||||
padding: 20px;
|
||||
}
|
||||
div#ads {
|
||||
clear: both;
|
||||
padding: 12px 0 12px 66px;
|
||||
}
|
||||
div#footer {
|
||||
clear: both;
|
||||
color: #777;
|
||||
margin: 0 auto;
|
||||
padding: 20px 0 40px;
|
||||
text-align: center;
|
||||
}
|
||||
324
css/galleriffic-2.css
Normal file
324
css/galleriffic-2.css
Normal file
@@ -0,0 +1,324 @@
|
||||
div.content {
|
||||
/* The display of content is enabled using jQuery so that the slideshow content won't display unless javascript is enabled. */
|
||||
display: none;
|
||||
float: none;
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
}
|
||||
div.content a, div.navigation a {
|
||||
text-decoration: none;
|
||||
color: #777;
|
||||
}
|
||||
div.content a:focus, div.content a:hover, div.content a:active {
|
||||
text-decoration: underline;
|
||||
}
|
||||
div.controls {
|
||||
margin-top: 5px;
|
||||
height: 23px;
|
||||
}
|
||||
div.controls a {
|
||||
padding: 5px;
|
||||
}
|
||||
div.ss-controls {
|
||||
float: left;
|
||||
}
|
||||
div.nav-controls {
|
||||
float: right;
|
||||
}
|
||||
div.slideshow-container {
|
||||
position: relative;
|
||||
clear: both;
|
||||
/* Fill available screen height more aggressively on large displays */
|
||||
height: clamp(700px, calc(100vh - 220px), 980px);
|
||||
max-width: 1100px;
|
||||
}
|
||||
div.loader {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-image: url('loader.gif');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
div.slideshow {
|
||||
|
||||
}
|
||||
div.slideshow span.image-wrapper {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
div.slideshow a.advance-link {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
line-height: 1;
|
||||
text-align: center;
|
||||
}
|
||||
div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited {
|
||||
text-decoration: none;
|
||||
}
|
||||
div.slideshow img {
|
||||
vertical-align: middle;
|
||||
border: 1px solid #ccc;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
height: auto;
|
||||
}
|
||||
div.download {
|
||||
float: right;
|
||||
}
|
||||
div.caption-container {
|
||||
position: relative;
|
||||
clear: left;
|
||||
height: 75px;
|
||||
}
|
||||
span.image-caption {
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
div.caption {
|
||||
padding: 12px;
|
||||
}
|
||||
div.image-title {
|
||||
font-weight: bold;
|
||||
font-size: 1.4em;
|
||||
}
|
||||
div.image-desc {
|
||||
line-height: 1.3em;
|
||||
padding-top: 12px;
|
||||
}
|
||||
div.navigation {
|
||||
/* The navigation style is set using jQuery so that the javascript specific styles won't be applied unless javascript is enabled. */
|
||||
}
|
||||
|
||||
/* Ensure thumbnail list area clears its floated children (thumbs + pagination) */
|
||||
#thumbs-list::after {
|
||||
content: "";
|
||||
display: block;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
/* Upload panel under thumbnails */
|
||||
.upload-panel {
|
||||
clear: both; /* never overlap floated thumbnails/pagination */
|
||||
margin-top: 14px;
|
||||
padding-top: 12px;
|
||||
border-top: 1px solid #e5e5e5;
|
||||
}
|
||||
.upload-title {
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.dropzone {
|
||||
position: relative;
|
||||
border: 2px dashed #cfcfcf;
|
||||
border-radius: 8px;
|
||||
padding: 14px 12px;
|
||||
background: #fafafa;
|
||||
cursor: pointer;
|
||||
}
|
||||
.dropzone:focus {
|
||||
outline: none;
|
||||
box-shadow: 0 0 0 3px rgba(46, 131, 255, 0.25);
|
||||
border-color: #2e83ff;
|
||||
}
|
||||
.dropzone.dragover {
|
||||
border-color: #2e83ff;
|
||||
background: #f2f7ff;
|
||||
}
|
||||
.dropzone-text {
|
||||
color: #666;
|
||||
font-size: 12px;
|
||||
}
|
||||
.file-input {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
opacity: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
.upload-preview {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.upload-preview img {
|
||||
max-width: 100%;
|
||||
max-height: 160px;
|
||||
border: 1px solid #ddd;
|
||||
background: #fff;
|
||||
display: block;
|
||||
}
|
||||
.preview-meta {
|
||||
font-size: 11px;
|
||||
color: #666;
|
||||
margin-top: 6px;
|
||||
word-break: break-all;
|
||||
}
|
||||
.upload-actions {
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
.upload-actions button {
|
||||
padding: 7px 12px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #cfcfcf;
|
||||
background: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
.upload-actions button:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.upload-status {
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* Fullscreen lightbox */
|
||||
.lightbox {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 99999;
|
||||
}
|
||||
.lightbox-backdrop {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: rgba(0, 0, 0, 0.85);
|
||||
z-index: 0;
|
||||
}
|
||||
.lightbox-content {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 12px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.lightbox-content img {
|
||||
/* Fill the dark area as much as possible while keeping aspect ratio */
|
||||
width: 98vw;
|
||||
height: 98vh;
|
||||
object-fit: contain;
|
||||
border: 1px solid rgba(255, 255, 255, 0.2);
|
||||
background: #000;
|
||||
}
|
||||
.lightbox-close {
|
||||
position: absolute;
|
||||
top: 14px;
|
||||
right: 14px;
|
||||
z-index: 2; /* ensure clickable above .lightbox-content */
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 999px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.25);
|
||||
background: rgba(0, 0, 0, 0.35);
|
||||
color: #fff;
|
||||
font-size: 28px;
|
||||
line-height: 42px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.lightbox-close:hover {
|
||||
background: rgba(0, 0, 0, 0.55);
|
||||
}
|
||||
|
||||
/* ---- Layout: slideshow (left) + thumbs (right), full width ---- */
|
||||
.gallery-wrap {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.gallery-wrap > #gallery.content {
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
order: 2;
|
||||
}
|
||||
|
||||
.gallery-wrap > #thumbs.navigation {
|
||||
flex: 0 0 380px;
|
||||
max-width: 38vw;
|
||||
order: 1;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
.gallery-wrap {
|
||||
flex-direction: column;
|
||||
}
|
||||
.gallery-wrap > #thumbs.navigation {
|
||||
flex: 1 1 auto;
|
||||
max-width: none;
|
||||
order: 2;
|
||||
}
|
||||
}
|
||||
ul.thumbs {
|
||||
clear: both;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
ul.thumbs li {
|
||||
float: left;
|
||||
padding: 0;
|
||||
margin: 5px 10px 5px 0;
|
||||
list-style: none;
|
||||
}
|
||||
a.thumb {
|
||||
padding: 2px;
|
||||
display: block;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
ul.thumbs li.selected a.thumb {
|
||||
background: #000;
|
||||
}
|
||||
a.thumb:focus {
|
||||
outline: none;
|
||||
}
|
||||
ul.thumbs img {
|
||||
border: none;
|
||||
display: block;
|
||||
}
|
||||
div.pagination {
|
||||
clear: both;
|
||||
}
|
||||
div.navigation div.top {
|
||||
margin-bottom: 12px;
|
||||
height: 11px;
|
||||
}
|
||||
div.navigation div.bottom {
|
||||
margin-top: 12px;
|
||||
}
|
||||
div.pagination a, div.pagination span.current, div.pagination span.ellipsis {
|
||||
display: block;
|
||||
float: left;
|
||||
margin-right: 2px;
|
||||
padding: 4px 7px 2px 7px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
div.pagination a:hover {
|
||||
background-color: #eee;
|
||||
text-decoration: none;
|
||||
}
|
||||
div.pagination span.current {
|
||||
font-weight: bold;
|
||||
background-color: #000;
|
||||
border-color: #000;
|
||||
color: #fff;
|
||||
}
|
||||
div.pagination span.ellipsis {
|
||||
border: none;
|
||||
padding: 5px 0 3px 2px;
|
||||
}
|
||||
BIN
css/loader.gif
Normal file
BIN
css/loader.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
Reference in New Issue
Block a user