Some small gallery tweaks

This commit is contained in:
seaweedchan 2013-08-23 03:01:13 -07:00
parent 04d968d6f1
commit 9a43535675
5 changed files with 28 additions and 882 deletions

View File

@ -1,5 +1,5 @@
/*
* 4chan X - Version 1.2.35 - 2013-08-22
* 4chan X - Version 1.2.35 - 2013-08-23
*
* Licensed under the MIT license.
* https://github.com/seaweedchan/4chan-x/blob/master/LICENSE

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1090,7 +1090,7 @@ a:only-of-type > .remove {
z-index: 30;
display: <%= flex %>;
<%= flex %>-direction: row;
background: linear-gradient(rgba(0,0,0,1), rgba(0,0,0,0.5));
background: rgba(0,0,0,0.7);
}
.gal-viewport {
display: <%= flex %>;
@ -1166,7 +1166,6 @@ a:only-of-type > .remove {
overflow: auto;
/* Flex > Non-Flex child max-width and overflow fix (Firefox only?) */
width: 1%;
padding-top: 2.4em;
}
.gal-image a {
margin: auto;
@ -1174,27 +1173,28 @@ a:only-of-type > .remove {
.gal-image img {
max-width: 100%;
}
.gal-info {
position: absolute;
top: 0;
right: 40px;
left: 20px;
height: 2.4em;
background-color: rgba(0,0,0,0.3);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
padding: 0 20px;
}
.gal-close {
font-size: 2em;
float: right;
padding-right: 8px;
position: fixed;
top: 5px;
right: 195px;
}
.gal-name {
font-size: 2em;
color: #ddd;
position: fixed;
bottom: 5px;
right: 190px;
background: rgba(0,0,0,0.6) !important;
border-radius: 3px;
padding: 2px 5px;
color: white !important;
}
.gal-count {
color: #ddd;
position: fixed;
bottom: 26px;
right: 190px;
background: rgba(0,0,0,0.6) !important;
border-radius: 3px;
padding: 2px 5px;
color: white !important;
}

View File

@ -31,11 +31,9 @@ Gallery =
id: 'a-gallery'
innerHTML: """
<div class=gal-viewport>
<div class=gal-info>
<a href=javascript:; class=gal-close>×</a>
<a class=gal-name></a>
<span class=gal-count>(<span class='count'></span> / <span class='total'></span>)</a>
</div>
<a href=javascript:; class=gal-close>×</a>
<a class=gal-name target="_blank"></a>
<span class=gal-count><span class='count'></span> / <span class='total'></span></a></span>
<div class=gal-prev></div>
<div class=gal-image>
<a href=javascript:;><img></a>