commit: 8803ca9efe23caa9c885ef1ebe411188f1e5169a
parent: 6b1db5c2b202383bd22d40909a68df8cbcb20b36
Author: Eugen Rochko <eugen@zeonfederated.com>
Date: Tue, 21 Mar 2017 19:18:37 +0100
Improved landing page
Diffstat:
5 files changed, 124 insertions(+), 9 deletions(-)
diff --git a/app/assets/images/fluffy-elephant-friend.png b/app/assets/images/fluffy-elephant-friend.png
Binary files differ.
diff --git a/app/assets/stylesheets/about.scss b/app/assets/stylesheets/about.scss
@@ -95,6 +95,7 @@
.actions {
overflow: hidden;
+ margin-bottom: 20px;
.info {
float: right;
@@ -273,3 +274,61 @@
}
}
}
+
+.features-list {
+ display: flex;
+ margin-bottom: 20px;
+
+ .features-list__column {
+ flex: 1 1 0;
+
+ ul {
+ list-style: none;
+ }
+
+ li {
+ margin: 0;
+ }
+ }
+}
+
+.screenshot-with-signup {
+ display: flex;
+ margin-bottom: 20px;
+
+ .mascot {
+ flex: 1 1 auto;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+
+ img {
+ display: block;
+ margin: 0 auto;
+ max-width: 100%;
+ height: auto;
+ }
+ }
+
+ .simple_form {
+ width: 300px;
+ flex: 0 0 auto;
+ background: rgba(darken($color1, 7%), 0.5);
+ padding: 14px;
+ border-radius: 4px;
+ box-shadow: 0 0 15px rgba($color8, 0.4);
+
+ .actions {
+ margin-bottom: 0;
+ }
+
+ .info {
+ text-align: center;
+
+ a {
+ color: $color2;
+ }
+ }
+ }
+}
diff --git a/app/views/about/index.html.haml b/app/views/about/index.html.haml
@@ -20,17 +20,64 @@
Mastodon
%p= t('about.about_mastodon').html_safe
- %p= t('about.about_instance', instance: Rails.configuration.x.local_domain).html_safe
- .screenshot= image_tag 'screenshot.png'
+ .screenshot-with-signup
+ .mascot= image_tag 'fluffy-elephant-friend.png'
+
+ = simple_form_for(:user, url: user_registration_path) do |f|
+ = f.simple_fields_for :account do |ff|
+ = ff.input :username, autofocus: true, placeholder: t('simple_form.labels.defaults.username'), required: true, input_html: { 'aria-label' => t('simple_form.labels.defaults.username') }
+
+ = f.input :email, placeholder: t('simple_form.labels.defaults.email'), required: true, input_html: { 'aria-label' => t('simple_form.labels.defaults.email') }
+ = f.input :password, autocomplete: "off", placeholder: t('simple_form.labels.defaults.password'), required: true, input_html: { 'aria-label' => t('simple_form.labels.defaults.password') }
+ = f.input :password_confirmation, autocomplete: "off", placeholder: t('simple_form.labels.defaults.confirm_password'), required: true, input_html: { 'aria-label' => t('simple_form.labels.defaults.confirm_password') }
+
+ .actions
+ = f.button :button, t('about.get_started'), type: :submit
+
+ .info
+ = link_to t('auth.login'), new_user_session_path, class: 'webapp-btn'
+ ·
+ = link_to t('about.about_this'), about_more_path
+
+ %h3= t('about.features_headline')
+
+ .features-list
+ .features-list__column
+ %ul.fa-ul
+ %li
+ = fa_icon('li check-square')
+ = t 'about.features.chronology'
+ %li
+ = fa_icon('li check-square')
+ = t 'about.features.public'
+ %li
+ = fa_icon('li check-square')
+ = t 'about.features.characters'
+ %li
+ = fa_icon('li check-square')
+ = t 'about.features.gifv'
+ .features-list__column
+ %ul.fa-ul
+ %li
+ = fa_icon('li check-square')
+ = t 'about.features.privacy'
+ %li
+ = fa_icon('li check-square')
+ = t 'about.features.blocks'
+ %li
+ = fa_icon('li check-square')
+ = t 'about.features.ethics'
+ %li
+ = fa_icon('li check-square')
+ = t 'about.features.api'
- unless @description.blank?
+ %h3= t('about.description_headline', domain: Rails.configuration.x.local_domain)
%p= @description.html_safe
.actions
.info
- = link_to t('about.learn_more'), about_more_path
- ·
= link_to t('about.terms'), terms_path
·
= link_to t('apps'), 'https://github.com/tootsuite/mastodon/blob/master/docs/Using-Mastodon/Apps.md'
@@ -38,6 +85,3 @@
= link_to t('about.source_code'), 'https://github.com/tootsuite/mastodon'
·
= link_to t('about.other_instances'), 'https://github.com/tootsuite/mastodon/blob/master/docs/Using-Mastodon/List-of-Mastodon-instances.md'
-
- = link_to t('about.get_started'), new_user_registration_path, class: 'button webapp-btn'
- = link_to t('auth.login'), new_user_session_path, class: 'button webapp-btn'
diff --git a/app/views/settings/preferences/show.html.haml b/app/views/settings/preferences/show.html.haml
@@ -7,7 +7,7 @@
.fields-group
= f.input :locale, collection: I18n.available_locales, wrapper: :with_label, include_blank: false, label_method: lambda { |locale| human_locale(locale) }
- = f.input :setting_default_privacy, collection: Status.visibilities.keys, wrapper: :with_label, include_blank: false, label_method: lambda { |visibility| I18n.t("statuses.visibilities.#{visibility}") }, required: false
+ = f.input :setting_default_privacy, collection: Status.visibilities.keys - [:direct], wrapper: :with_label, include_blank: false, label_method: lambda { |visibility| I18n.t("statuses.visibilities.#{visibility}") }, required: false
.fields-group
= f.simple_fields_for :notification_emails, hash_to_object(current_user.settings.notification_emails) do |ff|
diff --git a/config/locales/en.yml b/config/locales/en.yml
@@ -2,11 +2,23 @@
en:
about:
about_instance: "<em>%{instance}</em> is a Mastodon instance."
- about_mastodon: Mastodon is a <em>free, open-source</em> social network server. A <em>decentralized</em> alternative to commercial platforms, it avoids the risks of a single company monopolizing your communication. Anyone can run Mastodon and participate in the <em>social network</em> seamlessly.
+ about_mastodon: Mastodon is a <em>free, open-source</em> social network. A <em>decentralized</em> alternative to commercial platforms, it avoids the risks of a single company monopolizing your communication. Pick a server that you trust — whichever you choose, you can interact with everyone else. Anyone can run their own Mastodon instance and participate in the <em>social network</em> seamlessly.
+ about_this: About this instance
business_email: 'Business e-mail:'
contact: Contact
+ description_headline: What is %{domain}?
domain_count_after: other instances
domain_count_before: Connected to
+ features:
+ api: Open API for apps and services
+ blocks: Rich block and muting tools
+ characters: 500 characters per post
+ chronology: Timelines are chronological
+ ethics: 'Ethical design: no ads, no tracking'
+ gifv: GIFV sets and short videos
+ privacy: Granular, per-post privacy settings
+ public: Public timelines
+ features_headline: What sets Mastodon apart
get_started: Get started
learn_more: Learn more
links: Links
