Add Media Category Filter Buttons
This commit is contained in:
@ -41,7 +41,7 @@
|
||||
{if $file.authorid != 0}<span class="author block_level">{$file.authorname}</span>{/if}
|
||||
</header>
|
||||
|
||||
<div class="clearfix equal_heights serendipity_ImageWrapper"">
|
||||
<div class="clearfix equal_heights image_wrapper"">
|
||||
<div class="media_file_preview">
|
||||
{if $file.is_image AND $file.full_thumb}
|
||||
{if $file.url}
|
||||
@ -70,7 +70,7 @@
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<footer class="serendipity_ImageCaption">
|
||||
<footer class="image_caption">
|
||||
<ul class="media_file_meta plainList">
|
||||
{if $file.hotlink}
|
||||
<li>{$file.nice_hotlink}</li>
|
||||
|
@ -135,6 +135,17 @@
|
||||
<div class="form_buttons">
|
||||
<input name="go" type="submit" value="{$CONST.GO}">
|
||||
</div>
|
||||
|
||||
|
||||
<input type="radio" id="serendipity[filter][fileCategory][All]" name="serendipity[filter][fileCategory]" {if $media.filter.fileCategory == ""}checked{/if} value=""></input>
|
||||
<label for="serendipity[filter][fileCategory][All]" class="media_selector button_link">All</label>
|
||||
|
||||
<input id="serendipity[filter][fileCategory][Image]" type="radio" name="serendipity[filter][fileCategory]" {if $media.filter.fileCategory == "image"}checked{/if} value="image"></input>
|
||||
<label for="serendipity[filter][fileCategory][Image]" class="media_selector button_link">{$CONST.IMAGE}</label>
|
||||
|
||||
<input id="serendipity[filter][fileCategory][Video]" type="radio" name="serendipity[filter][fileCategory]" {if $media.filter.fileCategory == "video"}checked{/if} value="video"></input>
|
||||
<label for="serendipity[filter][fileCategory][Video]" class="media_selector button_link">{$CONST.VIDEO}</label>
|
||||
|
||||
</form>
|
||||
{if $media.nr_files < 1}
|
||||
<span class="msg_notice"><span class="icon-info-circle"></span> {$CONST.NO_IMAGES_FOUND}</span>
|
||||
|
@ -1414,7 +1414,7 @@ form > .button_link:first-of-type { margin-top: 0; }
|
||||
|
||||
.media_pane .pagination { margin: 0; }
|
||||
|
||||
.serendipity_ImageWrapper:hover > .serendipity_ImageCaption {
|
||||
.image_wrapper:hover > .image_caption {
|
||||
display: block;
|
||||
-webkit-animation: fade-in 0.4s 1;
|
||||
-moz-animation: fade-in 0.4s 1;
|
||||
@ -1422,14 +1422,12 @@ form > .button_link:first-of-type { margin-top: 0; }
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.serendipity_ImageCaption {
|
||||
.image_caption {
|
||||
display: none;
|
||||
position: absolute;
|
||||
color: white;
|
||||
background-color: rgba(0, 0, 0, 0.6);
|
||||
opacity: 0;
|
||||
|
||||
|
||||
}
|
||||
|
||||
@-webkit-keyframes fade-in {
|
||||
@ -1446,6 +1444,25 @@ form > .button_link:first-of-type { margin-top: 0; }
|
||||
100% { opacity: 1; }
|
||||
}
|
||||
|
||||
input[name="serendipity[filter][fileCategory]"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
label.media_selector {
|
||||
cursor: pointer;
|
||||
}
|
||||
input:checked + label.media_selector {
|
||||
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fff), color-stop(1px, #ddd), color-stop(100%, #eee));
|
||||
background-image: -webkit-linear-gradient(#fff, #ddd 1px, #eee);
|
||||
background-image: -moz-linear-gradient(#fff, #ddd 1px, #eee);
|
||||
background-image: -o-linear-gradient(#fff, #ddd 1px, #eee);
|
||||
background-image: linear-gradient(#fff, #ddd 1px, #eee);
|
||||
-webkit-box-shadow: inset rgba(0, 0, 0, 0.25) 0 1px 2px 0;
|
||||
-moz-box-shadow: inset rgba(0, 0, 0, 0.25) 0 1px 2px 0;
|
||||
box-shadow: inset rgba(0, 0, 0, 0.25) 0 1px 2px 0;
|
||||
border-color: #999 #bbb #ddd;
|
||||
}
|
||||
|
||||
|
||||
/* SMALL SCREEN (e.g. smartphones)
|
||||
----------------------------------------------------------------- */
|
||||
|
Reference in New Issue
Block a user