photofloat/web/css/000-controls.css

219 lines
3.8 KiB
CSS
Raw Normal View History

2011-05-06 13:55:47 +02:00
body {
margin: 0;
padding: 0;
background-color: #222222;
font-family: "LM Roman", "Georgia", "Palatino Linotype", "Palatino", "Times New Roman", "Times", serif;
color: #FFFFFF;
}
a {
2011-05-08 08:57:27 +02:00
color: #84AAC2;
2011-05-06 13:55:47 +02:00
text-decoration: none;
}
a:hover {
2011-05-08 08:57:27 +02:00
color: #FFAD27;
2011-05-06 13:55:47 +02:00
}
#title {
position: absolute;
top: 0;
padding: 0.4em;
font-weight: bold;
2011-05-07 04:48:09 +02:00
font-size: 1.15em;
2011-05-06 13:55:47 +02:00
}
#loading {
display: none;
}
#album-view {
position: absolute;
top: 2.5em;
padding: 1em;
}
#thumbs {
2011-06-24 09:02:50 +02:00
clear: both;
2011-05-06 13:55:47 +02:00
line-height: 0;
}
#thumbs img {
border: 0;
margin: 0;
padding: 0;
}
2011-05-10 01:36:15 +02:00
.current-thumb {
border-top: 4px solid #FFAD27 !important;
2011-05-10 01:36:15 +02:00
}
2011-05-06 13:55:47 +02:00
#subalbums {
2011-05-07 00:55:02 +02:00
padding-top: 1.5em;
2011-05-06 13:55:47 +02:00
}
.album-button {
float: left;
display: block;
2011-05-07 00:55:02 +02:00
width: 150px;
height: 60px;
2011-05-06 13:55:47 +02:00
text-align: center;
font-style: italic;
2011-05-07 00:55:02 +02:00
font-size: 12px;
background-repeat: no-repeat;
background-position: top;
padding-top: 150px;
2011-05-07 01:11:03 +02:00
background-image: url(../img/image-placeholder.png);
2011-05-06 13:55:47 +02:00
}
#next, #back {
position: absolute;
width: auto;
font-size: 12em;
2011-05-06 13:55:47 +02:00
line-height: 0;
top: 40%;
2011-05-07 13:42:34 +02:00
font-weight: bold;
2011-05-08 08:57:27 +02:00
opacity: 0.35;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=35)";
filter: alpha(opacity=35);
2011-05-06 13:55:47 +02:00
}
#back {
2011-05-08 08:57:27 +02:00
left: 0.1em;
2011-05-06 13:55:47 +02:00
}
#next {
2011-05-08 08:57:27 +02:00
right: 0.1em;
2011-05-06 13:55:47 +02:00
}
#photo {
border: 0;
left: 0;
2011-05-06 13:55:47 +02:00
}
#photo-view {
position: absolute;
bottom: 150px;
top: 2.5em;
overflow: hidden;
left: 0;
right: 0;
text-align: center;
2011-05-06 13:55:47 +02:00
}
#photo-box, #video-box {
2011-05-07 04:48:09 +02:00
display: inline;
}
#video-box-inner {
position: absolute;
top: 50%;
width: 100%;
}
2011-05-07 04:48:09 +02:00
#photo-links {
background-color: #000000;
font-weight: bold;
height: 12px;
font-size: 12px;
line-height: 10px;
2011-05-07 04:48:09 +02:00
padding-top: 3px;
padding-bottom: 3px;
padding-right: 10px;
padding-left: 10px;
display: none;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
-moz-border-top-right-radius: 5px;
-moz-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-webkit-border-top-left-radius: 5px;
}
2011-05-07 08:09:54 +02:00
#metadata {
background-color: #000000;
2011-05-07 13:42:34 +02:00
width: 340px;
2011-05-07 08:09:54 +02:00
font-size: 12px;
line-height: 12px;
padding-top: 3px;
padding-bottom: 3px;
padding-right: 10px;
padding-left: 10px;
display: none;
margin: 0 auto;
margin-top: 1px;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
-moz-border-top-right-radius: 5px;
-moz-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-webkit-border-top-left-radius: 5px;
opacity: 0.5;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);
2011-05-07 09:42:44 +02:00
overflow: auto;
2011-05-07 08:09:54 +02:00
}
#metadata table {
2011-05-07 09:42:44 +02:00
margin: auto auto;
2011-05-07 08:09:54 +02:00
text-align: left;
}
#metadata tr {
height: 14px;
}
2011-05-07 04:48:09 +02:00
#photo-bar {
position: absolute;
bottom: 0;
width: 100%;
text-align: center;
}
2012-04-19 20:52:41 +02:00
#fullscreen, #fullscreen-divider {
display: none;
}
2011-05-06 13:55:47 +02:00
.photo-view-container {
position: absolute;
height: 150px;
width: 100%;
bottom: 0;
top: auto !important;
overflow-x: auto;
overflow-y: hidden;
white-space: nowrap;
padding: 0 !important;
2011-05-06 14:50:45 +02:00
text-align: center;
background-color: #999999;
2011-05-06 13:55:47 +02:00
}
2011-05-07 04:48:09 +02:00
2011-05-10 01:13:13 +02:00
#powered-by {
clear: both;
text-align: center;
font-size: 0.85em;
font-style: italic;
font-weight: bold;
text-shadow: rgba(0,0,0,0.5) -1px 0, rgba(0,0,0,0.3) 0 -1px, rgba(255,255,255,0.5) 0 1px, rgba(0,0,0,0.3) -1px -2px;
color: #FFAD27;
}
2012-08-17 17:16:23 +02:00
#error-overlay, #error-text, #auth-text {
2011-05-09 11:01:24 +02:00
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
2011-05-07 04:48:09 +02:00
display: none;
2011-05-09 11:01:24 +02:00
}
#error-overlay {
background-color: #000000;
}
2012-08-17 17:16:23 +02:00
#error-text, #auth-text {
2011-05-09 11:01:24 +02:00
position: fixed;
2011-05-07 04:48:09 +02:00
padding-top: 20%;
2012-08-17 17:16:23 +02:00
text-align: center;
}
#error-text {
2011-05-07 04:48:09 +02:00
font-size: 4em;
font-weight: bold;
font-style: italic;
}
#video-unsupported {
background-image: url(../img/video-unsupported.png);
background-position: top center;
background-repeat: no-repeat;
padding-top: 96px;
}
2012-08-17 17:16:23 +02:00
#auth-text input {
color: rgb(0, 0, 0);
background-color: rgb(200, 200, 200);
border: 0;
font-family: inherit;
font-size: 2em;
font-weight: bold;
font-style: italic;
}