aadil/fedi-tumblr
0
0
Fork 0
Code Issues 6 Pull Requests Projects Releases Wiki Activity

200520 New reply layout and Longhorn theme

Browse Source
This commit is contained in:
Daisuke 2020-05-20 14:53:33 -05:00
parent cb98b84c94
commit 2b1cee3f9d
27 changed files with 900 additions and 78 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
action.php
View File

@ -276,6 +276,24 @@ foreach($_GET as $key => $value){
case "userinfo":
$info = api_get("accounts/".htmlentities($value));
$rel = api_get("accounts/relationships?id=".htmlentities($value));
$photos = api_get("accounts/".htmlentities($value)."/statuses?only_media=true&limit=5&exclude_reblogs=true");
$photo = array();
$c = 0;
if (!empty($photos)){
foreach ($photos as $elem){
if ($elem['media_attachments'][0]['type'] == "image"){
$photo[$c]['url'] = $elem['media_attachments'][0]['url'];
if ($elem['sensitive'] == true){
$photo[$c]['s'] = true;
}
$c++;
}
if ($c == 3){
break;
}
}
}
echo "<div class='userinfo_he' style='background-color:#".averageColor($info['avatar'])."; background-size:cover;" . (!empty($info['header']) ? "background-image:url(".$info['header'].");" : "") . "'>
<span style='margin:5px; display:inline-block;'>
@ -291,6 +309,11 @@ foreach($_GET as $key => $value){
<span id='".$info['id']."' class='profileButton ".(in_array($info['id'],$user_settings['nsfw']) ? "unnsfw" : "nsfw" )."'>".(in_array($info['id'],$user_settings['nsfw']) ? "NSFW <span class='fontello'>&#xf205;</span>" : "NSFW <span class='fontello'>&#xf204;</span>" )."</span>
".($logedin ? "<span id='" . $info['id'] . "' class='profileButton " . ($rel[0]['muting'] ? "un" : "") . "mute'>" . ($rel[0]['muting'] ? "&#xe81a; Unmute" : "&#xe81b; Mute") . "</span>" : "")."
</span>
<div style='display:flex; width:280px'>";
foreach ($photo as $elem){
echo "<div style='overflow:hidden; display:block; height:90px; flex:1; background-image:url(\"".$elem['url']."\"); ".(isset($elem['s']) ? "filter: blur(5px);" : "")." background-size:cover; margin:2px;'></div>";
}
echo "</div>
</div>
";
die();
@ -367,3 +390,4 @@ if(isset($_POST['status'])){
die();
}

9
css/color.css
View File

@ -260,7 +260,14 @@ input[type="submit"] {
}
.post_footer {
background-color: #eee;
background-color: transparent;
}
.felem a:hover > span {
background-color:white;
box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
color: black !important;
border-radius:4px;
}
.public::after {

49
css/mobile.css
View File

@ -55,6 +55,7 @@ input[type="file"], .nloadmore {
textarea {
resize: none;
font-size:12px !important;
}
/* omnipresent */
@ -110,6 +111,16 @@ textarea {
margin:0px !important;
text-align: left;
word-break: break-all;
font-size:12px !important;
}
.content * {
font-size:12px !important;
}
.content .emoji {
height:19px !important;
}
aside {
@ -288,7 +299,7 @@ aside {
}
.element {
width: 90% !important;
width: 100% !important;
clear: both;
display: inline-block;
margin-top: 3px;
@ -369,10 +380,18 @@ aside {
}
.felem {
margin-left: 7px;
margin-left: 16px;
float: left;
}
.felem a {
font-size:20px !important;
}
.felem a > span {
font-size:small;
}
.contact{
background-color:white;
cursor: pointer;
@ -403,7 +422,7 @@ aside {
float: left;
text-align: center;
position: relative;
border-radius: 3px;
border-radius: 0px;
}
.postform,.searchmobile {
@ -427,16 +446,8 @@ aside {
text-align: left;
}
.postHeader div {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.postHeader *,.post_footer *{
font-size:small;
font-size:12px;
}
.previewpost {
@ -534,6 +545,10 @@ aside {
margin: 15px;
}
.postAge,.public:after,.unlisted:after,.private:after,.direct:after {
font-size:11px;
}
.post_footer {
width: 630px;
display: table-cell;
@ -544,8 +559,9 @@ aside {
border-radius: 3px;
}
.post_buttons {
font-family: fontello;
font-family: fontello, sans-serif;
float: right;
display: inline-block;
text-align: right;
@ -557,7 +573,7 @@ aside {
font-family: inherit;
text-decoration: none;
color: inherit;
font-size: inherit;
font-family: fontello, sans-serif;
}
.reply {
@ -565,6 +581,11 @@ aside {
clear: both;
text-align: left;
display: block;
border-bottom:1px dotted #aaa;
}
.replyflex {
flex: 6 !important;
}
.note {

45
css/style.css
View File

@ -345,6 +345,10 @@ aside {
padding:0px;
}
.reply .postMenu {
margin-right:15px !important;
}
.profileMenu:hover > div, .listmenu:hover > div{
display:block !important;
}
@ -363,6 +367,30 @@ aside {
float: left;
}
.felem a {
font-size:20px !important;
position:relative;
}
.notif .felem a {
font-size:13px !important;
}
.felem a > span {
display:none;
}
.felem a:hover > span {
display:block;
position:absolute;
width:30px;
height:27px;
top:-35px;
left:-5px;
text-align:center;
padding-top:3px;
}
.contact{
background-color:white;
cursor: pointer;
@ -526,8 +554,20 @@ aside {
border-radius: 3px;
}
.postAge,.public:after,.unlisted:after,.private:after,.direct:after {
font-size:12px;
}
.reply:hover .post_buttons,.reply:hover .postMenu {
display:block !important;
}
.replyflex {
flex:9;
}
.post_buttons {
font-family: fontello;
font-family: fontello, sans-serif;
float: right;
display: inline-block;
text-align: right;
@ -536,7 +576,7 @@ aside {
.post_buttons a,
.post_buttons span {
font-family: inherit;
font-family: fontello, sans-serif;
text-decoration: none;
color: inherit;
font-size: inherit;
@ -547,6 +587,7 @@ aside {
clear: both;
text-align: left;
display: block;
border-bottom:1px dotted #aaa;
}
.note {

54
include/functions.php
View File

@ -43,7 +43,7 @@ function get_urls($input) {
shortcodes and the emoji url is defined in the same place */
function emojify($string, $emojis, $size = 40) {
foreach ($emojis as $emoji) {
$string = str_replace(":" . $emoji['shortcode'] . ":", "<img alt='" . $emoji['shortcode'] . "' title='" . $emoji['shortcode'] . "' src='" . $emoji['static_url'] . "' height=$size style='vertical-align: middle;'>", $string);
$string = str_replace(":" . $emoji['shortcode'] . ":", "<img class='emoji' alt='" . $emoji['shortcode'] . "' title='" . $emoji['shortcode'] . "' src='" . $emoji['static_url'] . "' height=$size style='vertical-align: middle;'>", $string);
}
return $string;
}
@ -321,8 +321,9 @@ function render_reply($item) {
$reply['id'] = $item['id'];
$reply['uid'] = $item['account']['id'];
$reply['name'] = emojify($item['account']['display_name'], $item['account']['emojis'], 15);
$reply['name'] = emojify($item['account']['display_name'], $item['account']['emojis'], 20);
$reply['acct'] = $item['account']['acct'];
$reply['handle'] = "@".explode("@",$item['account']['acct'])[0];
$reply['avatar'] = $item['account']['avatar'];
$reply['menu'] = "<ul>";
@ -357,24 +358,25 @@ function render_reply($item) {
$reply['replyto'] = ($item['in_reply_to_id'] ? " <a class='fontello link preview ldr' target='_blank' id='" . $item['in_reply_to_id'] . "' href='?thread=" . $item['in_reply_to_id'] . "'>&#xf112;</a> " : "");
$reply['text'] = processText($item);
$reply['date'] = "<a class='ldr postAge' id='".strtotime($item['created_at'])."' style='text-decoration:none;' target='_blank' href='?thread=" . $item['id'] . "'>" . time_elapsed_string($item['created_at']) . "</a> - <span class='fontello ".$item['visibility']."'> </span>";
$reply['date'] = "<a class='ldr postAge' id='".strtotime($item['created_at'])."' style='text-decoration:none;' target='_blank' href='?thread=" . $item['id'] . "'>" . time_elapsed_string($item['created_at']) . "</a>";
$reply['visibility'] = $item['visibility'];
$reply['media'] = "";
if (!empty($item['media_attachments'])) {
$reply['media'] = "<div style='width:170px; display:inline-block; float:left; margin-right:15px; '>";
$reply['media'] = "<div style='width:170px; display:inline-block; float:left; margin:15px 0px 10px 0px;'>";
$images = count($item['media_attachments']);
$class = ($images > 1 ? "class='icon'" : "");
foreach ($item['media_attachments'] as $file) {
$ext = explode(".", $file['url']);
$ext = end($ext);
$ext = explode("?", $ext) [0];
if ($ext == 'mp4' || $ext == 'webm') {
if (in_array($ext,array('webm','mp4','ogv'))) {
$reply['media'] .= "<div style='text-align:center; width:100%;'><video preload='metadata' width='100%' controls ".($user_settings['videoloop'] == "on" ? "loop" : "").">
<source src='" . $file['url'] . "' type='video/$ext'>
<source src='" . $file['url'] . "' type='video/".($ext == "ogv" ? "ogg" : $ext)."'>
</video></div>
";
}
elseif ($ext == 'mp3' || $ext == 'ogg') {
elseif (in_array($ext,array('mp3','ogg','oga','opus'))) {
$reply['media'] .= "<div style='text-align:center; width:100%;'><audio controls>
<source src='" . $file['url'] . "' type='audio/$ext'>
Your browser does not support the audio tag.
@ -814,28 +816,36 @@ function timeline($query) {
global $srv;
$notes = "";
$media = ($query['text'] == "on" ? "" : "&only_media=true");
$next = ($query['next'] ? "&max_id=" . $query['next'] : ($query['since'] ? "&since_id=" . $query['since'] : ""));
$hq = array();
$hq['limit'] = 30;
$hq['only_media'] = ($query['text'] == "off" ? 'true' : 'false');
if ($query['next']){
$hq['max_id'] = $query['next'];
$next = $query['next'];
} elseif ($query['since']) {
$hq['since_id'] = $query['since'];
}
switch ($query['mode']) {
case "home":
$array = api_get("timelines/home?limit=30{$media}{$next}");
$array = api_get("timelines/home?".http_build_query($hq));
break;
case "federated":
$array = api_get("timelines/public?limit=30{$media}{$next}");
$array = api_get("timelines/public?".http_build_query($hq));
break;
case "tag":
$array = api_get("timelines/tag/" . $query['tag'] . "?limit=30{$media}{$next}");
$array = api_get("timelines/tag/" . $query['tag'] . "?".http_build_query($hq));
break;
case "local":
$array = api_get("timelines/public?limit=30&local=true{$media}{$next}");
$array = api_get("timelines/public?local=true&".http_build_query($hq));
break;
case "user":
$array = api_get("accounts/" . $query['user'] . "/statuses?limit=30{$media}{$next}");
$array = api_get("accounts/" . $query['user'] . "/statuses?".http_build_query($hq));
break;
case "thread":
@ -845,19 +855,19 @@ function timeline($query) {
break;
case "favourites":
$array = api_get("favourites?limit=30{$media}{$next}");
$array = api_get("favourites?".http_build_query($hq));
break;
case "direct":
$array = api_get("timelines/direct?limit=30{$next}");
$array = api_get("timelines/direct?".http_build_query($hq));
break;
case "list":
$array = api_get("timelines/list/" . $query['list'] . "?limit=30{$next}");
$array = api_get("timelines/list/" . $query['list'] . "?".http_build_query($hq));
break;
case "bookmarks":
$array = api_get("bookmarks?limit=30{$next}");
$array = api_get("bookmarks?".http_build_query($hq));
break;
case "search":
@ -866,11 +876,11 @@ function timeline($query) {
case "account":
$info = api_get("accounts/verify_credentials");
$array = api_get("accounts/" . $info['id'] . "/statuses?limit=30{$media}{$next}");
$array = api_get("accounts/" . $info['id'] . "/statuses?".http_build_query($hq));
break;
default:
$array = api_get("timelines/public?limit=30{$media}{$next}");
$array = api_get("timelines/public?".http_build_query($hq));
break;
}
@ -1059,4 +1069,4 @@ function getHeaders($respHeaders) {
}
return $headerText;
}
}

66
js/scripts.js
View File

@ -121,6 +121,70 @@ $('body').on('click', '.replies', function(e) {
});
});
$.fn.isOnScreen = function(){
var win = $(window);
var viewport = {
top : win.scrollTop(),
left : win.scrollLeft()
};
viewport.right = viewport.left + win.width();
viewport.bottom = viewport.top + win.height();
var bounds = this.offset();
bounds.right = bounds.left + this.outerWidth();
bounds.bottom = bounds.top + this.outerHeight();
return (!(viewport.right < bounds.left || viewport.left > bounds.right || viewport.bottom < bounds.top || viewport.top > bounds.bottom));
};
/*
$('body').on('click', '.postbody:not(a)', function(e) {
e.preventDefault;
$(".reply").remove();
$(".element").removeClass("element_pad");
$(this).closest(".element").addClass("element_pad");
//$('.replies_container').html('');
var id = $(this).closest(".post").attr('id');
if($('#' + id+'.replies_container').find('.reply').length < 1){
$('#' + id+'.replies_container').html("<p><img src='img/loading.gif'></p>");
}
$.get("action.php?a=true&replies=" + id, function(data) {
$('#' + id+'.replies_container').html(data);
$('#' + id+'.replies_container').delay(800).fadeIn(400);
$('#a' + id).html('');
$('#' + id+".replies_container .ancestor").appendTo('#a' + id);
});
});
*/
/*
$('body').on('click', '.postbody:not(a)', function(e) {
e.preventDefault;
$(".reply").remove();
$(".element").removeClass("element_pad");
$(this).closest(".element").addClass("element_pad");
var id = $(this).closest(".post").attr('id');
var offset = $('#'+id+' .postHeader').offset().top + 200;
if($('#' + id+'.replies_container').find('.reply').length < 1){
$('#' + id+'.replies_container').html("<p><img src='img/loading.gif'></p>");
}
$.get("action.php?a=true&replies=" + id, function(data) {
$('#' + id+'.replies_container').html(data);
$('#' + id+'.replies_container').delay(800).fadeIn(400);
$('#a' + id).html('');
$.when($('#' + id+".replies_container .ancestor").appendTo('#a' + id)).then(function() {
if ($('#'+id+'.post_buttons').isOnScreen() == false) {
$('html, body').animate({
scrollTop: offset
}, 1000);
}
});
});
});
*/
$('body').on('click', '.ldr:not(.tlicon)', function(e) {
$('.tlicon').each(function(a){
$( this ).removeClass('tiselected')
@ -497,4 +561,4 @@ function timeSince(date) {
return " just now";
}
return Math.floor(seconds) + " seconds";
}
}

10
layout/footer.php
View File

@ -46,17 +46,23 @@ $query = http_build_query(array_filter(array(
$('body').on('click', '.replyform', function(e) {
e.preventDefault;
$("#replyform").remove();
$(".element").removeClass("element_pad");
$(this).closest(".element").addClass("element_pad");
var id = $(this).parents().eq(1).attr('id');
var type = $(this).parents().eq(3).attr('class').trim().replace(" ",".");
var type = $(this).parents().eq(3).attr('mode').trim().replace(" ",".");
console.log(type);
$('#replyform').remove();
var data = JSON.parse(document.getElementById('data-' + id).innerHTML);
$.get("action.php?a=true&themefile=templates/replyform.txt", function(result) {
result = result.replace(":content:", data.mentions)
result = result.replace(":id:", data.id)
$('.'+type).find('#' + id+'.replies_container').prepend(result);
if(type == 'post'){
$('.'+type).find('#' + id+'.replies_container').prepend(result);
} else {
$('#' + id+'.'+type).after(result);
}
$('#replyform #' + data.scope).prop('selected', true);
$('#' + id).fadeIn(400);
});

14
modules/timeline.php
View File

@ -89,7 +89,6 @@ $thread = timeline(array_merge($tl, $user_settings));
$profile['bottom'] = "";
}
/* some values are processed from the profile and stored in the $profile array*/
$profile['avatar'] = $info['avatar'];
$profile['name'] = emojify($info['display_name'], $info['emojis'], 40);
@ -139,13 +138,20 @@ if ((!isset($thread[0]['id']) && !empty($thread)) || !is_array($thread)) {
continue;
}
$post['name'] = "<span style='position:relative;'><b><span id='" . $elem['reblog']['account']['id'] . "' class='user'><a class='link ldr desktop' href='?user=" . $elem['reblog']['account']['id'] . "'>" . emojify($elem['reblog']['account']['display_name'], $elem['reblog']['account']['emojis'], 20) . "</a><a class='link ldr mobile' style='font-size:12px;' href='?user=" . $elem['reblog']['account']['id'] . "'>@" . explode("@",$elem['reblog']['account']['acct'])[0] . "</a></span></span></b><span class='desktop' style='font-size:12px; opacity:0.8;'> (" . $elem['reblog']['account']['acct'] . ")</span>";
$post['name'] = emojify($elem['reblog']['account']['display_name'], $elem['reblog']['account']['emojis'], 20);
$post['uid'] = $elem['reblog']['account']['id'];
$post['acct'] = '';//$elem['reblog']['account']['acct'];
$post['handle'] = explode("@",$elem['reblog']['account']['acct'])[0];
$post['replyto'] = "<span>" . ($elem['reblog']['in_reply_to_id'] ? " <a class='fontello link preview ldr' target='_blank' id='" . $elem['reblog']['in_reply_to_id'] . "' href='?thread=" . $elem['reblog']['in_reply_to_id'] . "'>&#xf112;</a>" : "") . "</span>";
$post['rt'] = "<span>[ <span style='font-family:fontello'> &#xe826; </span> <img src='" . $elem['account']['avatar'] . "' width=20 style='vertical-align:middle; border-radius:5px;'> <a class='link ldr user' style='font-size:12px;' id='" . $elem['account']['id'] . "' href='?user=" . $elem['account']['id'] . "'><span class='desktop'>" . emojify($elem['account']['display_name'], $elem['account']['emojis'], 15) . "</span><span class='mobile'>@" . explode("@", $elem['account']['acct']) [0] . "</span></a> ]</span>";
$post['rt'] = "<div style='display:inline-block; font-family:fontello, sans-serif; vertical-align:top;'>[ &#xe826; <img src='" . $elem['account']['avatar'] . "' width=20 style='border-radius:5px; vertical-align:middle;'> <span class='user' id='" . $elem['account']['id'] . "'><a class='link ldr' style='font-size:12px;' id='" . $elem['account']['id'] . "' href='?user=" . $elem['account']['id'] . "'><span>@" . explode("@", $elem['account']['acct']) [0] . "</a></span> ]</div>";
$elem = $elem['reblog'];
}
else {
$post['name'] = "<span style='position:relative;'><b><span id='" . $elem['account']['id'] . "' class='user'><a class='link ldr desktop' href='?user=" . $elem['account']['id'] . "'>" . emojify($elem['account']['display_name'], $elem['account']['emojis'], 20) . "</a><a class='link ldr mobile' style='font-size:12px;' href='?user=" . $elem['account']['id'] . "'>@" . explode("@",$elem['account']['acct'])[0] . "</a></span></span></b><span class='desktop' style='font-size:12px; opacity:0.8;'> (" . $elem['account']['acct'] . ")</span>";
$post['name'] = emojify($elem['account']['display_name'], $elem['account']['emojis'], 20);
$post['uid'] = $elem['account']['id'];
$post['acct'] = "(@".$elem['account']['acct'].")";
$post['handle'] = explode("@",$elem['account']['acct'])[0];
$post['replyto'] = "<span>" . ($elem['in_reply_to_id'] ? " <a class='fontello link preview ldr' target='_blank' id='" . $elem['in_reply_to_id'] . "' href='?thread=" . $elem['in_reply_to_id'] . "'>&#xf112;</a>" : "") . "</span>";
}

20
templates/post.txt
View File

@ -1,18 +1,30 @@
<div class='element'>
<div class='avatar desktop' style='background-image:url(:avatar:) :style:'></div>
<div class='post' id=':id:' pid=':pid:'>
<div class='post' id=':id:' pid=':pid:' mode="post">
<div id='a:id:' class='ancestors'>:ancestors:</div>
<div class='postHeader'>
<div style='width:82%; margin:5px; margin-left:10px; display:block; float:left; line-height:30px;'><img src=':avatar:' width=25 class='mobile' style='vertical-align:middle; border-radius:10px'> :name: :rt: </div>
<div style='width:80%; margin:5px; margin-left:10px; display:block; float:left; line-height:30px;'>
<img src=':avatar:' width=25 class='mobile' style='border-radius:10px; display:inline-block;'>
<div style='max-width:50%; display:inline-block;' class='user' id=':uid:'>
<div style='white-space: nowrap; overflow: hidden; text-overflow: ellipsis;'>
<a class='link ldr' href='?user=:uid:' style='font-weight:bold;'>
<span class='desktop'>:name:</span>
<span class='mobile'>:handle:</span>
</a>
</div>
</div>
<span class='desktop' style='vertical-align:top; font-size:12px;'>:acct:</span>
:rt:
</div>
<span style="margin-top:12px; margin-right:10px; float:right; display:block;">
<span class='postMenu fontello'>&#xf0c9;<div style='display:none; z-index:99; width:130px; position: absolute; top: 15px; right: -1px;' class='menu'>:menu:</div></span>
</span>
</div>
:spoiler:
<div class='media' style='text-align:center;'>:media:</div>
<div class='postbody'><div class='content' style='margin-bottom:5px;'>
<div class='postbody'><span class='content' style='margin-bottom:5px;'>
:replyto: :text:
</div></div>
</span></div>
<div class='post_footer'>:footer:</DIV>
<div class='post_notes'>:notes:</DIV>
<div id=':id:' class='replies_container'><noscript>:form:</noscript>:descendants:</div>

34
templates/reply.txt
View File

@ -1,25 +1,19 @@
<div class='reply :mode:' id=':id:'>
<div class='postHeader'>
<div style='margin:4px; display:block; float:left;'>
<img src=':avatar:' width=30 style='vertical-align:middle; border-radius:30px;'>
<a class='ldr link user' href='?user=:uid:' id=':uid:'>
<b>:name:</b>
</a>
<span class='desktop'>(:acct:)</span>
<div class='reply :mode:' id=':id:' style='display:inline-block; position:relative;'>
<div style='display:flex;' mode="reply">
<div style='flex:1; text-align:center; padding-bottom:8px; padding-top:8px;'>
<img src=':avatar:' style='vertical-align:middle; border-radius:30px; width:80%'>
</div>
<span style='margin:12px; float:right; display:block;'>
<span class='postMenu fontello'>&#xf0c9;
<div style='display:none; z-index:99; width:130px; position: absolute; top: 15px; right: -1px;' class='menu'>:menu:</div>
<div style='padding:5px 8px 8px 0px;' class='replyflex'>
<span id=':uid:' class='user desktop'><b><a class='link ldr' href='?user=:uid:'>:name:</a></b></span> <span id=':uid:' class='user mobile'><b><a class='link ldr' href='?user=:uid:' style='font-size:10px;'>:handle:</a></b></span> <span >:date:</span><br>
<br> <span class='content' style='width:100%;'>:replyto: :text:</span><br>
:media:
<br>
<span id=':id:' class="post_buttons mobile" style='position:absolute; right:10px; bottom:5px;'>:buttons:</span>
<span class=':visibility: fontello' style='position:absolute; right:10px; top:5px;'></span>
<span class='postMenu fontello mobile' style='position:absolute; right:15px; top:5px;'>&#xf0c9;
<div style='display:none; z-index:99; width:130px; position: absolute; top: 10px; right: -1px;' class='menu'>:menu:</div>
</span>
</span>
</div>
</div>
<div class='postbody'>
<div class='content' style='margin:0px;'>:media: :replyto: :text:</div>
</div>
<span style='width:100%; margin-bottom:10px; display:block;'>
<span style='margin-left:10px;'>:date:</span>
<span id=':id:' class="post_buttons" style='margin-right:10px;'>:buttons:</span>
</span>
<div id=':id:' class='replies_container'></div>
<script type='application/json' id='data-:id:'>:json:</script>
</div>

16
templates/textpost.txt
View File

@ -1,9 +1,21 @@
<div class='element'>
<div class='avatar desktop' style='background-image:url(:avatar:) :style:'></div>
<div class='post' id=':id:' pid=':pid:'>
<div class='post' id=':id:' pid=':pid:' mode="post">
<div id='a:id:' class='ancestors'>:ancestors:</div>
<div class='postHeader'>
<div style='width:82%; margin:5px; margin-left:10px; display:block; float:left; line-height:30px;'><img src=':avatar:' width=25 class='mobile' style='vertical-align:middle; border-radius:10px'> :name: :rt: </div>
<div style='width:80%; margin:5px; margin-left:10px; display:block; float:left; line-height:30px;'>
<img src=':avatar:' width=25 class='mobile' style='border-radius:10px; display:inline-block;'>
<div style='max-width:50%; display:inline-block;' class='user' id=':uid:'>
<div style='white-space: nowrap; overflow: hidden; text-overflow: ellipsis;'>
<a class='link ldr' href='?user=:uid:' style='font-weight:bold;'>
<span class='desktop'>:name:</span>
<span class='mobile'>:handle:</span>
</a>
</div>
</div>
<span class='desktop' style='vertical-align:top; font-size:12px;'>:acct:</span>
:rt:
</div>
<span style="margin-top:12px; margin-right:10px; float:right; display:block;">
<span class='postMenu fontello'>&#xf0c9;<div style='display:none; z-index:99; width:130px; position: absolute; top: 15px; right: -1px;' class='menu'>:menu:</div></span>
</span>

17
themes/1994/css/color.css
View File

@ -159,6 +159,14 @@ input[type="checkbox"]:checked+label {
padding:2px;
}
.reply .postMenu {
background-color: transparent;
border: none;
color:black;
padding:2px;
margin-right:10px;
}
.profile,.loader,.menu,.notif,.postMenu > .menu {
background-color: #efd7f3 !important;
border: 2px outset #f2e0f5 !important;
@ -265,6 +273,7 @@ input[type="checkbox"]:checked+label {
.loadmore, .postform,.searchmobile {
background-color: #efd7f3;
border: 2px outset #f2e0f5 !important;
border-radius:0px !important;
}
.previewpost,.userinfo {
@ -330,6 +339,14 @@ input[type="checkbox"]:checked+label {
background-color:#c8f7f5;
}
.felem a:hover > span {
background-color: #efd7f3;
border: 2px outset #f2e0f5 !important;
box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
color: black !important;
border-radius:0px;
}
.public::after {
content: '';
}

7
themes/ancientbird/css/color.css
View File

@ -278,6 +278,13 @@ input[type="submit"] {
background-color: #eee;
}
.felem a:hover > span {
background-color:white;
box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
color: black !important;
border-radius:4px;
}
.public::after {
content: '';
}

7
themes/bythebook/css/color.css
View File

@ -262,6 +262,13 @@ input[type="submit"] {
border-top:2px solid #dedfe1;
}
.felem a:hover > span {
background-color:white;
box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
color: black !important;
border-radius:4px;
}
.public::after {
content: '';
}

19
themes/chicago/css/color.css
View File

@ -170,6 +170,15 @@ input[type="submit"] {
padding:2px;
}
.reply .postMenu {
background-color: transparent;
border: none !important;
color:black;
padding:2px;
margin-right:20px !important;
color:transparent;
}
.menu div{
background-color: #b8b8b8;
border: 2px outset #fff !important;
@ -331,6 +340,16 @@ input[type="submit"] {
border: 2px inset #fff !important;
}
.felem a:hover > span {
background-color: #b8b8b8;
border-left: 1px solid #e4e6f3 !important;
border-top: 1px solid #e4e6f3 !important;
border-right: 1px solid #000507 !important;
border-bottom: 1px solid #000507 !important;
box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
color: black !important;
}
.public{
display:inline-block;
width:17px;

8
themes/cuatro/css/color.css
View File

@ -251,6 +251,14 @@ input[type="submit"] {
border-top:2px solid #eeaa88;
}
.felem a:hover > span {
background-color: #f0e0d6;
border:1px solid #800000;
color: #4267b2;
}
.public::after {
content: '';
}

7
themes/custom/css/color.php
View File

@ -300,6 +300,13 @@ input[type="submit"] {
border-radius: 0px 0px <?php echo $theme['br']; ?>px <?php echo $theme['br']; ?>px;
}
.felem a:hover > span {
color: <?php echo $backgroundLighter; ?>;
background-color: <?php echo $backgroundDarker ?> !important;
border: <?php echo $theme['bw']; ?>px solid #<?php echo $theme['bc']; ?>;
border-radius:3px;
}
.public::after {
content: '';
}

BIN
themes/longhorn/bg.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

492
themes/longhorn/css/color.css Normal file
View File

@ -0,0 +1,492 @@
a, .link {
color: blue;
}
body {
background-color: #3975b4;
background-image: url("../bg.jpg");
}
select{
color:black;
background-color:white;
}
label {
color: #425f99;
}
textarea,input[type="text"]{
background-color:white;
border: 2px solid #666 !important;
box-shadow: 0px 0px 3px rgba(255,255,255,1);
}
input[type="radio"]:checked+label {
color: black;
}
input[type="checkbox"]:checked+label {
color: red;
}
.topbar {
background-color: rgba(0,0,0,0.7);
background-image: linear-gradient(to bottom, rgba(150,150,150,0.55) 0%, rgba(160,160,160,0.55) 47%, rgba(56,55,55,0.45) 47%, rgba(56,55,55,0.45) 100%);
box-shadow: 3px 3px 5px rgba(0,0,0,0.5);
color: white;
}
.gotop {
background-color: rgba(255, 255, 255, 0.5);
}
.gotop a {
color: white;
}
.topicon, .appname > a {
color: white !important;
}
.tiselected {
border-bottom: 2px solid white;
}
.search {
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.7) inset;
}
.search input[type="text"],.search input[type="submit"]{
border:0px !important;
background-image:none;
background-color:transparent !important;
box-shadow: none;
color: #000;
}
.badge {
color: white;
}
.alert {
background-color: red;
}
.notif,.postAge{
color:black;
}
.notif .text{
color:black !important;
}
.uname {
text-decoration:underline !important;
}
.side_element,.userinfo,.previewpost,#notifications,#hiddenside .notif {
background-color: rgba(0,0,0,0.86);
/*border: 1px solid #ababab !important;*/
border-radius:0px !important;
border: 1px solid #eee !important;
}
.side_element li:active {
background-color: rgba(255, 255, 255, 0.25);
}
.side_element a, .userinfo a, .userinfo .ldr, .previewpost a {
color: white !important;
text-shadow: 1px 1px 2px black;
}
.uploadBox {
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
}
.delpic {
color:red;
background-color:white;
}
input[type="submit"] {
color: white;
border-radius: 4px !important;
border: 1px solid #3a2528;
text-align: center;
white-space: nowrap;
background: white;
background: linear-gradient(to bottom, rgba(203,196,194,1) 0%, rgba(148,148,148,1) 1%, rgba(120,129,133,1) 48%, rgba(92,112,127,1) 49%, rgba(17,60,78,1) 50%, rgba(64,110,148,1) 78%, rgba(124,149,185,1) 100%);
box-shadow: 0px 1px 2px rgba #8d8588 inset;
}
/*
button,.postform input[type="submit"],.reply input[type="submit"] {
background: linear-gradient(to bottom, rgba(242,242,242,1) 0%, rgba(248,248,248,1) 47%, rgba(238,238,238,1) 47%, rgba(207,207,207,1) 100%);
color: black;
padding: 5px $half-height 3px;
border-radius: 30px !important;
border: 1px solid #ccc !important;
text-shadow: rgba(10, 10, 10, 0.5) 1px 2px 2px;
text-align: center;
vertical-align: middle;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}*/
.formbtn {
color:white;
}
.formbtn label{
color:white;
}
#usermenu .menu {
background-color: #6B91B6;
}
.postMenu {
background: rgb(255,255,255);
background: linear-gradient(to bottom, rgba(252,252,252,1) 0%, rgba(243,226,225,1) 1%, rgba(220,164,160,1) 17%, rgba(208,129,121,1) 37%, rgba(189,67,51,1) 38%, rgba(197,124,106,1) 99%, rgba(255,255,255,1) 100%);
/* box-shadow: rgba(0, 0, 0, 0.5) 0px 5px 10px; /* FF 3.5+ */
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3) inset;
border-radius:0px 0px 6px 6px !important;
border:1px solid #444;
color:white;
text-shadow:0px 0px 3px black;
border-top:1px solid #ccc;
display:block;
}
.postMenu:hover {
background: rgb(255,255,255);
background: linear-gradient(to bottom, rgba(252,252,252,1) 0%, rgba(208,137,127,1) 1%, rgba(208,137,127,1) 17%, rgba(213,85,63,1) 37%, rgba(213,45,16,1) 38%, rgba(253,137,60,1) 99%, rgba(252,203,80,1) 100%);
}
.postMenu > .menu,.menu {
background-color: rgba(0,0,0,0.8) !important;
border-radius:5px !important;
background-image:none !important;
border: 1px solid #ccc !important;
color:white;
box-shadow: 2px 2px 5px rgba(0,0,0,0.9);
text-shadow:0px 0px 3px white;
}
.menu div{
color:white;
text-shadow:0px 0px 3px white;
box-shadow: 1px 1px 2px black;
}
.menu li{
color:white;
text-shadow:0px 0px 3px white;
}
.menu li:hover,.side_element li:hover {
background-color: #157efb !important;
background-image: linear-gradient(#5c83f9 ,#157efb);
color:white;
text-shadow:0px 0px 3px white;
}
.menu li a{
color:white;
/*text-shadow:0px 0px 3px white;*/
font-family: fontello, verdana, sans-serif !important;
text-align:left;
}
.menu li:hover a{
color:white !important;
}
.listmenu li {
background-color:black;
color:white;
}
.listmenu li:hover {
background-color:white;
color:white;
}
.autl:hover li{
background-color:lightgreen !important;
}
.rutl:hover li{
background-color:crimson !important;
}
.unblock,.unmute,.block,.mute,.follow,
.unfollow,
.nsfw,
.unnsfw,
.profileMenu,
.listmenu {
background-color: black;
color: white;
cursor: pointer;
}
.mute:hover,.block:hover,.follow:hover,
.nsfw:hover {
background-color: lime;
}
.unmute:hover,.unblock:hover,.unfollow:hover,
.unnsfw:hover{
background-color: crimson !important;
}
.unbookmark{
color: crimson !important;
}
.unfav, .unreblog{
color: red !important;
}
.loadingImage{
background-image: url("../loadingb.gif") !important;
}
.loader{
color:white !important;
text-shadow: 0px 0px 3px white;
}
.loader a,.loadmore a{
color:white !important;
text-shadow: 0px 0px 3px white;
}
.profile,.loader,.menu,.post,
.rb,
.textonly,
.loadmore,
.postform,
.searchmobile {
background-color:rgba(150,150,180,0.5);
background-image: linear-gradient(to bottom right, rgba(255,255,255,0.3) 1%, rgba(0,0,0,0) 36%, rgba(0,0,0,0) 60%, rgba(255,255,255,0.3) 99%);
border: 1px solid #fff !important;
border-radius:4px !important;
box-shadow: 1px 1px 3px rgba(0,0,0,0.5);
}
#notifications .notif{
color:white;
border:0px !important;
border-radius:0px !important;
}
.notif *{
color:white;
}
.postbody{
background-color:white;
border: 2px solid #666 !important;
box-shadow: 0px 0px 3px rgba(255,255,255,1);
border-radius:2px;
padding-top:10px;
padding-bottom:10px;
margin:4px 4px 0px 4px !important;
}
/*
.previewpost,.userinfo {
background-color: #e6e6e6;
background-image: none !important;
border: 1px solid #ababab !important;
border-radius:10px !important;
box-shadow: 1px 1px 3px rgba(0,0,0,0.5);
color:black;
}
*/
.userinfo_he a{
color:white !important;
}
.icon {
background-color: black;
}
.postHeader {
text-shadow: rgba(255, 255, 255, 1) 0px 0px 2px;
}
.postHeader * {
color: white;
text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
}
.toggleblur{
background: rgb(245,245,245);
background: linear-gradient(rgba(245,245,245,1) 0%, rgba(223,223,223,1) 60%, rgba(207,207,207,1) 61%, rgba(207,207,207,1) 63%, rgba(207,207,207,1) 66%, rgba(207,207,207,1) 66%, rgba(245,245,245,1) 100%);
color:black;
}
.polloption{
display:block;
margin:5px;
padding:5px;
background-color:white;
border: 1px solid #999999 !important;
border-radius:8px;
box-shadow: 1px 1px 2px inset rgba(0,0,0,0.3);
color:black;
}
.polloption:hover:not(.fixed),.voted{
cursor: pointer;
display:block;
margin:5px;
padding:5px;
background: rgb(185,215,245);
background: linear-gradient(rgba(108,124,154,1) 0%, rgba(135,160,200,1) 2%, rgba(151,180,224,1) 6%, rgba(162,193,240,1) 7%, rgba(139,180,236,1) 20%, rgba(95,168,224,1) 49%, rgba(135,202,240,1) 75%, rgba(182,227,255,1) 100%);
box-shadow: 0px 1px 2px black;
color:white;
}
.voteBar{
background: rgb(185,215,245);
background: linear-gradient(rgba(108,124,154,1) 0%, rgba(135,160,200,1) 2%, rgba(151,180,224,1) 6%, rgba(162,193,240,1) 7%, rgba(139,180,236,1) 20%, rgba(95,168,224,1) 49%, rgba(135,202,240,1) 75%, rgba(182,227,255,1) 100%);
box-shadow: 0px 1px 2px black;
}
.post_footer > a{
color: white;
}
.public::after {
content: '';
}
.unlisted::after {
content: '';
}
.private::after {
content: '';
}
.direct::after {
content: '';
}
.post .post_buttons a{
color:white;
}
.felem a:hover > span {
background-color:rgba(0,0,0,0.8);
border: 1px solid white;
box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
}
.notif .post_buttons {
background-color:white;
border: 1px solid #999999 !important;
border-radius:8px;
box-shadow: 1px 1px 2px inset rgba(0,0,0,0.3);
}
.notif .post_buttons a,.reply .post_buttons a{
color:black !important;
}
.reply .formbtn {
color:black;
}
.reply .formbtn label{
color:black;
}
.reply .postHeader {
background-color: #f1f1f1;
background-image: linear-gradient(#f5f5f5 ,#e6e6e6);
border-bottom:1px outset #ccc;
}
.reply .postMenu {
color:black;
background-image: none;
background-color: transparent;
border:0px;
box-shadow:none;
}
.reply > .postMenu a{
color:white !important;
font-weight:normal !important;
}
.reply .postMenu {
margin-top: 0px !important;
padding:0px !important;
}
.reply > .postMenu a {
font-weight: normal !important;
}
.reply > .postbody {
background-color:transparent;
border: none !important;
padding:0px !important
margin:0px !important;
}
.reply a {
color:black;
font-weight:bold;
text-shadow: none;
}
.reply {
background-color:#cddef0;
border-bottom: 1px dotted #333 !important;
color:black;
}
.note {
background-color: #ccc;
}
.button {
background-color: white;
}
.setting label {
background-color:white;
border: 1px inset #fff !important;
color:#aaaaaa;
}
.setting input[type="radio"]:checked+label {
background: white;
background: linear-gradient(to bottom, rgba(108,124,154,1) 0%, rgba(135,160,200,1) 2%, rgba(151,180,224,1) 6%, rgba(162,193,240,1) 7%, rgba(139,180,236,1) 20%, rgba(95,168,224,1) 49%, rgba(135,202,240,1) 75%, rgba(182,227,255,1) 100%);
border: 0px !important;
color:white;
}

16
themes/longhorn/css/mobile.css Normal file
View File

@ -0,0 +1,16 @@
body {
margin: 0;
background-attachment: fixed;
background-size: auto 100%;
background-repeat: no-repeat;
background-position: center top;
}
.content {
width:90% !important;
}
.postMenu {
padding:3px 5px 3px 5px;
margin-top:-11px !important;
}

10
themes/longhorn/css/style.css Normal file
View File

@ -0,0 +1,10 @@
body {
background-attachment: fixed;
background-size: cover;
margin: 0;
}
.postMenu {
padding:3px 15px 3px 15px;
margin-top:-11px !important;
}

BIN
themes/longhorn/loadingb.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

7
themes/monad/css/color.css
View File

@ -96,6 +96,13 @@ input[type="checkbox"]:checked+label {
box-shadow: 0px 0px 7px #000;
}
.felem a:hover > span {
background-color: rgba(18,26,36,0.8);
color: #d8a070 !important;
border: 1px solid #d8a070;
border-radius:4px;
}
.public::after {
content: '';
}

9
themes/phubbub/css/color.css
View File

@ -222,6 +222,15 @@ textarea,input[type="text"]{
border-top:2px solid #2f2f2f;
}
.felem a:hover > span {
background-color: #2f2f2f;
color: #ff8706 !important;
border-radius:4px;
border: 1px dotted #ff8706;
}
.public::after {
content: '';
}

24
themes/wetcat/css/color.css
View File

@ -127,8 +127,8 @@ input[type="checkbox"]:checked+label {
input[type="submit"] {
color: #fff;
border-radius: 5px !important;
border: 2px solid;
border-radius: 20px !important;
border: 1px solid;
text-shadow: rgba(10, 10, 10, 0.5) 1px 2px 2px;
text-align: center;
white-space: nowrap;
@ -151,8 +151,8 @@ button,.postform input[type="submit"],.reply input[type="submit"] {
color: #fff;
padding: 5px $half-height 3px;
border-radius: 12px !important;
border: 2px solid #ccc !important;
border-radius: 30px !important;
border: 1px solid #ccc !important;
text-shadow: rgba(10, 10, 10, 0.5) 1px 2px 2px;
text-align: center;
@ -184,6 +184,14 @@ button,.postform input[type="submit"],.reply input[type="submit"] {
background-color: #6B91B6;
}
.reply .postMenu {
color:black;
background-image: none;
background-color: transparent;
border:0px;
box-shadow:none;
}
.postMenu {
background: rgb(185,215,245);
background: linear-gradient(rgba(185,215,245,1) 0%, rgba(152,197,243,1) 28%, rgba(129,186,242,1) 52%, rgba(81,172,242,1) 59%, rgba(171,220,246,1) 100%);
@ -374,6 +382,14 @@ button,.postform input[type="submit"],.reply input[type="submit"] {
color: black !important;
}
.felem a:hover > span {
background-color: #e6e6e6;
border: 1px solid #ababab !important;
box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
color: black !important;
border-radius:4px;
}
.public::after {
content: '';
}

3
themes/wetcat/css/style.css
View File

@ -2,5 +2,4 @@ body {
background-attachment: fixed;
background-size: cover;
margin: 0;
}
}

11
themes/whistler/css/color.css
View File

@ -367,6 +367,17 @@ input[type="submit"] {
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2) inset;
}
.felem a:hover > span {
color: black !important;
background-color: #fbffbf !important;
border: 1px solid black;
box-shadow: 1px 1px 2px black;
border-radius:10px !important;
}
.public::after {
content: '';
}