A Microblog in Plain HTML
+ +
+
+
+
+
+
diff --git a/timeline-generic.css b/timeline-generic.css
new file mode 100644
index 0000000..6fef8ba
--- /dev/null
+++ b/timeline-generic.css
@@ -0,0 +1,85 @@
+.column {
+ float: left;
+ width: 30%;
+ background-color: #1a1a1a;
+}
+.timeline {
+ float: right;
+ width: 67%;
+ background-color: #1a1a1a;
+}
+.postcell {
+ border: 1px solid gray;
+ text-align: left;
+ margin: 0.25em 0
+}
+.message {
+ margin: 1em 1em 1em 3em;
+ white-space: pre-wrap;
+ word-wrap: break-word;
+}
+.reply {
+ margin: 0.5em
+}
+.timestamp {
+ text-align: right;
+ margin: 0.5em
+}
+.hashtag {
+ font-weight: bold;
+}
+.profile {
+ vertical-align: middle;
+ padding-left: 10px;
+}
+.avatar {
+ vertical-align: middle;
+ width: 50px;
+ height: 50px;
+}
+.handle{
+ font-size: large;
+ font-weight: bold;
+}
+.email{
+ text-align:left;
+ font-size: x-small;
+ text-decoration:none;
+}
+.bio {
+ vertical-align: middle;
+ font-size: small;
+ margin: 1em
+}
+.gallery {
+ margin-left: auto ;
+ margin-right: auto ;
+ display: flex;
+ align-items: center;
+ max-width: 100%;
+}
+.header {
+ background: black;
+ color: white;
+ font-size: large;
+ font-weight: bold;
+ padding: 0.5em;
+}
+div.panel {
+ margin: 2px;
+ /* border: 1px solid #ffbc06; */
+ width: auto
+}
+
+div.panel:hover {
+ border: 1px solid #777;
+}
+
+div.panel img {
+ width: 100%;
+ height: 100%;
+}
+
+div.panel img:hover {
+ filter: invert(100%);
+}
+%s
+
+
+