1 files changed, 479 insertions, 0 deletions
diff --git a/static/style.css b/static/style.css
new file mode 100644
index 0000000..602f2ef
--- /dev/null
+++ b/static/style.css
@@ -0,0 +1,479 @@
+.status-container-container {
+	margin: 12px 0 12px -4px;
+	padding: 4px;
+	border-left: 4px solid transparent;
+}
+
+.status-container-container:target {
+	border-color: #777777;
+}
+
+.status-container-container.highlight {
+	background-color: #cccccc;
+}
+
+.status-container {
+	display: flex;
+}
+
+.status-content {
+	margin: 4px 0;
+	word-wrap: anywhere;
+	max-height: 600px;
+	overflow: auto;
+}
+
+.status-content p {
+	margin: 0px;
+}
+
+.status-content img,
+.status-image,
+.status-video {
+	max-height: 180px;
+	max-width: 220px;
+	width: auto;
+	vertical-align: bottom;
+}
+
+.status-media-container {
+	margin: 4px 0;
+}
+
+.status-profile-img-container {
+	margin-right: 8px;
+}
+
+.status-profile-img {
+	height: 48px;
+	width: 48px;
+	object-fit: contain;
+	vertical-align: top;
+}
+
+.status {
+}
+
+.status a {
+	text-decoration: none;
+}
+
+.status-dname {
+	font-weight: 800;
+}
+
+.status-uname {
+	font-style: italic;
+	font-size: 10pt;
+}
+
+.status-emoji {
+	height: 20px;
+	margin-bottom: -4px;
+	width: auto;
+	vertical-align: unset !important;
+}
+
+.name-emoji {
+	height: 20px;
+	width: auto;
+}
+
+.status-action-container {
+	margin-top: 4px;
+}
+
+.status-action {
+	display: inline-block;
+	min-width: 64px;
+}
+
+.status-action form {
+	display: inline-block;
+}
+
+.status-action:last-child {
+	min-width: unset;
+}
+
+.status-action a {
+	display: inline-block;
+	text-decoration: none;
+	color: #333333;
+}
+
+.status-action a:hover,
+.status-action input:hover {
+	opacity: 0.6;
+}
+
+.status-action a.status-time {
+	width: auto;
+}
+
+.status-reply-count,
+.status-retweet-count,
+.status-like-count {
+	vertical-align: middle;
+}
+
+.page-title {
+	font-size: 23pt;
+}
+
+.post-form {
+	margin: 8px 0;
+}
+
+.post-form>div {
+	margin-bottom: 4px;
+}
+
+.signin-form {
+	margin: 8px 0;
+}
+
+.signin-form input {
+	margin: 4px 0;
+}
+
+.retweet-info {
+	margin: 8px 0 4px 24px;	
+}
+
+.retweet-info .status-profile-img {
+	height: 24px;
+	width: 24px;
+	vertical-align: middle;
+}
+
+.retweet-info .status-dname{
+	margin-left: 4px
+}
+
+.post-content {
+	padding: 4px;
+	font-size: 11pt;
+	font-family: initial;
+	max-width: 100%;
+}
+
+.pagination {
+	margin: 4px;
+}
+
+.pagination a {
+	margin: 0 8px;
+}
+
+.notification-container {
+	margin: 16px 0 16px -4px;
+	padding: 0 4px;
+	border-left: 4px solid transparent;
+}
+
+.notification-container.unread {
+	border-color: #777777;
+}
+
+.notification-follow-container,
+.notification-like-container,
+.notification-retweet-container {
+	display: flex;
+}
+
+.notification-info-text span {
+	vertical-align: middle;
+}
+
+.notification-follow-uname {
+	margin-top: 8px;
+}
+
+.status-reply-to {
+	display: inline-block;
+	vertical-align: center;
+}
+
+.status-reply-to-link {
+	font-size: 10pt
+}
+
+.status-reply-container .fa {
+	font-size: 10pt;
+	vertical-align: sub;
+	margin-right: -2px;
+}
+
+.status-reply-text {
+	font-size: 10pt;
+}
+
+.status-reply {
+	display: inline-block;
+}
+
+.status-reply-link {
+	font-size: 10pt;
+}
+
+.status-reply-info-divider {
+	margin: 0 4px;
+}
+
+.post-content-container {
+	padding-right: 8px;
+}
+
+.error-text {
+	margin: 8px 0;
+}
+
+.post-attachment-div {
+	margin: 2px 0;
+}
+
+.user-profile-img-container {
+	display: inline-block
+}
+
+.user-profile-details-container {
+	display: inline-block;
+	vertical-align: top;
+	margin: 0 4px;
+}
+
+.user-profile-details-container>div {
+	margin-bottom: 4px;
+}
+
+.user-profile-img {
+	max-height: 100px;
+	max-width: 100px;
+	object-fit: contain;
+	vertical-align: top;
+}
+
+.user-profile-decription {
+	margin: 4px 0;
+}
+
+.d-inline {
+	display: inline;
+}
+
+.btn-link {
+    border: none;
+    outline: none;
+    background: none;
+    cursor: pointer;
+    color: #0000EE;
+    padding: 0;
+    text-decoration: underline;
+    font-family: inherit;
+    font-size: inherit;
+}
+
+.status-visibility {
+	margin-left: 4px;
+	display: inline-block;
+	color: #444444;
+}
+
+.status-visibility span {
+	font-size: 9pt;
+	vertical-align: bottom;
+}
+
+.remote-link {
+	margin-left: 4px;
+	display: inline-block;
+	color: #444444;
+	text-decoration: none;
+}
+
+.remote-link span {
+	font-size: 9pt;
+	vertical-align: bottom;
+}
+
+.img-link {
+	display: inline-block;
+	position: relative;
+	margin: 2.5px 0;
+}
+
+.status-profile-img-container .img-link {
+	width: 48px;
+	overflow: hidden;
+}
+
+.status-nsfw-overlay {
+	height: 100%;
+	width: 100%;
+	background: black;
+	position: absolute;
+	top: 0;
+	left: 0;
+}
+
+.img-link:hover .status-nsfw-overlay {
+	display: none;
+}
+
+.status-video-container {
+	display: inline-block;
+	position: relative;
+}
+
+.status-video-container:hover .status-nsfw-overlay {
+	display: none;
+}
+
+.post-form-field>* {
+  vertical-align: middle;
+}
+
+.emoji {
+	min-width: 220px;
+	display: inline-block;
+	margin-bottom: 2px;
+}
+
+.emoji-img {
+	height: 24px;
+	width: 24px;
+	object-fit: contain;
+	vertical-align: middle;
+
+}
+
+.emoji-shortcode {
+	vertical-align: middle;
+	display: inline-block;
+}
+
+.post-form-emoji-link {
+	margin-left: 4px;
+}
+
+.post-form-emoji-link i {
+	font-size: 14pt !important;
+}
+
+.post-form-title {
+	vertical-align: middle;
+}
+
+.user-info {
+	margin-bottom: 8px;
+	display: flex;
+	align-items: top;
+}
+
+.user-info-img {
+	max-height: 64px;
+	max-width: 64px;
+	object-fit: contain;
+	vertical-align: middle;
+}
+
+.user-info-details-container {
+	margin-left: 8px;
+}
+
+.user-info-details-container>div {
+	margin-bottom: 4px;
+}
+
+.nav-link {
+	margin-right: 2px;
+}
+
+.user-list-container {
+	margin: 8px 0;
+}
+
+.user-list-item a {
+	text-decoration: none;
+}
+
+.user-list-item>div {
+	display: inline-block;
+	vertical-align: top;
+	margin: 0 4px 8px 0;
+}
+
+#settings-form {
+	margin: 8px 0;
+}
+
+.settings-form-field {
+	margin: 4px 0;
+}
+
+.settings-form-field * {
+	vertical-align: middle;
+}
+
+#settings-form button[type=submit] {
+	margin-top: 8px;
+}
+
+.icon {
+	height: 16px;
+	vertical-align: middle;
+}
+
+.icon.post-emoji {
+	height: 20px;
+}
+
+#reply-popup {
+	position: absolute;
+	background: #ffffff;
+	border: 1px solid #aaaaaa;
+	padding: 4px 8px;
+	z-index: 3;
+	margin: 0 8px 0 8px;
+}
+
+#reply-to-popup {
+	position: absolute;
+	background: #ffffff;
+	border: 1px solid #aaaaaa;
+	padding: 4px 8px;
+	z-index: 3;
+	margin: 0 8px 0 8px;
+}
+
+.dark {
+	background-color: #222222;
+	background-image: none;
+	color: #eaeaea;
+}
+
+.dark a {
+	color: #81a2be;
+}
+
+.dark .status-action a {
+	color: #999999;
+}
+
+.dark #post-content {
+	background-color: #333333;
+	border: 1px solid #444444;
+	color: #eaeaea;
+}
+
+.dark #reply-popup,
+.dark #reply-to-popup {
+	background-color: #222222;
+	border-color: #444444;
+}
+
+.dark .status-container-container.highlight {
+	background-color: #333333;
+}
+