commit: b3c7c8700d7ddf73d6fef4076f15ae7c3d39ce67
parent: 188c6f326b991793239c47751ef45226c0cd8890
Author: Eugen Rochko <eugen@zeonfederated.com>
Date: Mon, 3 Oct 2016 16:10:17 +0200
Fix most pages on small screens
Diffstat:
8 files changed, 96 insertions(+), 23 deletions(-)
diff --git a/app/assets/stylesheets/about.scss b/app/assets/stylesheets/about.scss
@@ -3,7 +3,7 @@
.about-body {
.wrapper {
- width: 600px;
+ max-width: 600px;
margin: 0 auto;
color: #9baec8;
padding-top: 200px;
@@ -38,4 +38,10 @@
font: 16px/16px 'Montserrat', sans-serif;
font-weight: 300;
}
+
+ @media screen and (max-width: 360px) {
+ .wrapper {
+ padding: 20px;
+ }
+ }
}
diff --git a/app/assets/stylesheets/accounts.scss b/app/assets/stylesheets/accounts.scss
@@ -63,6 +63,13 @@
margin-top: 30px;
position: relative;
z-index: 2;
+ flex-direction: row;
+ }
+
+ .details-counters {
+ display: flex;
+ flex-direction: row;
+ order: 0;
}
.counter {
@@ -129,6 +136,26 @@
line-height: 18px;
padding: 5px 10px;
color: #d9e1e8;
+ order: 1;
+ }
+
+ @media screen and (max-width: 360px) {
+ .details {
+ display: block;
+ }
+
+ .bio {
+ text-align: center;
+ margin-bottom: 20px;
+ }
+
+ .counter {
+ flex: 1 1 auto;
+ }
+
+ .counter:last-child {
+ border-right: none;
+ }
}
}
@@ -186,6 +213,18 @@
cursor: default;
color: lighten(#282c37, 10%);
}
+
+ @media screen and (max-width: 360px) {
+ padding: 30px 20px;
+
+ a, .current, .next_page, .previous_page, .gap {
+ display: none;
+ }
+
+ .next_page, .previous_page {
+ display: inline-block;
+ }
+ }
}
.accounts-grid {
diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
@@ -69,7 +69,6 @@ body {
padding-bottom: 140px;
text-rendering: optimizelegibility;
font-feature-settings: "kern";
- min-width: 380px;
&.app-body {
position: fixed;
@@ -77,6 +76,10 @@ body {
height: 100%;
padding: 0;
}
+
+ @media screen and (max-width: 360px) {
+ padding-bottom: 0;
+ }
}
.app-holder {
@@ -99,10 +102,14 @@ body {
}
.logo-container {
- width: 400px;
+ max-width: 400px;
margin: 100px auto;
cursor: default;
+ @media screen and (max-width: 360px) {
+ margin: 30px auto;
+ }
+
h1 {
display: block;
text-align: center;
@@ -145,7 +152,7 @@ body {
}
.form-container {
- width: 400px;
+ max-width: 400px;
margin: 0 auto;
padding: 20px;
@@ -321,6 +328,11 @@ body {
font-size: 12px;
font-weight: 400;
font-family: 'Roboto Mono', monospace;
+
+ a {
+ color: inherit;
+ text-decoration: none;
+ }
}
.powered-by {
diff --git a/app/assets/stylesheets/stream_entries.scss b/app/assets/stylesheets/stream_entries.scss
@@ -60,8 +60,12 @@
border-radius: 0;
box-shadow: none;
- &.activity-stream-headless {
- .entry:first-child {
+ .entry {
+ &:last-child {
+ border-radius: 0;
+ }
+
+ &:first-child {
border-radius: 0;
&:last-child {
@@ -71,6 +75,12 @@
}
}
+ @media screen and (max-width: 360px) {
+ .avatar {
+ display: none;
+ }
+ }
+
.entry__container {
display: flex;
}
@@ -192,6 +202,7 @@
display: block;
overflow: hidden;
padding-left: 10px;
+ margin-bottom: 21px;
li {
display: block;
@@ -200,7 +211,7 @@
height: 100px;
border-radius: 4px;
margin-right: 4px;
- margin-bottom: 25px;
+ margin-bottom: 4px;
a {
display: block;
diff --git a/app/helpers/accounts_helper.rb b/app/helpers/accounts_helper.rb
@@ -1,5 +1,10 @@
module AccountsHelper
def pagination_options
- { previous_label: "#{fa_icon('chevron-left')} Prev".html_safe, next_label: "Next #{fa_icon('chevron-right')}".html_safe, inner_window: 2 }
+ {
+ previous_label: "#{fa_icon('chevron-left')} Prev".html_safe,
+ next_label: "Next #{fa_icon('chevron-right')}".html_safe,
+ inner_window: 1,
+ outer_window: 0
+ }
end
end
diff --git a/app/models/user.rb b/app/models/user.rb
@@ -6,8 +6,6 @@ class User < ApplicationRecord
validates :account, presence: true
- has_many :oauth_applications, class_name: 'Doorkeeper::Application', as: :owner
-
scope :prolific, -> { joins('inner join statuses on statuses.account_id = users.account_id').select('users.*, count(statuses.id) as statuses_count').group('users.id').order('statuses_count desc') }
scope :recent, -> { order('created_at desc') }
scope :admins, -> { where(admin: true) }
diff --git a/app/views/accounts/_header.html.haml b/app/views/accounts/_header.html.haml
@@ -4,17 +4,19 @@
= display_name(@account)
%small= "@#{@account.username}"
.details
- .counter{ class: active_nav_class(account_url(@account)) }
- = link_to account_url(@account) do
- %span.counter-label Posts
- %span.counter-number= @account.statuses.count
- .counter{ class: active_nav_class(following_account_url(@account)) }
- = link_to following_account_url(@account) do
- %span.counter-label Following
- %span.counter-number= @account.following.count
- .counter{ class: active_nav_class(followers_account_url(@account)) }
- = link_to followers_account_url(@account) do
- %span.counter-label Followers
- %span.counter-number= @account.followers.count
.bio
%p= @account.note
+
+ .details-counters
+ .counter{ class: active_nav_class(account_url(@account)) }
+ = link_to account_url(@account) do
+ %span.counter-label Posts
+ %span.counter-number= @account.statuses.count
+ .counter{ class: active_nav_class(following_account_url(@account)) }
+ = link_to following_account_url(@account) do
+ %span.counter-label Following
+ %span.counter-number= @account.following.count
+ .counter{ class: active_nav_class(followers_account_url(@account)) }
+ = link_to followers_account_url(@account) do
+ %span.counter-label Followers
+ %span.counter-number= @account.followers.count
diff --git a/app/views/layouts/public.html.haml b/app/views/layouts/public.html.haml
@@ -1,7 +1,7 @@
- content_for :content do
.container= yield
.footer
- %span.domain= Rails.configuration.x.local_domain
+ %span.domain= link_to Rails.configuration.x.local_domain, root_path
%span.powered-by
\//
powered by
