devol
/
fediembedi-wordpress-widget-embed-fediverso
mirror of https://git.feneas.org/mediaformat/fediembedi
1
0
Fork 0
Code Issues Releases Wiki Activity

Refactor Instance selection and logic

This commit is contained in:
Django Doucet 2019-12-30 01:06:04 -05:00
parent 9186167c0e
commit 3e8ae17fb9
9 changed files with 370 additions and 185 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

105
fediembedi-mastodon.tpl.php Normal file
View File

@ -0,0 +1,105 @@
<!-- mastodon -->
<div class="scrollable" style="height: <?php echo $height; ?>;">
<div role="feed">
<?php if($show_header): ?>
<div class="account-timeline__header">
<div class="account__header">
<div class="account__header__image">
<div class="account__header__info"></div>
<?php if ($status[0]->account->header): echo "<img src=" . $status[0]->account->header . " loading='lazy'>"; endif; ?>
</div>
<div class="account__header__bar">
<div class="account__header__tabs">
<a href="<?php echo $status[0]->account->url; ?>" class="avatar" rel="noreferrer noopener" target="_blank">
<div class="account__avatar" style="width:90px; height: 90px; background-image: url('<?php echo $status[0]->account->avatar; ?>'); background-size: cover;"></div>
</a>
<div class="spacer"></div>
<div class="account__header__tabs__buttons">
<a href="<?php echo $status[0]->account->url; ?>" rel="noreferrer noopener" class="button logo-button">Follow</a>
</div>
</div>
<div class="account__header__tabs__name">
<h1>
<span><?php echo $status[0]->account->display_name; ?></span>
<small><a href="" target="_blank" rel="noreferrer noopener"><?php echo $status[0]->account->url; ?></a></small>
</h1>
</div>
<div class="account__header__extra">
<div class="account__header__bio">
<div class="account__header__content">
<?php echo $status[0]->account->note; ?>
</div>
</div>
</div>
</div>
</div>
</div>
<?php endif; ?>
<?php foreach ($status as $statut) { ?>
<article>
<div tabindex="-1">
<div class="status__wrapper status__wrapper-public focusable" tabindex="0">
<div class="status__prepend">
<?php
if(!is_null($statut->reblog)): ?>
<div class="status__prepend-icon-wrapper"><i role="img" class="fa fa-retweet status__prepend-icon fa-fw"></i></div>
</div><?php
else: echo '</div>';
endif; ?>
<div class="status status-public">
<div class="status__info">
<a href="<?php if(is_null($statut->reblog)): echo $statut->url; else: echo $statut->reblog->url; endif; ?>" class="status__relative-time" target="_blank" rel="noopener">
<time datetime="<?php echo $statut->created_at; ?>"><?php
printf( _x( '%1$s ago', '%2$s = human-readable time difference', 'fediembedi' ),
human_time_diff(
wp_date("U", strtotime($statut->created_at))
)
);
?></time>
</a>
<a href="<?php if(is_null($statut->reblog)): echo $statut->account->url; else: echo $statut->reblog->account->url; endif; ?>" class="status__display-name" rel="noopener noreferrer" target="_blank">
<div class="status__avatar">
<div class="account__avatar" style="background-image: url(<?php if(is_null($statut->reblog)): echo $statut->account->avatar; else: echo $statut->reblog->account->avatar; endif; ?>); background-size: 40px; width: 40px; height: 40px;"></div>
</div>
<span class="display-name"><?php if(is_null($statut->reblog)): echo $statut->account->display_name; else: echo $statut->reblog->account->display_name; endif; ?></span>
</a>
</div>
<div class="status__content"><?php
if(!is_null($statut->reblog)):
$statut = $statut->reblog;
endif;
if(empty($statut->spoiler_text)):
echo $statut->content;
if(!is_null($statut->card)): ?>
<a href="<?php echo $statut->card->url; ?>" class="status-card compact" target="_blank" rel="noopener noreferrer">
<div class="status-card__image"><div class="status-card__image-image" style="background-image: url(<?php echo $statut->card->image; ?>);"></div></div>
<div class="status-card__content">
<strong class="status-card__title" title="<?php echo $statut->card->title; ?>"><?php echo htmlentities($statut->card->title); ?></strong>
<p class="status-card__description"><?php echo wp_trim_words(htmlentities($statut->card->description)); ?></p>
<span class="status-card__host"><?php echo $statut->card->url; ?></span>
</div>
</a>
<?php
endif;
else: echo '<details><summary>' . $statut->spoiler_text . '</summary>'. $statut->content . '</details>';
endif;
if(!empty($statut->media_attachments)):
foreach ($statut->media_attachments as $attachment) {
if (!empty($attachment->preview_url) && $attachment->type === 'image'):
echo "<img src='" . $attachment->preview_url . "' class='media-gallery__item' alt='" . $attachment->description . "' loading='lazy'>";
elseif($attachment->type === 'video'):
echo "<video src=" . $attachment->url . " controls poster='" . $attachment->preview_url . "' class='media-gallery__item' alt=" . $attachment->description . ">";
elseif($attachment->type === 'audio'):
echo "<audio src=" . $attachment->url . " controls poster='" . $attachment->preview_url . "' class='media-gallery__item' alt=" . $attachment->description . ">";
endif;
}
endif;
?></div>
</div>
</div>
</div>
</article>
<?php } ?>
</div>
</div>

57
fediembedi-pixelfed.tpl.php Normal file
View File

@ -0,0 +1,57 @@
<!-- pixelfed -->
<div class="scrollable" style="height: <?php echo $height; ?>;">
<div role="feed">
<?php if($show_header): ?>
<div class="account-timeline__header">
<div class="account__header">
<div class="account__header__bar">
<div class="account__header__tabs">
<a href="<?php echo $status[0]->account->url; ?>" class="avatar" rel="noreferrer noopener" target="_blank">
<div class="account__avatar" style="margin-top: 50px; width:90px; height: 90px; background-image: url('<?php echo $status[0]->account->avatar; ?>'); background-size: cover;"></div>
</a>
<div class="spacer"></div>
<div class="account__header__tabs__buttons">
<a href="<?php echo $status[0]->account->url; ?>" rel="noreferrer noopener" class="button logo-button">Follow</a>
</div>
</div>
<div class="account__header__tabs__name">
<h1>
<span><?php echo $status[0]->account->display_name; ?></span>
<small><a href="" target="_blank" rel="noreferrer noopener"><?php echo $status[0]->account->url; ?></a></small>
</h1>
</div>
<div class="account__header__extra">
<div class="account__header__bio">
<div class="account__header__content">
<?php echo $status[0]->account->note; ?>
</div>
</div>
</div>
</div>
</div>
</div>
<?php endif; ?>
<?php foreach ($status as $statut) { ?>
<article>
<div tabindex="-1">
<div class="status__wrapper status__wrapper-public focusable" tabindex="0">
<div class="status__content"><?php
if(!empty($statut->media_attachments)):
foreach ($statut->media_attachments as $attachment) {
if (!empty($attachment->preview_url) && $attachment->type === 'image'): ?>
<a href="<?php echo $statut->url; ?>" class="" target="_blank" rel="noopener">
<img src='<?php echo $attachment->preview_url; ?>' class='media-gallery__item' alt='<?php $attachment->description; ?>' loading='lazy'>
</a><?php
elseif($attachment->type === 'video'):
echo "<video src=" . $attachment->url . " controls poster='" . $attachment->preview_url . "' class='media-gallery__item' alt=" . $attachment->description . ">";
endif;
}
endif;
?></div>
</div>
</div>
</article>
<?php } ?>
</div>
</div>

126
fediembedi-widget-template.php
View File

@ -13,6 +13,10 @@ $only_media = (!empty($instance['only_media'])) ? $instance['only_media'] : '';
$pinned = (!empty($instance['pinned'])) ? $instance['pinned'] : '';
$exclude_replies = (!empty($instance['exclude_replies'])) ? $instance['exclude_replies'] : '';
$exclude_reblogs = (!empty($instance['exclude_reblogs'])) ? $instance['exclude_reblogs'] : '';
$number = isset( $instance['number'] ) ? absint( $instance['number'] ) : 5;
$height = isset( $instance['height'] ) ? esc_attr( $instance['height'] ) : '100%';
//Default query
$query = http_build_query(array(
'only_media' => $only_media,
'pinned' => $pinned,
@ -20,113 +24,17 @@ $query = http_build_query(array(
'limit' => 5,
'exclude_reblogs' => $exclude_reblogs
));
$status = $client->getStatus($only_media, $pinned, $exclude_replies, null, null, null, 10, $exclude_reblogs);
$status = $client->getStatus($only_media, $pinned, $exclude_replies, null, null, null, $number, $exclude_reblogs);
$instance_info = $client->getInstance();
if(WP_DEBUG_DISPLAY === true): echo '<details><summary>Debug</summary><pre>'; var_dump($instance_info); echo '</pre></details>'; endif;
?>
<div class="scrollable">
<div role="feed">
<?php if($show_header): ?>
<div class="account-timeline__header">
<div class="account__header">
<div class="account__header__image">
<div class="account__header__info"></div>
<?php if ($status[0]->account->header): echo "<img src=" . $status[0]->account->header . " loading='lazy'>"; endif; ?>
</div>
<div class="account__header__bar">
<div class="account__header__tabs">
<a href="<?php echo $status[0]->account->url; ?>" class="avatar" rel="noreferrer noopener" target="_blank">
<div class="account__avatar" style="width:90px; height: 90px; background-image: url('<?php echo $status[0]->account->avatar; ?>'); background-size: cover;"></div>
</a>
<div class="spacer"></div>
<div class="account__header__tabs__buttons">
<a href="<?php echo $status[0]->account->url; ?>" rel="noreferrer noopener" class="button logo-button" style="padding: 0px 16px; height: 36px; line-height: 36px;">Follow</a>
</div>
</div>
<div class="account__header__tabs__name">
<h1>
<span><?php echo $status[0]->account->display_name; ?></span>
<small><a href="" target="_blank" rel="noreferrer noopener"><?php echo $status[0]->account->url; ?></a></small>
</h1>
</div>
<div class="account__header__extra">
<div class="account__header__bio">
<div class="account__header__content">
<?php echo $status[0]->account->note; ?>
</div>
</div>
</div>
</div>
</div>
</div>
<?php endif; ?>
<?php foreach ($status as $statut) { ?>
<article>
<div tabindex="-1">
<div class="status__wrapper status__wrapper-public focusable" tabindex="0">
<div class="status__prepend">
<?php
if(!is_null($statut->reblog)): ?>
<div class="status__prepend-icon-wrapper"><i role="img" class="fa fa-retweet status__prepend-icon fa-fw"></i></div>
</div><?php
else: echo '</div>';
endif; ?>
<div class="status status-public">
<div class="status__info">
<a href="<?php if(is_null($statut->reblog)): echo $statut->url; else: echo $statut->reblog->url; endif; ?>" class="status__relative-time" target="_blank" rel="noopener">
<time datetime="<?php echo $statut->created_at; ?>"><?php
printf( _x( '%1$s ago', '%2$s = human-readable time difference', 'fediembedi' ),
human_time_diff(
wp_date("U", strtotime($statut->created_at))
)
);
?></time>
</a>
<a href="<?php if(is_null($statut->reblog)): echo $statut->account->url; else: echo $statut->reblog->account->url; endif; ?>" class="status__display-name" rel="noopener noreferrer" target="_blank">
<div class="status__avatar">
<div class="account__avatar" style="background-image: url(<?php if(is_null($statut->reblog)): echo $statut->account->avatar; else: echo $statut->reblog->account->avatar; endif; ?>); background-size: 40px; width: 40px; height: 40px;"></div>
</div>
<span class="display-name"><?php if(is_null($statut->reblog)): echo $statut->account->display_name; else: echo $statut->reblog->account->display_name; endif; ?></span>
</a>
</div>
<div class="status__content"><?php
if(!is_null($statut->reblog)):
$statut = $statut->reblog;
endif;
if(empty($statut->spoiler_text)):
echo $statut->content;
if(!is_null($statut->card)): ?>
<a href="<?php echo $statut->card->url; ?>" class="status-card compact" target="_blank" rel="noopener noreferrer">
<div class="status-card__image"><div class="status-card__image-image" style="background-image: url(<?php echo $statut->card->image; ?>);"></div></div>
<div class="status-card__content">
<strong class="status-card__title" title="<?php echo $statut->card->title; ?>"><?php echo htmlentities($statut->card->title); ?></strong>
<p class="status-card__description"><?php echo wp_trim_words(htmlentities($statut->card->description)); ?></p>
<span class="status-card__host"><?php echo $statut->card->url; ?></span>
</div>
</a>
<?php
endif;
else: echo '<details><summary>' . $statut->spoiler_text . '</summary>'. $statut->content . '</details>';
endif;
if(!empty($statut->media_attachments)):
foreach ($statut->media_attachments as $attachment) {
if (!empty($attachment->preview_url) && $attachment->type === 'image'):
echo "<img src='" . $attachment->preview_url . "' class='media-gallery__item' alt='" . $attachment->description . "' loading='lazy'>";
elseif($attachment->type === 'video'):
echo "<video src=" . $attachment->url . " controls poster='" . $attachment->preview_url . "' class='media-gallery__item' alt=" . $attachment->description . ">";
elseif($attachment->type === 'audio'):
echo "<audio src=" . $attachment->url . " controls poster='" . $attachment->preview_url . "' class='media-gallery__item' alt=" . $attachment->description . ">";
endif;
}
endif;
?></div>
</div>
</div>
</div>
</article>
<?php }
if(WP_DEBUG_DISPLAY === true): echo '<details><summary>Debug</summary><pre>'; var_dump($status); echo '</pre></details>'; endif; ?>
</div>
</div>
$instance_type = get_option('fediembedi-instance-type');
switch ($instance_type) {
case 'Mastodon':
include(plugin_dir_path(__FILE__) . 'fediembedi-mastodon.tpl.php' );
break;
case 'Pixelfed':
include(plugin_dir_path(__FILE__) . 'fediembedi-pixelfed.tpl.php' );
break;
default:
include(plugin_dir_path(__FILE__) . 'fediembedi-mastodon.tpl.php' );
break;
} ?>

129
fediembedi-widget.php
View File

@ -44,71 +44,80 @@ class WP_Widget_fediembedi extends WP_Widget {
$pinned = (!empty($instance['pinned'])) ? $instance['pinned'] : NULL;
$exclude_replies = (!empty($instance['exclude_replies'])) ? $instance['exclude_replies'] : NULL;
$exclude_reblogs = (!empty($instance['exclude_reblogs'])) ? $instance['exclude_reblogs'] : NULL;
$remote_instance = get_option('fediembedi-instance');
$client = new \Client($remote_instance);
$instance_info = $client->getInstance();
$number = isset( $instance['number'] ) ? absint( $instance['number'] ) : 5;
$height = isset( $instance['height'] ) ? esc_attr( $instance['height'] ) : '';
$instance_type = get_option('fediembedi-instance-type');
$pixelfed = '';
if (strpos($instance_info->version, 'Pixelfed') !== false) {
$pixelfed = true;
}
?>
<p>
<p>
<label for="<?php echo $this->get_field_id('title'); ?>"><?php _e('Title:', 'fediembedi'); ?>
<input class="widefat" id="<?php echo $this->get_field_id('title'); ?>" name="<?php echo $this->get_field_name('title'); ?>" type="text" value="<?php echo esc_attr($instance['title']); ?>" />
</label>
</p>
<p>
<label>
<input
type="checkbox"
<?php checked( $instance[ 'show_header' ], '1' ); ?>
id="<?php echo $this->get_field_id( '1' ); ?>"
name="<?php echo $this->get_field_name('show_header'); ?>"
value="1"
/><?php _e( 'Show header', 'fediembedi' ); ?>
</label>
<br>
<label>
<input
type="checkbox"
<?php checked( $instance[ 'only_media' ], '1' ); ?>
id="<?php echo $this->get_field_id( '1' ); ?>"
name="<?php echo $this->get_field_name('only_media'); ?>"
value="1"
/><?php _e( 'Only media', 'fediembedi' ); ?>
</label>
<br>
<label>
<input
type="checkbox"
<?php checked( $instance[ 'pinned' ], '1' ); ?>
id="<?php echo $this->get_field_id( '1' ); ?>"
name="<?php echo $this->get_field_name('pinned'); ?>"
value="1"
/><?php _e( 'Show pinned statuses', 'fediembedi' ); ?>
</label>
<br>
<label>
<input
type="checkbox"
<?php checked( $instance[ 'exclude_replies' ], '1' ); ?>
id="<?php echo $this->get_field_id( '1' ); ?>"
name="<?php echo $this->get_field_name('exclude_replies'); ?>"
value="1"
/><?php _e( 'Hide replies', 'fediembedi' ); ?>
</label>
<br>
<label>
<input
type="checkbox"
<?php checked( $instance[ 'exclude_reblogs' ], '1' ); ?>
id="<?php echo $this->get_field_id( '1' ); ?>"
name="<?php echo $this->get_field_name('exclude_reblogs'); ?>"
value="1"
/><?php _e( 'Hide reblogs', 'fediembedi' ); ?>
</label>
</p>
<p>
<label>
<input
type="checkbox"
<?php checked( $instance[ 'show_header' ], '1' ); ?>
id="<?php echo $this->get_field_id( '1' ); ?>"
name="<?php echo $this->get_field_name('show_header'); ?>"
value="1"
/><?php _e( 'Show header', 'fediembedi' ); ?>
</label>
</p>
<p style="<?php if($instance_type === 'Pixelfed'){ echo 'display: none;'; } ?>">
<label>
<input
type="checkbox"
<?php checked( $instance[ 'only_media' ], '1' ); ?>
id="<?php echo $this->get_field_id( '1' ); ?>"
name="<?php echo $this->get_field_name('only_media'); ?>"
value="1"
/><?php _e( 'Only show media', 'fediembedi' ); ?>
</label>
</p>
<p>
<label>
<input
type="checkbox"
<?php checked( $instance[ 'pinned' ], '1' ); ?>
id="<?php echo $this->get_field_id( '1' ); ?>"
name="<?php echo $this->get_field_name('pinned'); ?>"
value="1"
/><?php _e( 'Only show pinned statuses', 'fediembedi' ); ?>
</label>
</p>
<p>
<label>
<input
type="checkbox"
<?php checked( $instance[ 'exclude_replies' ], '1' ); ?>
id="<?php echo $this->get_field_id( '1' ); ?>"
name="<?php echo $this->get_field_name('exclude_replies'); ?>"
value="1"
/><?php _e( 'Hide replies', 'fediembedi' ); ?>
</label>
</p>
<p style="<?php if($instance_type === 'Pixelfed'){ echo 'display: none;'; } ?>">
<label>
<input
type="checkbox"
<?php checked( $instance[ 'exclude_reblogs' ], '1' ); ?>
id="<?php echo $this->get_field_id( '1' ); ?>"
name="<?php echo $this->get_field_name('exclude_reblogs'); ?>"
value="1"
/><?php _e( 'Hide reblogs', 'fediembedi' ); ?>
</label>
</p>
<p>
<label for="<?php echo $this->get_field_id( 'number' ); ?>"><?php _e( 'Number of items to show:' ); ?></label>
<input class="tiny-text" id="<?php echo $this->get_field_id( 'number' ); ?>" name="<?php echo $this->get_field_name( 'number' ); ?>" type="number" step="1" min="1" value="<?php echo $number; ?>" size="3" />
</p>
<p>
<label for="<?php echo $this->get_field_id( 'height' ); ?>"><?php _e( 'Widget height:' ); ?></label>
<input class="" id="<?php echo $this->get_field_id( 'height' ); ?>" name="<?php echo $this->get_field_name( 'height' ); ?>" type="text" value="<?php echo $height; ?>" placeholder="500px" size="5" />
</p>
<?php
}
@ -131,6 +140,8 @@ class WP_Widget_fediembedi extends WP_Widget {
$instance['pinned'] = $new_instance['pinned'];
$instance['exclude_replies'] = $new_instance['exclude_replies'];
$instance['exclude_reblogs'] = $new_instance['exclude_reblogs'];
$instance['number'] = (int) $new_instance['number'];
$instance['height'] = sanitize_text_field( $new_instance['height'] );
return $instance;
}

22
fediembedi.php
View File

@ -20,15 +20,10 @@ class FediConfig
{
add_action('plugins_loaded', array($this, 'init'));
add_action('widgets_init', array($this, 'fediembedi_widget'));
//add_action('admin_enqueue_scripts', array($this, 'enqueue_scripts'));
add_action('wp_enqueue_scripts', array($this, 'enqueue_styles'));
add_action('admin_menu', array($this, 'configuration_page'));
//add_action('save_post', array($this, 'toot_post'));
add_action('admin_notices', array($this, 'admin_notices'));
add_filter('plugin_action_links_'.plugin_basename(__FILE__), array($this, 'fediembedi_add_plugin_page_settings_link'));
//add_action('add_meta_boxes', array($this, 'add_metabox'));
//add_action('publish_future_post', array($this, 'toot_scheduled_post'));
//add_action('wp_ajax_get_toot_preview', array($this, 'get_toot_preview_ajax_handler'));
}
@ -57,7 +52,7 @@ class FediConfig
$instance = get_option('fediembedi-instance');
$client = new \Client($instance);
$token = $client->get_bearer_token($client_id, $client_secret, $code, get_admin_url());
$instance_info = $client->getInstance();
//$instance_info = $client->getInstance();
if (isset($token->error)) {
//print_r($token);
@ -78,7 +73,7 @@ class FediConfig
update_option('fediembedi-client-id', '');
update_option('fediembedi-client-secret', '');
update_option('fediembedi-token', $token->access_token);
update_option('fediembedi-instance-info', $instance_info);
//update_option('fediembedi-instance-type', $instance_type);
}
$redirect_url = get_admin_url() . 'options-general.php?page=fediembedi';
@ -117,14 +112,12 @@ class FediConfig
public function enqueue_styles($hook)
{
if( is_active_widget( false, false, 'fediembedi') ) {
$instance = get_option('fediembedi-instance');
$client = new \Client($instance);
$instance_info = $client->getInstance();
if (strpos($instance_info->version, 'Pixelfed') === false) {
wp_enqueue_style( 'fediembedi', plugin_dir_url( __FILE__ ) . 'mastodon-light.css', array(), filemtime(plugin_dir_path( __FILE__ ) . 'mastodon-light.css') );
$instance_type = get_option('fediembedi-instance-type');
if ($instance_type === 'Mastodon') {
wp_enqueue_style( 'fediembedi', plugin_dir_url( __FILE__ ) . 'mastodon.css', array(), filemtime(plugin_dir_path( __FILE__ ) . 'mastodon.css') );
} else {
//https://css-tricks.com/lozad-js-performant-lazy-loading-images/ lazyloading for background images
wp_enqueue_style( 'fediembedi', plugin_dir_url( __FILE__ ) . 'pixelfed-light.css', array(), filemtime(plugin_dir_path( __FILE__ ) . 'pixelfed-light.css') );
wp_enqueue_style( 'fediembedi', plugin_dir_url( __FILE__ ) . 'pixelfed.css', array(), filemtime(plugin_dir_path( __FILE__ ) . 'pixelfed.css') );
}
}
}
@ -172,6 +165,7 @@ class FediConfig
if ($is_valid_nonce) {
$instance = esc_url($_POST['instance']);
$instance_type = esc_attr($_POST['instance_type']);
$client = new \Client($instance);
$redirect_url = get_admin_url();
@ -206,6 +200,7 @@ class FediConfig
update_option('fediembedi-client-id', $client->get_client_id());
update_option('fediembedi-client-secret', $client->get_client_secret());
update_option('fediembedi-instance', $instance);
update_option('fediembedi-instance-type', $instance_type);
$account = $client->verify_credentials($token);
@ -234,6 +229,7 @@ class FediConfig
}
$instance = get_option('fediembedi-instance');
$instance_type = get_option('fediembedi-instance-type');
if (!empty($token)) {
$client = new \Client($instance);

7
form.tpl.php
View File

@ -13,6 +13,10 @@ define("ADVANCED_VIEW",false);
<?php wp_nonce_field( 'fediembedi-configuration' ); ?>
<div style="display:<?php echo !ACCOUNT_CONNECTED ? "block":"none"?>">
<input type="text" id="instance" name="instance" size="80" value="<?php esc_attr_e( $instance ); ?>" list="mInstances">
<select class="" id="instance_type" name="instance_type" value="<?php esc_attr_e( $instance_type ); ?>">
<option value="Mastodon">Mastodon/Pleroma</option>
<option value="Pixelfed">Pixelfed</option>
</select>
<input class="button button-primary" type="submit" value="<?php esc_attr_e( 'Connect to your instance', 'fediembedi' ); ?>" name="save" id="save">
<br><small>The currently supported software are Mastodon, Pleroma, Pixelfed.</small>
</div>
@ -36,7 +40,4 @@ define("ADVANCED_VIEW",false);
<div class="clear"></div>
</form>
<?php
//require("instanceList.php")
?>
</div>

101
img/pixelfed-icon-color.svg Normal file
View File

@ -0,0 +1,101 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="50px" height="50px" viewBox="0 0 50 50" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 51.3 (57544) - http://www.bohemiancoding.com/sketch -->
<title>icon/color/svg/pixelfed-icon-color</title>
<desc>Created with Sketch.</desc>
<defs>
<rect id="path-1" x="0" y="0.112107623" width="50" height="49.7757848"></rect>
<linearGradient x1="100%" y1="55.8067876%" x2="0%" y2="60.1177402%" id="linearGradient-3">
<stop stop-color="#FF5C34" offset="0%"></stop>
<stop stop-color="#EB0256" offset="100%"></stop>
</linearGradient>
<linearGradient x1="33.0892153%" y1="100%" x2="68.9900955%" y2="15.3101693%" id="linearGradient-4">
<stop stop-color="#A63FDB" offset="0%"></stop>
<stop stop-color="#FF257E" offset="100%"></stop>
</linearGradient>
<linearGradient x1="14.7223019%" y1="50%" x2="94.315299%" y2="67.5256558%" id="linearGradient-5">
<stop stop-color="#00FFF0" offset="0%"></stop>
<stop stop-color="#0087FF" offset="100%"></stop>
</linearGradient>
<linearGradient x1="81.2260936%" y1="10.0128769%" x2="20.8151903%" y2="74.4920673%" id="linearGradient-6">
<stop stop-color="#17C934" offset="0%"></stop>
<stop stop-color="#03FF6E" offset="100%"></stop>
</linearGradient>
<linearGradient x1="50%" y1="111.913008%" x2="30.5601577%" y2="0%" id="linearGradient-7">
<stop stop-color="#FFB000" offset="0%"></stop>
<stop stop-color="#FF7725" offset="100%"></stop>
</linearGradient>
<path d="M25.8796198,24.6636771 C25.5187511,17.8623246 19.644178,12.6376937 12.7583935,12.9941375 C5.87260905,13.3505813 0.583119676,19.1531217 0.94398835,25.9544743 L0.954359402,26.1499392 C0.924772259,25.6582574 0.909768036,25.162698 0.909768036,24.6636771 C0.909768036,14.5077362 7.12441451,5.78550566 16.0023658,2.00478143 L16.5257487,1.7959139 C22.9188985,-0.755414121 30.1955057,2.29544903 32.7785059,8.61020748 C35.3615061,14.9249659 32.2727696,22.1123491 25.8796198,24.6636771 Z" id="path-8"></path>
<path d="M16.3387661,1.87053346 L16.5257487,1.7959139 C22.9188985,-0.755414121 30.1955057,2.29544903 32.7785059,8.61020748 C35.3615061,14.9249659 32.2727696,22.1123491 25.8796198,24.6636771 C25.8261894,23.6566658 25.6518881,22.6842191 25.3713301,21.7593344 C28.8012958,19.9026454 31.1268503,16.3032843 31.1268503,12.167421 C31.1268503,6.13067623 26.1723508,1.23692769 20.060666,1.23692769 C18.7548626,1.23692769 17.5018839,1.46032366 16.3387661,1.87053346 Z" id="path-9"></path>
<linearGradient x1="-81.3646199%" y1="59.6233723%" x2="121.418067%" y2="72.057922%" id="linearGradient-10">
<stop stop-color="#9EE85D" offset="0%"></stop>
<stop stop-color="#0ED061" offset="100%"></stop>
</linearGradient>
<path d="M28.3794511,9.27014825 L28.5664337,9.1955287 C34.9595835,6.64420067 42.2361907,9.69506383 44.8191909,16.0098223 C47.4021911,22.3245807 44.3134546,29.5119639 37.9203048,32.0632919 C37.8668744,31.0562806 37.6925731,30.0838339 37.4120151,29.1589492 C40.8419808,27.3022602 43.1675353,23.7028991 43.1675353,19.5670358 C43.1675353,13.530291 38.2130358,8.63654249 32.101351,8.63654249 C30.7955476,8.63654249 29.5425689,8.85993845 28.3794511,9.27014825 Z" id="path-11"></path>
<linearGradient x1="45.510285%" y1="116.818646%" x2="0%" y2="-4.0376427%" id="linearGradient-12">
<stop stop-color="#21EFE3" offset="0%"></stop>
<stop stop-color="#2598FF" offset="100%"></stop>
</linearGradient>
<path d="M25.1352415,22.7323503 L25.3222242,22.6577307 C31.7153739,20.1064027 38.9919812,23.1572658 41.5749814,29.4720243 C44.1579816,35.7867827 41.069245,42.9741659 34.6760953,45.5254939 C34.6226649,44.5184826 34.4483636,43.5460359 34.1678055,42.6211512 C37.5977712,40.7644622 39.9233257,37.1651011 39.9233257,33.0292378 C39.9233257,26.992493 34.9688263,22.0987445 28.8571415,22.0987445 C27.5513381,22.0987445 26.2983594,22.3221405 25.1352415,22.7323503 Z" id="path-13"></path>
<linearGradient x1="100%" y1="58.2065614%" x2="-89.649052%" y2="74.3165445%" id="linearGradient-14">
<stop stop-color="#A63FDB" offset="0%"></stop>
<stop stop-color="#FF257E" offset="100%"></stop>
</linearGradient>
<path d="M10.6540931,23.7648224 L10.8410757,23.6902028 C17.2342255,21.1388748 24.5108328,24.1897379 27.093833,30.5044964 C29.6768331,36.8192548 26.5880966,44.006638 20.1949468,46.557966 C20.1415164,45.5509547 19.9672152,44.578508 19.6866571,43.6536233 C23.1166228,41.7969343 25.4421773,38.1975732 25.4421773,34.0617099 C25.4421773,28.0249651 20.4876778,23.1312166 14.375993,23.1312166 C13.0701896,23.1312166 11.8172109,23.3546126 10.6540931,23.7648224 Z" id="path-15"></path>
<path d="M5.54585436,10.6972047 L5.73283698,10.6225852 C12.1259868,8.07125717 19.402594,11.1221203 21.9855942,17.4368788 C24.5685944,23.7516372 21.4798579,30.9390204 15.0867081,33.4903484 C15.0332777,32.483337 14.8589764,31.5108904 14.5784184,30.5860057 C18.0083841,28.7293167 20.3339386,25.1299556 20.3339386,20.9940923 C20.3339386,14.9573475 15.3794391,10.063599 9.26775427,10.063599 C7.9619509,10.063599 6.70897218,10.2869949 5.54585436,10.6972047 Z" id="path-16"></path>
<path d="M35.631732,42.3730981 L40.1765635,42.3730981 C44.4579764,42.3730981 47.9287473,39.0094481 47.9287473,34.8601757 C47.9287473,30.7109033 44.4579764,27.3472534 40.1765635,27.3472534 L33.6170234,27.3472534 C31.1469775,27.3472534 29.1446097,29.2878206 29.1446097,31.6816316 L29.1446097,48.5516086 L35.631732,42.3730981 Z" id="path-17"></path>
<filter x="-26.6%" y="-18.9%" width="153.2%" height="147.2%" filterUnits="objectBoundingBox" id="filter-18">
<feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
<feGaussianBlur stdDeviation="1.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.298686594 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
</filter>
</defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="icon-copy-9">
<g id="Group">
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<g id="Rectangle"></g>
<g id="Group-12" mask="url(#mask-2)">
<g transform="translate(-12.598536, -12.100617)">
<g id="Group-5" stroke-width="1" fill-rule="evenodd" transform="translate(37.298810, 37.253293) rotate(40.000000) translate(-37.298810, -37.253293) translate(11.517560, 12.253293)">
<path d="M25.8796198,24.6636771 C19.1892035,23.016023 12.4132807,27.0374857 10.7451726,33.6458656 C9.07706451,40.2542455 13.1484497,46.9470835 19.8388659,48.5947376 L20.3450373,48.7193929 C9.69088103,46.3380067 1.6209996,37.2282295 0.954359365,26.1499385 L0.94398835,25.9544743 C0.583119676,19.1531217 5.87260905,13.3505813 12.7583935,12.9941375 C19.644178,12.6376937 25.5187511,17.8623246 25.8796198,24.6636771 Z" id="Combined-Shape" fill="url(#linearGradient-3)"></path>
<path d="M25.8796198,24.6636771 C22.3283116,30.5015748 24.2407085,38.0777295 30.1510778,41.5854923 C36.0614471,45.0932551 43.7316521,43.2043076 47.2829602,37.3664099 L47.5182297,36.9796568 C43.2031146,44.3603916 35.1286161,49.3273543 25.8796198,49.3273543 C23.9775953,49.3273543 22.125241,49.1172988 20.3450373,48.7193929 L19.8388659,48.5947376 C13.1484497,46.9470835 9.07706451,40.2542455 10.7451726,33.6458656 C12.4132807,27.0374857 19.1892035,23.016023 25.8796198,24.6636771 Z" id="Combined-Shape-Copy-6" fill="url(#linearGradient-4)"></path>
<path d="M25.8796198,24.6636771 C30.3117909,29.8809656 38.1867277,30.5614853 43.4687835,26.1836605 C48.7508393,21.8058357 49.439807,14.0274595 45.0076359,8.81017106 L44.9061506,8.69070851 C48.612765,12.9940954 50.8494715,18.5708837 50.8494715,24.6636771 C50.8494715,29.1494627 49.6370515,33.3555446 47.5182297,36.9796568 L47.2829602,37.3664099 C43.7316521,43.2043076 36.0614471,45.0932551 30.1510778,41.5854923 C24.2407085,38.0777295 22.3283116,30.5015748 25.8796198,24.6636771 Z" id="Combined-Shape-Copy-5" fill="url(#linearGradient-5)"></path>
<path d="M25.8796198,24.6636771 C32.2727696,22.1123491 35.3615061,14.9249659 32.7785059,8.61020748 C30.1955057,2.29544903 22.9188985,-0.755414121 16.5257487,1.7959139 L16.0023658,2.00478143 C19.0317193,0.714714639 22.3711681,0 25.8796198,0 C33.5016588,0 40.3260608,3.37321498 44.9061506,8.69070851 L45.0076359,8.81017106 C49.439807,14.0274595 48.7508393,21.8058357 43.4687835,26.1836605 C38.1867277,30.5614853 30.3117909,29.8809656 25.8796198,24.6636771 Z" id="Combined-Shape-Copy-4" fill="url(#linearGradient-6)"></path>
<g id="Combined-Shape-Copy-3" fill="url(#linearGradient-7)">
<use xlink:href="#path-8"></use>
<use fill-opacity="0.1" style="mix-blend-mode: multiply;" xlink:href="#path-8"></use>
</g>
<g id="Combined-Shape" opacity="0.504910714">
<use fill="url(#linearGradient-7)" xlink:href="#path-9"></use>
<use fill-opacity="0.496178668" fill="#000000" style="mix-blend-mode: overlay;" xlink:href="#path-9"></use>
</g>
<g id="Combined-Shape-Copy-7" opacity="0.544252232" transform="translate(37.055527, 20.178799) rotate(72.000000) translate(-37.055527, -20.178799) ">
<use fill="url(#linearGradient-10)" xlink:href="#path-11"></use>
<use fill-opacity="0.499886775" fill="#000000" style="mix-blend-mode: overlay;" xlink:href="#path-11"></use>
</g>
<g id="Combined-Shape-Copy-8" opacity="0.562220982" transform="translate(33.811317, 33.641001) rotate(143.000000) translate(-33.811317, -33.641001) ">
<use fill="url(#linearGradient-12)" xlink:href="#path-13"></use>
<use fill="#000000" style="mix-blend-mode: overlay;" xlink:href="#path-13"></use>
</g>
<g id="Combined-Shape-Copy-9" opacity="0.584151786" transform="translate(19.330169, 34.673473) rotate(217.000000) translate(-19.330169, -34.673473) ">
<use fill="url(#linearGradient-14)" xlink:href="#path-15"></use>
<use fill-opacity="0.503085371" fill="#000000" style="mix-blend-mode: overlay;" xlink:href="#path-15"></use>
</g>
<g id="Combined-Shape-Copy-10" opacity="0.180133929" transform="translate(14.221930, 21.605855) rotate(-71.000000) translate(-14.221930, -21.605855) ">
<use fill="url(#linearGradient-3)" xlink:href="#path-16"></use>
<use fill-opacity="0.772843071" fill="#000000" style="mix-blend-mode: multiply;" xlink:href="#path-16"></use>
</g>
</g>
<g id="Path-6-Copy-2" fill-rule="nonzero">
<use fill="black" fill-opacity="1" filter="url(#filter-18)" xlink:href="#path-17"></use>
<use fill="#FFFFFF" xlink:href="#path-17"></use>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

3
mastodon-light.css → mastodon.css
View File

@ -84,6 +84,9 @@
margin: 0 8px;
color: #fff;
border-radius: 4px;
padding: 0px 16px;
height: 36px;
line-height: 36px;
}
.account__header__tabs__name {
padding: 5px;

5
pixelfed-light.css → pixelfed.css
View File

@ -70,7 +70,6 @@
display: flex;
align-items: flex-start;
padding: 7px 5px;
margin-top: -55px;
}
.account__header__bar .avatar {
display: block;
@ -85,6 +84,10 @@
.account__header__tabs__buttons .button {
margin: 0 8px;
color: #fff;
border-radius: 4px;
padding: 0px 16px;
height: 36px;
line-height: 36px;
}
.account__header__tabs__name {
padding: 5px;