diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml
index ec73d9b..868bbf9 100644
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -1,11 +1,11 @@
-image: alpine:latest
-
-pages:
- stage: deploy
- script:
- - echo 'Nothing to do...'
- artifacts:
- paths:
- - public
- only:
- - master
+image: alpine:latest
+
+pages:
+ stage: deploy
+ script:
+ - echo 'Nothing to do...'
+ artifacts:
+ paths:
+ - public
+ only:
+ - master
diff --git a/README.md b/README.md
index 26580f7..0d4f9b1 100644
--- a/README.md
+++ b/README.md
@@ -1,19 +1,19 @@
-# Mastodon embed timeline
-
-Embed a mastodon feed timeine in your page, with just html, css and js.
-
-Working version running at:
-https://www.idotj.com
-
-## User guide
-
-
-## Licensing
-
-
-## Improve me
-
-Feel free to add a chaching layer, improve the styles and add more features.
-
-
-
+# Mastodon embed timeline
+
+Embed a mastodon feed timeine in your page, with just html, css and js.
+
+Working version running at:
+https://www.idotj.com
+
+## User guide
+
+
+## Licensing
+
+
+## Improve me
+
+Feel free to add a chaching layer, improve the styles and add more features.
+
+
+
diff --git a/src/index.html b/src/index.html
index f6f25e6..e66dddf 100644
--- a/src/index.html
+++ b/src/index.html
@@ -1,52 +1,52 @@
-
-
-
-
- Mastodon timeline
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+ Mastodon timeline
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/mastodon-timeline.css b/src/mastodon-timeline.css
index f5da693..1487ed4 100644
--- a/src/mastodon-timeline.css
+++ b/src/mastodon-timeline.css
@@ -1,165 +1,164 @@
-/* Mastodon embed timeline */
-/* main container */
-.mt-timeline {
- height: calc(100% - 4rem);
- padding: 2rem 3rem;
- position: relative;
- background: lightgray;
-}
-
-.mt-timeline a:link,
-.mt-timeline a:active,
-.mt-timeline a {
- text-decoration: none;
- color: darkblue;
-}
-
-.mt-body {
- height: 100%;
- overflow-y: auto;
- white-space: pre-wrap;
- word-wrap: break-word;
-}
-
-.mt-body .invisible {
- display: none;
-}
-
-/* toots messages */
-.mt-toot {
- margin: 0 0.5rem 0 0;
- padding: 1rem 0 2rem 65px;
- position: relative;
- min-height: 60px;
- background-color: transparent;
- border-bottom: 1px solid #dee2e6;
-}
-
-.mt-toot:hover {
- cursor: pointer;
- background-color: rgba(124, 124, 124, 0.2);
-}
-
-.mt-toot p:last-child {
- margin-bottom: 0;
-}
-
-.mt-user {
- display: table;
- font-weight: 600;
-}
-
-.mt-avatar {
- position: absolute;
- top: 20px;
- left: 5px;
- width: 50px;
- height: 50px;
- background-color: transparent;
- background-repeat: no-repeat;
- background-position: 50% 50%;
- background-size: contain;
- background-color: #fff;
- border-radius: 5px;
-}
-
-.mt-avatar-boosted {
- width: 40px;
- height: 40px;
-}
-
-.mt-avatar-booster {
- width: 25px;
- height: 25px;
- top: 25px;
- left: 25px;
-}
-
-.toot-text {
- margin-bottom: 0.25rem;
-}
-
-.mt-error {
- color: darkred;
- background: lightpink;
- margin: 5px;
- padding: 10px;
-}
-
-/* poll */
-.toot-poll {
- margin-bottom: 0.25rem;
-}
-.toot-poll ul{
- list-style: none;
- padding: 0;
- margin: 0;
-}
-.toot-poll ul li:not(:last-child){
- margin-bottom: 0.25rem;
-}
-.toot-poll ul li:before {
- content: "◯";
- padding-right: 0.5rem;
-}
-
-/* medias */
-.toot-media {
- overflow: hidden;
- margin-bottom: 0.25rem;
-}
-.toot-media-preview {
- position: relative;
- margin-top: 0.25rem;
- height: auto;
- text-align: center;
- width: 100%;
-}
-.toot-media-spoiler > img {
- filter: blur(2rem);
-}
-.toot-media-preview a {
- display: block;
- position: absolute;
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
-}
-.img-ratio14_7 {
-position: relative;
-padding-top: 48.95%; /* 14:7 */
-width: 100%;
-}
-.img-ratio14_7 > img {
-width: 100%;
-height: auto;
-position: absolute;
-top: 50%;
-left: 50%;
-transform: translate(-50%, -50%);
-text-align: center;
-}
-
-/* date */
-.toot-date {
- font-size: 0.75rem;
- opacity: 0.5;
-}
-
-/* loading-spinner */
-.loading-spinner {
- height: 100%;
- background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns:svg='http://www.w3.org/2000/svg' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.0' viewBox='0 0 128 128' %3E%3Cg%3E%3Cpath d='M64 128A64 64 0 0 1 18.34 19.16L21.16 22a60 60 0 1 0 52.8-17.17l.62-3.95A64 64 0 0 1 64 128z' fill='%23404040'/%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 64 64' to='360 64 64' dur='1000ms' repeatCount='indefinite'%3E%3C/animateTransform%3E%3C/g%3E%3C/svg%3E");
- background-repeat: no-repeat;
- background-position: center center;
- background-color: transparent;
- background-size: min(2.5rem, calc(100% - 0.5rem));
-}
-
-/* see more btn */
-.mt-seeMore{
- margin: 2rem auto;
- padding: 0 2rem;
- text-align: center;
-}
+/* Mastodon embed timeline */
+/* Main container */
+.mt-timeline {
+ height: calc(100% - 4rem);
+ padding: 2rem 3rem;
+ position: relative;
+ background: lightgray;
+}
+
+.mt-timeline a:link,
+.mt-timeline a:active,
+.mt-timeline a {
+ text-decoration: none;
+ color: darkblue;
+}
+
+.mt-body {
+ height: 100%;
+ overflow-y: auto;
+ white-space: pre-wrap;
+ word-wrap: break-word;
+}
+
+.mt-body .invisible {
+ display: none;
+}
+
+/* Toot container */
+.mt-toot {
+ margin: 0 0.5rem 0 0;
+ padding: 1rem 0 2rem 65px;
+ position: relative;
+ min-height: 60px;
+ background-color: transparent;
+ border-bottom: 1px solid #dee2e6;
+}
+.mt-toot:hover {
+ cursor: pointer;
+ background-color: rgba(124, 124, 124, 0.2);
+}
+.mt-toot p:last-child {
+ margin-bottom: 0;
+}
+
+/* User icon */
+.mt-user {
+ display: table;
+ font-weight: 600;
+}
+.mt-avatar {
+ position: absolute;
+ top: 20px;
+ left: 5px;
+ width: 50px;
+ height: 50px;
+ background-color: transparent;
+ background-repeat: no-repeat;
+ background-position: 50% 50%;
+ background-size: contain;
+ background-color: #fff;
+ border-radius: 5px;
+}
+.mt-avatar-boosted {
+ width: 40px;
+ height: 40px;
+}
+.mt-avatar-booster {
+ width: 25px;
+ height: 25px;
+ top: 25px;
+ left: 25px;
+}
+
+/* Message */
+.toot-text {
+ margin-bottom: 0.25rem;
+}
+.toot-text .ellipsis::after{
+ content:'...';
+}
+.mt-error {
+ color: darkred;
+ background: lightpink;
+ margin: 5px;
+ padding: 10px;
+}
+
+/* Poll */
+.toot-poll {
+ margin-bottom: 0.25rem;
+}
+.toot-poll ul{
+ list-style: none;
+ padding: 0;
+ margin: 0;
+}
+.toot-poll ul li:not(:last-child){
+ margin-bottom: 0.25rem;
+}
+.toot-poll ul li:before {
+ content: "◯";
+ padding-right: 0.5rem;
+}
+
+/* Medias */
+.toot-media {
+ overflow: hidden;
+ margin-bottom: 0.25rem;
+}
+.toot-media-preview {
+ position: relative;
+ margin-top: 0.25rem;
+ height: auto;
+ text-align: center;
+ width: 100%;
+}
+.toot-media-spoiler > img {
+ filter: blur(2rem);
+}
+.toot-media-preview a {
+ display: block;
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+}
+.img-ratio14_7 {
+position: relative;
+padding-top: 48.95%; /* 14:7 */
+width: 100%;
+}
+.img-ratio14_7 > img {
+width: 100%;
+height: auto;
+position: absolute;
+top: 50%;
+left: 50%;
+transform: translate(-50%, -50%);
+text-align: center;
+}
+
+/* Date */
+.toot-date {
+ font-size: 0.75rem;
+ opacity: 0.5;
+}
+
+/* Loading-spinner */
+.loading-spinner {
+ height: 100%;
+ background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns:svg='http://www.w3.org/2000/svg' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.0' viewBox='0 0 128 128' %3E%3Cg%3E%3Cpath d='M64 128A64 64 0 0 1 18.34 19.16L21.16 22a60 60 0 1 0 52.8-17.17l.62-3.95A64 64 0 0 1 64 128z' fill='%23404040'/%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 64 64' to='360 64 64' dur='1000ms' repeatCount='indefinite'%3E%3C/animateTransform%3E%3C/g%3E%3C/svg%3E");
+ background-repeat: no-repeat;
+ background-position: center center;
+ background-color: transparent;
+ background-size: min(2.5rem, calc(100% - 0.5rem));
+}
+
+/* See more btn */
+.mt-seeMore{
+ margin: 2rem auto;
+ padding: 0 2rem;
+ text-align: center;
+}
diff --git a/src/mastodon-timeline.js b/src/mastodon-timeline.js
index 31275d5..73edd1e 100644
--- a/src/mastodon-timeline.js
+++ b/src/mastodon-timeline.js
@@ -20,7 +20,6 @@ let MastodonApi = function (params_) {
// Endpoint access settings
this.INSTANCE_URI = params_.instance_uri;
- this.ACCESS_TOKEN = params_.access_token;
this.ACCOUNT_ID = params_.account_id;
this.PROFILE_NAME = params_.profile_name;
this.TOOTS_LIMIT = params_.toots_limit || 20;
@@ -71,6 +70,7 @@ MastodonApi.prototype.getToots = function () {
let allHashtags = document.querySelectorAll("#mt-timeline .hashtag");
for(let j=0; j