mbk-lab
/
nextcloud
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #3187 from nextcloud/inputs-scss-optimisation 

Inputs.scss rewritting and optimisation
This commit is contained in:
Morris Jobke 2017-01-22 11:41:49 -06:00 committed by GitHub
parent bde1150d04 08361e61d2
commit 0d6e3ca86b
26 changed files with 352 additions and 666 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
apps/files_sharing/css/authenticate.css
View File

@ -9,12 +9,8 @@ input[type='submit'] {
margin: 6px; margin: 6px;
} }
#body-login input[type='submit'] {
position: absolute;
top: 0;
border: none;
}
fieldset > p { fieldset > p {
position: relative; position: relative;
display: flex;
align-items: center;
} }

63
apps/files_sharing/css/public.css
View File

@ -107,29 +107,30 @@ thead {
max-width: 90%; max-width: 90%;
} }
/* header buttons */
#details {
display: inline-flex;
}
#details button,
#details input,
#details .button {
margin: 0 5px;
line-height: normal;
}
#details button:hover,
#details input:hover,
#details .button:hover {
/* No */
border-color: rgba(0,0,0,0.3) !important;
}
/* within #save */ /* within #save */
#save .save-form { #save .save-form {
position: relative; position: relative;
} }
#remote_address { #remote_address {
margin: 0; width: 200px;
width: 130px;
height: 14px;
padding: 6px;
padding-right: 24px;
}
.ie8 #remote_address {
padding-right: 30px;
}
#save #save-button,
#save #save-button-confirm {
margin: 0 5px;
height: 28px;
padding-bottom: 4px;
line-height: 14px;
} }
#save-button-confirm { #save-button-confirm {
@ -137,31 +138,9 @@ thead {
background-color: transparent; background-color: transparent;
border: none; border: none;
margin: 2px 4px !important; margin: 2px 4px !important;
right: 0; right: 4px;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; box-shadow: none;
filter: alpha(opacity=50); height: 30px;
opacity: .5;
}
.ie8 #save-button-confirm {
margin: 2px 0 !important;
}
#save-button-confirm:disabled,
#save-button-confirm:disabled:hover,
#save-button-confirm:disabled:focus {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
filter: alpha(opacity=20);
opacity: .2;
cursor: default;
}
#save-button-confirm:hover,
#save-button-confirm:focus {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
cursor: pointer;
} }
#public-upload .avatardiv { #public-upload .avatardiv {

2
apps/files_sharing/js/public.js
View File

@ -259,7 +259,7 @@ OCA.Sharing.PublicApp = {
$('.save-form').submit(function (event) { $('.save-form').submit(function (event) {
event.preventDefault(); event.preventDefault();
var remote = $(this).find('input[type="text"]').val(); var remote = $(this).find('input[type="email"]').val();
var token = $('#sharingToken').val(); var token = $('#sharingToken').val();
var owner = $('#save').data('owner'); var owner = $('#save').data('owner');
var ownerDisplayName = $('#save').data('owner-display-name'); var ownerDisplayName = $('#save').data('owner-display-name');

8
apps/files_sharing/templates/public.php
View File

@ -58,13 +58,13 @@ $maxUploadFilesize = min($upload_max_filesize, $post_max_size);
data-owner-display-name="<?php p($_['displayName']) ?>" data-owner="<?php p($_['owner']) ?>" data-name="<?php p($_['filename']) ?>"> data-owner-display-name="<?php p($_['displayName']) ?>" data-owner="<?php p($_['owner']) ?>" data-name="<?php p($_['filename']) ?>">
<button id="save-button"><?php p($l->t('Add to your Nextcloud')) ?></button> <button id="save-button"><?php p($l->t('Add to your Nextcloud')) ?></button>
<form class="save-form hidden" action="#"> <form class="save-form hidden" action="#">
<input type="text" id="remote_address" placeholder="user@yourNextcloud.org"/> <input type="email" id="remote_address" placeholder="user@yourNextcloud.org"/>
<button id="save-button-confirm" class="icon-confirm svg" disabled></button> <button id="save-button-confirm" class="icon-confirm svg" disabled></button>
</form> </form>
</span> </span>
<?php } ?> <?php } ?>
<a href="<?php p($_['downloadURL']); ?>" id="download" class="button"> <a href="<?php p($_['downloadURL']); ?>" id="download" class="button">
<img class="svg" alt="" src="<?php print_unescaped(image_path("core", "actions/download.svg")); ?>"/> <span class="icon icon-download"></span>
<span id="download-text"><?php p($l->t('Download'))?></span> <span id="download-text"><?php p($l->t('Download'))?></span>
</a> </a>
<?php } ?> <?php } ?>
@ -89,8 +89,8 @@ $maxUploadFilesize = min($upload_max_filesize, $post_max_size);
<div id="imgframe"></div> <div id="imgframe"></div>
<?php endif; ?> <?php endif; ?>
<div class="directDownload"> <div class="directDownload">
<a href="<?php p($_['downloadURL']); ?>" id="downloadFile" class="button"> <a href="<?php p($_['downloadURL']); ?>" id="downloadFile" class="button primary">
<img class="svg" alt="" src="<?php print_unescaped(image_path("core", "actions/download.svg")); ?>"/> <span class="icon icon-download"></span>
<?php p($l->t('Download %s', array($_['filename'])))?> (<?php p($_['fileSize']) ?>) <?php p($l->t('Download %s', array($_['filename'])))?> (<?php p($_['fileSize']) ?>)
</a> </a>
</div> </div>

5
core/css/apps.scss
View File

@ -214,7 +214,8 @@ em {
top: 0; top: 0;
bottom: 0; bottom: 0;
font-size: 12px; font-size: 12px;
button, .counter { button,
.counter {
width: 44px; width: 44px;
height: 44px; height: 44px;
padding-top: 12px; padding-top: 12px;
@ -258,6 +259,7 @@ em {
height: 100%; height: 100%;
width: 100%; width: 100%;
margin: 0; margin: 0;
box-shadow: none;
} }
.app-navigation-entry-utils-menu-button { .app-navigation-entry-utils-menu-button {
button { button {
@ -620,6 +622,7 @@ em {
height: auto; height: auto;
margin: 0; margin: 0;
font-weight: inherit; font-weight: inherit;
box-shadow: none;
/* prevent .action class to break the design */ /* prevent .action class to break the design */
&.action { &.action {
padding: inherit !important; padding: inherit !important;

895
core/css/inputs.scss
View File

File diff suppressed because it is too large Load Diff

9
core/css/styles.scss
View File

@ -567,14 +567,13 @@ label.infield {
} }
#pass2, input[name='personal-password-clone'] { #pass2, input[name='personal-password-clone'] {
padding: .6em 2.5em .4em .4em; padding-right: 30px;
width: 8em;
} }
#personal-show + label { #personal-show + label {
height: 14px; height: 14px;
margin-top: -25px; margin-top: -25px;
left: 295px; left: 267px;
display: block; display: block;
} }
@ -724,9 +723,9 @@ label.infield {
#body-login input { #body-login input {
font-size: 20px; font-size: 20px;
margin: 5px; margin: 5px;
padding: 11px 10px 9px; padding: 10px 10px 8px;
&[type='text'], &[type='password'] { &[type='text'], &[type='password'] {
width: 249px; width: calc(100% - 10px); /* 5px margin */
} }
&.login { &.login {
width: 269px; width: 269px;

1
core/img/actions/checkbox-checked-disabled.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M2.5 2.5h11v11h-11z" fill="#fff"/><path d="M3 2c-.554 0-1 .446-1 1v10c0 .554.446 1 1 1h10c.554 0 1-.446 1-1V3c0-.554-.446-1-1-1H3zm8.924 2.066l1.433 1.432-6.365 6.365L2.75 7.62l1.414-1.415 2.828 2.83 4.932-4.97z" fill="#969696"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 307 B

1
core/img/actions/checkbox-checked-white.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M3 2c-.554 0-1 .446-1 1v10c0 .554.446 1 1 1h10c.554 0 1-.446 1-1V3c0-.554-.446-1-1-1H3zm8.924 2.066l1.433 1.432-6.365 6.365L2.75 7.62l1.414-1.415 2.828 2.83 4.932-4.97z" fill="#fff"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 261 B

1
core/img/actions/checkbox-checked.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M2.5 2.5h11v11h-11z" fill="#fff"/><path d="M3 2c-.554 0-1 .446-1 1v10c0 .554.446 1 1 1h10c.554 0 1-.446 1-1V3c0-.554-.446-1-1-1H3zm8.924 2.066l1.433 1.432-6.365 6.365L2.75 7.62l1.414-1.415 2.828 2.83 4.932-4.97z" fill="#0082c9"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 307 B

1
core/img/actions/checkbox-disabled-white.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M2.5 2.5h11v11h-11z" fill="#dcdcdc"/><path d="M3 2c-.554 0-1 .446-1 1v10c0 .554.446 1 1 1h10c.554 0 1-.446 1-1V3c0-.554-.446-1-1-1H3zm0 1h10v10H3V3z" fill="#fff"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 241 B

1
core/img/actions/checkbox-disabled.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M2.5 2.5h11v11h-11z" fill="#dcdcdc"/><path d="M3 2c-.554 0-1 .446-1 1v10c0 .554.446 1 1 1h10c.554 0 1-.446 1-1V3c0-.554-.446-1-1-1H3zm0 1h10v10H3V3z" fill="#969696"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 244 B

1
core/img/actions/checkbox-mark-white.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M11.924 4.066l-4.932 4.97-2.828-2.83L2.75 7.618l4.242 4.243 6.365-6.365-1.433-1.432z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 165 B

1
core/img/actions/checkbox-mark.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M11.924 4.066l-4.932 4.97-2.828-2.83L2.75 7.618l4.242 4.243 6.365-6.365-1.433-1.432z" fill="#fff"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 177 B

1
core/img/actions/checkbox-mixed-disabled.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M2.5 2.5h11v11h-11z" fill="#dcdcdc"/><path d="M3 2c-.554 0-1 .446-1 1v10c0 .554.446 1 1 1h10c.554 0 1-.446 1-1V3c0-.554-.446-1-1-1H3zm0 1h10v10H3V3z" fill="#969696"/><path d="M4 7h8v2H4z" fill="#fff"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 279 B

2
core/img/actions/checkbox-mixed-white.svg
View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M3 2c-.554 0-1 .446-1 1v10c0 .554.446 1 1 1h10c.554 0 1-.446 1-1V3c0-.554-.446-1-1-1H3zm1 5h8v2H4V7z" fill="#fff"/></svg> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path d="M4 7v2h8V7H4z"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 193 B

After

Width:  |  Height:  |  Size: 94 B

2
core/img/actions/checkbox-mixed.svg
View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M2.5 2.5h11v11h-11z" fill="#fff"/><path d="M3 2c-.554 0-1 .446-1 1v10c0 .554.446 1 1 1h10c.554 0 1-.446 1-1V3c0-.554-.446-1-1-1H3zm1 5h8v2H4V7z" fill="#969696"/></svg> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path d="M4 7v2h8V7H4z" fill="#fff"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 239 B

After

Width:  |  Height:  |  Size: 106 B

1
core/img/actions/checkbox-white.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M3 2c-.554 0-1 .446-1 1v10c0 .554.446 1 1 1h10c.554 0 1-.446 1-1V3c0-.554-.446-1-1-1H3zm0 1h10v10H3V3z" fill="#fff"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 195 B

1
core/img/actions/checkbox.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M2.5 2.5h11v11h-11z" fill="#fff"/><path d="M3 2c-.554 0-1 .446-1 1v10c0 .554.446 1 1 1h10c.554 0 1-.446 1-1V3c0-.554-.446-1-1-1H3zm0 1h10v10H3V3z" fill="#969696"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 241 B

1
core/img/actions/radio-checked-disabled.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M8 1.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13z" fill="#fff"/><path d="M8 1a7 7 0 0 0-7 7 7 7 0 0 0 7 7 7 7 0 0 0 7-7 7 7 0 0 0-7-7zm0 1a6 6 0 0 1 6 6 6 6 0 0 1-6 6 6 6 0 0 1-6-6 6 6 0 0 1 6-6zm0 2a4 4 0 1 0 0 8 4 4 0 0 0 0-8z" fill="#969696"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 320 B

1
core/img/actions/radio-checked-white.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M8 1a7 7 0 0 0-7 7 7 7 0 0 0 7 7 7 7 0 0 0 7-7 7 7 0 0 0-7-7zm0 1a6 6 0 0 1 6 6 6 6 0 0 1-6 6 6 6 0 0 1-6-6 6 6 0 0 1 6-6zm0 2a4 4 0 1 0 0 8 4 4 0 0 0 0-8z" fill="#fff"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 248 B

1
core/img/actions/radio-checked.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M8 1.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13z" fill="#fff"/><path d="M8 1a7 7 0 0 0-7 7 7 7 0 0 0 7 7 7 7 0 0 0 7-7 7 7 0 0 0-7-7zm0 1a6 6 0 0 1 6 6 6 6 0 0 1-6 6 6 6 0 0 1-6-6 6 6 0 0 1 6-6zm0 2a4 4 0 1 0 0 8 4 4 0 0 0 0-8z" fill="#0082c9"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 320 B

1
core/img/actions/radio-disabled.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M8 1.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13z" fill="#dcdcdc"/><path d="M8 1a7 7 0 0 0-7 7 7 7 0 0 0 7 7 7 7 0 0 0 7-7 7 7 0 0 0-7-7zm0 1a6 6 0 0 1 6 6 6 6 0 0 1-6 6 6 6 0 0 1-6-6 6 6 0 0 1 6-6z" fill="#969696"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 290 B

1
core/img/actions/radio-white.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M8 1a7 7 0 0 0-7 7 7 7 0 0 0 7 7 7 7 0 0 0 7-7 7 7 0 0 0-7-7zm0 1a6 6 0 0 1 6 6 6 6 0 0 1-6 6 6 6 0 0 1-6-6 6 6 0 0 1 6-6z" fill="#fff"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 215 B

1
core/img/actions/radio.svg
View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M8 1.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13z" fill="#fff"/><path d="M8 1a7 7 0 0 0-7 7 7 7 0 0 0 7 7 7 7 0 0 0 7-7 7 7 0 0 0-7-7zm0 1a6 6 0 0 1 6 6 6 6 0 0 1-6 6 6 6 0 0 1-6-6 6 6 0 0 1 6-6z" fill="#969696"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 287 B

8
settings/css/settings.css
View File

@ -399,7 +399,7 @@ table.grid th, table.grid td {
font-weight: normal; font-weight: normal;
} }
td.name, td.password { padding-left:.8em; } td.name, td.password { padding-left:.8em; }
td.password>img,td.displayName>img, td.remove>a, td.quota>img { visibility:hidden; } td.password>img,td.displayName>img, td.remove>a, td.quota>img { visibility:hidden; vertical-align: middle;}
td.password, td.quota, td.displayName { width:12em; cursor:pointer; } td.password, td.quota, td.displayName { width:12em; cursor:pointer; }
td.password>span, td.quota>span, rd.displayName>span { margin-right: 1.2em; color: #C7C7C7; } td.password>span, td.quota>span, rd.displayName>span { margin-right: 1.2em; color: #C7C7C7; }
span.usersLastLoginTooltip { white-space: nowrap; } span.usersLastLoginTooltip { white-space: nowrap; }
@ -804,9 +804,9 @@ span.indeterminate {
/* PASSWORD */ /* PASSWORD */
#passwordform .strengthify-wrapper { #passwordform .strengthify-wrapper {
position: absolute; position: absolute;
left: 186px; left: 166px;
width: 131px; width: 130px;
margin-top: -7px; margin-top: -6px;
} }
/* OPERA hack for strengthify*/ /* OPERA hack for strengthify*/