added some bootstrap styling

This commit is contained in:
jem 2020-07-08 09:23:28 +02:00
parent 5f076fccc6
commit 45c5b10d93
2 changed files with 21 additions and 16 deletions

View file

@ -4,12 +4,15 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>masto-embed</title> <title>masto-embed</title>
</head> </head>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<body> <body>
<div id="masto-embed" <div class="container">
account_name="team" <div id="masto-embed"
coment_in_account_id="2" account_name="team"
host_url="https://social.meissa-gmbh.de"> coment_in_account_id="2"
Here the timeline will appear. host_url="https://social.meissa-gmbh.de">
Here the timeline will appear.
</div>
</div> </div>
<script src="js/main.js"></script> <script src="js/main.js"></script>
</body> </body>

View file

@ -32,22 +32,24 @@
(let [{:keys [title description image url]} card] (let [{:keys [title description image url]} card]
[:div {:class "card" :url url} [:div {:class "card" :url url}
(when (some? image) (when (some? image)
[:img {:src image}]) [:img {:class "card-img-top" :src image}])
[:h3 title] [:h3 {:class "card-title"} title]
[:p description]]))) [:p {:class "card-body"} description]])))
(defn masto->html [statuses] (defn masto->html [statuses]
[:ul [:ul {:class "list-group"}
(map (fn [status] (map (fn [status]
(let [{:keys [created_at card]} status (let [{:keys [created_at card]} status
date (t/parse created_at)] date (t/parse created_at)]
[:li [:li {:class "list-group-item, card"}
[:h2 [:div {:class "card-body"}
[:a {:href (get-in status [:account :url])} [:h2 {:class "card-title"}
(t/unparse (t/formatters :date) date) [:a {:href (get-in status [:account :url])}
(t/unparse (t/formatters :hour-minute-second) date)]] (t/unparse (t/formatters :date) date) " "
(:content status) (t/unparse (t/formatters :hour-minute-second) date)]]
(mastocard->html card)])) [:p {:class "card-text"}
(:content status)
(mastocard->html card)]]]))
statuses)]) statuses)])