diff --git a/app/javascript/images/background-cybre-light.png b/app/javascript/images/background-cybre-light.png
new file mode 100644
index 000000000..44d76c24c
Binary files /dev/null and b/app/javascript/images/background-cybre-light.png differ
diff --git a/app/javascript/images/header-cybre-alt.jpg b/app/javascript/images/header-cybre-alt.jpg
new file mode 100644
index 000000000..4d2b6b3a8
Binary files /dev/null and b/app/javascript/images/header-cybre-alt.jpg differ
diff --git a/app/javascript/images/header-cybre-colour.jpg b/app/javascript/images/header-cybre-colour.jpg
new file mode 100644
index 000000000..2d1b5b4f0
Binary files /dev/null and b/app/javascript/images/header-cybre-colour.jpg differ
diff --git a/app/javascript/images/logo-cybre-light.png b/app/javascript/images/logo-cybre-light.png
new file mode 100644
index 000000000..91908f6d3
Binary files /dev/null and b/app/javascript/images/logo-cybre-light.png differ
diff --git a/app/javascript/styles/cybre-light.scss b/app/javascript/styles/cybre-light.scss
new file mode 100644
index 000000000..fb29c0521
--- /dev/null
+++ b/app/javascript/styles/cybre-light.scss
@@ -0,0 +1,251 @@
+@import 'mastodon-light/variables';
+
+// $ui-base-color: #f7e8ed; // "darkest"
+// $ui-base-lighter-color: darken($ui-base-color, 40%); // Lighter darkest
+// $ui-secondary-color: #ead0d6; // "lightest"
+// $ui-primary-color: #bf5677; // "lighter"
+// $ui-highlight-color: #bf5677; // "vibrant"
+// $primary-text-color: #382b32;
+// $secondary-text-color: #382b32;
+//
+// $icon-button-inactive-color: lighten(desaturate($ui-base-lighter-color, 20%), 20%);
+// $action-button-color: $icon-button-inactive-color;
+//
+// $about-page-text: $primary-text-color;
+
+$ui-base-color: #f7e8ed; // "darkest"
+$ui-base-lighter-color: lighten($ui-base-color, 40%); // Lighter darkest
+$ui-primary-color: #ed9aad; // "lighter"
+$ui-secondary-color: #6d3e4d;
+$ui-highlight-color: #bf5677; // "vibrant"
+$ui-base-alt: #f9f2f5;
+
+$header-color: $ui-highlight-color;
+$header-text-color: #fff;
+
+$darker-text-color: #38282c;
+$dark-text-color: #5b4348;
+
+$lighter-text-color: #38282c;
+$light-text-color: #5b4348;
+
+$icon-button-inactive-color: darken(desaturate($ui-base-lighter-color, 10%), 20%);
+$action-button-color: $icon-button-inactive-color;
+
+@import 'cybre-base';
+
+@import 'mastodon-light/diff';
+
+$gold-star: #dd9d08;
+
+//Un-invert darkened and lightened functions
+@function darken($color, $amount) {
+ @return hsl(hue($color), saturation($color), lightness($color) - $amount);
+}
+
+@function lighten($color, $amount) {
+ @return hsl(hue($color), saturation($color), lightness($color) + $amount);
+}
+
+
+// cybre-specific additions
+
+.column .static-content.getting-started {
+ background-image: url('../images/logo-cybre-light.png');
+ background-size:auto 50%;
+ background-position: 50% 75%;
+ background-repeat:no-repeat;
+}
+
+.ui, body {
+ background: $ui-base-color url('../images/background-cybre-light.png');
+}
+
+// about.scss
+#mastodon-timeline {
+ .column-header {
+ color:white;
+ }
+}
+
+// components.scss
+
+.column-header {
+ background: $header-color;
+ color: $header-text-color;
+ border-top-left-radius: 3px;
+ border-top-right-radius: 3px;
+ box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
+}
+
+.column-header__button {
+ background: $header-color;
+ color: $header-text-color;
+ border-top-right-radius: 3px;
+
+ &:hover {
+ color: darken($ui-base-color, 10%);
+ }
+
+ &.active {
+ color: $primary-text-color;
+ background: darken($ui-base-color, 5%);
+
+ &:hover {
+ background: darken($ui-base-color, 5%);
+ }
+ }
+}
+
+// selectivity -- needs to override .column-header > button
+.column-header .column-header__back-button {
+ background: $header-color;
+ color:$header-text-color;
+}
+
+.column-back-button {
+ background: $header-color;
+ color:$header-text-color;
+}
+
+.column-header__collapsible-inner {
+ background: darken($ui-base-alt, 2%);
+}
+
+/* More colorful compose form */
+.compose-form {
+ .autosuggest-textarea__textarea,
+ .spoiler-input__input {
+ color: $primary-text-color;
+ border: 1px solid $ui-highlight-color;
+ }
+
+ .autosuggest-textarea__textarea {
+ border-bottom-width:0px;
+ }
+ .compose-form__modifiers {
+ border: 1px solid $ui-highlight-color;
+ border-top-width:0px;
+ }
+
+ .compose-form__buttons button.active:last-child {
+ border-radius:3px;
+ background: $ui-base-color;
+ color: $ui-highlight-color;
+ }
+ .compose-form__buttons-wrapper {
+ background-color:$ui-highlight-color;
+ }
+
+ .icon-button.inverted {
+ color: $white;
+
+ &:hover {
+ color:darken($ui-base-color, 5%);
+ }
+ }
+}
+.compose-form .compose-form__buttons-wrapper .character-counter__wrapper
+.character-counter {
+ color: $white;
+}
+
+/* Fix the privacy dropdown options */
+.privacy-dropdown.active .privacy-dropdown__value.active .icon-button {
+ color: $ui-highlight-color;
+}
+
+.privacy-dropdown__option {
+ color: $primary-text-color;
+
+ strong {
+ color: $primary-text-color;
+ }
+
+ &:hover,
+ &.active {
+ color: $white;
+
+ .privacy-dropdown__option__content {
+ color: $white;
+
+ strong {
+ color: $white;
+ }
+ }
+ }
+}
+
+/* Fix the CW button */
+.text-icon-button {
+ color: $white;
+ &.active {
+ background: $ui-base-color;
+ color: $ui-primary-color;
+ }
+ &:focus, &:hover {
+ color: darken($ui-base-color, 3%);
+ }
+}
+
+.column-link {
+ background: lighten($ui-highlight-color, 5%);
+ color:$white;
+ &:hover {
+ background: lighten($ui-highlight-color, 10%);
+ }
+}
+.column-link__badge {
+ background: saturate(darken($ui-highlight-color, 5%), 5%);
+}
+.column-subheading {
+ background: darken($ui-highlight-color, 5%);
+ color:$white;
+}
+
+.status__relative-time, .status__display-name {
+ color: darken($ui-base-color, 60%);
+}
+
+.status__content {
+ .status__content__spoiler-link {
+ background: $ui-base-lighter-color;
+ color: $white;
+
+ &:hover {
+ background: lighten($ui-base-lighter-color, 5%);
+ color: $white;
+ }
+ }
+}
+
+.modal-root__overlay {
+ background: rgba(0,0,0,.7);
+}
+
+.reply-indicator {
+ background-color: $ui-highlight-color;
+ color: $white;
+}
+.reply-indicator__display-name,
+.reply-indicator__content {
+ color: $white;
+}
+.reply-indicator__content a {
+ color: lighten($ui-primary-color, 10%);
+}
+
+.drawer .drawer__inner {
+ background:$ui-base-alt;
+}
+
+.drawer .drawer__header {
+ background: $ui-base-color;
+ border-radius:3px;
+}
+
+.column {
+ & > .scrollable {
+ background-color: $ui-base-alt;
+ }
+}
diff --git a/config/locales/en.yml b/config/locales/en.yml
index a03b12a39..3a141c4c3 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -316,9 +316,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
@@ -477,22 +474,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.
@@ -533,7 +514,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"
@@ -618,7 +598,6 @@ en:
remote_follow:
acct: Enter your username@domain you want to follow 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_unfollow:
@@ -695,7 +674,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:
@@ -804,6 +782,7 @@ en:
contrast: High contrast
default: Mastodon
mastodon-light: Mastodon (light)
+ light: Cybre Lite
time:
formats:
default: "%b %d, %Y, %H:%M"
diff --git a/config/themes.yml b/config/themes.yml
index 9c21c9459..83477ac91 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
+light: styles/cybre-light.scss