nocebo/diaspora
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Cleaning publisher a bit + responsive styling

Browse source
This commit is contained in:
augier 2015-08-22 17:46:10 +02:00
parent f2456eda9c
commit c3ddd4c086
4 changed files with 73 additions and 57 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/assets/javascripts/app/views/publisher_view.js
View file

@ -106,7 +106,7 @@ app.views.Publisher = Backbone.View.extend({
var form = this.$(".content_creation form");
this.view_services = new app.views.PublisherServices({
el: this.$("#publisher_service_icons"),
el: this.$("#publisher-service-icons"),
input: this.inputEl,
form: form
});

47
app/assets/stylesheets/publisher.scss
View file

@ -29,19 +29,17 @@
}
.options_and_submit {
padding: 10px 0 ;
#publisher_service_icons {
.btn-link{ text-decoration: none; }
.btn-link.question_mark .entypo-cog {
padding: 10px 0;
#publisher-service-icons {
text-decoration: none;
.entypo-cog, .service_icon {
color: $text-grey;
font-size: 16px;
line-height: $line-height-computed;
}
.btn-link.question_mark:hover.entypo-cog { color: $black; }
.btn-link.service_icon {
padding-left: 5px;
padding-right: 5px;
line-height: 16px;
}
.service_icon { padding: 6px 5px; }
.btn.btn-link.question_mark:hover .entypo-cog { color: $black; }
.dim { opacity: 0.3; }
.social_media_logos-wordpress-16x16 {
display: inline-block;
@ -49,6 +47,29 @@
width: 16px;
}
}
$sm-xs-average: ($screen-sm + $screen-xs) / 2;
@media(max-width: $sm-xs-average) {
#hide_publisher {
display: block;
width: 100%;
margin-bottom: 5px;
}
}
@media(max-width: $screen-xs) {
.btn-toolbar {
width: 100%;
display: flex;
.btn, .aspect_dropdown{ flex-grow: 1; }
.aspect_dropdown .btn { width: 100%; }
}
.btn-group:first-child { margin: 0; }
.dropdown-menu.pull-right {
left: 0;
right: auto;
}
}
}
#publisher_textarea_wrapper {
@ -59,7 +80,7 @@
input[type='text']#status_message_text {
border: none;
box-shadow: none;
margin: none;
margin: 0;
}
textarea {
@ -153,7 +174,7 @@
color: black;
font-size: 50px;
line-height: 50px;
font-style: bold;
font-weight: bold;
position: absolute;
z-index: 2;
opacity: 0.85;
@ -183,7 +204,7 @@
#upload_error {
color: white;
font-style: bold;
font-weight: bold;
border-top: 1px solid white;
background-color: $red;
text-align: center;

79
app/views/publisher/_publisher.html.haml
View file

@ -4,80 +4,75 @@
if( app.publisher ) app.publisher.triggerGettingStarted();
});
#publisher.row{class: ((aspect == :profile || publisher_open) ? "mention_popup" : "closed")}
.row#publisher{class: ((aspect == :profile || publisher_open) ? "mention_popup" : "closed")}
.content_creation
= form_for(StatusMessage.new) do |status|
= status.error_messages
%params
#publisher_textarea_wrapper
- if current_user.getting_started?
= status.text_area :fake_text, rows: 2, value: h(publisher_formatted_text), tabindex: 1, placeholder: "#{t('contacts.index.start_a_conversation')}...",
'data-title' => popover_with_close_html( '1. ' + t('shared.public_explain.share') ),
'data-content' => t('shared.public_explain.new_user_welcome_message'),
'class' => 'form-control'
= status.text_area :fake_text, :rows => 2, :value => h(publisher_formatted_text),
:tabindex => 1, :placeholder => "#{t('contacts.index.start_a_conversation')}...",
"data-title" => popover_with_close_html("1. " + t("shared.public_explain.share")),
"data-content" => t("shared.public_explain.new_user_welcome_message"),
"class" => "form-control"
- else
= status.text_area :fake_text, rows: 2, value: h(publisher_formatted_text), tabindex: 1, placeholder: "#{t('contacts.index.start_a_conversation')}...",
'class' => 'form-control'
= status.hidden_field :text, value: h(publisher_hidden_text), class: 'clear_on_submit'
= status.text_area :fake_text, :rows => 2, :value => h(publisher_formatted_text),
:tabindex => 1, :placeholder => "#{t('contacts.index.start_a_conversation')}...",
"class" => "form-control"
= status.hidden_field :text, value: h(publisher_hidden_text), class: "clear_on_submit"
#photodropzone_container.container-fluid
.container-fluid#photodropzone_container
%ul#photodropzone
#location_container.form-group{ style: "padding: 4px 6px;"}
= hidden_field :location, :coords
#poll_creator_container
-# handlebars template
#button_container
#publisher-images.pull-right
#poll_creator.btn.btn-link{title: t('shared.publisher.poll.add_a_poll')}
.pull-right#publisher-images
.btn.btn-link#poll_creator{title: t("shared.publisher.poll.add_a_poll")}
%i.entypo-bar-graph
#file-upload.btn.btn-link{title: t('shared.publisher.upload_photos')}
.btn.btn-link#file-upload{title: t("shared.publisher.upload_photos")}
%i.entypo-camera.publisher_image
#locator.btn.btn-link{title: t('shared.publisher.get_location')}
.btn.btn-link#locator{title: t("shared.publisher.get_location")}
%i.entypo-location.publisher_image
#hide_location.btn.btn-link{title: t('shared.publisher.remove_location')}
.btn.btn-link#hide_location{title: t("shared.publisher.remove_location")}
%i.entypo-cross.publisher_image
%span.markdownIndications
!= t('shared.publisher.formatWithMarkdown', markdown_link: link_to(t('help.markdown'), 'https://diasporafoundation.org/formatting', target: :blank))
!= t("shared.publisher.formatWithMarkdown", markdown_link: link_to(t("help.markdown"),
"https://diasporafoundation.org/formatting", target: :blank))
- if publisher_public
= hidden_field_tag 'aspect_ids[]', "public"
= hidden_field_tag "aspect_ids[]", "public"
- elsif all_aspects_selected?(selected_aspects)
= hidden_field_tag 'aspect_ids[]', "all_aspects"
= hidden_field_tag "aspect_ids[]", "all_aspects"
- else
- for aspect_id in aspect_ids
= hidden_field_tag 'aspect_ids[]', aspect_id.to_s
= hidden_field_tag "aspect_ids[]", aspect_id.to_s
#publisher_spinner{class: 'hidden'}
.hidden#publisher_spinner
.loader
.spinner
.options_and_submit.col-sm-12
.public_toggle
.btn.btn-default.pull-left#hide_publisher{title: t('shared.publisher.discard_post')}
%span.text
=t('cancel')
.public_toggle.clearfix
.btn.btn-default.pull-left#hide_publisher{title: t("shared.publisher.discard_post")}
%span.text= t("cancel")
.btn-toolbar.pull-right
%span#publisher_service_icons.btn-group
- if current_user.services
- for service in current_user.services
= service_button(service)
.btn.btn-link{ class: "question_mark",
title: t("shared.public_explain.manage"),
data: {toggle: "modal", target: "#publicExplainModal"}}
%i.entypo-cog
= render partial: "publisher/aspect_dropdown", locals: {selected_aspects: selected_aspects}
%button.btn.btn-default.btn-group.post_preview_button= t("shared.publisher.preview")
%button.btn.btn-group.btn-primary#submit= t("shared.publisher.share")
= render partial: "publisher/aspect_dropdown", locals: { :selected_aspects => selected_aspects }
.btn-toolbar.pull-right#publisher-service-icons
- if current_user.services
- current_user.services.each do |service|
= service_button(service)
.btn.btn-link.question_mark{title: t("shared.public_explain.manage"),
data: {toggle: "modal", target: "#publicExplainModal"}}
%i.entypo-cog
%button.btn.btn-default.btn-group.post_preview_button
%span.text
= t('shared.publisher.preview')
%button#submit.btn.btn-group.btn-primary
%span.text
= t('shared.publisher.share')
= link_to '', contacts_path(:aspect_ids => aspect_ids), class: 'selected_contacts_link hidden'
= link_to "", contacts_path(aspect_ids: aspect_ids), class: "selected_contacts_link hidden"
#publisher_photo_upload
= render 'shared/public_explain'
= render "shared/public_explain"

2
app/views/publisher/_publisher.mobile.haml
View file

@ -8,7 +8,7 @@
= status.text_area :text, placeholder: t('shared.publisher.whats_on_your_mind'), rows: 4, autofocus: "autofocus", class: "form-control"
.form-group
%span#publisher_service_icons
%span#publisher-service-icons
- if current_user.services
- for service in current_user.services
= image_tag "social_media_logos/#{service.provider}-32x32.png", title: service.provider.titleize, class: "service_icon dim", id:"#{service.provider}", maxchar: "#{service.class::MAX_CHARACTERS}"