"vier": Several design changes. New option for coloured network items.

This commit is contained in:
Michael Vogel 2014-03-02 01:29:20 +01:00
parent 37edb3079d
commit 2b5345323f
6 changed files with 58 additions and 46 deletions

View file

@ -39,7 +39,8 @@ function theme_admin_post(&$a){
function vier_form(&$a, $style){
$styles = array(
"shadow"=>"Shadow",
"flat"=>"Flat"
"flat"=>"Flat",
"netcolour"=>"Coloured Networks"
);
$t = get_markup_template("theme_settings.tpl" );
$o .= replace_macros($t, array(

View file

@ -30,7 +30,7 @@
}
.icon.s10 {
font-size: 1em;
font-size: 0.7em;
}
.icon.s16 {
font-size: 1.2em;

View file

@ -0,0 +1,34 @@
.tread-wrapper {
background-color: #fafafa;
}
.twit {
/* background-color: #FFFAFA; */
background-color: #fafeff;
}
.pump {
/* background-color: #FAFFFA; */
background-color: #fcfffa;
}
.face {
/* background-color: #FAFAFF; */
background-color: #fafcff;
}
.feed {
/* background-color: #FFFFFA; */
background-color: #fffdfa;
}
.dspr {
background-color: #FFFAFF;
}
.dfrn {
background-color: #FAFAFA;
}
.stat {
/* background-color: #FAFFFF; */
background-color: #fffafd;
}
.mail {
/* background-color: #FFFFF9; */
background-color: #fffafa;
}

View file

@ -125,7 +125,8 @@ img {
background-repeat: no-repeat;
width: 18px;
height: 18px;
display: block;
/* display: block; */
display: inline-block;
overflow: hidden;
padding: 1px;
color: #999;
@ -1116,18 +1117,18 @@ section.minimal {
/* wall item */
.tread-wrapper {
/* border-bottom: 1px solid #BDCDD4; */
border-bottom: 1px solid #D2D2D2;
border-bottom: 1px solid #D2D2D2;
position: relative;
padding: 5px;
margin-bottom: 10px;
box-shadow: 1px 1px 6px -3px rgba(0, 0, 0, 0.7);
background-color: #FAFaFa;
background-color: #FFFFFF;
/* width: 755px; */
}
.wall-item-decor {
position: absolute;
left: 755px;
left: calc(100% - 7px);
left: calc(100% - 16px);
/* top: -10px; */
width: 16px;
}
@ -1157,15 +1158,19 @@ border-bottom: 1px solid #D2D2D2;
.wall-item-bottom {
/* font-size: 14px; */
}
.wall-item-container .wall-item-bottom {
opacity: 0;
/* .wall-item-container .wall-item-bottom { */
.wall-item-container .wall-item-links,
.wall-item-container .wall-item-actions {
opacity: 0.2;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.wall-item-container:hover .wall-item-bottom {
/* .wall-item-container:hover .wall-item-bottom { */
.wall-item-container:hover .wall-item-links,
.wall-item-container:hover .wall-item-actions {
opacity: 1;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
@ -1448,37 +1453,6 @@ border-bottom: 1px solid #D2D2D2;
padding-right: 12px; */
}
.twit {
/* background-color: #FFFAFA; */
background-color: #fafeff;
}
.pump {
/* background-color: #FAFFFA; */
background-color: #fcfffa;
}
.face {
/* background-color: #FAFAFF; */
background-color: #fafcff;
}
.feed {
/* background-color: #FFFFFA; */
background-color: #fffdfa;
}
.dspr {
background-color: #FFFAFF;
}
.dfrn {
background-color: #FAFAFA;
}
.stat {
/* background-color: #FAFFFF; */
background-color: #fffafd;
}
.mail {
/* background-color: #FFFFF9; */
background-color: #fffafa;
}
#profile-jot-form {
box-shadow: 1px 1px 6px -3px #666;
background-color: #fafafa;

View file

@ -27,8 +27,8 @@
{{if $item.thread_level!=1}}<div class="children">{{/if}}
<div class="wall-item-decor">
<span class="icon s22 star {{$item.isstarred}}" id="starred-{{$item.id}}" title="{{$item.star.starred}}">{{$item.star.starred}}</span>
{{if $item.lock}}<span class="icon s22 lock fakelink" onclick="lockview(event,{{$item.id}});" title="{{$item.lock}}">{{$item.lock}}</span>{{/if}}
<!-- <span class="icon s22 star {{$item.isstarred}}" id="starred-{{$item.id}}" title="{{$item.star.starred}}">{{$item.star.starred}}</span> -->
<!-- {{if $item.lock}}<span class="icon s22 lock fakelink" onclick="lockview(event,{{$item.id}});" title="{{$item.lock}}">{{$item.lock}}</span>{{/if}} -->
<img id="like-rotator-{{$item.id}}" class="like-rotator" src="images/rotator.gif" alt="{{$item.wait}}" title="{{$item.wait}}" style="display: none;" />
</div>
@ -57,11 +57,11 @@
</div>
<div class="wall-item-actions-author">
<a href="{{$item.profile_url}}" target="redir" title="{{$item.linktitle}}" class="wall-item-name-link"><span class="wall-item-name{{$item.sparkle}}">{{$item.name}}</span></a>
{{if $item.owner_url}}{{$item.via}} <a href="{{$item.owner_url}}" target="redir" title="{{$item.olinktitle}}" class="wall-item-name-link"><span class="wall-item-name{{$item.osparkle}}" id="wall-item-ownername-{{$item.id}}">{{$item.owner_name}}</span></a> <!-- {{$item.vwall}} -->{{/if}}
{{if $item.owner_url}}{{$item.via}} <a href="{{$item.owner_url}}" target="redir" title="{{$item.olinktitle}}" class="wall-item-name-link"><span class="wall-item-name{{$item.osparkle}}" id="wall-item-ownername-{{$item.id}}">{{$item.owner_name}}</span></a> <!-- {{$item.vwall}} -->{{/if}}
<span class="wall-item-ago">
{{if $item.plink}}<a title="{{$item.plink.title}}" href="{{$item.plink.href}}" style="color: #999">{{$item.created}}</a>{{else}} {{$item.created}} {{/if}}
{{if $item.lock}}<span class="fakelink" style="color: #999" onclick="lockview(event,{{$item.id}});">{{$item.lock}}</span> {{/if}}
</span>
{{if $item.lock}}<span class="icon s10 lock fakelink" onclick="lockview(event,{{$item.id}});" title="{{$item.lock}}">{{$item.lock}}</span>{{/if}}
<span class="wall-item-network" title="{{$item.app}}">
{{$item.network_name}}
</span>
@ -92,7 +92,7 @@
</div>
<div class="wall-item-bottom">
<div class="wall-item-links">
{{if $item.plink}}<a title="{{$item.plink.title}}" href="{{$item.plink.href}}"><i class="icon-link icon-large"></i></a>{{/if}}
{{if $item.plink}}<a title="{{$item.plink.title}}" href="{{$item.plink.orig}}"><i class="icon-link icon-large"></i></a>{{/if}}
</div>
<div class="wall-item-actions">
<div class="wall-item-actions-social">
@ -100,8 +100,9 @@
<span id="comment-{{$item.id}}" class="fakelink togglecomment" onclick="openClose('item-comments-{{$item.id}}');"><i class="icon-comment"></i></span>
{{/if}}{{/if}}
{{if $item.vote}}
{{if $item.vote.like}}
<a href="#" id="like-{{$item.id}}" title="{{$item.vote.like.0}}" onclick="dolike({{$item.id}},'like'); return false"><i class="icon-thumbs-up icon-large"></i></a>
{{if $item.vote.dislike}}
{{/if}}{{if $item.vote.dislike}}
<a href="#" id="dislike-{{$item.id}}" title="{{$item.vote.dislike.0}}" onclick="dolike({{$item.id}},'dislike'); return false"><i class="icon-thumbs-down icon-large"></i></a>
{{/if}}
{{if $item.vote.share}}

View file

@ -18,6 +18,8 @@ $a->theme_info = array();
$style = get_pconfig(local_user(), 'vier', 'style');
if ($style == "flat")
$a->page['htmlhead'] .= '<link rel="stylesheet" href="view/theme/vier/flat.css" type="text/css" media="screen"/>'."\n";
else if ($style == "netcolour")
$a->page['htmlhead'] .= '<link rel="stylesheet" href="view/theme/vier/netcolour.css" type="text/css" media="screen"/>'."\n";
$a->page['htmlhead'] .= <<< EOT
<script type="text/javascript" src="$baseurl/view/theme/vier/js/jquery.divgrow-1.3.1.f1.min.js"></script>