projekte
/
oho
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

added different thumbs and date meta

This commit is contained in:
bmen 2019-03-28 12:52:54 +01:00
parent cb78a1eeab
commit eabe2ccc7b
10 changed files with 48 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
img/thumb01.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 48 KiB

BIN
img/thumb02.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 40 KiB

BIN
img/thumb03.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 31 KiB

BIN
img/thumb04.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 44 KiB

BIN
img/thumb05.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 33 KiB

BIN
img/thumb06.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 44 KiB

BIN
img/thumb07.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 46 KiB

BIN
img/thumb08.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 74 KiB

42
index.html
View File

@ -132,7 +132,7 @@
<div class="col-1-4-fixed">
<div class="search-results-variante3-item">
<div class="search-results-variante3-item-img">
<img src="img/aserradero-portatil-bolport_278x182.jpg" />
<img src="img/thumb01.jpg" />
</div>
<div class="search-results-variante3-item-info">
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
@ -158,13 +158,18 @@
<li><i class="fas fa-book-open"></i></li>
</ul>
<div class="clearer">&nbsp;</div>
<div class="search-results-variante3-item-meta-date">
<span class="updated">Updated: 03/27/19</span>
<span class="released">Released: 04/12/15</span>
</div>
<div class="clearer">&nbsp;</div>
</div>
</div>
</div>
<div class="col-1-4-fixed">
<div class="search-results-variante3-item">
<div class="search-results-variante3-item-img">
<img src="img/aserradero-portatil-bolport_278x182.jpg" />
<img src="img/thumb02.jpg" />
</div>
<div class="search-results-variante3-item-info">
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
@ -190,13 +195,18 @@
<li><i class="fas fa-book-open"></i></li>
</ul>
<div class="clearer">&nbsp;</div>
<div class="search-results-variante3-item-meta-date">
<span class="updated">Updated: 03/27/19</span>
<span class="released">Released: 04/12/15</span>
</div>
<div class="clearer">&nbsp;</div>
</div>
</div>
</div>
<div class="col-1-4-fixed">
<div class="search-results-variante3-item">
<div class="search-results-variante3-item-img">
<img src="img/aserradero-portatil-bolport_278x182.jpg" />
<img src="img/thumb03.jpg" />
</div>
<div class="search-results-variante3-item-info">
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
@ -222,13 +232,18 @@
<li><i class="fas fa-book-open"></i></li>
</ul>
<div class="clearer">&nbsp;</div>
<div class="search-results-variante3-item-meta-date">
<span class="updated">Updated: 03/27/19</span>
<span class="released">Released: 04/12/15</span>
</div>
<div class="clearer">&nbsp;</div>
</div>
</div>
</div>
<div class="col-1-4-fixed">
<div class="search-results-variante3-item">
<div class="search-results-variante3-item-img">
<img src="img/aserradero-portatil-bolport_278x182.jpg" />
<img src="img/thumb04.jpg" />
</div>
<div class="search-results-variante3-item-info">
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
@ -254,13 +269,18 @@
<li><i class="fas fa-book-open"></i></li>
</ul>
<div class="clearer">&nbsp;</div>
<div class="search-results-variante3-item-meta-date">
<span class="updated">Updated: 03/27/19</span>
<span class="released">Released: 04/12/15</span>
</div>
<div class="clearer">&nbsp;</div>
</div>
</div>
</div>
<div class="col-1-4-fixed">
<div class="search-results-variante3-item">
<div class="search-results-variante3-item-img">
<img src="img/aserradero-portatil-bolport_278x182.jpg" />
<img src="img/thumb05.jpg" />
</div>
<div class="search-results-variante3-item-info">
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
@ -286,13 +306,18 @@
<li><i class="fas fa-book-open"></i></li>
</ul>
<div class="clearer">&nbsp;</div>
<div class="search-results-variante3-item-meta-date">
<span class="updated">Updated: 03/27/19</span>
<span class="released">Released: 04/12/15</span>
</div>
<div class="clearer">&nbsp;</div>
</div>
</div>
</div>
<div class="col-1-4-fixed">
<div class="search-results-variante3-item">
<div class="search-results-variante3-item-img">
<img src="img/aserradero-portatil-bolport_278x182.jpg" />
<img src="img/thumb06.jpg" />
</div>
<div class="search-results-variante3-item-info">
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
@ -318,6 +343,11 @@
<li><i class="fas fa-book-open"></i></li>
</ul>
<div class="clearer">&nbsp;</div>
<div class="search-results-variante3-item-meta-date">
<span class="updated">Updated: 03/27/19</span>
<span class="released">Released: 04/12/15</span>
</div>
<div class="clearer">&nbsp;</div>
</div>
</div>
</div>

12
style.css
View File

@ -507,6 +507,7 @@ a:hover {
clip-path: inset(0 0 0 0);
width:278px;
margin:0 0;
border-radius:8px;
}
.search-results-variante3-item .search-results-variante3-item-info {
background: #fef0e4;
@ -526,6 +527,8 @@ a:hover {
.search-results-variante3-item .search-results-variante3-item-meta {
padding: 5px;
background:#fff;
border-bottom-right-radius: 8px;
border-bottom-left-radius: 8px;
}
.search-results-variante3-item:hover .search-results-variante3-item-meta {
padding: 5px 10px;
@ -573,6 +576,15 @@ a:hover {
height:7px;
display: block;
}
.search-results-variante3-item .search-results-variante3-item-meta .search-results-variante3-item-meta-date {
display:none;
}
.search-results-variante3-item .search-results-variante3-item-meta .search-results-variante3-item-meta-date .released {
float:right;
}
.search-results-variante3-item:hover .search-results-variante3-item-meta .search-results-variante3-item-meta-date {
display:block;
}
.search-results-variante3 svg {
transform: rotate(-90deg);
stroke-dasharray: 251; /* (2PI * 40px) */