Knah-Tsaeb/MyShaarli
Knah-Tsaeb/MyShaarli
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Change tag style

Browse source
This commit is contained in:
Knah Tsaeb 2016-09-14 11:13:49 +02:00
parent e68e261882
commit 645557480c
4 changed files with 82 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
tpl/myShaarli/linklist.html
View file

@ -90,8 +90,8 @@ <h3 class="linktitle">{function="returnFavicon($value.url)"}<a href="{$redirecto
onclick="showQrCode(this); return false;" class="qrcode" data-permalink="{$scripturl}?{$value.linkdate|smallHash}"><img src="images/qrcode.png#" title="QR-Code" alt="qrcode logo"></a></span> - <span class="linkurl" title="Short link">{$value.url|htmlspecialchars}</span> onclick="showQrCode(this); return false;" class="qrcode" data-permalink="{$scripturl}?{$value.linkdate|smallHash}"><img src="images/qrcode.png#" title="QR-Code" alt="qrcode logo"></a></span> - <span class="linkurl" title="Short link">{$value.url|htmlspecialchars}</span>
<br> <br>
{if="$value.tags"} {if="$value.tags"}
<div class="linktaglist"> <div class="tags">
{loop="value.taglist"}<span class="linktag" title="Add tag"><a href="?addtag={$value|urlencode}">{$value|htmlspecialchars}</a></span> {/loop} {loop="value.taglist"}<a href="?addtag={$value|urlencode}">{$value|htmlspecialchars}</a> {/loop}
</div> </div>
{/if} {/if}
</div> </div>

60
tpl/myShaarli/myShaarli.css
View file

@ -621,33 +621,51 @@ a, .linkdescription a {
text-decoration: none; text-decoration: none;
} }
.linktaglist { .tags a {
line-height: 200%; float: left;
padding-top: 0.3em; background: #777;
color: #fff;
text-decoration: none;
margin: 0 0 10px 18px;
padding: 2px 10px 1px;
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
position: relative;
transition: all .25s linear;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
white-space: nowrap;
line-height: 21px;
} }
.linktag { .tags a:before {
background: linear-gradient(#F2F2F2,#ffffff); content: "";
background-color: #ffffff; border-style: solid;
background-image: url(../../images/tag_blue.png); border-color: transparent #777 transparent transparent;
background-position: 3px center; border-width: 12px 13px 12px 0;
background-repeat: no-repeat; position: absolute;
border-radius: 3px 3px 3px 3px; left: -13px;
box-shadow: 0 0 2px rgba(0,0,0,0.5); top: 0;
cursor: pointer; transition: all .25s linear;
font-size: 9pt;
height: 20px;
padding: 3px 3px 3px 20px;
} }
.linktag:hover { .tags a:after {
border-color: #555573; background: none repeat scroll 0 0 #FFFFFF;
color: #000; border-radius: 50% 50% 50% 50%;
box-shadow: 0 1px 1px #737373 inset;
content: "";
height: 5px;
left: -1px;
position: absolute;
top: 10px;
width: 5px;
} }
.linktag a { .tags a:hover {
color: #777; background-color: #333;
text-decoration: none; color: #a2dd42;
}
.tags a:hover:before {
border-color: transparent #333 transparent transparent;
} }
.linkshort a { .linkshort a {

62
tpl/myShaarli_Columns/columns.css
View file

@ -633,36 +633,52 @@ a, .linkdescription a {
color: #3465A4; color: #3465A4;
text-decoration: none; text-decoration: none;
} }
.tags a {
.linktaglist { float: left;
line-height: 200%; background: #777;
padding-top: 0.3em; color: #fff;
text-decoration: none;
margin: 0 0 10px 18px;
padding: 2px 10px 1px;
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
position: relative;
transition: all .25s linear;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
white-space: nowrap;
line-height: 21px;
} }
.linktag { .tags a:before {
background: linear-gradient(#F2F2F2,#ffffff); content: "";
background-color: #ffffff; border-style: solid;
background-image: url(../../images/tag_blue.png); border-color: transparent #777 transparent transparent;
background-position: 3px center; border-width: 12px 13px 12px 0;
background-repeat: no-repeat; position: absolute;
border-radius: 3px 3px 3px 3px; left: -13px;
box-shadow: 0 0 2px rgba(0,0,0,0.5); top: 0;
cursor: pointer; transition: all .25s linear;
font-size: 9pt;
height: 20px;
padding: 3px 3px 3px 20px;
} }
.linktag:hover { .tags a:after {
border-color: #555573; background: none repeat scroll 0 0 #FFFFFF;
color: #000; border-radius: 50% 50% 50% 50%;
box-shadow: 0 1px 1px #737373 inset;
content: "";
height: 5px;
left: -1px;
position: absolute;
top: 10px;
width: 5px;
} }
.linktag a { .tags a:hover {
color: #777; background-color: #333;
text-decoration: none; color: #a2dd42;
}
.tags a:hover:before {
border-color: transparent #333 transparent transparent;
} }
.linkshort a { .linkshort a {
color: #393964; color: #393964;
text-decoration: none; text-decoration: none;

4
tpl/myShaarli_Columns/linklist.html
View file

@ -90,8 +90,8 @@ <h3 class="linktitle">{function="returnFavicon($value.url)"}<a href="{$redirecto
onclick="showQrCode(this); return false;" class="qrcode" data-permalink="{$scripturl}?{$value.linkdate|smallHash}"><img src="images/qrcode.png#" title="QR-Code" alt="qrcode logo"></a></span> - <span class="linkurl" title="Short link">{$value.url|htmlspecialchars}</span> onclick="showQrCode(this); return false;" class="qrcode" data-permalink="{$scripturl}?{$value.linkdate|smallHash}"><img src="images/qrcode.png#" title="QR-Code" alt="qrcode logo"></a></span> - <span class="linkurl" title="Short link">{$value.url|htmlspecialchars}</span>
<br> <br>
{if="$value.tags"} {if="$value.tags"}
<div class="linktaglist"> <div class="tags">
{loop="value.taglist"}<span class="linktag" title="Add tag"><a href="?addtag={$value|urlencode}">{$value|htmlspecialchars}</a></span> {/loop} {loop="value.taglist"}<a href="?addtag={$value|urlencode}">{$value|htmlspecialchars}</a> {/loop}
</div> </div>
{/if} {/if}
</div> </div>