mirror of
https://github.com/nicolabs/mastodon-timeline-widget.git
synced 2025-09-07 16:19:12 +02:00
~ merge from i18n_export_all
+ link on images to open them ~ lots of changes in CSS to adopt nicolabs.net style
This commit is contained in:
parent
8abc588a8b
commit
52646c40bd
|
@ -16,9 +16,9 @@ MastodonApi.text = {
|
|||
,spoilerBtnOpened : "隠す"
|
||||
,nsfwLabel : "閲覧注意"
|
||||
,nsfwViewMsg : "クリックして表示"
|
||||
,title : "Toots" // TODO : translate
|
||||
,byAuthor : "by" // TODO : translate
|
||||
,loading : "loading..." // TODO : translate
|
||||
,error : "ERROR" // TODO : translate
|
||||
,viewOn : "View on" // TODO : translate
|
||||
,title : "Latest toots" // TODO : translate
|
||||
,byAuthor : "by" // TODO : translate
|
||||
,loading : "loading..." // TODO : translate
|
||||
,error : "ERROR" // TODO : translate
|
||||
,viewOn : "View on" // TODO : translate
|
||||
};
|
||||
|
|
|
@ -10,37 +10,10 @@
|
|||
|
||||
/* main container >>> */
|
||||
.mastodon-timeline {
|
||||
box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
|
||||
font-family: 'Noto Sans Japanese', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, メイリオ, Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.mt-header,
|
||||
.mt-footer {
|
||||
padding: 10px 10px;
|
||||
}
|
||||
|
||||
.mastodon-timeline a:link,
|
||||
.mastodon-timeline a:active,
|
||||
.mastodon-timeline a {
|
||||
text-decoration: none;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.mt-header {
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid purple;
|
||||
}
|
||||
|
||||
.mt-header h4 {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.mt-body {
|
||||
height: 250px;
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
|
||||
/* force wrap */
|
||||
white-space: pre-wrap; /* css-3 */
|
||||
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
|
||||
|
@ -58,40 +31,17 @@
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.mt-footer {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* toots -messages */
|
||||
.mt-toot {
|
||||
margin: 5px;
|
||||
padding: 5px 5px 5px 65px;
|
||||
padding: 0 0 2em 65px;
|
||||
position: relative;
|
||||
min-height: 60px;
|
||||
}
|
||||
|
||||
.mt-footer,
|
||||
.mt-toot:nth-child(n+2) {
|
||||
border-top: 1px solid purple;
|
||||
}
|
||||
|
||||
.mt-toot p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.mt-date {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.mt-date .nsfw {
|
||||
background: purple;
|
||||
color: white;
|
||||
margin-right: 1em;
|
||||
padding: 0 3px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
|
||||
.mt-avatar {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
|
@ -188,82 +138,4 @@ a.btn-spoiler {
|
|||
left: 5%;
|
||||
}
|
||||
|
||||
/* <<< */
|
||||
|
||||
/* light theme >>> */
|
||||
.mastodon-timeline-light {
|
||||
background: #fafafa;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.mastodon-timeline-light .mt-footer,
|
||||
.mastodon-timeline-light .mt-header {
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.mastodon-timeline-light a:link,
|
||||
.mastodon-timeline-light a:active,
|
||||
.mastodon-timeline-light a {
|
||||
color: #26afff;
|
||||
}
|
||||
|
||||
.mastodon-timeline-light .mt-header {
|
||||
border-bottom-color: lightgrey;
|
||||
}
|
||||
|
||||
.mastodon-timeline-light .mt-footer,
|
||||
.mastodon-timeline-light .mt-toot:nth-child(n+2) {
|
||||
border-top-color: lightgrey;
|
||||
}
|
||||
|
||||
.mastodon-timeline-light .toot-status,
|
||||
.mastodon-timeline-light .mt-date a {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
/* spoiler === */
|
||||
.mastodon-timeline-light a.btn-spoiler {
|
||||
background: #26afff;
|
||||
color: white;
|
||||
}
|
||||
/* <<< */
|
||||
|
||||
/* dark theme >>> */
|
||||
.mastodon-timeline-dark {
|
||||
background: #393f4f;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.mastodon-timeline-dark .mt-footer,
|
||||
.mastodon-timeline-dark .mt-header {
|
||||
background: #313543;
|
||||
}
|
||||
|
||||
.mastodon-timeline-dark a:link,
|
||||
.mastodon-timeline-dark a:active,
|
||||
.mastodon-timeline-dark a {
|
||||
color: #2b90d9;
|
||||
}
|
||||
|
||||
.mastodon-timeline-dark .mt-header {
|
||||
border-bottom-color: #606984;
|
||||
}
|
||||
|
||||
.mastodon-timeline-dark .mt-footer,
|
||||
.mastodon-timeline-dark .mt-toot:nth-child(n+2) {
|
||||
border-top-color: #606984;
|
||||
}
|
||||
|
||||
.mastodon-timeline-dark .toot-status,
|
||||
.mastodon-timeline-dark .mt-date a {
|
||||
color: #606984;
|
||||
}
|
||||
|
||||
/* spoiler === */
|
||||
.mastodon-timeline-dark a.btn-spoiler {
|
||||
background: #687390;
|
||||
color: #393F4F;
|
||||
}
|
||||
/* <<< */
|
||||
|
||||
/* vim set foldmethod=marker foldlevel=0 */
|
||||
|
|
|
@ -132,7 +132,7 @@ MastodonApi.text = {
|
|||
,spoilerBtnOpened : "Show less"
|
||||
,nsfwLabel : "NSFW"
|
||||
,nsfwViewMsg : "Click to view"
|
||||
,title : "Toots"
|
||||
,title : "Latest toots..."
|
||||
,byAuthor : "by"
|
||||
,loading : "loading..."
|
||||
,error : "ERROR"
|
||||
|
@ -146,7 +146,7 @@ MastodonApi.text = {
|
|||
*/
|
||||
MastodonApi.prototype.makeWidget = function() {
|
||||
this.widget.addClass('mastodon-timeline');
|
||||
this.widget.append($('<div class="mt-header"><h4>'+MastodonApi.text.title+'</h4> '+MastodonApi.text.byAuthor+' <span class="user-link"></span></div>'));
|
||||
this.widget.append($('<div class="mt-header"><h4>'+MastodonApi.text.title+'</h4></div>'));
|
||||
this.widget.append($('<div class="mt-body"><div class="mt-loading">'+MastodonApi.text.loading+'</div></div>'));
|
||||
this.widget.append($('<div class="mt-footer"></div>'));
|
||||
};
|
||||
|
@ -394,7 +394,7 @@ MastodonApi.prototype.replaceMedias = function(content, media_, nsfw_) {
|
|||
}
|
||||
else {
|
||||
// pics visible
|
||||
var pic = '<div class="toot-media-preview" style="background-image:url('+media_.preview_url+');"></div>';
|
||||
var pic = '<a href="'+media_.preview_url+'"><div class="toot-media-preview" style="background-image:url('+media_.preview_url+');"></div></a>';
|
||||
}
|
||||
|
||||
return pic;
|
||||
|
|
Loading…
Reference in a new issue