tweak quattro theme

This commit is contained in:
Fabrixxm 2014-09-17 10:59:19 +02:00
parent 3031457c36
commit d1029e1fb2
10 changed files with 495 additions and 53 deletions

View file

@ -113,3 +113,6 @@
@MailDisplaySubjectColor: @Grey5;
@MailDisplaySubjectBackgroundColor: #f6f7f8;
@NotificationsPageListOddBackground: @Grey1;
@NotificationsPageListEvenBackground: @Grey2;

View file

@ -64,6 +64,9 @@
.icon.type-unkn {
background-image: url("../../../images/icons/22/zip.png");
}
.icon.type-application {
background-image: url("../../../images/icons/22/zip.png");
}
.icon.type-audio {
background-image: url("../../../images/icons/22/audio.png");
}
@ -134,6 +137,9 @@
.icon.s10.type-unkn {
background-image: url("../../../images/icons/10/zip.png");
}
.icon.s10.type-application {
background-image: url("../../../images/icons/10/zip.png");
}
.icon.s10.type-audio {
background-image: url("../../../images/icons/10/audio.png");
}
@ -204,6 +210,9 @@
.icon.s16.type-unkn {
background-image: url("../../../images/icons/16/zip.png");
}
.icon.s16.type-application {
background-image: url("../../../images/icons/16/zip.png");
}
.icon.s16.type-audio {
background-image: url("../../../images/icons/16/audio.png");
}
@ -274,6 +283,9 @@
.icon.s22.type-unkn {
background-image: url("../../../images/icons/22/zip.png");
}
.icon.s22.type-application {
background-image: url("../../../images/icons/22/zip.png");
}
.icon.s22.type-audio {
background-image: url("../../../images/icons/22/audio.png");
}
@ -344,6 +356,9 @@
.icon.s48.type-unkn {
background-image: url("../../../images/icons/48/zip.png");
}
.icon.s48.type-application {
background-image: url("../../../images/icons/48/zip.png");
}
.icon.s48.type-audio {
background-image: url("../../../images/icons/48/audio.png");
}
@ -477,6 +492,19 @@ div.jGrowl div.info {
color: #ffffff;
padding-left: 58px;
}
/* notifications page */
.notif-item {
padding: 0.5em;
}
.notif-item:nth-child(even) {
background-color: #cccccc;
}
.notif-item:nth-child(odd) {
background-color: #ffffff;
}
.notif-item .notif-image {
width: 16px;
}
/* header */
header {
position: fixed;
@ -1272,7 +1300,7 @@ section {
width: 25px;
height: 25px;
}
/* reshare */
/* reshare e embed */
.wall-item-container .wall-item-content .type-link img,
.type-link img {
max-width: 160px;
@ -1280,10 +1308,21 @@ section {
float: left;
margin-right: 10px;
}
.wall-item-container .wall-item-content .type-link img.attachment-image,
.type-link img.attachment-image {
max-width: 650px;
max-height: inital;
float: none;
margin-right: 0px;
}
.type-link blockquote {
margin-left: 160px;
margin: 1em 0px;
max-height: 160px;
overflow: hidden;
padding-left: 1em;
}
.type-video blockquote {
padding-left: 1em;
}
.shared_header {
height: 32px;
@ -1306,6 +1345,13 @@ blockquote.shared_content {
color: #000;
border: none;
}
.oembed.video > a.embed_video {
display: block;
float: none;
}
.oembed.video > a.embed_video > div {
background: rgba(255, 255, 255, 0.36) url(../../../images/icons/48/play.png) no-repeat center center !important;
}
/* threaded comments */
.children {
margin-top: 1em;
@ -1397,7 +1443,30 @@ span[id^="showmore-wrap"] {
display: block;
}
#contacts-actions {
clear: both;
position: absolute;
left: 800px;
width: 200px;
background-color: #ffffff;
border: 2px solid #364e59;
display: none;
}
#contacts-actions .batch-action {
display: block;
width: 100%;
background-color: #ffffff;
border: 0px;
color: #2d2d2d;
text-align: left;
padding: 5px 10px;
font-size: 11px;
}
#contacts-actions .batch-action:hover {
background-color: #bdcdd4;
}
@media (max-width: 1000px) {
#contacts-actions {
left: 40px;
}
}
.contact-photo {
width: 48px;
@ -1916,6 +1985,11 @@ ul.tabs li .active {
background: url("../../../images/icons/16/user.png") no-repeat left center;
padding-left: 18px;
}
#photo-top-upload-link,
.photos-upload-link {
margin: 1em 0px;
display: block;
}
.photos-upload-link a,
#photo-top-upload-link {
background: url("../../../images/icons/16/add.png") no-repeat left center;
@ -1981,10 +2055,8 @@ ul.tabs li .active {
background: url("../../../images/icons/22/image.png") no-repeat top left;
padding-left: 23px;
min-height: 22px;
}
#photo-album-title a {
display: block;
padding-top: 5px;
padding-top: 6px;
/* a { display: block;}*/
}
#photo-caption {
display: block;

View file

@ -111,3 +111,6 @@
@MailDisplaySubjectColor: @Grey5;
@MailDisplaySubjectBackgroundColor: #f6f7f8;
@NotificationsPageListOddBackground: @Grey1;
@NotificationsPageListEvenBackground: @Green4;

View file

@ -64,6 +64,9 @@
.icon.type-unkn {
background-image: url("../../../images/icons/22/zip.png");
}
.icon.type-application {
background-image: url("../../../images/icons/22/zip.png");
}
.icon.type-audio {
background-image: url("../../../images/icons/22/audio.png");
}
@ -134,6 +137,9 @@
.icon.s10.type-unkn {
background-image: url("../../../images/icons/10/zip.png");
}
.icon.s10.type-application {
background-image: url("../../../images/icons/10/zip.png");
}
.icon.s10.type-audio {
background-image: url("../../../images/icons/10/audio.png");
}
@ -204,6 +210,9 @@
.icon.s16.type-unkn {
background-image: url("../../../images/icons/16/zip.png");
}
.icon.s16.type-application {
background-image: url("../../../images/icons/16/zip.png");
}
.icon.s16.type-audio {
background-image: url("../../../images/icons/16/audio.png");
}
@ -274,6 +283,9 @@
.icon.s22.type-unkn {
background-image: url("../../../images/icons/22/zip.png");
}
.icon.s22.type-application {
background-image: url("../../../images/icons/22/zip.png");
}
.icon.s22.type-audio {
background-image: url("../../../images/icons/22/audio.png");
}
@ -344,6 +356,9 @@
.icon.s48.type-unkn {
background-image: url("../../../images/icons/48/zip.png");
}
.icon.s48.type-application {
background-image: url("../../../images/icons/48/zip.png");
}
.icon.s48.type-audio {
background-image: url("../../../images/icons/48/audio.png");
}
@ -477,6 +492,19 @@ div.jGrowl div.info {
color: #ffffff;
padding-left: 58px;
}
/* notifications page */
.notif-item {
padding: 0.5em;
}
.notif-item:nth-child(even) {
background-color: #ddffdd;
}
.notif-item:nth-child(odd) {
background-color: #ffffff;
}
.notif-item .notif-image {
width: 16px;
}
/* header */
header {
position: fixed;
@ -1272,7 +1300,7 @@ section {
width: 25px;
height: 25px;
}
/* reshare */
/* reshare e embed */
.wall-item-container .wall-item-content .type-link img,
.type-link img {
max-width: 160px;
@ -1280,10 +1308,21 @@ section {
float: left;
margin-right: 10px;
}
.wall-item-container .wall-item-content .type-link img.attachment-image,
.type-link img.attachment-image {
max-width: 650px;
max-height: inital;
float: none;
margin-right: 0px;
}
.type-link blockquote {
margin-left: 160px;
margin: 1em 0px;
max-height: 160px;
overflow: hidden;
padding-left: 1em;
}
.type-video blockquote {
padding-left: 1em;
}
.shared_header {
height: 32px;
@ -1306,6 +1345,13 @@ blockquote.shared_content {
color: #000;
border: none;
}
.oembed.video > a.embed_video {
display: block;
float: none;
}
.oembed.video > a.embed_video > div {
background: rgba(255, 255, 255, 0.36) url(../../../images/icons/48/play.png) no-repeat center center !important;
}
/* threaded comments */
.children {
margin-top: 1em;
@ -1397,7 +1443,30 @@ span[id^="showmore-wrap"] {
display: block;
}
#contacts-actions {
clear: both;
position: absolute;
left: 800px;
width: 200px;
background-color: #ffffff;
border: 2px solid #364e59;
display: none;
}
#contacts-actions .batch-action {
display: block;
width: 100%;
background-color: #ffffff;
border: 0px;
color: #2d2d2d;
text-align: left;
padding: 5px 10px;
font-size: 11px;
}
#contacts-actions .batch-action:hover {
background-color: #ccff42;
}
@media (max-width: 1000px) {
#contacts-actions {
left: 40px;
}
}
.contact-photo {
width: 48px;
@ -1916,6 +1985,11 @@ ul.tabs li .active {
background: url("../../../images/icons/16/user.png") no-repeat left center;
padding-left: 18px;
}
#photo-top-upload-link,
.photos-upload-link {
margin: 1em 0px;
display: block;
}
.photos-upload-link a,
#photo-top-upload-link {
background: url("../../../images/icons/16/add.png") no-repeat left center;
@ -1981,10 +2055,8 @@ ul.tabs li .active {
background: url("../../../images/icons/22/image.png") no-repeat top left;
padding-left: 23px;
min-height: 22px;
}
#photo-album-title a {
display: block;
padding-top: 5px;
padding-top: 6px;
/* a { display: block;}*/
}
#photo-caption {
display: block;

View file

@ -20,6 +20,7 @@
&.unlock { background-image: url("../../../images/icons/@{size}/unlock.png"); }
&.plugin { background-image: url("../../../images/icons/@{size}/plugin.png"); }
&.type-unkn { background-image: url("../../../images/icons/@{size}/zip.png"); }
&.type-application { background-image: url("../../../images/icons/@{size}/zip.png"); }
&.type-audio{ background-image: url("../../../images/icons/@{size}/audio.png"); }
&.type-video{ background-image: url("../../../images/icons/@{size}/video.png"); }
&.type-image{ background-image: url("../../../images/icons/@{size}/image.png"); }

View file

@ -116,3 +116,6 @@
@MailDisplaySubjectColor: @Grey5;
@MailDisplaySubjectBackgroundColor: #f6f7f8;
@NotificationsPageListOddBackground: @Grey1;
@NotificationsPageListEvenBackground: @Grey2;

View file

@ -64,6 +64,9 @@
.icon.type-unkn {
background-image: url("../../../images/icons/22/zip.png");
}
.icon.type-application {
background-image: url("../../../images/icons/22/zip.png");
}
.icon.type-audio {
background-image: url("../../../images/icons/22/audio.png");
}
@ -134,6 +137,9 @@
.icon.s10.type-unkn {
background-image: url("../../../images/icons/10/zip.png");
}
.icon.s10.type-application {
background-image: url("../../../images/icons/10/zip.png");
}
.icon.s10.type-audio {
background-image: url("../../../images/icons/10/audio.png");
}
@ -204,6 +210,9 @@
.icon.s16.type-unkn {
background-image: url("../../../images/icons/16/zip.png");
}
.icon.s16.type-application {
background-image: url("../../../images/icons/16/zip.png");
}
.icon.s16.type-audio {
background-image: url("../../../images/icons/16/audio.png");
}
@ -274,6 +283,9 @@
.icon.s22.type-unkn {
background-image: url("../../../images/icons/22/zip.png");
}
.icon.s22.type-application {
background-image: url("../../../images/icons/22/zip.png");
}
.icon.s22.type-audio {
background-image: url("../../../images/icons/22/audio.png");
}
@ -344,6 +356,9 @@
.icon.s48.type-unkn {
background-image: url("../../../images/icons/48/zip.png");
}
.icon.s48.type-application {
background-image: url("../../../images/icons/48/zip.png");
}
.icon.s48.type-audio {
background-image: url("../../../images/icons/48/audio.png");
}
@ -477,6 +492,19 @@ div.jGrowl div.info {
color: #ffffff;
padding-left: 58px;
}
/* notifications page */
.notif-item {
padding: 0.5em;
}
.notif-item:nth-child(even) {
background-color: #cccccc;
}
.notif-item:nth-child(odd) {
background-color: #ffffff;
}
.notif-item .notif-image {
width: 16px;
}
/* header */
header {
position: fixed;
@ -1272,7 +1300,7 @@ section {
width: 25px;
height: 25px;
}
/* reshare */
/* reshare e embed */
.wall-item-container .wall-item-content .type-link img,
.type-link img {
max-width: 160px;
@ -1280,10 +1308,21 @@ section {
float: left;
margin-right: 10px;
}
.wall-item-container .wall-item-content .type-link img.attachment-image,
.type-link img.attachment-image {
max-width: 650px;
max-height: inital;
float: none;
margin-right: 0px;
}
.type-link blockquote {
margin-left: 160px;
margin: 1em 0px;
max-height: 160px;
overflow: hidden;
padding-left: 1em;
}
.type-video blockquote {
padding-left: 1em;
}
.shared_header {
height: 32px;
@ -1306,6 +1345,13 @@ blockquote.shared_content {
color: #000;
border: none;
}
.oembed.video > a.embed_video {
display: block;
float: none;
}
.oembed.video > a.embed_video > div {
background: rgba(255, 255, 255, 0.36) url(../../../images/icons/48/play.png) no-repeat center center !important;
}
/* threaded comments */
.children {
margin-top: 1em;
@ -1397,7 +1443,30 @@ span[id^="showmore-wrap"] {
display: block;
}
#contacts-actions {
clear: both;
position: absolute;
left: 800px;
width: 200px;
background-color: #ffffff;
border: 2px solid #364e59;
display: none;
}
#contacts-actions .batch-action {
display: block;
width: 100%;
background-color: #ffffff;
border: 0px;
color: #2d2d2d;
text-align: left;
padding: 5px 10px;
font-size: 11px;
}
#contacts-actions .batch-action:hover {
background-color: #c0a3c7;
}
@media (max-width: 1000px) {
#contacts-actions {
left: 40px;
}
}
.contact-photo {
width: 48px;
@ -1916,6 +1985,11 @@ ul.tabs li .active {
background: url("../../../images/icons/16/user.png") no-repeat left center;
padding-left: 18px;
}
#photo-top-upload-link,
.photos-upload-link {
margin: 1em 0px;
display: block;
}
.photos-upload-link a,
#photo-top-upload-link {
background: url("../../../images/icons/16/add.png") no-repeat left center;
@ -1981,10 +2055,8 @@ ul.tabs li .active {
background: url("../../../images/icons/22/image.png") no-repeat top left;
padding-left: 23px;
min-height: 22px;
}
#photo-album-title a {
display: block;
padding-top: 5px;
padding-top: 6px;
/* a { display: block;}*/
}
#photo-caption {
display: block;

View file

@ -115,6 +115,13 @@ div.jGrowl div.info {
padding-left: 58px;
}
/* notifications page */
.notif-item {
padding: 0.5em;
&:nth-child(even) { background-color: @NotificationsPageListEvenBackground; }
&:nth-child(odd) { background-color: @NotificationsPageListOddBackground; }
.notif-image { width: 16px; }
}
/* header */
@ -674,23 +681,34 @@ section {
}
.wwto .contact-photo { width: 25px; height: 25px; }
/* reshare */
/* reshare e embed */
.wall-item-container .wall-item-content .type-link img,
.type-link img {
max-width: 160px;
max-height: 160px;
float: left;
margin-right: 10px;
&.attachment-image {
max-width: 650px;
max-height: inital;
float: none;
margin-right: 0px;
}
}
.type-link {
blockquote {
margin-left: 160px;
margin: 1em 0px;
max-height: 160px;
overflow: hidden;
padding-left: 1em;
}
.oembed {}
}
.type-video blockquote { padding-left: 1em; }
.shared_header {
height: 32px;
color: #999;
@ -716,6 +734,20 @@ blockquote.shared_content {
}
.oembed.video {
> a.embed_video {
display: block;
float: none;
> div {
background:
rgba(255, 255, 255, 0.36)
url(../../../images/icons/48/play.png)
no-repeat center center
!important;
}
}
}
/* threaded comments */
.children {
@ -788,7 +820,31 @@ span[id^="showmore-wrap"] {
.contact-select { position: absolute; top:64px; left:64px; display:none; }
.contact-select:checked,
.contact-photo:hover .contact-select { display:block; }
#contacts-actions { clear: both; }
#contacts-actions {
position: absolute;
left: 800px;
width: 200px;
background-color: @MenuBg;
border: 2px solid @MenuBorder;
.batch-action {
display: block;
width: 100%;
background-color: @MenuBg;
border: 0px;
color: @MenuItem;
text-align: left;
padding: 5px 10px;
font-size: 11px;
}
.batch-action:hover {
background-color: @MenuItemHoverBg;
}
display: none;
}
@media (max-width: 1000px) {
#contacts-actions { left: 40px; }
}
.contact-photo {
width: 48px; height: 48px;
img { width: 48px; height: 48px; }
@ -1286,6 +1342,8 @@ ul.tabs {
padding-left: 18px;
}
#photo-top-upload-link,
.photos-upload-link { margin: 1em 0px; display: block; }
.photos-upload-link a,
#photo-top-upload-link {
background: url("../../../images/icons/16/add.png") no-repeat left center;
@ -1334,7 +1392,8 @@ ul.tabs {
background: url("../../../images/icons/22/image.png") no-repeat top left;
padding-left: 23px;
min-height: 22px;
a { display: block; padding-top: 5px; }
padding-top: 6px;
/* a { display: block;}*/
}
#photo-caption {

View file

@ -0,0 +1,138 @@
<script>
function confirm_delete(uname){
return confirm( "{{$confirm_delete}}".format(uname));
}
function confirm_delete_multi(){
return confirm("{{$confirm_delete_multi}}");
}
function selectall(cls){
$("."+cls).attr('checked','checked');
return false;
}
</script>
<div id='adminpage'>
<h1>{{$title}} - {{$page}}</h1>
<form action="{{$baseurl}}/admin/users" method="post">
<input type='hidden' name='form_security_token' value='{{$form_security_token}}'>
<h3>{{$h_pending}}</h3>
{{if $pending}}
<table id='pending'>
<thead>
<tr>
{{foreach $th_pending as $th}}<th>{{$th}}</th>{{/foreach}}
<th></th>
<th></th>
</tr>
</thead>
<tbody>
{{foreach $pending as $u}}
<tr>
<td class="created">{{$u.created}}</td>
<td class="name">{{$u.name}}</td>
<td class="email">{{$u.email}}</td>
<td class="checkbox"><input type="checkbox" class="pending_ckbx" id="id_pending_{{$u.hash}}" name="pending[]" value="{{$u.hash}}" /></td>
<td class="tools">
<a href="{{$baseurl}}/regmod/allow/{{$u.hash}}" title='{{$approve}}'><span class='icon like'></span></a>
<a href="{{$baseurl}}/regmod/deny/{{$u.hash}}" title='{{$deny}}'><span class='icon dislike'></span></a>
</td>
</tr>
{{/foreach}}
</tbody>
</table>
<div class='selectall'><a href='#' onclick="return selectall('pending_ckbx');">{{$select_all}}</a></div>
<div class="submit"><input type="submit" name="page_users_deny" value="{{$deny}}"/> <input type="submit" name="page_users_approve" value="{{$approve}}" /></div>
{{else}}
<p>{{$no_pending}}</p>
{{/if}}
<h3>{{$h_users}}</h3>
{{if $users}}
<table id='users'>
<thead>
<tr>
<th></th>
{{foreach $th_users as $th}}<th>{{$th}}</th>{{/foreach}}
<th></th>
<th></th>
</tr>
</thead>
<tbody>
{{foreach $users as $u}}
<tr>
<td><img class='icon' src="{{$u.micro}}" alt="{{$u.nickname}}" title="{{$u.nickname}}"></td>
<td class='name'><a href="{{$u.url}}" title="{{$u.nickname}}" >{{$u.name}}</a></td>
<td class='email'>{{$u.email}}</td>
<td class='register_date'>{{$u.register_date}}</td>
<td class='login_date'>{{$u.login_date}}</td>
<td class='lastitem_date'>{{$u.lastitem_date}}</td>
<td class='login_date'>{{$u.page_flags}} {{if $u.is_admin}}({{$siteadmin}}){{/if}} {{if $u.account_expired}}({{$accountexpired}}){{/if}}</td>
<td class="checkbox">
{{if $u.is_admin}}
&nbsp;
{{else}}
<input type="checkbox" class="users_ckbx" id="id_user_{{$u.uid}}" name="user[]" value="{{$u.uid}}"/></td>
{{/if}}
<td class="tools">
{{if $u.is_admin}}
&nbsp;
{{else}}
<a href="{{$baseurl}}/admin/users/block/{{$u.uid}}?t={{$form_security_token}}" title='{{if $u.blocked}}{{$unblock}}{{else}}{{$block}}{{/if}}'><span class='icon {{if $u.blocked==0}}unlock{{else}}lock{{/if}}'></span></a>
<a href="{{$baseurl}}/admin/users/delete/{{$u.uid}}?t={{$form_security_token}}" title='{{$delete}}' onclick="return confirm_delete('{{$u.name}}')"><span class='icon delete'></span></a>
{{/if}}
</td>
</tr>
{{/foreach}}
</tbody>
</table>
<div class='selectall'><a href='#' onclick="return selectall('users_ckbx');">{{$select_all}}</a></div>
<div class="submit"><input type="submit" name="page_users_block" value="{{$block}}/{{$unblock}}" /> <input type="submit" name="page_users_delete" value="{{$delete}}" onclick="return confirm_delete_multi()" /></div>
{{else}}
NO USERS?!?
{{/if}}
</form>
{{if $deleted}}
<h3>{{$h_deleted}}</h3>
<table id='deleted'>
<thead>
<tr>
<th></th>
{{foreach $th_deleted as $th}}<th>{{$th}}</th>{{/foreach}}
</tr>
</thead>
<tbody>
{{foreach $deleted as $u}}
<tr>
<td><img class='icon' src="{{$u.micro}}" alt="{{$u.nickname}}" title="{{$u.nickname}}"></td>
<td class='name'><a href="{{$u.url}}" title="{{$u.nickname}}" >{{$u.name}}</a></td>
<td class='email'>{{$u.email}}</td>
<td class='register_date'>{{$u.register_date}}</td>
<td class='login_date'>{{$u.login_date}}</td>
<td class='lastitem_date'>{{$u.lastitem_date}}</td>
<td class='login_date'>{{$u.deleted}}</td>
</tr>
{{/foreach}}
</tbody>
</table>
{{/if}}
<h3>{{$h_newuser}}</h3>
<form action="{{$baseurl}}/admin/users" method="post">
<input type='hidden' name='form_security_token' value='{{$form_security_token}}'>
<table id='users'>
<tbody>
<tr>
<td>{{include file="field_input.tpl" field=$newusername}}</td>
</tr>
<tr>
<td>{{include file="field_input.tpl" field=$newusernickname}}</td>
</tr>
<tr>
<td>{{include file="field_input.tpl" field=$newuseremail}}</td>
</tr>
</tbody>
</table>
<div class="submit"><input type="submit" name="add_new_user_submit" value="{{$submit}}" /></div>
</form>
</div>

View file

@ -42,6 +42,24 @@ $(document).ready(function(){
}
});
/*
* show and hide contact action buttons in
* contacts page on contacts' checkbox selection
*/
$('.contact-select').bind('click', function(e) {
var y = e.clientY;
var elm = $("#contacts-actions");
y=y-40;
if (y<0) y=0;
if (y+elm.height() > $("html").height()) y=$("html").height()-elm.height();
elm.css('top', y+"px");
if ($(".contact-select:checked").length > 0) {
elm.show();
} else {
elm.hide();
}
});
});
function insertFormatting(comment,BBcode,id) {
@ -90,6 +108,7 @@ function cmtBbOpen(id) {
function cmtBbClose(id) {
$("#comment-edit-bb-" + id).hide();
}
$(document).ready(function() {
$('html').click(function() { $("#nav-notifications-menu" ).hide(); });