Mirrors
/
nextcloud-server
mirror of https://github.com/nextcloud/server
3
0
Fork 0
Code Releases Activity
Browse Source

Merge pull request #9374 from nextcloud/federation-share-popover-fix 

Federation share popover fix
pull/9412/head
Morris Jobke 8 years ago
committed by GitHub
parent
ec0623045b 16231da19f
commit
8b0616347c
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 70 additions and 73 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 73
      settings/css/settings.scss
  2. 6
      settings/js/federationscopemenu.js
  3. 7
      settings/js/federationsettingsview.js
  4. 57
      settings/templates/settings/personal/personal.info.php

73
settings/css/settings.scss
View File

@ -38,10 +38,6 @@ input {
.avatardiv { .avatardiv {
margin: 10px auto; margin: 10px auto;
} }
.federationScopeMenu {
/* popover magic fix */
margin-right: calc(-50% - 7px);
}
.warning { .warning {
width: 100%; width: 100%;
} }
@ -110,23 +106,6 @@ input {
grid-template-rows: 1fr 2fr 1fr; grid-template-rows: 1fr 2fr 1fr;
} }
.icon-federation-menu {
padding-left: 16px;
background-size: 16px;
background-position: left 8px;
opacity: .3;
margin-top: -2px;
margin-left: 10px;
cursor: pointer;
.icon-triangle-s {
display: inline-block;
vertical-align: middle;
cursor: pointer;
}
}
.personal-show-container { .personal-show-container {
width: 100%; width: 100%;
} }
@ -322,29 +301,37 @@ input {
} }
} }
.federationScopeMenu {
top: 44px;
margin-right: calc(-50% + 30px); /* half - the triangle icon width - borders */
&.bubble::after {
right: 50%;
transform: translate(50%, 0);
}
&.popovermenu {
a.menuitem, label.menuitem {
font-size: 12.8px;
line-height: 1.6em;
.federation-menu {
position: relative;
cursor: pointer;
margin-left: 10px;
.icon-federation-menu {
padding-left: 16px;
background-size: 16px;
background-position: left center;
opacity: .3;
cursor: inherit;
.icon-triangle-s {
display: inline-block;
vertical-align: middle;
cursor: inherit;
} }
.menuitem {
font-size: 12.8px;
line-height: 1.6em;
.menuitem-text-detail {
opacity: .75;
}
&.active {
box-shadow: inset 2px 0 $color-primary;
.menuitem-text {
font-weight: 600;
}
.federationScopeMenu {
top: 44px;
&.popovermenu {
.menuitem {
// override h2 heading font size
font-size: 12.8px;
line-height: 1.6em;
.menuitem-text-detail {
opacity: .75;
}
&.active {
box-shadow: inset 2px 0 $color-primary;
.menuitem-text {
font-weight: 600;
}
} }
} }
} }

6
settings/js/federationscopemenu.js
View File

@ -37,7 +37,7 @@
*/ */
var FederationScopeMenu = OC.Backbone.View.extend({ var FederationScopeMenu = OC.Backbone.View.extend({
tagName: 'div', tagName: 'div',
className: 'federationScopeMenu popovermenu bubble hidden menu',
className: 'federationScopeMenu popovermenu bubble menu menu-center',
field: undefined, field: undefined,
_scopes: undefined, _scopes: undefined,
@ -129,10 +129,6 @@
break; break;
} }
var $el = $(context.target);
var offsetIcon = $el.offset();
var offsetHeading = $el.closest('h2').offset();
this.render(); this.render();
this.$el.removeClass('hidden'); this.$el.removeClass('hidden');

7
settings/js/federationsettingsview.js
View File

@ -62,14 +62,13 @@
render: function() { render: function() {
var self = this; var self = this;
_.each(this._inputFields, function(field) { _.each(this._inputFields, function(field) {
var $heading = self.$('#' + field + 'form h2');
var $icon = self.$('#' + field + 'form h2 > span');
var $icon = self.$('#' + field + 'form h2 > .federation-menu');
var scopeMenu = new OC.Settings.FederationScopeMenu({field: field}); var scopeMenu = new OC.Settings.FederationScopeMenu({field: field});
self.listenTo(scopeMenu, 'select:scope', function(scope) { self.listenTo(scopeMenu, 'select:scope', function(scope) {
self._onScopeChanged(field, scope); self._onScopeChanged(field, scope);
}); });
$heading.append(scopeMenu.$el);
$icon.append(scopeMenu.$el);
$icon.on('click', _.bind(scopeMenu.show, scopeMenu)); $icon.on('click', _.bind(scopeMenu.show, scopeMenu));
// Restore initial state // Restore initial state
@ -190,7 +189,7 @@
}, },
_setFieldScopeIcon: function(field, scope) { _setFieldScopeIcon: function(field, scope) {
var $icon = this.$('#' + field + 'form > h2 > span');
var $icon = this.$('#' + field + 'form > h2 .icon-federation-menu');
$icon.removeClass('icon-password'); $icon.removeClass('icon-password');
$icon.removeClass('icon-contacts-dark'); $icon.removeClass('icon-contacts-dark');

57
settings/templates/settings/personal/personal.info.php
View File

@ -42,9 +42,12 @@ vendor_style('jcrop/css/jquery.Jcrop');
<div> <div>
<form id="avatarform" class="section" method="post" action="<?php p(\OC::$server->getURLGenerator()->linkToRoute('core.avatar.postAvatar')); ?>"> <form id="avatarform" class="section" method="post" action="<?php p(\OC::$server->getURLGenerator()->linkToRoute('core.avatar.postAvatar')); ?>">
<h2> <h2>
<label><?php p($l->t('Profile picture')); ?></label><span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
<label><?php p($l->t('Profile picture')); ?></label>
<div class="federation-menu">
<span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
</div>
</h2> </h2>
<div id="displayavatar"> <div id="displayavatar">
<div class="avatardiv"></div> <div class="avatardiv"></div>
@ -102,9 +105,11 @@ vendor_style('jcrop/css/jquery.Jcrop');
<form id="displaynameform" class="section"> <form id="displaynameform" class="section">
<h2> <h2>
<label for="displayname"><?php p($l->t('Full name')); ?></label> <label for="displayname"><?php p($l->t('Full name')); ?></label>
<span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
<div class="federation-menu">
<span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
</div>
</h2> </h2>
<input type="text" id="displayname" name="displayname" <input type="text" id="displayname" name="displayname"
<?php if(!$_['displayNameChangeSupported']) { print_unescaped('class="hidden"'); } ?> <?php if(!$_['displayNameChangeSupported']) { print_unescaped('class="hidden"'); } ?>
@ -124,9 +129,11 @@ vendor_style('jcrop/css/jquery.Jcrop');
<form id="emailform" class="section"> <form id="emailform" class="section">
<h2> <h2>
<label for="email"><?php p($l->t('Email')); ?></label> <label for="email"><?php p($l->t('Email')); ?></label>
<span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
<div class="federation-menu">
<span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
</div>
</h2> </h2>
<div class="verify <?php if ($_['email'] === '' || $_['emailScope'] !== 'public') p('hidden'); ?>"> <div class="verify <?php if ($_['email'] === '' || $_['emailScope'] !== 'public') p('hidden'); ?>">
<img id="verify-email" title="<?php p($_['emailMessage']); ?>" data-status="<?php p($_['emailVerification']) ?>" src=" <img id="verify-email" title="<?php p($_['emailMessage']); ?>" data-status="<?php p($_['emailVerification']) ?>" src="
@ -165,9 +172,11 @@ vendor_style('jcrop/css/jquery.Jcrop');
<form id="phoneform" class="section"> <form id="phoneform" class="section">
<h2> <h2>
<label for="phone"><?php p($l->t('Phone number')); ?></label> <label for="phone"><?php p($l->t('Phone number')); ?></label>
<span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
<div class="federation-menu">
<span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
</div>
</h2> </h2>
<input type="tel" id="phone" name="phone" <?php if(!$_['lookupServerUploadEnabled']) print_unescaped('disabled="1"'); ?> <input type="tel" id="phone" name="phone" <?php if(!$_['lookupServerUploadEnabled']) print_unescaped('disabled="1"'); ?>
value="<?php p($_['phone']) ?>" value="<?php p($_['phone']) ?>"
@ -185,9 +194,11 @@ vendor_style('jcrop/css/jquery.Jcrop');
<form id="addressform" class="section"> <form id="addressform" class="section">
<h2> <h2>
<label for="address"><?php p($l->t('Address')); ?></label> <label for="address"><?php p($l->t('Address')); ?></label>
<span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
<div class="federation-menu">
<span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
</div>
</h2> </h2>
<input type="text" id="address" name="address" <?php if(!$_['lookupServerUploadEnabled']) print_unescaped('disabled="1"'); ?> <input type="text" id="address" name="address" <?php if(!$_['lookupServerUploadEnabled']) print_unescaped('disabled="1"'); ?>
placeholder="<?php p($l->t('Your postal address')); ?>" placeholder="<?php p($l->t('Your postal address')); ?>"
@ -205,9 +216,11 @@ vendor_style('jcrop/css/jquery.Jcrop');
<form id="websiteform" class="section"> <form id="websiteform" class="section">
<h2> <h2>
<label for="website"><?php p($l->t('Website')); ?></label> <label for="website"><?php p($l->t('Website')); ?></label>
<span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
<div class="federation-menu">
<span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
</div>
</h2> </h2>
<?php if($_['lookupServerUploadEnabled']) { ?> <?php if($_['lookupServerUploadEnabled']) { ?>
<div class="verify <?php if ($_['website'] === '' || $_['websiteScope'] !== 'public') p('hidden'); ?>"> <div class="verify <?php if ($_['website'] === '' || $_['websiteScope'] !== 'public') p('hidden'); ?>">
@ -252,9 +265,11 @@ vendor_style('jcrop/css/jquery.Jcrop');
<form id="twitterform" class="section"> <form id="twitterform" class="section">
<h2> <h2>
<label for="twitter"><?php p($l->t('Twitter')); ?></label> <label for="twitter"><?php p($l->t('Twitter')); ?></label>
<span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
<div class="federation-menu">
<span class="icon-federation-menu icon-password">
<span class="icon-triangle-s"></span>
</span>
</div>
</h2> </h2>
<?php if($_['lookupServerUploadEnabled']) { ?> <?php if($_['lookupServerUploadEnabled']) { ?>
<div class="verify <?php if ($_['twitter'] === '' || $_['twitterScope'] !== 'public') p('hidden'); ?>"> <div class="verify <?php if ($_['twitter'] === '' || $_['twitterScope'] !== 'public') p('hidden'); ?>">

Write Preview
Loading…
Cancel
Save