diff --git a/app/javascript/fonts/premillenium/MSSansSerif.ttf b/app/javascript/fonts/premillenium/MSSansSerif.ttf
new file mode 100644
index 000000000..3afd76ff2
Binary files /dev/null and b/app/javascript/fonts/premillenium/MSSansSerif.ttf differ
diff --git a/app/javascript/images/alert_badge.png b/app/javascript/images/alert_badge.png
new file mode 100644
index 000000000..681f6e651
Binary files /dev/null and b/app/javascript/images/alert_badge.png differ
diff --git a/app/javascript/images/clippy_frame.png b/app/javascript/images/clippy_frame.png
new file mode 100644
index 000000000..7f2cd6a59
Binary files /dev/null and b/app/javascript/images/clippy_frame.png differ
diff --git a/app/javascript/images/clippy_wave.gif b/app/javascript/images/clippy_wave.gif
new file mode 100644
index 000000000..4d2e38a3d
Binary files /dev/null and b/app/javascript/images/clippy_wave.gif differ
diff --git a/app/javascript/images/elephant-fren.png b/app/javascript/images/elephant-fren.png
index 38b1e3cba..3b64edf08 100644
Binary files a/app/javascript/images/elephant-fren.png and b/app/javascript/images/elephant-fren.png differ
diff --git a/app/javascript/images/icon_about.png b/app/javascript/images/icon_about.png
new file mode 100644
index 000000000..08b76dcd9
Binary files /dev/null and b/app/javascript/images/icon_about.png differ
diff --git a/app/javascript/images/icon_blocks.png b/app/javascript/images/icon_blocks.png
new file mode 100644
index 000000000..8b1490875
Binary files /dev/null and b/app/javascript/images/icon_blocks.png differ
diff --git a/app/javascript/images/icon_direct.png b/app/javascript/images/icon_direct.png
new file mode 100644
index 000000000..71e898a98
Binary files /dev/null and b/app/javascript/images/icon_direct.png differ
diff --git a/app/javascript/images/icon_docs.png b/app/javascript/images/icon_docs.png
new file mode 100644
index 000000000..6af1c8268
Binary files /dev/null and b/app/javascript/images/icon_docs.png differ
diff --git a/app/javascript/images/icon_domain_blocks.png b/app/javascript/images/icon_domain_blocks.png
new file mode 100644
index 000000000..ed3750485
Binary files /dev/null and b/app/javascript/images/icon_domain_blocks.png differ
diff --git a/app/javascript/images/icon_follow_requests.png b/app/javascript/images/icon_follow_requests.png
new file mode 100644
index 000000000..4123e2a69
Binary files /dev/null and b/app/javascript/images/icon_follow_requests.png differ
diff --git a/app/javascript/images/icon_home.png b/app/javascript/images/icon_home.png
new file mode 100644
index 000000000..66ce779c0
Binary files /dev/null and b/app/javascript/images/icon_home.png differ
diff --git a/app/javascript/images/icon_invite.png b/app/javascript/images/icon_invite.png
new file mode 100644
index 000000000..21156ec96
Binary files /dev/null and b/app/javascript/images/icon_invite.png differ
diff --git a/app/javascript/images/icon_keyboard_shortcuts.png b/app/javascript/images/icon_keyboard_shortcuts.png
new file mode 100644
index 000000000..d66f3939e
Binary files /dev/null and b/app/javascript/images/icon_keyboard_shortcuts.png differ
diff --git a/app/javascript/images/icon_likes.png b/app/javascript/images/icon_likes.png
new file mode 100644
index 000000000..17d7a9c59
Binary files /dev/null and b/app/javascript/images/icon_likes.png differ
diff --git a/app/javascript/images/icon_lists.png b/app/javascript/images/icon_lists.png
new file mode 100644
index 000000000..3828946e8
Binary files /dev/null and b/app/javascript/images/icon_lists.png differ
diff --git a/app/javascript/images/icon_local.png b/app/javascript/images/icon_local.png
new file mode 100644
index 000000000..5f82df395
Binary files /dev/null and b/app/javascript/images/icon_local.png differ
diff --git a/app/javascript/images/icon_logout.png b/app/javascript/images/icon_logout.png
new file mode 100644
index 000000000..7ff806f58
Binary files /dev/null and b/app/javascript/images/icon_logout.png differ
diff --git a/app/javascript/images/icon_mutes.png b/app/javascript/images/icon_mutes.png
new file mode 100644
index 000000000..c2225e966
Binary files /dev/null and b/app/javascript/images/icon_mutes.png differ
diff --git a/app/javascript/images/icon_notifications.png b/app/javascript/images/icon_notifications.png
new file mode 100644
index 000000000..0aaf5e68d
Binary files /dev/null and b/app/javascript/images/icon_notifications.png differ
diff --git a/app/javascript/images/icon_pin.png b/app/javascript/images/icon_pin.png
new file mode 100644
index 000000000..2329d8c54
Binary files /dev/null and b/app/javascript/images/icon_pin.png differ
diff --git a/app/javascript/images/icon_public.png b/app/javascript/images/icon_public.png
new file mode 100644
index 000000000..3c09460db
Binary files /dev/null and b/app/javascript/images/icon_public.png differ
diff --git a/app/javascript/images/icon_settings.png b/app/javascript/images/icon_settings.png
new file mode 100644
index 000000000..07f5c4519
Binary files /dev/null and b/app/javascript/images/icon_settings.png differ
diff --git a/app/javascript/images/icon_tos.png b/app/javascript/images/icon_tos.png
new file mode 100644
index 000000000..d0dbb13f7
Binary files /dev/null and b/app/javascript/images/icon_tos.png differ
diff --git a/app/javascript/images/mailer/icon_cached.png b/app/javascript/images/mailer/icon_cached.png
index 5c993dbee..210833d34 100644
Binary files a/app/javascript/images/mailer/icon_cached.png and b/app/javascript/images/mailer/icon_cached.png differ
diff --git a/app/javascript/images/mailer/icon_done.png b/app/javascript/images/mailer/icon_done.png
index f7f95a0e8..0d2ef0cb8 100644
Binary files a/app/javascript/images/mailer/icon_done.png and b/app/javascript/images/mailer/icon_done.png differ
diff --git a/app/javascript/images/mailer/icon_email.png b/app/javascript/images/mailer/icon_email.png
index 13967009a..aae9d2bb9 100644
Binary files a/app/javascript/images/mailer/icon_email.png and b/app/javascript/images/mailer/icon_email.png differ
diff --git a/app/javascript/images/mailer/icon_file_download.png b/app/javascript/images/mailer/icon_file_download.png
index 3f7ac429b..8a6a8673b 100644
Binary files a/app/javascript/images/mailer/icon_file_download.png and b/app/javascript/images/mailer/icon_file_download.png differ
diff --git a/app/javascript/images/mailer/icon_grade.png b/app/javascript/images/mailer/icon_grade.png
index 8c212b7ee..895b57d0a 100644
Binary files a/app/javascript/images/mailer/icon_grade.png and b/app/javascript/images/mailer/icon_grade.png differ
diff --git a/app/javascript/images/mailer/icon_lock_open.png b/app/javascript/images/mailer/icon_lock_open.png
index c854c3bdb..9f62eadc2 100644
Binary files a/app/javascript/images/mailer/icon_lock_open.png and b/app/javascript/images/mailer/icon_lock_open.png differ
diff --git a/app/javascript/images/mailer/icon_person_add.png b/app/javascript/images/mailer/icon_person_add.png
index 6290a42ae..3453060ae 100644
Binary files a/app/javascript/images/mailer/icon_person_add.png and b/app/javascript/images/mailer/icon_person_add.png differ
diff --git a/app/javascript/images/mailer/icon_reply.png b/app/javascript/images/mailer/icon_reply.png
index a70093356..8bce4955c 100644
Binary files a/app/javascript/images/mailer/icon_reply.png and b/app/javascript/images/mailer/icon_reply.png differ
diff --git a/app/javascript/images/mailer/logo_full.png b/app/javascript/images/mailer/logo_full.png
index 82d981fc6..1c4f33287 100644
Binary files a/app/javascript/images/mailer/logo_full.png and b/app/javascript/images/mailer/logo_full.png differ
diff --git a/app/javascript/images/mailer/logo_transparent.png b/app/javascript/images/mailer/logo_transparent.png
index 6dbcc2e8d..8fda4f67f 100644
Binary files a/app/javascript/images/mailer/logo_transparent.png and b/app/javascript/images/mailer/logo_transparent.png differ
diff --git a/app/javascript/images/reticle.png b/app/javascript/images/reticle.png
index 41a5d1c3a..998994f5c 100644
Binary files a/app/javascript/images/reticle.png and b/app/javascript/images/reticle.png differ
diff --git a/app/javascript/images/start.png b/app/javascript/images/start.png
new file mode 100644
index 000000000..7843455b6
Binary files /dev/null and b/app/javascript/images/start.png differ
diff --git a/app/javascript/images/void.png b/app/javascript/images/void.png
index d73066688..10b274f18 100644
Binary files a/app/javascript/images/void.png and b/app/javascript/images/void.png differ
diff --git a/app/javascript/styles/win95.scss b/app/javascript/styles/win95.scss
new file mode 100644
index 000000000..b0b308920
--- /dev/null
+++ b/app/javascript/styles/win95.scss
@@ -0,0 +1,2086 @@
+$win95-bg: #bfbfbf;
+$win95-dark-grey: #404040;
+$win95-mid-grey: #808080;
+$win95-window-header: #00007f;
+$win95-tooltip-yellow: #ffffcc;
+$win95-blue: blue;
+$win95-cyan: #008080;
+
+$ui-base-lighter-color: $win95-dark-grey;
+$ui-highlight-color: $win95-window-header;
+
+@mixin win95-border-outset() {
+ border-left: 2px solid #efefef;
+ border-top: 2px solid #efefef;
+ border-right: 2px solid #404040;
+ border-bottom: 2px solid #404040;
+ border-radius:0px;
+}
+
+@mixin win95-outset() {
+ box-shadow: inset -1px -1px 0px #000000,
+ inset 1px 1px 0px #ffffff,
+ inset -2px -2px 0px #808080,
+ inset 2px 2px 0px #dfdfdf;
+ border-radius:0px;
+}
+
+@mixin win95-border-inset() {
+ border-left: 2px solid #404040;
+ border-top: 2px solid #404040;
+ border-right: 2px solid #efefef;
+ border-bottom: 2px solid #efefef;
+ border-radius:0px;
+}
+
+@mixin win95-border-slight-inset() {
+ border-left: 1px solid #404040;
+ border-top: 1px solid #404040;
+ border-right: 1px solid #efefef;
+ border-bottom: 1px solid #efefef;
+ border-radius:0px;
+}
+
+@mixin win95-inset() {
+ box-shadow: inset 1px 1px 0px #000000,
+ inset -1px -1px 0px #ffffff,
+ inset 2px 2px 0px #808080,
+ inset -2px -2px 0px #dfdfdf;
+ border-width:0px;
+ border-radius:0px;
+}
+
+
+@mixin win95-tab() {
+ box-shadow: inset -1px 0px 0px #000000,
+ inset 1px 0px 0px #ffffff,
+ inset 0px 1px 0px #ffffff,
+ inset 0px 2px 0px #dfdfdf,
+ inset -2px 0px 0px #808080,
+ inset 2px 0px 0px #dfdfdf;
+ border-radius:0px;
+ border-top-left-radius: 1px;
+ border-top-right-radius: 1px;
+}
+
+@mixin win95-reset() {
+ box-shadow: unset;
+}
+
+@font-face {
+ font-family:"premillenium";
+ src: url('../fonts/premillenium/MSSansSerif.ttf') format('truetype');
+}
+
+@import 'cybre-base';
+
+
+body {
+ font-size:13px;
+ font-family: "MS Sans Serif", "premillenium", sans-serif;
+ color:black;
+}
+
+.ui,
+.ui .columns-area,
+body.admin {
+ background: #008080;
+}
+
+.loading-bar {
+ height:5px;
+ background-color: #000080;
+}
+
+.tabs-bar {
+ background: $win95-bg;
+ @include win95-outset()
+ height: 30px;
+}
+
+.tabs-bar__link {
+ color:black;
+ border:2px outset $win95-bg;
+ border-top-width: 1px;
+ border-left-width: 1px;
+ margin:2px;
+ padding:3px;
+}
+
+.tabs-bar__link.active {
+ @include win95-inset();
+ color:black;
+}
+
+.tabs-bar__link:last-child::before {
+ content:"Start";
+ color:black;
+ font-weight:bold;
+ font-size:15px;
+ width:80%;
+ display:block;
+ position:absolute;
+ right:0px;
+}
+
+.tabs-bar__link:last-child {
+ position:relative;
+ flex-basis:60px !important;
+ font-size:0px;
+ color:$win95-bg;
+
+ background-image: url("../images/start.png");
+ background-repeat:no-repeat;
+ background-position:8%;
+ background-clip:padding-box;
+ background-size:auto 50%;
+}
+
+.drawer .drawer__inner {
+ overflow: visible;
+ height:inherit;
+ background:$win95-bg;
+}
+
+.drawer:after {
+ display:block;
+ content: " ";
+
+ position:absolute;
+ bottom:15px;
+ left:15px;
+ width:132px;
+ height:117px;
+ background-image:url("../images/clippy_wave.gif"), url("../images/clippy_frame.png");
+ background-repeat:no-repeat;
+ background-position: 4px 20px, 0px 0px;
+ z-index:0;
+}
+
+.drawer__pager {
+ overflow-y:auto;
+}
+
+.privacy-dropdown__dropdown {
+ z-index:2;
+}
+
+.column {
+ max-height:100vh;
+}
+
+.column > .scrollable {
+ background: $win95-bg;
+ @include win95-border-outset()
+ border-top-width:0px;
+}
+
+.column-header__wrapper {
+ color:white;
+ font-weight:bold;
+ background:#7f7f7f;
+}
+
+.column-header {
+ padding:0px;
+ font-size:13px;
+ background:#7f7f7f;
+ @include win95-border-outset()
+ border-bottom-width:0px;
+ color:white;
+ font-weight:bold;
+ align-items:baseline;
+ min-height: 24px;
+}
+
+.column-header > button {
+ padding: 0px;
+ min-height: 22px;
+}
+
+.column-header__wrapper.active {
+ background:$win95-window-header;
+}
+
+.column-header__wrapper.active::before {
+ display:none;
+}
+.column-header.active {
+ box-shadow:unset;
+ background:$win95-window-header;
+}
+
+.column-header.active .column-header__icon {
+ color:white;
+}
+
+.column-header__buttons {
+ max-height: 20px;
+ margin: 2px;
+ margin-left: -2px;
+}
+
+.column-header__buttons button {
+ margin-left: 2px;
+}
+
+.column-header__button {
+ background: $win95-bg;
+ color: black;
+ @include win95-outset()
+
+ line-height:0px;
+ font-size:14px;
+ padding:0px 4px;
+
+ &:hover {
+ color: black;
+ }
+}
+
+.column-header__button.active, .column-header__button.active:hover {
+ @include win95-inset();
+ background-color:#7f7f7f;
+}
+
+// selectivity -- needs to override .column-header > button
+.column-header .column-header__back-button {
+ background: $win95-bg;
+ color: black;
+ padding:2px;
+ padding-right: 4px;
+ max-height: 20px;
+ min-height: unset;
+ margin: 2px;
+ @include win95-outset()
+ font-size: 13px;
+ line-height: 17px;
+ font-weight:bold;
+}
+
+.column-header__buttons .column-header__back-button {
+ margin: 0;
+}
+
+.column-back-button {
+ background:$win95-bg;
+ color:black;
+ @include win95-outset()
+ font-size:13px;
+ font-weight:bold;
+
+ padding: 2px;
+ height: 26px;
+}
+
+.column-back-button--slim-button {
+ position:absolute;
+ top:-22px;
+ right:4px;
+ max-height:20px;
+ padding: 1px 6px 0 2px;
+ box-sizing: border-box;
+}
+
+.column-back-button__icon {
+ font-size:11px;
+ margin-top:-3px;
+}
+
+.column-header__collapsible {
+ border-left:2px outset $win95-bg;
+ border-right:2px outset $win95-bg;
+}
+
+.column-header__collapsible-inner {
+ background:$win95-bg;
+ color:black;
+}
+
+.column-header__collapsible__extra {
+ color:black;
+}
+
+.column-header__collapsible__extra div[role="group"] {
+ border: 2px groove #eee;
+ margin-bottom: 11px;
+ padding: 4px;
+}
+
+.column-inline-form {
+ background-color: $win95-bg;
+ @include win95-border-outset();
+ border-bottom-width:0px;
+ border-top-width:0px;
+
+ align-items: baseline;
+}
+
+.column-inline-form .icon-button {
+ font-size: 14px!important;
+ line-height: 17px!important;
+}
+
+.column-inline-form .setting-text {
+ line-height: 17px;
+ padding-left: 4px;
+}
+
+.column-settings__section {
+ color:black;
+ font-weight:bold;
+ font-size:11px;
+}
+
+[role="group"] .column-settings__section {
+ display:inline-block;
+ background-color:$win95-bg;
+ position:relative;
+
+ top: -14px;
+ top: calc(-1em - 0.5ex);
+ left: 4px;
+
+ padding: 0px 4px;
+ margin-bottom: 0px;
+}
+
+.setting-meta__label, .setting-toggle__label {
+ color:black;
+ font-weight:normal;
+}
+
+.setting-meta__label span:before {
+ content:"(";
+}
+.setting-meta__label span:after {
+ content:")";
+}
+
+.setting-toggle {
+ line-height:13px;
+}
+
+.react-toggle .react-toggle-track {
+ border-radius:0px;
+ background-color:white;
+ @include win95-border-inset();
+
+ width:12px;
+ height:12px;
+}
+
+.react-toggle:hover:not(.react-toggle--disabled) .react-toggle-track {
+ background-color:white;
+}
+
+.react-toggle .react-toggle-track-check {
+ left:2px;
+ transition:unset;
+}
+
+.react-toggle .react-toggle-track-check svg path {
+ fill: black;
+}
+
+.react-toggle .react-toggle-track-x {
+ display:none;
+}
+
+.react-toggle .react-toggle-thumb {
+ border-radius:0px;
+ display:none;
+}
+
+.text-btn {
+ background-color:$win95-bg;
+ @include win95-outset()
+ padding:4px;
+}
+
+.text-btn:hover {
+ text-decoration:none;
+ color:black;
+}
+
+.text-btn:active {
+ @include win95-inset();
+}
+
+.setting-text {
+ color:black;
+ background-color:white;
+ @include win95-inset();
+ font-size:13px;
+ padding:2px;
+}
+
+.setting-text:active, .setting-text:focus,
+.setting-text.light:active, .setting-text.light:focus {
+ color:black;
+ border-bottom:2px inset $win95-bg;
+}
+
+.column-header__setting-arrows .column-header__setting-btn {
+ padding:3px 10px;
+}
+
+.column-header__setting-arrows .column-header__setting-btn:last-child {
+ padding:3px 10px;
+}
+
+.missing-indicator {
+ background-color:$win95-bg;
+ color:black;
+ @include win95-outset()
+}
+
+.missing-indicator > div {
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAYAAAA7bUf6AAAACXBIWXMAAC4jAAAuIwF4pT92AAAAF3pUWHRUaXRsZQAACJnLyy9Jyy/NSwEAD5IDblIFOhoAAAAXelRYdEF1dGhvcgAACJlLzijKz0vMAQALmgLoDsFj8gAAAQpJREFUOMuVlD0OwjAMhd2oQl04Axfo0IGBgYELcAY6cqQuSO0ZOEAZGBg6VKg74gwsEaoESRVHjusI8aQqzY8/PbtOEz1qkFSn2YevlaNOpLMJh2DwvixhuXtOa6/LCh51DUMEFkAsgAZD207Doin8mQ562JpRE5CHBAAhmIqD1L8AqzUUUJkxc6kr3AgAJ+NuvIWRdk7WcrKl0AUqcIBBHOiEbpS4m27mIL5Onfg3k0rgggeQuS2sDOGSahKR+glgqaGLgUJs951NN1q9D72cQqQWR9cr3sm9YcEssEuz6eEuZh2bu0aSOhQ1MBezu2O/+TVSvEFII3qLsZWrSA2AAUQIh1HpyP/kC++zjVSMj6ntAAAAAElFTkSuQmCC')
+ no-repeat;
+ background-position:center center;
+}
+
+.empty-column-indicator,
+.error-column {
+ background: $win95-bg;
+ color: black;
+}
+
+.status__wrapper {
+ border: 2px groove $win95-bg;
+ margin:4px;
+}
+
+.status {
+ @include win95-border-slight-inset();
+ background-color:white;
+ margin:4px;
+ padding-bottom:40px;
+ margin-bottom:8px;
+}
+
+.status.status-direct {
+ background-color:$win95-bg;
+}
+
+.status__content {
+ font-size:13px;
+}
+
+.status.light .status__relative-time,
+.status.light .display-name span {
+ color: #7f7f7f;
+}
+
+.status__action-bar {
+ box-sizing:border-box;
+ position:absolute;
+ bottom:-1px;
+ left:-1px;
+ background:$win95-bg;
+ width:calc(100% + 2px);
+ padding-left:10px;
+ padding: 4px 2px;
+ padding-bottom:4px;
+ border-bottom:2px groove $win95-bg;
+ border-top:1px outset $win95-bg;
+ text-align: right;
+}
+
+.status__wrapper .status__action-bar {
+ border-bottom-width:0px;
+}
+
+.status__action-bar-button {
+ float:right;
+}
+
+.status__action-bar-dropdown {
+ margin-left:auto;
+ margin-right:10px;
+
+ .icon-button {
+ min-width:28px;
+ }
+}
+.status.light .status__content a {
+ color:blue;
+}
+
+.focusable:focus {
+ background: $win95-bg;
+ .detailed-status__action-bar {
+ background: $win95-bg;
+ }
+
+ .status, .detailed-status {
+ background: white;
+ outline:2px dotted $win95-mid-grey;
+ }
+}
+
+.dropdown__trigger.icon-button {
+ padding-right:6px;
+}
+
+.detailed-status__action-bar-dropdown .icon-button {
+ min-width:28px;
+}
+
+.detailed-status {
+ background:white;
+ background-clip:padding-box;
+ margin:4px;
+ border: 2px groove $win95-bg;
+ padding:4px;
+}
+
+.detailed-status__display-name {
+ color:#7f7f7f;
+}
+
+.detailed-status__display-name strong {
+ color:black;
+ font-weight:bold;
+}
+.account__avatar,
+.account__avatar-overlay-base,
+.account__header__avatar,
+.account__avatar-overlay-overlay {
+ @include win95-border-slight-inset();
+ clip-path:none;
+ filter: saturate(1.8) brightness(1.1);
+}
+
+.detailed-status__action-bar {
+ background-color:$win95-bg;
+ border:0px;
+ border-bottom:2px groove $win95-bg;
+ margin-bottom:8px;
+ justify-items:left;
+ padding-left:4px;
+}
+
+.icon-button {
+ background:$win95-bg;
+ @include win95-border-outset()
+ padding:0px 0px 0px 0px;
+ margin-right:4px;
+
+ color:#3f3f3f;
+ &.inverted, &:hover, &.inverted:hover, &:active, &:focus {
+ color:#3f3f3f;
+ }
+}
+
+.icon-button:active {
+ @include win95-border-inset();
+}
+
+.status__action-bar > .icon-button {
+ padding:0px 15px 0px 0px;
+ min-width:25px;
+}
+
+.icon-button.star-icon,
+.icon-button.star-icon:active {
+ background:transparent;
+ border:none;
+}
+
+.icon-button.star-icon.active {
+ color: $gold-star;
+ &:active, &:hover, &:focus {
+ color: $gold-star;
+ }
+}
+
+.icon-button.star-icon > i {
+ background:$win95-bg;
+ @include win95-border-outset()
+ padding-bottom:3px;
+}
+
+.icon-button.star-icon:active > i {
+ @include win95-border-inset();
+}
+
+.text-icon-button {
+ color:$win95-dark-grey;
+}
+
+.detailed-status__action-bar-dropdown {
+ margin-left:auto;
+ justify-content:right;
+ padding-right:16px;
+}
+
+.detailed-status__button {
+ flex:0 0 auto;
+}
+
+.detailed-status__button .icon-button {
+ padding-left:2px;
+ padding-right:25px;
+}
+
+.status-card {
+ border-radius:0px;
+ background:white;
+ border: 1px solid black;
+ color:black;
+}
+
+.status-card:hover {
+ background-color:white;
+}
+
+.status-card__title {
+ color:blue;
+ text-decoration:underline;
+ font-weight:bold;
+}
+
+.load-more {
+ width:auto;
+ margin:5px auto;
+ background: $win95-bg;
+ @include win95-outset();
+ color:black;
+ padding: 2px 5px;
+
+ &:hover {
+ background: $win95-bg;
+ color:black;
+ }
+}
+
+.status-card__description {
+ color:black;
+}
+
+.account__display-name strong, .status__display-name strong {
+ color:black;
+ font-weight:bold;
+}
+
+.account .account__display-name {
+ color:black;
+}
+
+.account {
+ border-bottom: none;
+}
+
+.reply-indicator__content .status__content__spoiler-link, .status__content .status__content__spoiler-link {
+ background:$win95-bg;
+ @include win95-outset()
+}
+
+.reply-indicator__content .status__content__spoiler-link:hover, .status__content .status__content__spoiler-link:hover {
+ background:$win95-bg;
+}
+
+.reply-indicator__content .status__content__spoiler-link:active, .status__content .status__content__spoiler-link:active {
+ @include win95-inset();
+}
+
+.reply-indicator__content a, .status__content a {
+ color:blue;
+}
+
+.notification {
+ border: 2px groove $win95-bg;
+ margin:4px;
+}
+
+.notification__message {
+ color:black;
+ font-size:13px;
+}
+
+.notification__display-name {
+ font-weight:bold;
+}
+
+
+.drawer__header {
+ background: $win95-bg;
+ @include win95-border-outset()
+ justify-content:left;
+ margin-bottom:0px;
+ padding-bottom:2px;
+ border-bottom:2px groove $win95-bg;
+}
+
+.drawer__tab {
+ color:black;
+ @include win95-outset()
+ padding:5px;
+ margin:2px;
+ flex: 0 0 auto;
+}
+
+.drawer__tab:first-child::before {
+ content:"Start";
+ color:black;
+ font-weight:bold;
+ font-size:15px;
+ width:80%;
+ display:block;
+ position:absolute;
+ right:0px;
+
+}
+
+.drawer__tab:first-child {
+ position:relative;
+ padding:5px 15px;
+ width:40px;
+ font-size:0px;
+ color:$win95-bg;
+
+ background-image: url("../images/start.png");
+ background-repeat:no-repeat;
+ background-position:8%;
+ background-clip:padding-box;
+ background-size:auto 50%;
+}
+
+.drawer__header a:hover {
+ background-color:transparent;
+}
+
+.drawer__header a:first-child:hover {
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAOCAIAAACpTQvdAAAACXBIWXMAAC4jAAAuIwF4pT92AAAAF3pUWHRBdXRob3IAAAiZS84oys9LzAEAC5oC6A7BY/IAAACWSURBVCiRhVJJDsQgDEuqOfRZ7a1P5gbP4uaJaEjTADMWQhHYjlk4p0wLnNdptdF4KvBUDyGzVwc2xO+uKtH+1o0ytEEmqFpuxlvFCGCxKbNIT56QCi2MzaA/2Mz+mERSOeqzJG2RUxkjdTabgPtFoZ1bZxcKvgPcLZVufAyR9Ni8v5dWDzfFx0giC1RvZFv6l35QQ/Mvv39XXgGzQpoAAAAASUVORK5CYII=");
+ background-repeat:no-repeat;
+ background-position:8%;
+ background-clip:padding-box;
+ background-size:auto 50%;
+ transition:unset;
+}
+
+.drawer__tab:first-child {
+
+}
+
+.search {
+ background:$win95-bg;
+ padding-top:2px;
+ padding:2px;
+ border:2px outset $win95-bg;
+ border-top-width:0px;
+ border-bottom: 2px groove $win95-bg;
+ margin-bottom:0px;
+}
+
+.search input {
+ background-color:white;
+ color:black;
+ @include win95-border-slight-inset();
+}
+
+.search__input:focus {
+ background-color:white;
+}
+
+.search-popout {
+ box-shadow: unset;
+ color:black;
+ border-radius:0px;
+ background-color:$win95-tooltip-yellow;
+ border:1px solid black;
+
+ h4 {
+ color:black;
+ text-transform: none;
+ font-weight:bold;
+ }
+}
+
+.search-results__header {
+ background-color: $win95-bg;
+ color:black;
+ border-bottom:2px groove $win95-bg;
+}
+
+.search-results__hashtag {
+ color:blue;
+}
+
+.search-results__section h5:before {
+ display: none;
+}
+
+.search-results__section h5 {
+ background: #bfbfbf;
+ span {
+ color: black;
+ padding: 0px 2px;
+ }
+}
+
+.search-results__section {
+ border: 3px groove white;
+ margin: 11px 6px 9px 3px;
+}
+
+.search-results__section .account:hover,
+.search-results__section .account:hover .account__display-name,
+.search-results__section .account:hover .account__display-name strong,
+.search-results__section .search-results__hashtag:hover {
+ background-color:$win95-window-header;
+ color:white;
+}
+
+.search__icon .fa {
+ color:#808080;
+
+ &.active {
+ opacity:1.0;
+ }
+
+ &:hover {
+ color: #808080;
+ }
+}
+
+.trends__item__name a,
+.trends__item__current {
+ color: black;
+}
+
+.drawer__inner,
+.drawer__inner.darker {
+ background-color:$win95-bg;
+ border: 2px outset $win95-bg;
+ border-top-width:0px;
+}
+
+.navigation-bar {
+ color:black;
+}
+
+.navigation-bar strong {
+ color:black;
+ font-weight:bold;
+}
+
+.compose-form .autosuggest-textarea__textarea,
+.compose-form .spoiler-input__input {
+ border-radius:0px;
+ @include win95-border-slight-inset();
+}
+
+.compose-form .autosuggest-textarea__textarea {
+ border-bottom:0px;
+}
+
+.compose-form__uploads-wrapper {
+ border-radius:0px;
+ border-bottom:1px inset $win95-bg;
+ border-top-width:0px;
+}
+
+.compose-form__upload-wrapper {
+ border-left:1px inset $win95-bg;
+ border-right:1px inset $win95-bg;
+}
+
+.compose-form .compose-form__buttons-wrapper {
+ background-color: $win95-bg;
+ border:2px groove $win95-bg;
+ margin-top:4px;
+ padding:4px 8px;
+}
+
+.compose-form__buttons {
+ background-color:$win95-bg;
+ border-radius:0px;
+ box-shadow:unset;
+}
+
+.compose-form__buttons-separator {
+ border-left: 2px groove $win95-bg;
+}
+
+.privacy-dropdown.active .privacy-dropdown__value.active,
+.advanced-options-dropdown.open .advanced-options-dropdown__value {
+ background: $win95-bg;
+}
+
+.privacy-dropdown.active .privacy-dropdown__value.active .icon-button {
+ color: $win95-dark-grey;
+}
+
+.privacy-dropdown.active
+.privacy-dropdown__value {
+ background: $win95-bg;
+ box-shadow:unset;
+}
+
+.privacy-dropdown__option.active, .privacy-dropdown__option:hover,
+.privacy-dropdown__option.active:hover {
+ background:$win95-window-header;
+}
+
+.privacy-dropdown__dropdown,
+.privacy-dropdown.active .privacy-dropdown__dropdown,
+.advanced-options-dropdown__dropdown,
+.advanced-options-dropdown.open .advanced-options-dropdown__dropdown
+{
+ box-shadow:unset;
+ color:black;
+ @include win95-outset()
+ background: $win95-bg;
+}
+
+.privacy-dropdown__option__content {
+ color:black;
+}
+
+.privacy-dropdown__option__content strong {
+ font-weight:bold;
+}
+
+.compose-form__warning::before {
+ content:"Tip:";
+ font-weight:bold;
+ display:block;
+ position:absolute;
+ top:-10px;
+ background-color:$win95-bg;
+ font-size:11px;
+ padding: 0px 5px;
+}
+
+.compose-form__warning {
+ position:relative;
+ box-shadow:unset;
+ border:2px groove $win95-bg;
+ background-color:$win95-bg;
+ color:black;
+}
+
+.compose-form__warning a {
+ color:blue;
+}
+
+.compose-form__warning strong {
+ color:black;
+ text-decoration:underline;
+}
+
+.compose-form__buttons button.active:last-child {
+ @include win95-border-inset();
+ background: #dfdfdf;
+ color:#7f7f7f;
+}
+
+.compose-form__upload-thumbnail {
+ border-radius:0px;
+ border:2px groove $win95-bg;
+ background-color:$win95-bg;
+ padding:2px;
+ box-sizing:border-box;
+}
+
+.compose-form__upload-thumbnail .icon-button {
+ max-width:20px;
+ max-height:20px;
+ line-height:10px !important;
+}
+
+.compose-form__upload-thumbnail .icon-button::before {
+ content:"X";
+ font-size:13px;
+ font-weight:bold;
+ color:black;
+}
+
+.compose-form__upload-thumbnail .icon-button i {
+ display:none;
+}
+
+.emoji-picker-dropdown__menu {
+ z-index:2;
+}
+
+.emoji-dialog.with-search {
+ box-shadow:unset;
+ border-radius:0px;
+ background-color:$win95-bg;
+ border:1px solid black;
+ box-sizing:content-box;
+
+}
+
+.emoji-dialog .emoji-search {
+ color:black;
+ background-color:white;
+ border-radius:0px;
+ @include win95-inset();
+}
+
+.emoji-dialog .emoji-search-wrapper {
+ border-bottom:2px groove $win95-bg;
+}
+
+.emoji-dialog .emoji-category-title {
+ color:black;
+ font-weight:bold;
+}
+
+.reply-indicator {
+ background-color:$win95-bg;
+ border-radius:3px;
+ border:2px groove $win95-bg;
+}
+
+.button {
+ background-color:$win95-bg;
+ @include win95-outset()
+ border-radius:0px;
+ color:black;
+ font-weight:bold;
+
+ &:hover, &:focus, &:disabled {
+ background-color:$win95-bg;
+ }
+
+ &:active {
+ @include win95-inset();
+ }
+
+ &:disabled {
+ color: #808080;
+ text-shadow: 1px 1px 0px #efefef;
+
+ &:active {
+ @include win95-outset();
+ }
+ }
+
+}
+
+.column-link {
+ background-color:transparent;
+ color:black;
+ &:hover {
+ background-color: $win95-window-header;
+ color:white;
+ }
+}
+
+.column-link__badge {
+ background-image: url('../images/alert_badge.png');
+ background-repeat: no-repeat;
+ background-size:contain;
+ background-color:transparent;
+ border-radius:0;
+ box-sizing: border-box;
+ width: 24px;
+ height:24px;
+ padding-top:4px;
+ padding-left:0px;
+ padding-right:1px;
+ text-align:center;
+ position:relative;
+ top:2px;
+}
+
+.column-link:hover .column-link__badge {
+ color:black;
+}
+
+.column-subheading {
+ background-color:transparent;
+ color:black;
+}
+
+.column {
+ overflow-y:auto;
+}
+
+.getting-started__wrapper {
+ position:relative;
+ top:-60px;
+ padding-top:0px;
+ z-index:10;
+
+ box-shadow: inset -1px 0px 0px #000000,
+ inset 1px 1px 0px #ffffff,
+ inset -2px 0px 0px #808080,
+ inset 2px 2px 0px #dfdfdf;
+ border-radius:0px;
+
+ background-color:$win95-bg;
+
+ border-top:60px solid $win95-cyan;
+ border-bottom: 2px groove $win95-bg;
+
+ height: unset !important;
+
+ .navigation-bar {
+ padding-left: 45px;
+ }
+
+ .column-subheading {
+ font-size:0px;
+ margin:0px;
+ padding:0px;
+ background-color: transparent;
+ color:black;
+ border-bottom: 2px groove $win95-bg;
+ text-transform: none;
+ }
+
+ .column-link {
+ background-size:32px 32px;
+ background-repeat:no-repeat;
+ background-position: 36px 50%;
+ padding-left:45px;
+
+ &:hover {
+ background-size:32px 32px;
+ background-repeat:no-repeat;
+ background-position: 36px 50%;
+ }
+
+ i {
+ font-size: 0px;
+ width:32px;
+ }
+ }
+}
+
+@media screen and (min-width: 360px) {
+ .getting-started__wrapper{
+ margin-bottom:0px;
+ }
+}
+
+
+.getting-started__wrapper + .flex-spacer {
+ display:none;
+}
+
+.column-link[href="/web/timelines/home"] {
+ background-image: url("../images/icon_home.png");
+ &:hover { background-image: url("../images/icon_home.png"); }
+}
+.column-link[href="/web/notifications"] {
+ background-image: url("../images/icon_notifications.png");
+ &:hover { background-image: url("../images/icon_notifications.png"); }
+}
+.column-link[href="/web/timelines/public"] {
+ background-image: url("../images/icon_public.png");
+ &:hover { background-image: url("../images/icon_public.png"); }
+}
+.column-link[href="/web/timelines/public/local"] {
+ background-image: url("../images/icon_local.png");
+ &:hover { background-image: url("../images/icon_local.png"); }
+}
+.column-link[href="/web/timelines/direct"] {
+ background-image: url("../images/icon_direct.png");
+ &:hover { background-image: url("../images/icon_direct.png"); }
+}
+.column-link[href="/web/pinned"] {
+ background-image: url("../images/icon_pin.png");
+ &:hover { background-image: url("../images/icon_pin.png"); }
+}
+.column-link[href="/web/favourites"] {
+ background-image: url("../images/icon_likes.png");
+ &:hover { background-image: url("../images/icon_likes.png"); }
+}
+.column-link[href="/web/lists"] {
+ background-image: url("../images/icon_lists.png");
+ &:hover { background-image: url("../images/icon_lists.png"); }
+}
+.column-link[href="/web/follow_requests"] {
+ background-image: url("../images/icon_follow_requests.png");
+ &:hover { background-image: url("../images/icon_follow_requests.png"); }
+}
+.column-link[href="/web/blocks"] {
+ background-image: url("../images/icon_blocks.png");
+ &:hover { background-image: url("../images/icon_blocks.png"); }
+}
+.column-link[href="/web/domain_blocks"] {
+ background-image: url("../images/icon_domain_blocks.png");
+ &:hover { background-image: url("../images/icon_domain_blocks.png"); }
+}
+.column-link[href="/web/mutes"] {
+ background-image: url("../images/icon_mutes.png");
+ &:hover { background-image: url("../images/icon_mutes.png"); }
+}
+.column-link[href="/settings/preferences"] {
+ background-image: url("../images/icon_settings.png");
+ &:hover { background-image: url("../images/icon_settings.png"); }
+}
+
+.getting-started__footer ul li a[href="/web/keyboard-shortcuts"] {
+ background-image: url("../images/icon_keyboard_shortcuts.png");
+ &:hover { background-image: url("../images/icon_keyboard_shortcuts.png"); }
+}
+.getting-started__footer ul li a[href="/invites"] {
+ background-image: url("../images/icon_invite.png");
+ &:hover { background-image: url("../images/icon_invite.png"); }
+}
+.getting-started__footer ul li a[href="/terms"] {
+ background-image: url("../images/icon_tos.png");
+ &:hover { background-image: url("../images/icon_tos.png"); }
+}
+.getting-started__footer ul li a[href="https://github.com/tootsuite/documentation#documentation"] {
+ background-image: url("../images/icon_docs.png");
+ &:hover { background-image: url("../images/icon_docs.png"); }
+}
+.getting-started__footer ul li a[href="/about/more"] {
+ background-image: url("../images/icon_about.png");
+ &:hover { background-image: url("../images/icon_about.png"); }
+}
+.getting-started__footer ul li a[href="/auth/sign_out"] {
+ background-image: url("../images/icon_logout.png");
+ &:hover { background-image: url("../images/icon_logout.png"); }
+}
+
+.getting-started__footer {
+ background-color: $win95-bg;
+ padding:0px;
+ position:relative;
+ top:-62px;
+
+ @include win95-outset();
+
+ p {
+ margin-left: 45px;
+ }
+
+ ul {
+ display:block;
+ li {
+ cursor:pointer;
+ display:block;
+ font-size:0px;
+ padding:0px;
+ line-height:0;
+ a {
+ padding:15px;
+ padding-left:77px;
+ line-height:1em;
+ font-size:16px;
+ display:block;
+ color:black;
+ background-size:32px 32px;
+ background-repeat:no-repeat;
+ background-position: 36px 50%;
+ &:hover {
+ text-decoration:none;
+ }
+ }
+
+ &:hover {
+ background-color: $win95-window-header;
+ a {
+ color:white;
+ }
+ }
+ }
+ }
+}
+
+.getting-started__wrapper::before {
+ content: "Start";
+ display:block;
+ color:black;
+ font-weight:bold;
+ font-size:15px;
+ position:absolute;
+ top:-32px;
+ left:0px;
+ padding:5px 15px;
+ width:50px;
+ font-size:16px;
+ padding-left:25px;
+ background-color:$win95-bg;
+ z-index:12;
+
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAOCAIAAACpTQvdAAAACXBIWXMAAC4jAAAuIwF4pT92AAAAF3pUWHRBdXRob3IAAAiZS84oys9LzAEAC5oC6A7BY/IAAACWSURBVCiRhVJJDsQgDEuqOfRZ7a1P5gbP4uaJaEjTADMWQhHYjlk4p0wLnNdptdF4KvBUDyGzVwc2xO+uKtH+1o0ytEEmqFpuxlvFCGCxKbNIT56QCi2MzaA/2Mz+mERSOeqzJG2RUxkjdTabgPtFoZ1bZxcKvgPcLZVufAyR9Ni8v5dWDzfFx0giC1RvZFv6l35QQ/Mvv39XXgGzQpoAAAAASUVORK5CYII=");
+ background-repeat:no-repeat;
+ background-position:8%;
+ background-clip:padding-box;
+ background-size:auto 50%;
+
+ @include win95-border-inset();
+}
+
+.getting-started__footer::after {
+ content:"Mastodon 95";
+ font-weight:bold;
+ font-size:23px;
+ color:white;
+ line-height:30px;
+ padding-left:20px;
+ padding-right:40px;
+
+ left:0px;
+ box-sizing:border-box;
+ bottom:-32px;
+ display:block;
+ position:absolute;
+ background-color:#7f7f7f;
+ width:624.5px;
+ height:32px;
+
+ z-index:11;
+
+ border-left: 2px solid #404040;
+ border-top: 2px solid #efefef;
+ border-right: 2px solid #efefef;
+ border-radius:0px;
+
+ -ms-transform: rotate(-90deg);
+
+ -webkit-transform: rotate(-90deg);
+ transform: rotate(-90deg);
+ transform-origin:top left;
+}
+
+.column .static-content.getting-started {
+ display:none;
+}
+
+.keyboard-shortcuts kbd {
+ background-color: $win95-bg;
+}
+
+.account__header {
+ background-color:#7f7f7f;
+}
+
+.account__header .account__header__content {
+ color:white;
+}
+
+.account__header .account__header__fields {
+ border-left: 1px solid black;
+ border-top: 1px solid black;
+
+ dt {
+ background-color:$win95-bg;
+ color:black;
+ border-top: 1px solid #ffffff;
+ border-bottom: 1px solid $win95-mid-grey;
+ border-right: 1px solid $win95-mid-grey;
+ }
+ dd {
+ background-color:white;
+ border: 1px solid $win95-bg;
+ color:black;
+ }
+ dd,dt {
+ padding: 5px 8px;
+ }
+}
+
+.account-authorize__wrapper {
+ border: 2px groove $win95-bg;
+ margin: 2px;
+ padding:2px;
+}
+
+.domain .domain__domain-name strong {
+ color: black;
+}
+
+.account--panel {
+ background-color: $win95-bg;
+ border:0px;
+ border-top: 2px groove $win95-bg;
+}
+
+.account-authorize .account__header__content {
+ color:black;
+ margin:10px;
+}
+
+.account__action-bar__tab > span {
+ color:black;
+ font-weight:bold;
+}
+
+.account__action-bar__tab strong {
+ color:black;
+}
+
+.account__action-bar {
+ border: unset;
+}
+
+.account__action-bar__tab {
+ border: 1px outset $win95-bg;
+}
+
+.account__action-bar__tab:active {
+ @include win95-inset();
+}
+
+.account__section-headline {
+ background: $win95-bg;
+ margin-top: 5px;
+
+ & > a {
+ @include win95-tab();
+ color: black;
+ padding: 5px;
+
+ &.active {
+ background: $win95-dark-grey;
+ @include win95-inset();
+ color: white;
+
+ &:before, &:after {
+ display: none;
+ }
+ }
+ }
+}
+
+.dropdown--active .dropdown__content > ul,
+.dropdown-menu {
+ background:$win95-tooltip-yellow;
+ border-radius:0px;
+ border:1px solid black;
+ box-shadow:unset;
+ margin-top: 6px;
+}
+
+.dropdown-menu a {
+ background-color:transparent;
+}
+
+.dropdown-menu__arrow {
+ &.bottom {
+ border-bottom-color: $win95-tooltip-yellow;
+ }
+
+ &.top {
+ border-top-color: $win95-tooltip-yellow;
+ }
+
+ &:before {
+ position: relative;
+ border: 0 solid transparent;
+ display: block;
+ content: '';
+ left: -8px;
+ z-index: -1;
+ }
+
+ &.bottom::before {
+ border-bottom-color: black;
+ border-width: 0 8px 6px;
+ bottom: 1px;
+ }
+
+ &.top::before {
+ border-top-color: black;
+ border-width: 6px 8px 0;
+ top: -5px;
+ }
+}
+
+.dropdown-menu {
+ margin-top: 6px;
+}
+
+.dropdown--active::after {
+ display:none;
+}
+
+.dropdown--active .icon-button {
+ color:black;
+ @include win95-inset();
+}
+
+.dropdown--active .dropdown__content > ul > li > a {
+ background:transparent;
+}
+
+.dropdown--active .dropdown__content > ul > li > a:hover {
+ background:transparent;
+ color:black;
+ text-decoration:underline;
+}
+
+.dropdown__sep,
+.dropdown-menu__separator
+{
+ border-color:#7f7f7f;
+}
+
+.detailed-status__action-bar-dropdown .dropdown--active .dropdown__content.dropdown__left {
+ left: unset;
+}
+
+.dropdown > .icon-button, .detailed-status__action-bar .icon-button,
+.status__action-bar .icon-button, .star-icon i {
+ /* i don't know what's going on with the inline
+ styles someone should look at the react code */
+ height: 25px !important;
+ width: 28px !important;
+ box-sizing: border-box;
+}
+
+.icon-button {
+ height: auto!important;
+ width: auto!important;
+}
+
+.status__action-bar-dropdown .icon-button {
+ position: relative;
+ top: -1px;
+}
+
+.fa-user-plus, .fa-user-times {
+ padding: 2px 0px 2px 1px;
+}
+
+.fa-ellipsis-h {
+ padding-top: 3px;
+}
+
+.status__action-bar-button .fa-floppy-o {
+ padding-top: 2px;
+}
+
+.notification .status__action-bar {
+ border-bottom: none;
+}
+
+.notification .status {
+ margin-bottom: 4px;
+}
+
+.status__wrapper .status {
+ margin-bottom: 3px;
+}
+
+.status__wrapper {
+ margin-bottom: 8px;
+}
+
+.status__prepend {
+ color: black;
+ font-size: 13px;
+}
+
+.icon-button .fa-retweet {
+ position: relative;
+ top: -1px;
+}
+
+.embed-modal, .error-modal, .onboarding-modal,
+.actions-modal, .boost-modal, .confirmation-modal, .report-modal {
+ @include win95-outset()
+ background:$win95-bg;
+}
+
+.actions-modal::before,
+.boost-modal::before,
+.confirmation-modal::before,
+.report-modal::before {
+ content: "Confirmation";
+ display:block;
+ background:$win95-window-header;
+ color:white;
+ font-weight:bold;
+ padding-left:2px;
+}
+
+.boost-modal::before {
+ content: "Boost confirmation";
+}
+
+.boost-modal__action-bar > div > span:before {
+ content: "Tip: ";
+ font-weight:bold;
+}
+
+.boost-modal__action-bar, .confirmation-modal__action-bar, .report-modal__action-bar {
+ background:$win95-bg;
+ margin-top:-15px;
+}
+
+.embed-modal h4, .error-modal h4, .onboarding-modal h4 {
+ background:$win95-window-header;
+ color:white;
+ font-weight:bold;
+ padding:2px;
+ font-size:13px;
+ text-align:left;
+}
+
+.media-modal .media-modal__close {
+ font-size: 14px!important;
+ line-height: 17px!important;
+ margin-right: 4vw;
+ margin-top: 4vh;
+}
+
+.confirmation-modal__action-bar {
+ .confirmation-modal__cancel-button {
+ color:black;
+
+ &:active,
+ &:focus,
+ &:hover {
+ color:black;
+ }
+
+ &:active {
+ @include win95-inset();
+ }
+ }
+}
+
+.embed-modal .embed-modal__container .embed-modal__html,
+.embed-modal .embed-modal__container .embed-modal__html:focus {
+ background:white;
+ color:black;
+ @include win95-inset();
+}
+
+.report-modal__target .media-modal__close {
+ top: 3px;
+ right: 0px;
+ font-size: 12px!important;
+ line-height: 13px!important;
+}
+
+.report-modal__comment p {
+ font-size: 12px;
+ margin-bottom: 1em;
+ padding-left: 3px;
+}
+
+.report-modal__comment .setting-text.light {
+ border-radius: 0;
+}
+
+.report-modal__container {
+ margin-right: 2px;
+}
+
+.report-modal::before {
+ height: 22px;
+ line-height: 23px;
+}
+
+.status-check-box__status .media-gallery {
+ margin: unset;
+}
+
+.modal-root__overlay,
+.account__header > div {
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAACXBIWXMAAC4jAAAuIwF4pT92AAAAFnpUWHRUaXRsZQAACJnLzU9JzElKBwALgwLXaCRlPwAAABd6VFh0QXV0aG9yAAAImUvOKMrPS8wBAAuaAugOwWPyAAAAEUlEQVQImWNgYGD4z4AE/gMADwMB/414xEUAAAAASUVORK5CYII=');
+}
+
+
+.admin-wrapper::before {
+ position:absolute;
+ top:0px;
+ content:"Control Panel";
+ color:white;
+ background-color:$win95-window-header;
+ font-size:13px;
+ font-weight:bold;
+ width:calc(100%);
+ margin: 2px;
+ display:block;
+ padding:2px;
+ padding-left:22px;
+ box-sizing:border-box;
+}
+
+.admin-wrapper {
+ position:relative;
+ background: $win95-bg;
+ @include win95-outset()
+ width:70vw;
+ height:80vh;
+ margin:10vh auto;
+ color: black;
+ padding-top:24px;
+ flex-direction:column;
+ overflow:hidden;
+}
+
+@media screen and (max-width: 1120px) {
+ .admin-wrapper {
+ width:90vw;
+ height:95vh;
+ margin:2.5vh auto;
+ }
+}
+
+@media screen and (max-width: 740px) {
+ .admin-wrapper {
+ width:100vw;
+ height:95vh;
+ height:calc(100vh - 24px);
+ margin:0px 0px 0px 0px;
+ }
+}
+
+.admin-wrapper .sidebar-wrapper {
+ position:static;
+ height:auto;
+ flex: 0 0 auto;
+ margin:2px;
+}
+
+.admin-wrapper .content-wrapper {
+ flex: 1 1 auto;
+ width:calc(100% - 20px);
+ @include win95-border-outset()
+ position:relative;
+ margin-left:10px;
+ margin-right:10px;
+ margin-bottom:40px;
+ box-sizing:border-box;
+}
+
+.admin-wrapper .content {
+ background-color: $win95-bg;
+ width: 100%;
+ max-width:100%;
+ min-height:100%;
+ box-sizing:border-box;
+ position:relative;
+}
+.admin-wrapper .content h4 {
+ color: black;
+}
+
+.admin-wrapper .sidebar {
+ position:static;
+ background: $win95-bg;
+ color:black;
+ width: 100%;
+ height:auto;
+ padding-bottom: 20px;
+}
+
+.admin-wrapper .sidebar .logo {
+ position:absolute;
+ top:2px;
+ left:4px;
+ width:18px;
+ height:18px;
+ margin:0px;
+}
+
+.admin-wrapper .sidebar > ul {
+ background: $win95-bg;
+ margin:0px;
+ margin-left:8px;
+ color:black;
+
+ & > li {
+ display:inline-block;
+
+ settings,
+ admin {
+ padding:2px;
+ border: 0px solid transparent;
+ }
+
+ logout {
+ position:absolute;
+ @include win95-outset();
+ right:12px;
+ bottom:10px;
+ }
+
+ web {
+ display:inline-block;
+ @include win95-outset();
+ position:absolute;
+ left: 12px;
+ bottom: 10px;
+ }
+
+ & > a {
+ display:inline-block;
+ @include win95-tab();
+ padding:2px 5px;
+ margin:0px;
+ color:black;
+ vertical-align:baseline;
+
+ &.selected {
+ background: $win95-bg;
+ color:black;
+ padding-top: 4px;
+ padding-bottom:4px;
+ }
+
+ &:hover {
+ background: $win95-bg;
+ color:black;
+ }
+ }
+
+ & > ul {
+ width:calc(100% - 20px);
+ background: transparent;
+ position:absolute;
+ left: 10px;
+ top:54px;
+ z-index:3;
+
+ & > li {
+ background: $win95-bg;
+ display: inline-block;
+ vertical-align:baseline;
+
+ & > a {
+ background: $win95-bg;
+ @include win95-tab();
+ color:black;
+ padding:2px 5px;
+ position:relative;
+ z-index:3;
+
+ &.selected {
+ background: $win95-bg;
+ color:black;
+ padding-bottom:4px;
+ padding-top: 4px;
+ padding-right:7px;
+ margin-left:-2px;
+ margin-right:-2px;
+ position:relative;
+ z-index:4;
+
+ &:first-child {
+ margin-left:0px;
+ }
+
+ &:hover {
+ background: transparent;
+ color:black;
+ }
+ }
+
+ &:hover {
+ background: $win95-bg;
+ color:black;
+ }
+ }
+ }
+ }
+ }
+}
+
+@media screen and (max-width: 1520px) {
+ .admin-wrapper .sidebar > ul > li > ul {
+ max-width:1000px;
+ }
+
+ .admin-wrapper .sidebar {
+ padding-bottom: 45px;
+ }
+}
+
+@media screen and (max-width: 600px) {
+ .admin-wrapper .sidebar > ul > li > ul {
+ max-width:500px;
+ }
+
+ .admin-wrapper {
+ .sidebar {
+ padding:0px;
+ padding-bottom: 70px;
+ width: 100%;
+ height: auto;
+ }
+ .content-wrapper {
+ overflow:auto;
+ height:80%;
+ height:calc(100% - 150px);
+ }
+ }
+}
+
+.flash-message {
+ background-color:$win95-tooltip-yellow;
+ color:black;
+ border:1px solid black;
+ border-radius:0px;
+ position:absolute;
+ top:0px;
+ left:0px;
+ width:100%;
+}
+
+.admin-wrapper table {
+ background-color: white;
+ @include win95-border-slight-inset();
+}
+
+.admin-wrapper .table th, .table td {
+ background-color:transparent;
+}
+
+.admin-wrapper button.table-action-link,
+.admin-wrapper a.table-action-link,
+.admin-wrapper button.table-action-link:hover,
+.admin-wrapper a.table-action-link:hover,
+.admin-wrapper a.name-tag,
+.admin-wrapper .name-tag,
+.admin-wrapper a.inline-name-tag,
+.admin-wrapper .inline-name-tag,
+.admin-wrapper .content h2,
+.simple_form .input.with_label .label_input > label,
+.admin-wrapper .content h6,
+.admin-wrapper .content > p,
+.admin-wrapper .content .muted-hint,
+.simple_form span.hint,
+.simple_form h4,
+.simple_form .check_boxes .checkbox label,
+.simple_form .input.with_label.boolean .label_input > label,
+.filters .filter-subset a,
+.simple_form .input.radio_buttons .radio label,
+a.table-action-link,
+a.table-action-link:hover,
+.simple_form .input.with_block_label > label,
+.simple_form p.hint {
+ color:black;
+}
+
+.table > tbody > tr:nth-child(2n+1) > td,
+.table > tbody > tr:nth-child(2n+1) > th {
+ background-color:white;
+}
+
+.simple_form input[type=text],
+.simple_form input[type=number],
+.simple_form input[type=email],
+.simple_form input[type=password],
+.simple_form textarea {
+ color:black;
+ background-color:white;
+ @include win95-border-slight-inset();
+
+ &:active, &:focus {
+ background-color:white;
+ }
+}
+
+.simple_form button,
+.simple_form .button,
+.simple_form .block-button
+{
+ background: $win95-bg;
+ @include win95-outset()
+ color:black;
+ font-weight: normal;
+
+ &:hover {
+ background: $win95-bg;
+ }
+}
+
+.simple_form .warning, .table-form .warning
+{
+ background: $win95-tooltip-yellow;
+ color:black;
+ box-shadow: unset;
+ text-shadow:unset;
+ border:1px solid black;
+
+ a {
+ color: blue;
+ text-decoration:underline;
+ }
+}
+
+.simple_form button.negative,
+.simple_form .button.negative,
+.simple_form .block-button.negative
+{
+ background: $win95-bg;
+}
+
+.filters .filter-subset {
+ border: 2px groove $win95-bg;
+ padding:2px;
+}
+
+.filters .filter-subset a::before {
+ content: "";
+ background-color:white;
+ border-radius:50%;
+ border:2px solid black;
+ border-top-color:#7f7f7f;
+ border-left-color:#7f7f7f;
+ border-bottom-color:#f5f5f5;
+ border-right-color:#f5f5f5;
+ width:12px;
+ height:12px;
+ display:inline-block;
+ vertical-align:middle;
+ margin-right:2px;
+}
+
+.filters .filter-subset a.selected::before {
+ background-color:black;
+ box-shadow: inset 0 0 0 3px white;
+}
+
+.filters .filter-subset a,
+.filters .filter-subset a:hover,
+.filters .filter-subset a.selected {
+ color:black;
+ border-bottom: 0px solid transparent;
+}
+
+.drawer__inner__mastodon {
+ display: none;
+}
+
+.list-editor h4 {
+ padding: 2px;
+ color: white;
+ font-size: 14px;
+ font-weight: bold;
+ background: #00007f;
+ border-radius: 0;
+}
+
+.list-editor {
+ @include win95-border-outset();
+ box-shadow: unset;
+}
+
+.list-editor .drawer__inner {
+ @include win95-inset();
+ border-radius: 0;
+}
+
+.batch-table__toolbar {
+ border-radius: 0px;
+ background-color:white;
+ border: 1px solid black;
+}
+
+.batch-table__row {
+ border: 1px solid black;
+ background-color: white;
+
+ &:hover {
+ background-color: white;
+ }
+}
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 501694eac..1cb9d2011 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -366,9 +366,6 @@ en:
peers_api_enabled:
desc_html: Domain names this instance has encountered in the fediverse
title: Publish list of discovered instances
- preview_sensitive_media:
- desc_html: Link previews on other websites will display a thumbnail even if the media is marked as sensitive
- title: Show sensitive media in OpenGraph previews
registrations:
closed_message:
desc_html: Displayed on frontpage when registrations are closed. You can use HTML tags
@@ -537,22 +534,6 @@ en:
follows: You follow
mutes: You mute
storage: Media storage
- filters:
- contexts:
- home: Home timeline
- notifications: Notifications
- public: Public timelines
- thread: Conversations
- edit:
- title: Edit filter
- errors:
- invalid_context: None or invalid context supplied
- invalid_irreversible: Irreversible filtering only works with home or notifications context
- index:
- delete: Delete
- title: Filters
- new:
- title: Add new filter
followers:
domain: Domain
explanation_html: If you want to ensure the privacy of your statuses, you must be aware of who is following you. Your private statuses are delivered to all instances where you have followers. You may wish to review them, and remove followers if you do not trust your privacy to be respected by the staff or software of those instances.
@@ -596,7 +577,6 @@ en:
'86400': 1 day
expires_in_prompt: Never
generate: Generate
- invited_by: 'You were invited by:'
max_uses:
one: 1 use
other: "%{count} uses"
@@ -679,7 +659,6 @@ en:
remote_follow:
acct: Enter your username@domain you want to act from
missing_resource: Could not find the required redirect URL for your account
- no_account_html: Don't have an account? You can sign up here
proceed: Proceed to follow
prompt: 'You are going to follow:'
remote_interaction:
@@ -759,7 +738,6 @@ en:
disallowed_hashtags:
one: 'contained a disallowed hashtag: %{tags}'
other: 'contained the disallowed hashtags: %{tags}'
- language_detection: Automatically detect language
open_in_web: Open in web
over_character_limit: character limit of %{max} exceeded
pin_errors:
@@ -868,6 +846,7 @@ en:
contrast: High contrast
default: Mastodon
mastodon-light: Mastodon (light)
+ win95: Windows 95
time:
formats:
default: "%b %d, %Y, %H:%M"
diff --git a/config/themes.yml b/config/themes.yml
index 9c21c9459..2da392eda 100644
--- a/config/themes.yml
+++ b/config/themes.yml
@@ -1,3 +1,4 @@
default: styles/application.scss
contrast: styles/contrast.scss
mastodon-light: styles/mastodon-light.scss
+win95: styles/win95.scss