LATEST CLUCCS
+
+
+ 
+
+
+
+
+
+ Tim Wijma
+ @timwijma
+
+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Possimus velit maiores non deserunt adipisci dicta quam nobis ad. Iste, unde?
+
+
+
+ favorite
+ 20
+
+
+ repeat
+ 20
+
+
+ chat_bubble
+ 20
+
+ FILTERED CLUCCS
diff --git a/dashboard_static/js/code.js b/dashboard_static/js/code.js index 6f5074e..2fea0fc 100644 --- a/dashboard_static/js/code.js +++ b/dashboard_static/js/code.js @@ -25,30 +25,30 @@ function getCSSVariable(name) { function tweetCell(tweet, parent) { var cell = document.createElement("div"); cell.innerHTML = - ''+
- '
' +
- '
';
+ `' +
- '
'+
- ''+
- ''+tweet.user.name+' '+
- '@'+tweet.user.screen_name+''+
- '
'+
- ''+tweet.text+''+
- ''+
- '
'+
- ''+
- 'favorite'+
- ''+tweet.favorite_count+''+
- '
'+
- ''+
- 'repeat'+
- ''+tweet.retweet_count+''+
- '
'+
- ''+
- 'chat_bubble'+
- ''+tweet.reply_count+''+
- '
'+
- '
+ 
+
`
parent.append(cell);
}
diff --git a/dashboard_static/style/style.css b/dashboard_static/style/style.css
index 14d15a2..5c3f4af 100644
--- a/dashboard_static/style/style.css
+++ b/dashboard_static/style/style.css
@@ -88,19 +88,43 @@ body {
.tweet {
display: flex;
+ background-color: var(--main-dark);
+ border-radius: 16px;
+ padding: 16px;
}
.tweet-profilepicture {
border-radius: 100%;
+ width: 60px;
+ height: 60px;
+ /* padding: 8px; */
+}
+
+.tweet-content {
+ padding-left: 16px;
}
.tweet-interactions {
display: flex;
+ margin-top: 8px;
}
.tweet-interaction {
display: flex;
align-items: center;
+ margin-right: 32px;
+}
+
+.tweet-interaction .material-symbols-outlined {
+ margin-right: 4px;
+}
+
+.tweet-nickname {
+ font-weight: bold;
+}
+
+.tweet-username {
+ opacity: 0.8;
}
.filters-search input {
+
+
+ ${tweet.user.name}
+ @${tweet.user.screen_name}
+
+ ${tweet.text}
+
+
+
+ favorite
+ ${tweet.favorite_count}
+
+
+ repeat
+ ${tweet.retweet_count}
+
+
+ chat_bubble
+ ${tweet.reply_count}
+
+