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

Merge pull request #6460 from svbergerem/move-new-styles-2

Browse source 
Move new styles (2)
This commit is contained in:
Jonne Haß 2015-10-06 21:56:08 +02:00
commit 26187b633b
17 changed files with 259 additions and 251 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/assets/javascripts/app/pages/settings.js
View file

@ -1,7 +1,7 @@
// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL-v3-or-Later
app.pages.Settings = Backbone.View.extend({
initialize: function() {
$(".settings_visibility").tooltip({placement: "top"});
$(".settings-visibility").tooltip({placement: "top"});
$(".profile-visibility-hint").tooltip({placement: "top"});
$("[name='profile[public_details]']").bootstrapSwitch();
}

10
app/assets/stylesheets/_application.scss
View file

@ -15,7 +15,7 @@
@import 'sprites';
@import 'hovercard';
@import 'base';
@import 'new_styles/interactions';
@import 'interactions';
@import 'spinner';
@import 'timeago';
@import 'vendor/fileuploader';
@ -26,15 +26,15 @@
@import 'typography';
/* login */
@import 'new_styles/login';
@import 'new_styles/registration';
@import 'new_styles/forms';
@import 'login';
@import 'registration';
@import 'forms';
/* terms */
@import 'terms';
/* profile and settings pages */
@import 'new_styles/settings';
@import 'settings';
/* new SPV */
@import 'header';

96
app/assets/stylesheets/forms.scss Normal file
View file

@ -0,0 +1,96 @@
// We need these to reset Bootstrap styles
// scss-lint:disable QualifyingElement
input,
input[type=email],
input[type=text],
input[type=password],
textarea {
&,
&:active,
&:invalid,
&:invalid:required,
&:focus,
&:active:focus,
&:invalid:focus,
&:invalid:required:focus {
border-color: $border-grey;
box-shadow: none;
color: $text-dark-grey;
}
}
// scss-lint:enable QualifyingElement
// Forms described here are only used on the public pages at the moment
.block-form {
margin: 20px auto;
fieldset {
background-color: $white;
margin-bottom: 1em;
position: relative; // To correctly place the entypo icon
input {
border-bottom-width: 0;
border-radius: 0;
color: $text-dark-grey;
margin: 0;
}
.form-control {
font-size: 16px;
height: 40px;
padding: 10px;
padding-left: 40px;
}
.form-control:first-of-type,
.form-control:first-of-type:focus,
.form-control:first-of-type:invalid,
.form-control:first-of-type:invalid:focus,
.form-control:first-of-type:invalid:required,
.form-control:first-of-type:invalid:required:focus {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.form-control:last-of-type,
.form-control:last-of-type:focus,
.form-control:last-of-type:invalid,
.form-control:last-of-type:invalid:focus,
.form-control:last-of-type:invalid:required,
.form-control:last-of-type:invalid:required:focus {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border-bottom-width: 1px;
}
[class^="entypo-"],
[class*="entypo-"] {
color: $text-grey;
font-size: 20px;
left: 10px;
line-height: 20px;
position: absolute;
text-align: center;
top: 10px;
width: 20px;
}
[class^="entypo-"]:nth-of-type(2),
[class*="entypo-"]:nth-of-type(2) {
top: 50px;
}
[class^="entypo-"]:nth-of-type(3),
[class*="entypo-"]:nth-of-type(3) {
top: 90px;
}
[class^="entypo-"]:nth-of-type(4),
[class*="entypo-"]:nth-of-type(4) {
top: 130px;
}
::placeholder { text-transform: uppercase; }
}
}

65
app/assets/stylesheets/interactions.scss Normal file
View file

@ -0,0 +1,65 @@
.control-icons {
a {
&:hover { text-decoration: none; }
[class^="entypo-"],
[class*="entypo-"] {
color: $text-grey;
font-size: $font-size-base;
line-height: $line-height-base;
vertical-align: middle;
}
[class^="entypo-"]:hover,
[class*="entypo-"]:hover {
color: $text;
}
&.hide_conversation i { font-size: $line-height-computed * 1.5; }
&.delete_conversation i { font-size: $font-size-base * 1.5; }
&.destroy_participation i { color: $black; }
&.destroy_participation i:hover { color: $text-dark-grey; }
}
}
.stream_container,
.single-post-interactions {
.control-icons {
float: right;
z-index: 6;
.block_user,
.comment_report,
.create_participation,
.delete,
.destroy_participation,
.post_report {
display: inline-block;
}
> a:hover { text-decoration: none; }
}
}
.stream_element,
.comment,
.photo,
.stream_element:hover .comment {
.control-icons {
@include transition(opacity);
opacity: 0;
}
&:hover .control-icons { opacity: 1; }
}
.stream_element,
.comment,
.photo {
.control-icons > a {
@include transition(opacity);
opacity: .8;
}
.control-icons > a:hover { opacity: 1; }
}

12
app/assets/stylesheets/new_styles/_login.scss → app/assets/stylesheets/login.scss
View file

@ -1,16 +1,16 @@
#login,
#forgot_password,
#reset_password {
.page-sessions.action-new,
.page-passwords.action-new,
.page-passwords.action-edit {
padding-top: 25px;
.logos-asterisk {
margin: auto;
width: 154px;
height: 154px;
margin: auto;
margin-bottom: 12px;
width: 154px;
}
form.block-form {
.block-form {
max-width: 400px;
}
}

90
app/assets/stylesheets/new_styles/_forms.scss
View file

@ -1,90 +0,0 @@
input,
input[type=email],
input[type=text],
input[type=password],
textarea { /* Bootstrap reset */
&,
&:active,
&:invalid,
&:invalid:required,
&:focus,
&:active:focus,
&:invalid:focus,
&:invalid:required:focus {
border-color: $border-grey;
box-shadow: none;
color : $text-dark-grey;
}
}
/* autocomplete colors */
input:-webkit-autofill{
background-color: #fff !important;
background-image: none !important;
}
/* Forms described here are only used on the public pages at the moment */
form.block-form {
margin: 20px auto;
fieldset {
margin-bottom: 1em;
background-color: #fff;
position: relative; /* To correctly place the entypo icon */
input {
color : $text-dark-grey;
margin: 0px;
border-bottom-width: 0px;
border-radius: 0px;
}
.form-control {
font-size: 16px;
height: 40px;
padding: 10px;
padding-left: 40px;
}
.form-control:first-of-type {
&,
&:focus,
&:invalid,
&:invalid:focus,
&:invalid:required,
&:invalid:required:focus {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
}
.form-control:last-of-type {
&,
&:focus,
&:invalid,
&:invalid:focus,
&:invalid:required,
&:invalid:required:focus {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border-bottom-width: 1px;
}
}
[class^="entypo-"], [class*="entypo-"] {
position: absolute;
line-height: 20px;
top: 10px;
left: 10px;
width: 20px;
text-align: center;
color: $text-grey;
font-size: 20px;
&:nth-of-type(2) { top: 50px; }
&:nth-of-type(3) { top: 90px; }
&:nth-of-type(4) { top: 130px; }
}
::placeholder { text-transform: uppercase; }
}
}

59
app/assets/stylesheets/new_styles/_interactions.scss
View file

@ -1,59 +0,0 @@
.control-icons {
a {
&:hover { text-decoration: none; }
[class^="entypo-"], [class*="entypo-"] {
color: $text-grey;
font-size: $font-size-base;
line-height: $line-height-base;
vertical-align: middle;
&:hover { color: $text; }
&.cross { font-size: $line-height-base; }
}
&.hide_conversation i {
font-size: $line-height-computed*1.5;
}
&.delete_conversation i {
font-size: $font-size-base*1.5;
}
&.destroy_participation i {
color: $black;
&:hover { color: $text-dark-grey; }
}
}
}
.stream_container, #single-post-interactions {
.control-icons {
z-index: 6;
float: right;
.block_user,
.comment_report,
.create_participation,
.delete,
.destroy_participation,
.post_report {
display: inline-block;
}
& > a:hover {
text-decoration: none;
}
}
.stream_element, .comment, .photo, .stream_element:hover .comment {
.control-icons > a {
@include transition(opacity);
opacity: 0;
}
&:hover .control-icons {
& > a { opacity: 0.8; }
& > a:hover { opacity: 1; }
}
}
}

52
app/assets/stylesheets/new_styles/_registration.scss
View file

@ -1,52 +0,0 @@
#registration {
.ball {
height: 633px;
max-width: 100%;
background: image-url("branding/ball.png") no-repeat;
background-size: contain;
}
.v-center {
display: table;
height: 633px;
.content {
display: table-cell;
vertical-align: middle;
#pod-name {
text-align: center;
margin: 12px;
font-size : 35px;
}
}
}
form {
max-width: 400px;
.captcha_img {
position: absolute;
left: 10px;
width: 120px;
top: 169px;
}
#user_captcha {
font-size: 16px;
height: 40px;
padding: 10px 10px 10px 130px;
line-height: $line-height-base;
box-sizing: border-box;
width: 100%;
border-bottom: 1px solid $border-grey;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
#terms > a {
color: inherit;
text-decoration: underline;
}
}
}

31
app/assets/stylesheets/new_styles/_settings.scss
View file

@ -1,31 +0,0 @@
/* Specific styles for the settings pages (profile, user account, privacy, services) */
#inner_account_delete {
width: 700px;
}
.as-selections #tags {
box-shadow: none;
}
.enclosed-checkbox label {
margin-bottom: 0;
}
#profile_photo_upload {
text-align: center;
.avatar {
height: auto;
width: auto;
max-width: 200px;
margin-bottom: 20px;
}
}
.settings_visibility { margin-left: 10px; }
#profile_bio {
width: 100%;
max-width: 100%;
min-width: 100%;
}

52
app/assets/stylesheets/registration.scss Normal file
View file

@ -0,0 +1,52 @@
.page-registrations.action-new {
.ball {
background: image-url('branding/ball.png') no-repeat;
background-size: contain;
height: 633px;
max-width: 100%;
}
.v-center {
display: table;
height: 633px;
}
.content {
display: table-cell;
vertical-align: middle;
h2 {
font-size: 35px;
margin: 12px;
text-align: center;
}
}
form {
max-width: 400px;
}
.captcha-img {
left: 10px;
position: absolute;
top: 169px;
width: 120px;
}
.captcha-input {
border-bottom: 1px solid $border-grey;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
box-sizing: border-box;
font-size: 16px;
height: 40px;
line-height: $line-height-base;
padding: 10px 10px 10px 130px;
width: 100%;
}
.terms > a {
color: inherit;
text-decoration: underline;
}
}

22
app/assets/stylesheets/settings.scss Normal file
View file

@ -0,0 +1,22 @@
// Specific styles for the settings pages (profile, user account, privacy, services)
.enclosed-checkbox label {
margin-bottom: 0;
}
.profile-photo-upload {
text-align: center;
.avatar {
height: auto;
margin-bottom: 20px;
max-width: 200px;
width: auto;
}
}
.settings-visibility { margin-left: 10px; }
.page-profiles.action-edit textarea {
max-width: 100%;
min-width: 100%;
}

4
app/assets/templates/single-post-viewer_tpl.jst.hbs
View file

@ -1,8 +1,8 @@
<div id='single-post-container' class='container-fluid'>
<div class='row'>
<div id='single-post-content' class='col-md-6'>
<div id='single-post-content' class='col-md-6 single-post-content'>
</div>
<div id='single-post-interactions' class='col-md-6'>
<div id='single-post-interactions' class='col-md-6 single-post-interactions'>
</div>
</div>
</div>

2
app/views/photos/_new_profile_photo.haml
View file

@ -57,7 +57,7 @@
}
window.onload = createUploader;
#profile_photo_upload
.profile-photo-upload#profile_photo_upload
= owner_image_tag(:thumb_large)
.small-horizontal-spacer
.clearfix

7
app/views/registrations/_form.haml
View file

@ -46,12 +46,15 @@
aria: {labelledby: "passwordConfirmationLabel"}
- if AppConfig.settings.captcha.enable?
= show_simple_captcha object: 'user', :code_type => 'numeric', input_html: {class: "form-control"}
= show_simple_captcha object: "user",
code_type: "numeric",
class: "simple-captcha-image",
input_html: {class: "form-control captcha-input"}
= invite_hidden_tag(invite)
- if AppConfig.settings.terms.enable?
%p#terms.text-center
%p.terms.text-center#terms
= t('registrations.new.terms', terms_link: link_to(t('registrations.new.terms_link'), terms_path, target: "_blank")).html_safe
= f.submit t('registrations.new.sign_up'), class: "btn btn-block btn-large btn-default", data: {disable_with: t('registrations.new.submitting')}

2
app/views/simple_captcha/_simple_captcha.haml
View file

@ -1,3 +1,3 @@
.captcha_img
.captcha-img
= simple_captcha_options[:image]
= simple_captcha_options[:field]

2
app/views/users/_edit.haml
View file

@ -20,7 +20,7 @@
.col-md-6
%h3
= t(".your_email")
%i.entypo-lock.gray.settings_visibility{title: t("users.edit.your_email_private")}
%i.entypo-lock.gray.settings-visibility{title: t("users.edit.your_email_private")}
= form_for "user", url: user_path,

2
features/step_definitions/custom_web_steps.rb
View file

@ -88,6 +88,7 @@ And /^I hover over the "([^"]+)"$/ do |element|
end
When /^I prepare the deletion of the first post$/ do
find(".stream .stream_element", match: :first).hover
within(find(".stream .stream_element", match: :first)) do
ctrl = find(".control-icons")
ctrl.hover
@ -96,6 +97,7 @@ When /^I prepare the deletion of the first post$/ do
end
When /^I prepare hiding the first post$/ do
find(".stream .stream_element", match: :first).hover
within(find(".stream .stream_element", match: :first)) do
ctrl = find(".control-icons")
ctrl.hover