diff --git a/app/assets/javascripts/app/views/publisher/getting_started_view.js b/app/assets/javascripts/app/views/publisher/getting_started_view.js index 25b1dacfd..02a025e0a 100644 --- a/app/assets/javascripts/app/views/publisher/getting_started_view.js +++ b/app/assets/javascripts/app/views/publisher/getting_started_view.js @@ -20,15 +20,13 @@ app.views.PublisherGettingStarted = Backbone.View.extend({ show: function() { this._addPopover(this.firstMessage, { trigger: "manual", - offset: 30, id: "first_message_explain", - placement: "right", + placement: "left", html: true, container: "body" }, 600); this._addPopover(this.visibility, { trigger: "manual", - offset: 10, id: "message_visibility_explain", placement: "bottom", html: true, @@ -36,7 +34,6 @@ app.views.PublisherGettingStarted = Backbone.View.extend({ }, 1000); this._addPopover(this.stream, { trigger: "manual", - offset: -5, id: "stream_explain", placement: "left", html: true, @@ -77,4 +74,3 @@ app.views.PublisherGettingStarted = Backbone.View.extend({ } }); // @license-end - diff --git a/app/assets/javascripts/app/views/publisher_view.js b/app/assets/javascripts/app/views/publisher_view.js index 5446a972f..609c29c4c 100644 --- a/app/assets/javascripts/app/views/publisher_view.js +++ b/app/assets/javascripts/app/views/publisher_view.js @@ -121,7 +121,7 @@ app.views.Publisher = Backbone.View.extend({ this.viewGettingStarted = new app.views.PublisherGettingStarted({ firstMessageEl: this.inputEl, visibilityEl: this.$(".public_toggle .aspect_dropdown > .dropdown-toggle"), - streamEl: $("#gs-shim") + streamEl: $("#main_stream") }); this.viewUploader = new app.views.PublisherUploader({ diff --git a/app/assets/javascripts/app/views/sidebar.js b/app/assets/javascripts/app/views/sidebar.js index 446137bb0..04892aa57 100644 --- a/app/assets/javascripts/app/views/sidebar.js +++ b/app/assets/javascripts/app/views/sidebar.js @@ -1,7 +1,7 @@ // @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL-v3-or-Later app.views.Sidebar = app.views.Base.extend({ - el: ".rightbar", + el: ".info-bar", events: { "click input#invite_code": "selectInputText" @@ -12,4 +12,3 @@ app.views.Sidebar = app.views.Base.extend({ } }); // @license-end - diff --git a/app/assets/stylesheets/getting-started.scss b/app/assets/stylesheets/getting-started.scss index 16cc1bff7..32b416449 100644 --- a/app/assets/stylesheets/getting-started.scss +++ b/app/assets/stylesheets/getting-started.scss @@ -45,10 +45,8 @@ #welcome-to-diaspora { background: orange; box-shadow: inset 0 -2px 10px rgba(0,0,0,0.35); - margin-bottom: 20px; - margin-top: -40px; padding-bottom: 30px; - padding-top: 60px; + padding-top: 20px; h1,h3 { color: $white; diff --git a/app/assets/stylesheets/navbar_left.scss b/app/assets/stylesheets/navbar_left.scss index aad0a35dd..6a3b99184 100644 --- a/app/assets/stylesheets/navbar_left.scss +++ b/app/assets/stylesheets/navbar_left.scss @@ -5,19 +5,14 @@ height: 100%; } +.left-navbar, .left-navbar-fixed-background { - background: $sidebars-background; border-right: 1px solid $light-grey; - position: fixed; - height: 100%; + background: $sidebars-background; } .left-navbar { - background: $sidebars-background; - border-right: 1px solid $light-grey; a { - color: $link-grey; - font-weight: bold; text-decoration: none; outline: 0; } @@ -32,11 +27,14 @@ } .hoverable { - border-bottom: 1px solid $border-grey; color: $link-grey; display: block; - font-weight: normal; padding: 10px 20px; + font-weight: bold; + + a { + color: $link-grey; + } &:hover, &:hover a, &:hover [class^="entypo"] { background-color: $blue; @@ -45,16 +43,16 @@ } } - .all_aspects a.hoverable.selected, - .followed-tags-sidebar a.hoverable.selected, - li.selected > a.hoverable { + .all-aspects .hoverable.selected, + .followed-tags-sidebar .hoverable.selected, + .selected > .hoverable { color: $white; background: $gray; border-color: $gray; } - #aspects_list, - #tags_list { + .all-aspects ul, + .followed-tags-sidebar ul { background: $left-navbar-drawer-background; li { padding: 0; } .entypo-check { visibility: hidden; } @@ -114,78 +112,78 @@ } /* ---- end override app/stylesheets/vendor/autoSuggest.css ---- */ } +} - .info-bar { - margin-top: 25px; +.info-bar { + margin-top: 25px; - .section { - margin-bottom: 20px; + .section { + margin-bottom: 20px; + } - > .title { - border-bottom: 1px solid $border-grey; - padding-bottom: 5px; + .title { + border-bottom: 1px solid $border-grey; + padding-bottom: 5px; - h5 { - color: $text-dark-grey; - font-size: $font-size-base; - margin: 0; - } - } - - .content { - color: $text-grey; - font-size: $font-size-small; - line-height: 18px; - padding: 10px 0; - - p, - ul { - margin: 0; - } - - ul { - margin-bottom: 5px; - padding-left: 0; - li { list-style: none; } - } - - .btn-link { - font-size: $font-size-small; - padding-left: 0; - } - - > #invite_code { - box-sizing: border-box; - font-size: $font-size-small; - height: 30px; - width: 100%; - } - - > .right-service-icons { - padding: 10px { - bottom: 0; - } - text-align: center; - - .social-media-logos-facebook-24x24, - .social-media-logos-twitter-24x24, - .social-media-logos-tumblr-24x24, - .social-media-logos-wordpress-24x24 { - height: 24px; - width: 24px; - } - - a { - display: inline-block; - } - } - - .stream-faces { - display: flex; - flex-flow: row wrap; - img { margin: 1px; } - } - } + h5 { + color: $text-dark-grey; + font-size: $font-size-base; + margin: 0; } } + + .content { + color: $text-grey; + font-size: $font-size-small; + line-height: 18px; + padding: 10px 0; + + p, + ul { + margin: 0; + } + + ul { + list-style: none; + margin-bottom: 5px; + padding-left: 0; + } + + .btn-link { + font-size: $font-size-small; + padding-left: 0; + } + + > [name="invite_code"] { + box-sizing: border-box; + font-size: $font-size-small; + height: 30px; + width: 100%; + } + } + + .right-service-icons { + padding: 10px { + bottom: 0; + } + text-align: center; + + .social-media-logos-facebook-24x24, + .social-media-logos-twitter-24x24, + .social-media-logos-tumblr-24x24, + .social-media-logos-wordpress-24x24 { + height: 24px; + width: 24px; + } + + a { + display: inline-block; + } + } + + .stream-faces { + display: flex; + flex-flow: row wrap; + img { margin: 1px; } + } } diff --git a/app/assets/stylesheets/publisher.scss b/app/assets/stylesheets/publisher.scss index 242c59fcb..df04cf349 100644 --- a/app/assets/stylesheets/publisher.scss +++ b/app/assets/stylesheets/publisher.scss @@ -1,4 +1,4 @@ -#publisher { +.publisher { z-index: 1; color: $text-grey; margin: 0; @@ -36,6 +36,7 @@ .options_and_submit { padding: 10px 0; + #publisher-service-icons { text-decoration: none; diff --git a/app/assets/stylesheets/stream.scss b/app/assets/stylesheets/stream.scss index 09edd9a61..9176d4b26 100644 --- a/app/assets/stylesheets/stream.scss +++ b/app/assets/stylesheets/stream.scss @@ -1,8 +1,14 @@ -body.page-streams, body.page-photos { - background-color: $sidebars-sub-background; +.page-streams, +.page-people, +.page-photos, +.page-tags { + background-color: $sidebars-background; } .stream_container { + margin: auto; + max-width: 900px; + .stream-title { margin: 12px 0; } @@ -16,7 +22,14 @@ body.page-streams, body.page-photos { width: 50px; } - #publisher { + .publisher { margin-left: 65px; } } + +@media(max-width: $screen-xs) { + + .publisher { + margin-left: 0; + } +} diff --git a/app/views/aspects/_aspect_stream.haml b/app/views/aspects/_aspect_stream.haml index f26a2dd17..b4cf0ce4f 100644 --- a/app/views/aspects/_aspect_stream.haml +++ b/app/views/aspects/_aspect_stream.haml @@ -7,14 +7,13 @@ = stream.title .container-fluid.main-stream-publisher - .pull-left + .pull-left.hidden-xs = owner_image_link = render "publisher/publisher", publisher_aspects_for(stream) = render "aspects/no_posts_message" -#gs-shim{:title => popover_with_close_html("3. #{t('.stay_updated')}"), 'data-content' => t('.stay_updated_explanation')} - -#main_stream.stream +.stream#main_stream{title: popover_with_close_html("3. #{t('.stay_updated')}"), + "data-content" => t(".stay_updated_explanation")} #paginate %span.loader.hidden diff --git a/app/views/publisher/_publisher.html.haml b/app/views/publisher/_publisher.html.haml index 70d386ce5..3ecec1f40 100644 --- a/app/views/publisher/_publisher.html.haml +++ b/app/views/publisher/_publisher.html.haml @@ -4,7 +4,7 @@ if( app.publisher ) app.publisher.triggerGettingStarted(); }); -.row#publisher{class: ((aspect == :profile || publisher_open) ? "mention_popup" : "closed")} +.row.publisher#publisher{class: ((aspect == :profile || publisher_open) ? "mention_popup" : "closed")} .content_creation = form_for(StatusMessage.new) do |status| = status.error_messages diff --git a/app/views/streams/main_stream.html.haml b/app/views/streams/main_stream.html.haml index 539600275..3fe7e0165 100644 --- a/app/views/streams/main_stream.html.haml +++ b/app/views/streams/main_stream.html.haml @@ -31,7 +31,7 @@ = link_to t("streams.activity.title"), activity_stream_path, rel: "backbone", class: "hoverable" %li{data: {stream: "mentions"}} = link_to t("streams.mentions.title"), mentioned_stream_path, rel: "backbone", class: "hoverable" - %li.all_aspects + %li.all-aspects = render "aspects/aspect_listings", stream: @stream %li.followed-tags-sidebar = render "tags/followed_tags_listings" diff --git a/app/views/tags/show.haml b/app/views/tags/show.haml index ce9588663..490516768 100644 --- a/app/views/tags/show.haml +++ b/app/views/tags/show.haml @@ -10,6 +10,7 @@ .container-fluid#tags_show .row + .col-lg-3.hidden-xs.left-navbar-fixed-background .col-md-3.hidden-xs %h4 = t('.tagged_people', count: @stream.tagged_people_count, tag: @stream.display_tag_name) diff --git a/features/step_definitions/aspects_steps.rb b/features/step_definitions/aspects_steps.rb index 0cfeb8242..b51284dcc 100644 --- a/features/step_definitions/aspects_steps.rb +++ b/features/step_definitions/aspects_steps.rb @@ -34,7 +34,7 @@ end World(AspectCukeHelpers) When /^I click on "([^"]*)" aspect edit icon$/ do |aspect_name| - within(".all_aspects") do + within(".all-aspects") do li = find('li', text: aspect_name) li.hover li.find('.modify_aspect').click