diff options
| -rw-r--r-- | .gitignore | 1 | ||||
| -rw-r--r-- | app/assets/images/avatars/missing.png | bin | 0 -> 3890 bytes | |||
| -rw-r--r-- | app/assets/stylesheets/application.scss | 13 | ||||
| -rw-r--r-- | app/assets/stylesheets/profile.scss | 62 | ||||
| -rw-r--r-- | app/models/account.rb | 8 | ||||
| -rw-r--r-- | app/views/profile/_status.html.haml | 16 | ||||
| -rw-r--r-- | app/views/profile/show.html.haml | 12 |
7 files changed, 81 insertions, 31 deletions
diff --git a/.gitignore b/.gitignore index 6d3b79652..b4a53fe1b 100644 --- a/.gitignore +++ b/.gitignore @@ -16,3 +16,4 @@ !/log/.keep /tmp coverage +public/system diff --git a/app/assets/images/avatars/missing.png b/app/assets/images/avatars/missing.png new file mode 100644 index 000000000..40353039f --- /dev/null +++ b/app/assets/images/avatars/missing.png Binary files differdiff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index 91b0d12fe..068480994 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -14,11 +14,24 @@ body { font-size: 13px; line-height: 18px; color: $quaternary-color; + + &::before { + display: block; + content: ""; + position: absolute; + background: $secondary-color; + width: 100%; + height: 200px; + z-index: -1; + top: 0; + left: 0; + } } .container { width: 800px; margin: 0 auto; + z-index: 2; } .footer { diff --git a/app/assets/stylesheets/profile.scss b/app/assets/stylesheets/profile.scss index 5508b8424..e2b59268a 100644 --- a/app/assets/stylesheets/profile.scss +++ b/app/assets/stylesheets/profile.scss @@ -1,5 +1,13 @@ .card { - padding-top: 20px; + margin-top: 40px; + display: flex; + background: darken($background-color, 10%); + border-bottom: 1px solid darken($background-color, 15%); + box-shadow: 4px 3px 0 rgba(0, 0, 0, 0.1); + + .bio { + flex-grow: 1; + } .name { font-size: 24px; @@ -12,24 +20,18 @@ } } - .bio { - - } - - .counter { - display: block; + .avatar { + width: 96px; float: left; - width: 100px; - text-align: center; - border: 1px solid #A593E0; - color: #A593E0; - border-radius: 5px; - padding: 3px 0; - margin-right: 3px; - - .num { + margin-right: 10px; + padding: 10px; + margin-top: -30px; + + img { + width: 94px; + height: 94px; display: block; - font-size: 24px; + border: 2px solid $background-color; } } } @@ -52,11 +54,33 @@ } } + .entry-container { + display: flex; + } + + .avatar { + width: 48px; + padding: 10px; + padding-left: 8px; + padding-right: 0; + padding-top: 12px; + + img { + width: 48px; + height: 48px; + display: block; + box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.1); + } + } + + .container { + flex-grow: 1; + } + .header { margin-bottom: 10px; padding: 10px; padding-bottom: 0; - padding-left: 8px; .name { text-decoration: none; @@ -79,6 +103,7 @@ color: $tertiary-color; padding: 5px 10px; padding-left: 8px; + clear: both; .name { color: $tertiary-color; @@ -112,7 +137,6 @@ cursor: default; padding: 10px; padding-top: 0; - padding-left: 8px; .counter { display: inline-block; diff --git a/app/models/account.rb b/app/models/account.rb index 0940118dc..f1ac6fdd7 100644 --- a/app/models/account.rb +++ b/app/models/account.rb @@ -3,7 +3,8 @@ class Account < ActiveRecord::Base has_one :user, inverse_of: :account # Avatar upload - has_attached_file :avatar, styles: { large: '300x300#', medium: '96x96#', small: '48x48#' } + attr_reader :avatar_remote_url + has_attached_file :avatar, styles: { large: '300x300#', medium: '96x96#', small: '48x48#' }, default_url: 'avatars/missing.png' validates_attachment_content_type :avatar, content_type: /\Aimage\/.*\Z/ # Timelines @@ -64,6 +65,11 @@ class Account < ActiveRecord::Base @subscription ||= OStatus2::Subscription.new(self.remote_url, secret: self.secret, token: self.verify_token, webhook: webhook_url, hub: self.hub_url) end + def avatar_remote_url=(url) + self.avatar = URI.parse(url) + @avatar_remote_url = url + end + before_create do if local? keypair = OpenSSL::PKey::RSA.new(Rails.env.test? ? 48 : 2048) diff --git a/app/views/profile/_status.html.haml b/app/views/profile/_status.html.haml index 44c58b84e..c2033b4f7 100644 --- a/app/views/profile/_status.html.haml +++ b/app/views/profile/_status.html.haml @@ -4,9 +4,13 @@ %i.fa.fa-retweet Shared by = link_to display_name(status.account), profile_url(status.account), class: 'name' - .header - = render partial: 'status_header', locals: { status: status.reblog? ? status.reblog : status } - .content - = status.content - .counters - = render partial: 'status_footer', locals: { status: status.reblog? ? status.reblog : status } + .entry-container + .avatar + = image_tag status.reblog? ? status.reblog.account.avatar.url(:small) : status.account.avatar.url(:small) + .container + .header + = render partial: 'status_header', locals: { status: status.reblog? ? status.reblog : status } + .content + = status.content + .counters + = render partial: 'status_footer', locals: { status: status.reblog? ? status.reblog : status } diff --git a/app/views/profile/show.html.haml b/app/views/profile/show.html.haml index c84cb7e81..b93791734 100644 --- a/app/views/profile/show.html.haml +++ b/app/views/profile/show.html.haml @@ -1,8 +1,10 @@ -%div.card - %h1.name - = @account.display_name.blank? ? @account.username : @account.display_name - %small= "@#{@account.username}" +.card + .avatar= image_tag @account.avatar.url(:medium) + .bio + %h1.name + = @account.display_name.blank? ? @account.username : @account.display_name + %small= "@#{@account.username}" -%div.activity-stream +.activity-stream - @account.statuses.order('id desc').each do |status| = render partial: 'status', locals: { status: status } |
