yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/v8/dev' into v8/feature/7212-segment-support

Browse Source
This commit is contained in:
Shannon
2020-01-13 21:33:26 +11:00
parent eeb4f172bc ecb6f93e54
commit d9d3e6847f
124 changed files with 3791 additions and 3097 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@@ -55,6 +55,7 @@ App_Data/TEMP/*
src/Umbraco.Web.UI/[Cc]ss/*
src/Umbraco.Web.UI/App_Code/*
src/Umbraco.Web.UI/App_Data/*
src/Umbraco.Web.UI/data/*
src/Umbraco.Tests/App_Data/*
src/Umbraco.Web.UI/[Mm]edia/*
src/Umbraco.Web.UI/[Mm]aster[Pp]ages/*

3
src/Umbraco.Web.UI.Client/lib/bootstrap/less/code.less
View File

@@ -9,14 +9,13 @@ pre.code {
padding: 0 3px 2px;
#font > #family > .monospace;
font-size: @baseFontSize - 2;
color: @grayDark;
color: @blueExtraDark;
.border-radius(3px);
}
// Inline code
code {
padding: 2px 4px;
color: #d14;
background-color: #f7f7f9;
border: 1px solid #e1e1e8;
white-space: nowrap;

13
src/Umbraco.Web.UI.Client/lib/bootstrap/less/dropdowns.less
View File

@@ -79,11 +79,9 @@
// Hover/Focus state
// -----------
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-menu > li > button:hover,
.dropdown-menu > li > button:focus,
.dropdown-submenu:hover > a,
.dropdown-submenu:focus > a {
.dropdown-submenu:hover > button {
text-decoration: none;
color: @dropdownLinkColorHover;
#gradient > .vertical(@dropdownLinkBackgroundHover, darken(@dropdownLinkBackgroundHover, 5%));
@@ -92,8 +90,7 @@
// Active state
// ------------
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
.dropdown-menu > .active > a:hover {
color: @dropdownLinkColorActive;
text-decoration: none;
outline: 0;
@@ -104,13 +101,11 @@
// --------------
// Gray out text and ensure the hover/focus state remains gray
.dropdown-menu > .disabled > a,
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus {
.dropdown-menu > .disabled > a:hover {
color: @grayLight;
}
// Nuke hover/focus effects
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus {
.dropdown-menu > .disabled > a:hover {
text-decoration: none;
background-color: transparent;
background-image: none; // Remove CSS gradient

2
src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbtoggle.directive.js
View File

@@ -75,6 +75,8 @@
scope.displayLabelOff = "";
function onInit() {
scope.inputId = scope.inputId || "umb-toggle_" + String.CreateGuid();
setLabelText();
// must wait until the current digest cycle is finished before we emit this event on init,
// otherwise other property editors might not yet be ready to receive the event

2
src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbcheckbox.directive.js
View File

@@ -46,6 +46,8 @@
vm.change = change;
function onInit() {
vm.inputId = vm.inputId || "umb-check_" + String.CreateGuid();
// If a labelKey is passed let's update the returned text if it's does not contain an opening square bracket [
if (vm.labelKey) {
localizationService.localize(vm.labelKey).then(function (data) {

2
src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbradiobutton.directive.js
View File

@@ -44,6 +44,8 @@
vm.change = change;
function onInit() {
vm.inputId = vm.inputId || "umb-radio_" + String.CreateGuid();
// If a labelKey is passed let's update the returned text if it's does not contain an opening square bracket [
if (vm.labelKey) {
localizationService.localize(vm.labelKey).then(function (data) {

119
src/Umbraco.Web.UI.Client/src/common/directives/components/umbcodesnippet.directive.js Normal file
View File

@@ -0,0 +1,119 @@
/**
@ngdoc directive
@name umbraco.directives.directive:umbCodeSnippet
@restrict E
@scope
@description
<h3>Markup example</h3>
<pre>
<div ng-controller="My.Controller as vm">
<umb-code-snippet
language="'csharp'">
{{code}}
</umb-code-snippet>
</div>
</pre>
<h3>Controller example</h3>
<pre>
(function () {
"use strict";
function Controller() {
var vm = this;
}
angular.module("umbraco").controller("My.Controller", Controller);
})();
</pre>
@param {string=} language Language of the code snippet, e.g csharp, html, css.
**/
(function () {
'use strict';
var umbCodeSnippet = {
templateUrl: 'views/components/umb-code-snippet.html',
controller: UmbCodeSnippetController,
controllerAs: 'vm',
transclude: true,
bindings: {
language: '<'
}
};
function UmbCodeSnippetController($timeout) {
const vm = this;
vm.page = {};
vm.$onInit = onInit;
vm.copySuccess = copySuccess;
vm.copyError = copyError;
function onInit() {
vm.guid = String.CreateGuid();
if (vm.language)
{
switch (vm.language.toLowerCase()) {
case "csharp":
case "c#":
vm.language = "C#";
break;
case "html":
vm.language = "HTML";
break;
case "css":
vm.language = "CSS";
break;
case "javascript":
vm.language = "JavaScript";
break;
}
}
}
// copy to clip board success
function copySuccess() {
if (vm.page.copyCodeButtonState !== "success") {
$timeout(function () {
vm.page.copyCodeButtonState = "success";
});
$timeout(function () {
resetClipboardButtonState();
}, 1000);
}
}
// copy to clip board error
function copyError() {
if (vm.page.copyCodeButtonState !== "error") {
$timeout(function () {
vm.page.copyCodeButtonState = "error";
});
$timeout(function () {
resetClipboardButtonState();
}, 1000);
}
}
function resetClipboardButtonState() {
vm.page.copyCodeButtonState = "init";
}
}
angular.module('umbraco.directives').component('umbCodeSnippet', umbCodeSnippet);
})();

13
src/Umbraco.Web.UI.Client/src/common/directives/components/umbmediagrid.directive.js
View File

@@ -312,14 +312,7 @@ Use this directive to generate a thumbnail grid of media items.
scope.onDetailsHover(item, $event, hover);
}
};
scope.clickEdit = function(item, $event) {
if (scope.onClickEdit) {
scope.onClickEdit({"item": item})
$event.stopPropagation();
}
};
var unbindItemsWatcher = scope.$watch('items', function(newValue, oldValue) {
if (angular.isArray(newValue)) {
activate();
@@ -341,8 +334,8 @@ Use this directive to generate a thumbnail grid of media items.
onDetailsHover: "=",
onClick: '=',
onClickName: "=",
onClickEdit: "&?",
allowOnClickEdit: "@?",
allowOpenFolder: "=",
allowOpenFile: "=",
filterBy: "=",
itemMaxWidth: "@",
itemMaxHeight: "@",

46
src/Umbraco.Web.UI.Client/src/common/services/editor.service.js
View File

@@ -367,7 +367,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function contentPicker(editor) {
editor.view = "views/common/infiniteeditors/treepicker/treepicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
editor.section = "content";
editor.treeAlias = "content";
open(editor);
@@ -390,7 +390,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function contentTypePicker(editor) {
editor.view = "views/common/infiniteeditors/treepicker/treepicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
editor.section = "settings";
editor.treeAlias = "documentTypes";
open(editor);
@@ -413,7 +413,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function mediaTypePicker(editor) {
editor.view = "views/common/infiniteeditors/treepicker/treepicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
editor.section = "settings";
editor.treeAlias = "mediaTypes";
open(editor);
@@ -436,7 +436,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function memberTypePicker(editor) {
editor.view = "views/common/infiniteeditors/treepicker/treepicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
editor.section = "settings";
editor.treeAlias = "memberTypes";
open(editor);
@@ -457,7 +457,7 @@ When building a custom infinite editor view you can use the same components as a
function copy(editor) {
editor.view = "views/common/infiniteeditors/copy/copy.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -477,7 +477,7 @@ When building a custom infinite editor view you can use the same components as a
function move(editor) {
editor.view = "views/common/infiniteeditors/move/move.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -495,7 +495,7 @@ When building a custom infinite editor view you can use the same components as a
function embed(editor) {
editor.view = "views/common/infiniteeditors/embed/embed.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -514,7 +514,7 @@ When building a custom infinite editor view you can use the same components as a
function rollback(editor) {
editor.view = "views/common/infiniteeditors/rollback/rollback.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -534,7 +534,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function linkPicker(editor) {
editor.view = "views/common/infiniteeditors/linkpicker/linkpicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -577,7 +577,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function mediaPicker(editor) {
editor.view = "views/common/infiniteeditors/mediapicker/mediapicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
editor.updatedMediaNodes = [];
open(editor);
}
@@ -598,7 +598,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function iconPicker(editor) {
editor.view = "views/common/infiniteeditors/iconpicker/iconpicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -692,7 +692,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function treePicker(editor) {
editor.view = "views/common/infiniteeditors/treepicker/treepicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -710,7 +710,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function nodePermissions(editor) {
editor.view = "views/common/infiniteeditors/nodepermissions/nodepermissions.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -728,7 +728,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function insertCodeSnippet(editor) {
editor.view = "views/common/infiniteeditors/insertcodesnippet/insertcodesnippet.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -746,7 +746,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function userGroupPicker(editor) {
editor.view = "views/common/infiniteeditors/usergrouppicker/usergrouppicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -782,7 +782,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function sectionPicker(editor) {
editor.view = "views/common/infiniteeditors/sectionpicker/sectionpicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -800,7 +800,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function insertField(editor) {
editor.view = "views/common/infiniteeditors/insertfield/insertfield.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -818,7 +818,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function templateSections(editor) {
editor.view = "views/common/infiniteeditors/templatesections/templatesections.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -836,7 +836,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function userPicker(editor) {
editor.view = "views/common/infiniteeditors/userpicker/userpicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -858,7 +858,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function itemPicker(editor) {
editor.view = "views/common/infiniteeditors/itempicker/itempicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -876,7 +876,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function macroPicker(editor) {
editor.view = "views/common/infiniteeditors/macropicker/macropicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -896,7 +896,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function memberGroupPicker(editor) {
editor.view = "views/common/infiniteeditors/membergrouppicker/membergrouppicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
open(editor);
}
@@ -917,7 +917,7 @@ When building a custom infinite editor view you can use the same components as a
*/
function memberPicker(editor) {
editor.view = "views/common/infiniteeditors/treepicker/treepicker.html";
editor.size = "small";
if (!editor.size) editor.size = "small";
editor.section = "member";
editor.treeAlias = "member";
open(editor);

4
src/Umbraco.Web.UI.Client/src/common/services/notifications.service.js
View File

@@ -148,7 +148,7 @@ angular.module('umbraco.services')
break;
case 1:
//info
this.success(args.header, args.message);
this.info(args.header, args.message);
break;
case 2:
//error
@@ -297,4 +297,4 @@ angular.module('umbraco.services')
};
return service;
});
});

6
src/Umbraco.Web.UI.Client/src/common/services/tinymce.service.js
View File

@@ -488,7 +488,7 @@ function tinyMceService($rootScope, $q, imageHelper, $locale, $http, $timeout, s
* @methodOf umbraco.services.tinyMceService
*
* @description
* Creates the umbrco insert embedded media tinymce plugin
* Creates the umbraco insert embedded media tinymce plugin
*
* @param {Object} editor the TinyMCE editor instance
*/
@@ -575,7 +575,7 @@ function tinyMceService($rootScope, $q, imageHelper, $locale, $http, $timeout, s
* @methodOf umbraco.services.tinyMceService
*
* @description
* Creates the umbrco insert media tinymce plugin
* Creates the umbraco insert media tinymce plugin
*
* @param {Object} editor the TinyMCE editor instance
*/
@@ -705,7 +705,7 @@ function tinyMceService($rootScope, $q, imageHelper, $locale, $http, $timeout, s
* @methodOf umbraco.services.tinyMceService
*
* @description
* Creates the insert umbrco macro tinymce plugin
* Creates the insert umbraco macro tinymce plugin
*
* @param {Object} editor the TinyMCE editor instance
*/

27
src/Umbraco.Web.UI.Client/src/less/application/umb-outline.less
View File

@@ -1,3 +1,7 @@
*:focus {
outline-color: @ui-outline;
}
.umb-outline {
&:focus {
outline:none;
@@ -10,7 +14,28 @@
left: 0;
right: 0;
border-radius: 3px;
box-shadow: 0 0 2px @blueMid, inset 0 0 2px 1px @blueMid;
box-shadow: 0 0 2px 0px @ui-outline, inset 0 0 2px 2px @ui-outline;
}
}
&.umb-outline--surrounding {
&:focus {
.tabbing-active &::after {
top: -6px;
bottom: -6px;
left: -6px;
right: -6px;
border-radius: 9px;
}
}
}
&.umb-outline--thin {
&:focus {
.tabbing-active &::after {
box-shadow: 0 0 2px @ui-outline, inset 0 0 2px 1px @ui-outline;
}
}
}
}

2
src/Umbraco.Web.UI.Client/src/less/belle.less
View File

@@ -132,6 +132,7 @@
@import "components/umb-content-grid.less";
@import "components/umb-contextmenu.less";
@import "components/umb-layout-selector.less";
@import "components/umb-mini-search.less";
@import "components/tooltip/umb-tooltip.less";
@import "components/tooltip/umb-tooltip-list.less";
@import "components/overlays/umb-overlay-backdrop.less";
@@ -140,6 +141,7 @@
@import "components/umb-empty-state.less";
@import "components/umb-property-editor.less";
@import "components/umb-property-actions.less";
@import "components/umb-code-snippet.less";
@import "components/umb-color-swatches.less";
@import "components/check-circle.less";
@import "components/umb-file-icon.less";

38
src/Umbraco.Web.UI.Client/src/less/buttons.less
View File

@@ -23,8 +23,7 @@
border-radius: 3px;
// Hover/focus state
&:hover,
&:focus {
&:hover {
background: @btnBackgroundHighlight;
color: @gray-4;
background-position: 0 -15px;
@@ -35,11 +34,6 @@
.transition(background-position .1s linear);
}
// Focus state for keyboard and accessibility
&:focus {
.tab-focus();
}
// Active state
&.active,
&:active {
@@ -54,7 +48,7 @@
&:disabled:hover {
cursor: default;
border-color: @btnBorder;
.opacity(65);
.opacity(80);
.box-shadow(none);
}
@@ -219,7 +213,7 @@ input[type="button"] {
}
// Made for Umbraco, 2019, used for buttons that has to stand back.
.btn-white {
.buttonBackground(@btnWhiteBackground, @btnWhiteBackgroundHighlight, @btnWhiteType, @btnWhiteTypeHover);
.buttonBackground(@btnWhiteBackground, @btnWhiteBackgroundHighlight, @btnWhiteType, @btnWhiteTypeHover, @gray-10, @gray-7);
}
// Inverse appears as dark gray
.btn-inverse {
@@ -230,8 +224,7 @@ input[type="button"] {
.buttonBackground(@btnNeutralBackground, @btnNeutralBackgroundHighlight);
color: @gray-5;
// Hover/focus state
&:hover,
&:focus {
&:hover {
color: @gray-5;
}
@@ -261,18 +254,18 @@ input[type="button"] {
.btn-outline {
border: 1px solid;
border-color: @gray-7;
background: @white;
background: transparent;
color: @blueExtraDark;
padding: 5px 13px;
transition: all .2s linear;
transition: border-color .12s linear, color .12s linear;
font-weight: 600;
}
.btn-outline:hover,
.btn-outline:focus,
.btn-outline:active {
.btn-outline:hover {
border-color: @ui-light-type-hover;
color: @ui-light-type-hover;
background: @white;
background: transparent;
transition: border-color .12s linear, color .12s linear;
}
// Cross-browser Jank
@@ -309,14 +302,12 @@ input[type="submit"].btn {
color: @linkColor;
.border-radius(0);
}
.btn-link:hover,
.btn-link:focus {
.btn-link:hover {
color: @linkColorHover;
text-decoration: underline;
background-color: transparent;
}
.btn-link[disabled]:hover,
.btn-link[disabled]:focus {
.btn-link[disabled]:hover {
color: @gray-4;
text-decoration: none;
}
@@ -324,8 +315,7 @@ input[type="submit"].btn {
// Make a reverse type of a button link
.btn-link-reverse{
text-decoration:underline;
&:hover,
&:focus{
&:hover {
text-decoration:none;
}
}
@@ -362,7 +352,7 @@ input[type="submit"].btn {
outline: 0;
-webkit-appearance: none;
&:hover, &:focus {
&:hover {
color: @ui-icon-hover;
}
}

4
src/Umbraco.Web.UI.Client/src/less/components/application/umb-drawer.less
View File

@@ -86,6 +86,7 @@
}
.umb-help-badge__title {
display: block;
font-size: 15px;
font-weight: bold;
color: @black;
@@ -160,6 +161,9 @@
border-radius: 0;
border-bottom: 1px solid @gray-9;
padding: 10px;
background: transparent;
width:100%;
border: 0 none;
}
.umb-help-list-item:last-child {

6
src/Umbraco.Web.UI.Client/src/less/components/application/umb-language-picker.less
View File

@@ -19,13 +19,13 @@
box-sizing: border-box;
color: @ui-option-type;
width: 100%;
outline-offset: -3px;
}
.umb-language-picker__expand {
font-size: 14px;
}
.umb-language-picker__toggle:focus,
.umb-language-picker__toggle:hover {
background: @ui-option-hover;
color:@ui-option-type-hover;
@@ -54,10 +54,10 @@
font-size: 14px;
width: 100%;
text-align: left;
outline-offset: -3px;
}
.umb-language-picker__dropdown-item:hover,
.umb-language-picker__dropdown-item:focus {
.umb-language-picker__dropdown-item:hover {
background: @ui-option-hover;
text-decoration: none;
color:@ui-option-type-hover;

7
src/Umbraco.Web.UI.Client/src/less/components/application/umb-tour.less
View File

@@ -112,3 +112,10 @@
.umb-tour-is-visible .umb-backdrop {
z-index: @zindexTourBackdrop;
}
.umb-tour__popover .underline{
font-size: 13px;
background: transparent;
border: none;
padding: 0;
}

15
src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button.less
View File

@@ -8,21 +8,6 @@
position: relative;
}
.umb-button__button:focus {
outline: none;
.tabbing-active &:after {
content: '';
position: absolute;
z-index: 10000;
top: 0;
bottom: 0;
left: 0;
right: 0;
border-radius: 3px;
box-shadow: 0 0 2px @blueMid, inset 0 0 2px 1px @blueMid;
}
}
.umb-button__content {
opacity: 1;
transition: opacity 0.25s ease;

16
src/Umbraco.Web.UI.Client/src/less/components/editor.less
View File

@@ -164,6 +164,7 @@ a.umb-editor-header__close-split-view:hover {
/* variant switcher */
.umb-variant-switcher__toggle {
position: relative;
display: flex;
align-items: center;
padding: 0 10px;
@@ -173,6 +174,8 @@ a.umb-editor-header__close-split-view:hover {
text-decoration: none !important;
font-size: 13px;
color: @ui-action-discreet-type;
background: transparent;
border: none;
max-width: 50%;
white-space: nowrap;
@@ -185,7 +188,7 @@ a.umb-editor-header__close-split-view:hover {
}
}
a.umb-variant-switcher__toggle {
button.umb-variant-switcher__toggle {
transition: color 0.2s ease-in-out;
&:hover {
//background-color: @gray-10;
@@ -242,8 +245,7 @@ a.umb-variant-switcher__toggle {
border-left: 4px solid @ui-active;
}
.umb-variant-switcher__item:hover,
.umb-variant-switcher__item:focus {
.umb-variant-switcher__item:hover {
outline: none;
}
@@ -267,7 +269,7 @@ a.umb-variant-switcher__toggle {
align-items: center;
justify-content: center;
margin-left: 5px;
top: -6px;
top: -3px;
width: 14px;
height: 14px;
border-radius: 7px;
@@ -285,8 +287,10 @@ a.umb-variant-switcher__toggle {
flex: 1;
cursor: pointer;
padding-top: 6px !important;
padding-bottom: 6px !important;
border-left: 2px solid transparent;
padding-bottom: 6px !important;
background-color: transparent;
border: none;
border-left: 2px solid transparent;
}
.umb-variant-switcher__name {

5
src/Umbraco.Web.UI.Client/src/less/components/editor/subheader/umb-editor-sub-header.less
View File

@@ -24,8 +24,9 @@
.umb-editor-sub-header.--state-selection {
padding-left: 10px;
padding-right: 10px;
background-color: @pinkLight;
border-color: @pinkLight;
background-color: @ui-selected-border;
border-color: @ui-selected-border;
color: @white;
border-radius: 3px;
}

20
src/Umbraco.Web.UI.Client/src/less/components/tree/umb-tree-item.less
View File

@@ -4,16 +4,16 @@
width: auto;
margin-top:1px;
.umb-tree-item__label {
user-select: none;
}
&:hover .umb-tree-item__arrow {
visibility: visible;
cursor: pointer
}
}
.umb-tree-item__label {
user-select: none;
}
.umb-tree-item__arrow {
position: relative;
margin-left: -16px;
@@ -92,18 +92,6 @@
color: @blue;
}
.umb-options {
&:hover i {
opacity: .7;
}
i {
background: @ui-active-type;
transition: opacity 120ms ease;
}
}
a,
.umb-tree-icon,
.umb-tree-item__arrow {

39
src/Umbraco.Web.UI.Client/src/less/components/tree/umb-tree.less
View File

@@ -99,6 +99,7 @@ body.touch .umb-tree {
.umb-tree-item__inner {
border: 2px solid transparent;
overflow: visible;
}
.umb-tree-header {
@@ -176,9 +177,25 @@ body.touch .umb-tree {
cursor: pointer;
border-radius: @baseBorderRadius;
&:hover {
background: @btnBackgroundHighlight;
i {
height: 5px !important;
width: 5px !important;
border-radius: 20px;
display: inline-block;
margin: 0 2px 0 0;
background: @ui-active-type;
&:last-child {
margin: 0;
}
}
&:hover {
background: rgba(255, 255, 255, .5);
i {
background: @ui-active-type-hover;
}
}
// NOTE - We're having to repeat ourselves here due to an .sr-only class appearing in umbraco/lib/font-awesome/css/font-awesome.min.css
&.sr-only--hoverable:hover,
&.sr-only--focusable:focus {
@@ -193,19 +210,6 @@ body.touch .umb-tree {
border-radius: 3px;
}
i {
height: 5px !important;
width: 5px !important;
border-radius: 20px;
background: @black;
display: inline-block;
margin: 0 2px 0 0;
&:last-child {
margin: 0;
}
}
.hide-options & {
display: none !important;
}
@@ -289,9 +293,8 @@ body.touch .umb-tree {
}
.no-access {
.umb-tree-icon,
.root-link,
.umb-tree-item__label {
> .umb-tree-item__inner .umb-tree-icon,
> .umb-tree-item__inner .umb-tree-item__label {
color: @gray-7;
cursor: not-allowed;
}

27
src/Umbraco.Web.UI.Client/src/less/components/umb-breadcrumbs.less
View File

@@ -4,6 +4,7 @@
margin-left: 0;
display: flex;
flex-wrap: wrap;
user-select: none;
}
.umb-breadcrumbs__ancestor {
@@ -12,10 +13,23 @@
}
.umb-breadcrumbs__action {
position: relative;
background: transparent;
border: 0 none;
padding: 0;
margin-top: -4px;
border-radius: 3px;
padding: 0 4px;
color: @ui-option-type;
&.--current {
font-weight: bold;
pointer-events: none;
}
&:hover {
color: @ui-option-type-hover;
background-color: @white;
}
}
.umb-breadcrumbs__ancestor-link,
@@ -26,6 +40,7 @@
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
padding: 0 4px;
}
.umb-breadcrumbs__ancestor-link {
@@ -39,13 +54,13 @@
.umb-breadcrumbs__separator {
position: relative;
top: 1px;
margin-left: 5px;
margin-right: 5px;
margin: 0 1px;
margin-top: -3px;
color: @gray-7;
}
input.umb-breadcrumbs__add-ancestor {
height: 25px;
margin: 0 0 0 3px;
height: 24px;
margin: -2px 0 -2px 3px;
width: 100px;
}

19
src/Umbraco.Web.UI.Client/src/less/components/umb-checkmark.less
View File

@@ -2,21 +2,30 @@
border: 2px solid @white;
width: 25px;
height: 25px;
border: 1px solid @gray-7;
border: 1px solid @ui-action-discreet-border;
border-radius: 3px;
box-sizing: border-box;
display: flex;
justify-content: center;
align-items: center;
color: @gray-7;
color: @ui-selected-type;
cursor: pointer;
font-size: 15px;
&:hover {
border-color:@ui-action-discreet-border-hover;
color: @ui-selected-type-hover;
}
}
.umb-checkmark--checked {
background: @ui-active;
border-color: @ui-active;
background: @ui-selected-border;
border-color: @ui-selected-border;
color: @white;
&:hover {
background: @ui-selected-border-hover;
border-color: @ui-selected-border-hover;
color: @white;
}
}
.umb-checkmark--xs {
@@ -45,4 +54,4 @@
width: 50px;
height: 50px;
font-size: 20px;
}
}

43
src/Umbraco.Web.UI.Client/src/less/components/umb-code-snippet.less Normal file
View File

@@ -0,0 +1,43 @@
.umb-code-snippet {
.umb-code-snippet__header {
box-sizing: content-box;
background-color: @gray-10;
display: flex;
flex-direction: row;
font-size: .8rem;
border: 1px solid @gray-8;
border-radius: 3px 3px 0 0;
border-bottom: 0;
margin-top: 16px;
min-height: 30px;
.language {
display: flex;
align-items: center;
justify-content: flex-start;
flex-grow: 1;
padding: 2px 10px;
}
button {
background-color: transparent;
border: none;
border-left: 1px solid @gray-8;
border-radius: 0;
color: #000;
&:hover {
background-color: @grayLighter;
}
}
}
.umb-code-snippet__content {
pre {
border-radius: 0 0 3px 3px;
overflow: auto;
white-space: nowrap;
}
}
}

9
src/Umbraco.Web.UI.Client/src/less/components/umb-content-grid.less
View File

@@ -29,15 +29,15 @@
border-radius: 5px;
box-shadow: 0 0 4px 0 darken(@ui-selected-border, 20), inset 0 0 2px 0 darken(@ui-selected-border, 20);
pointer-events: none;
transition: opacity 100ms;
}
}
}
.umb-content-grid__item:hover {
&::before {
opacity: .33;
opacity: .2;
}
}
.umb-content-grid__item.-selected:hover {
@@ -46,6 +46,7 @@
}
}
.umb-content-grid__icon-container {
height: 75px;
display: flex;
@@ -66,8 +67,10 @@
}
.umb-content-grid__item-name {
position: relative;
padding: 5px;
margin: -5px -5px 15px -5px;
font-weight: bold;
margin-bottom: 15px;
line-height: 1.4em;
display: inline-flex;

19
src/Umbraco.Web.UI.Client/src/less/components/umb-editor-navigation-item.less
View File

@@ -4,6 +4,7 @@
&__action,
> a {
position: relative;
background: transparent;
text-align: center;
cursor: pointer;
@@ -18,26 +19,20 @@
align-items: center;
justify-content: center;
height: calc(~'@{editorHeaderHeight}'- ~'1px'); // need to offset the 1px border-bottom on .umb-editor-header - avoids overflowing top of the container
position: relative;
color: @ui-active-type;
&:focus,
&:hover {
color: @ui-active-type-hover !important;
text-decoration: none;
}
&:focus {
outline: none;
}
&::after {
&::before {
content: "";
position: absolute;
height: 0px;
left: 8px;
right: 8px;
background-color: @ui-light-active-border;
position: absolute;
bottom: 0;
border-radius: 3px 3px 0 0;
opacity: 0;
@@ -47,14 +42,13 @@
&.is-active {
color: @ui-light-active-type;
&::after {
&::before {
opacity: 1;
height: 4px;
}
}
}
&__action:focus,
&__action:active,
& > a:active {
.box-shadow(~"inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)");
@@ -111,7 +105,6 @@
&__anchor_dropdown {
// inherits from .dropdown-menu
margin: 0;
overflow: hidden;
// center align horizontal
left: 50%;
@@ -122,7 +115,7 @@
li {
&.is-active a {
border-left-color: @ui-selected-border;
border-left-color: @ui-active;
}
a {
@@ -192,4 +185,4 @@
&::after {
background-color: @red;
}
}
}

15
src/Umbraco.Web.UI.Client/src/less/components/umb-grid-selector.less
View File

@@ -41,12 +41,17 @@
margin-top: 10px;
}
button.umb-grid-selector__item {
width: 169px;
height: 194px;
}
.umb-grid-selector__item-icon {
font-size: 50px;
color: @gray-8;
display: block;
line-height: 50px;
margin-bottom: 15px;
font-size: 50px;
color: @gray-8;
display: block;
line-height: 50px;
margin-bottom: 15px;
}
.umb-grid-selector__item-label {

11
src/Umbraco.Web.UI.Client/src/less/components/umb-layout-selector.less
View File

@@ -6,7 +6,8 @@
.umb-layout-selector__active-layout {
background: transparent;
box-sizing: border-box;
border: 1px solid @inputBorder;
border: 1px solid @ui-action-discreet-border;
color: @ui-action-discreet-type;
cursor: pointer;
height: 30px;
width: 30px;
@@ -17,7 +18,8 @@
}
.umb-layout-selector__active-layout:hover {
border-color: @inputBorderFocus;
border-color: @ui-action-discreet-border-hover;
color: @ui-action-discreet-type-hover;
}
.umb-layout-selector__dropdown {
@@ -31,6 +33,7 @@
flex-direction: column;
transform: translate(-50%,0);
left: 50%;
border-radius: 3px;
}
.umb-layout-selector__dropdown-item {
@@ -46,11 +49,11 @@
}
.umb-layout-selector__dropdown-item:hover {
border: 1px solid @gray-8;
border: 1px solid @ui-action-discreet-border;
}
.umb-layout-selector__dropdown-item.-active {
border: 1px solid @blue;
border: 1px solid @ui-action-discreet-border-hover;
}
.umb-layout-selector__dropdown-item-icon,

34
src/Umbraco.Web.UI.Client/src/less/components/umb-media-grid.less
View File

@@ -40,25 +40,41 @@
}
}
.umb-media-grid__item.-selectable {
.umb-media-grid__item.-selectable,
.umb-media-grid__item.-folder {// If folders isnt selectable, they opens if clicked, therefor...
cursor: pointer;
.tabbing-active &:focus {
outline: 2px solid @inputBorderTabFocus;
}
}
.umb-media-grid__item.-file {
background-color: @white;
}
.umb-media-grid__item.-folder {
&.-selectable {
.media-grid-item-edit:hover .umb-media-grid__item-name,
.media-grid-item-edit:focus .umb-media-grid__item-name {
text-decoration: underline;
}
}
&.-unselectable {
&:hover, &:focus {
.umb-media-grid__item-name {
text-decoration: underline;
}
}
}
}
.umb-media-grid__item.-selected {
color:@ui-selected-type;
.umb-media-grid__item-overlay {
color: @ui-selected-type;
}
}
.umb-media-grid__item.-selected,
.umb-media-grid__item.-selected,
.umb-media-grid__item.-selectable:hover {
&::before {
content: "";
@@ -139,10 +155,10 @@
background: fade(@white, 92%);
transition: opacity 150ms;
&:hover {
&.-can-open:hover {
text-decoration: underline;
}
.tabbing-active &:focus {
opacity: 1;
}
@@ -190,7 +206,7 @@
align-items: center;
color: @black;
transition: opacity 150ms;
&:hover {
color: @ui-action-discreet-type-hover;
}

44
src/Umbraco.Web.UI.Client/src/less/components/umb-mini-search.less Normal file
View File

@@ -0,0 +1,44 @@
.umb-mini-search {
position: relative;
display: block;
.icon {
position: absolute;
padding: 5px 8px;
pointer-events: none;
top: 2px;
color: @ui-action-discreet-type;
transition: color .1s linear;
}
input {
width: 0px;
padding-left:24px;
margin-bottom: 0px;
background-color: transparent;
border-color: @ui-action-discreet-border;
transition: background-color .1s linear, border-color .1s linear, color .1s linear, width .1s ease-in-out, padding-left .1s ease-in-out;
}
&:focus-within, &:hover {
.icon {
color: @ui-action-discreet-type-hover;
}
input {
color: @ui-action-discreet-border-hover;
border-color: @ui-action-discreet-border-hover;
}
}
input:focus, &:focus-within input {
background-color: white;
color: @ui-action-discreet-border-hover;
border-color: @ui-action-discreet-border-hover;
}
input:focus, &:focus-within input, &.--has-value input {
width: 190px;
padding-left:30px;
}
}

5
src/Umbraco.Web.UI.Client/src/less/components/umb-nested-content.less
View File

@@ -41,11 +41,8 @@
}
.umb-nested-content__item.ui-sortable-placeholder {
background: @gray-10;
border: 1px solid @gray-9;
margin-top: 1px;
visibility: visible !important;
height: 55px;
margin-top: -1px;
}
.umb-nested-content__item--single > .umb-nested-content__content {

1
src/Umbraco.Web.UI.Client/src/less/components/umb-progress-circle.less
View File

@@ -5,6 +5,7 @@
.umb-progress-circle__view-box {
position: absolute;
transform: rotate(-90deg);
right: 0;
}
// circle highlight on progressbar

1
src/Umbraco.Web.UI.Client/src/less/components/umb-sub-views.less
View File

@@ -8,7 +8,6 @@
padding-left: 0;
padding-right: 0;
&:focus {
outline: none;
text-decoration: none;
}
}

40
src/Umbraco.Web.UI.Client/src/less/components/umb-table.less
View File

@@ -34,8 +34,12 @@
text-decoration: none;
padding: 0;
margin-left: 1px;
body:not(.tabbing-active) & {
outline: 0;
}
}
input.umb-table__input {
margin: 0 auto;
}
@@ -47,6 +51,8 @@ input.umb-table__input {
.umb-table-head {
font-size: 14px;
font-weight: bold;
color: @ui-disabled-type;
}
.umb-table-head__link {
@@ -68,10 +74,12 @@ input.umb-table__input {
.umb-table-head__link.sortable {
cursor: pointer;
color: @ui-action-discreet-type;
&:hover {
text-decoration: none;
color: @black;
color: @ui-action-discreet-type-hover;
}
outline-offset: 1px;
}
.umb-table-thead__icon {
@@ -129,6 +137,9 @@ input.umb-table__input {
&::before {
opacity:.66;
}
.umb-table-body__checkicon {
color: @ui-selected-border;
}
}
}
@@ -141,21 +152,19 @@ input.umb-table__input {
}
.umb-table-body__link {
position: relative;
color: @ui-option-type;
font-size: 14px;
font-weight: bold;
text-decoration: none;
&:hover, &:focus {
&:hover {
color: @ui-option-type-hover;
text-decoration: underline;
outline: none;
}
}
.umb-table-body__icon,
.umb-table-body__icon[class^="icon-"],
.umb-table-body__icon[class*=" icon-"] {
.umb-table-body__icon {
margin: 0 auto;
font-size: 20px;
line-height: 20px;
@@ -164,13 +173,11 @@ input.umb-table__input {
text-decoration: none;
}
.umb-table-body__checkicon,
.umb-table-body__checkicon[class^="icon-"],
.umb-table-body__checkicon[class*=" icon-"] {
.umb-table-body__checkicon {
display: none;
font-size: 18px;
line-height: 20px;
color: @green;
color: @ui-selected-border;
}
.umb-table-body .umb-table__name {
@@ -179,7 +186,8 @@ input.umb-table__input {
font-weight: bold;
a {
color: @ui-option-type;
&:hover, &:focus {
outline-offset: 1px;
&:hover {
color: @ui-option-type-hover;
text-decoration: underline;
}
@@ -249,8 +257,8 @@ input.umb-table__input {
flex-flow: row nowrap;
flex: 1 1 5%;
position: relative;
margin: auto 14px;
padding: 6px 2px;
margin: auto 0;
padding: 6px 16px;
text-align: left;
overflow:hidden;
}
@@ -268,8 +276,8 @@ input.umb-table__input {
.umb-table-cell:first-of-type:not(.not-fixed) {
flex: 0 0 25px;
margin: 0 0 0 15px;
padding: 15px 0;
margin: 0;
padding: 15px 0 15px 15px;
}
.umb-table-cell--auto-width {

14
src/Umbraco.Web.UI.Client/src/less/components/users/umb-user-group-picker-list.less
View File

@@ -7,11 +7,17 @@
display: flex;
margin-bottom: 5px;
padding: 10px;
position: relative;
}
.umb-user-group-picker-list-item:active,
.umb-user-group-picker-list-item:focus {
text-decoration: none;
.umb-user-group-picker__action{
background: transparent;
border: 0 none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.umb-user-group-picker-list-item:hover {
@@ -35,4 +41,4 @@
.umb-user-group-picker-list-item__permission {
font-size: 13px;
color: @gray-4;
}
}

12
src/Umbraco.Web.UI.Client/src/less/forms.less
View File

@@ -252,7 +252,7 @@ input[type="color"],
outline: 0;
.tabbing-active & {
outline: 2px solid @inputBorderTabFocus;
outline: 2px solid @ui-outline;
}
}
}
@@ -297,11 +297,11 @@ select[size] {
}
// Focus for select, file, radio, and checkbox
select:focus,
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
.tab-focus();
select,
input[type="file"],
input[type="radio"],
input[type="checkbox"] {
.umb-outline();
}

52
src/Umbraco.Web.UI.Client/src/less/hacks.less
View File

@@ -185,40 +185,38 @@ iframe, .content-column-body {
// Inline code
// 1: Revert border radius to match look and feel of 7.4+
code{
.border-radius(@baseBorderRadius); // 1
code {
.border-radius(@baseBorderRadius); // 1
}
// Blocks of code
// 1: Wrapping code is unreadable on small devices.
pre {
display: block;
padding: (@baseLineHeight - 1) / 2;
margin: 0 0 @baseLineHeight / 2;
font-family: @sansFontFamily;
//font-size: @baseFontSize - 1; // 14px to 13px
color: @gray-2;
line-height: @baseLineHeight;
white-space: pre-wrap; // 1
overflow-x: auto; // 1
background-color: @gray-10;
border: 1px solid @gray-8;
.border-radius(@baseBorderRadius);
display: block;
padding: (@baseLineHeight - 1) / 2;
margin: 0 0 @baseLineHeight / 2;
font-family: @sansFontFamily;
color: @gray-2;
line-height: @baseLineHeight;
white-space: pre-wrap; // 1
overflow-x: auto; // 1
background-color: @brownGrayLight;
border: 1px solid @gray-8;
.border-radius(@baseBorderRadius);
// Make prettyprint styles more spaced out for readability
&.prettyprint {
margin-bottom: @baseLineHeight;
}
// Make prettyprint styles more spaced out for readability
&.prettyprint {
margin-bottom: @baseLineHeight;
}
// Account for some code outputs that place code tags in pre tags
code {
padding: 0;
white-space: pre; // 1
word-wrap: normal; // 1
background-color: transparent;
border: 0;
}
// Account for some code outputs that place code tags in pre tags
code {
padding: 0;
white-space: pre; // 1
word-wrap: normal; // 1
background-color: transparent;
border: 0;
}
}
/* Styling for content/media sort order dialog */

1
src/Umbraco.Web.UI.Client/src/less/installer.less
View File

@@ -3,6 +3,7 @@
@import "variables.less"; // Modify this for custom colors, font-sizes, etc
@import "colors.less";
@import "mixins.less";
@import "application/umb-outline.less";
@import "buttons.less";
@import "forms.less";

44
src/Umbraco.Web.UI.Client/src/less/listview.less
View File

@@ -1,6 +1,10 @@
// Listview
// -------------------------
.umb-listview {
min-height: 100px;
}
.umb-listview table {
border: 1px solid @gray-8;
}
@@ -43,6 +47,15 @@
/* add padding */
.left-addon input[type="text"] { padding-left: 30px !important; padding-right: 6px; }
.right-addon input[type="text"] { padding-right: 30px; padding-left: 6px !important; }
&__label-icon{
width: 30px;
height: 30px;
position: absolute;
top: -1px;
left:0;
margin:0
}
}
.umb-listview table form {
@@ -136,7 +149,36 @@
/* TEMP */
.umb-minilistview {
.umb-table-row.not-allowed { opacity: 0.6; cursor: not-allowed; }
.umb-table-row.not-allowed {
opacity: 0.6;
cursor: not-allowed;
}
div.umb-mini-list-view__breadcrumb {
margin-bottom: 10px;
}
div.no-display {
display: none
}
div.umb-table-cell-padding {
padding-top: 8px;
padding-bottom: 8px;
}
div.umb-table-cell .form-search {
width: 100%;
margin-right: 0;
input {
width: 100%;
}
.icon-search {
font-size: 14px;
}
}
}
.umb-listview .table-striped tbody td {

6
src/Umbraco.Web.UI.Client/src/less/main.less
View File

@@ -117,6 +117,12 @@ h5.-black {
}
.umb-control-group {
position: relative;
&.umb-control-group__listview {
// position: relative messes up the listview status messages (e.g. "no search results")
position: unset;
}
&::after {
content: '';
display:block;

9
src/Umbraco.Web.UI.Client/src/less/mixins.less
View File

@@ -30,7 +30,6 @@
outline: thin dotted @gray-3;
// Webkit
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
// Center-align a block level element
@@ -435,7 +434,7 @@
// Button backgrounds
// ------------------
.buttonBackground(@startColor, @hoverColor: @startColor, @textColor: @white, @textColorHover: @textColor) {
.buttonBackground(@startColor, @hoverColor: @startColor, @textColor: @white, @textColorHover: @textColor, @disabledColor: @sand-1, @disabledTextColor: @white) {
color: @textColor;
border-color: @startColor @startColor darken(@startColor, 15%);
@@ -449,14 +448,14 @@
}
// in these cases the gradient won't cover the background, so we override
&:hover, &:focus, &:active, &.active {
&:hover {
color: @textColorHover;
background-color: @hoverColor;
}
&.disabled, &[disabled] {
color: @white;
background-color: @sand-1;
background-color: @disabledColor;
color: @disabledTextColor;
}
}

40
src/Umbraco.Web.UI.Client/src/less/navs.less
View File

@@ -233,11 +233,14 @@
}
.dropdown-menu > li > a {
position: relative;
padding: 8px 20px;
color: @ui-option-type;
text-decoration: none;
}
.dropdown-menu > li > button {
position: relative;
background: transparent;
border: 0;
padding: 8px 20px;
@@ -253,11 +256,9 @@
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-menu > li > button:hover,
.dropdown-menu > li > button:focus,
.dropdown-submenu:hover > a,
.dropdown-submenu:focus > a {
.dropdown-submenu:hover > button {
color: @ui-option-type-hover;
background: @ui-option-hover;
}
@@ -300,8 +301,7 @@
// Active:hover/:focus dropdown links
// -------------------------
.nav > .dropdown.active > a:hover,
.nav > .dropdown.active > a:focus {
.nav > .dropdown.active > a:hover {
cursor: pointer;
}
@@ -309,24 +309,21 @@
// -------------------------
.nav-tabs .open .dropdown-toggle,
.nav-pills .open .dropdown-toggle,
.nav > li.dropdown.open.active > a:hover,
.nav > li.dropdown.open.active > a:focus {
.nav > li.dropdown.open.active > a:hover {
/*color: @white;*/
background-color: @gray-8;
border-color: @gray-8;
}
.nav li.dropdown.open .caret,
.nav li.dropdown.open.active .caret,
.nav li.dropdown.open a:hover .caret,
.nav li.dropdown.open a:focus .caret {
.nav li.dropdown.open a:hover .caret {
border-top-color: @white;
border-bottom-color: @white;
.opacity(100);
}
// Dropdowns in stacked tabs
.tabs-stacked .open > a:hover,
.tabs-stacked .open > a:focus {
.tabs-stacked .open > a:hover {
border-color: @gray-8;
}
@@ -377,15 +374,13 @@
}
.tabs-below > .nav-tabs > li > a {
.border-radius(0 0 4px 4px);
&:hover,
&:focus {
&:hover {
border-bottom-color: transparent;
border-top-color: @gray-8;
}
}
.tabs-below > .nav-tabs > .active > a,
.tabs-below > .nav-tabs > .active > a:hover,
.tabs-below > .nav-tabs > .active > a:focus {
.tabs-below > .nav-tabs > .active > a:hover {
border-color: transparent @gray-8 @gray-8 @gray-8;
}
@@ -414,13 +409,11 @@
margin-right: -1px;
.border-radius(4px 0 0 4px);
}
.tabs-left > .nav-tabs > li > a:hover,
.tabs-left > .nav-tabs > li > a:focus {
.tabs-left > .nav-tabs > li > a:hover {
border-color: @gray-10 @gray-8 @gray-10 @gray-10;
}
.tabs-left > .nav-tabs .active > a,
.tabs-left > .nav-tabs .active > a:hover,
.tabs-left > .nav-tabs .active > a:focus {
.tabs-left > .nav-tabs .active > a:hover {
border-color: @gray-8 transparent @gray-8 @gray-8;
*border-right-color: @white;
}
@@ -435,13 +428,11 @@
margin-left: -1px;
.border-radius(0 4px 4px 0);
}
.tabs-right > .nav-tabs > li > a:hover,
.tabs-right > .nav-tabs > li > a:focus {
.tabs-right > .nav-tabs > li > a:hover {
border-color: @gray-10 @gray-10 @gray-10 @gray-8;
}
.tabs-right > .nav-tabs .active > a,
.tabs-right > .nav-tabs .active > a:hover,
.tabs-right > .nav-tabs .active > a:focus {
.tabs-right > .nav-tabs .active > a:hover {
border-color: @gray-8 @gray-8 @gray-8 transparent;
*border-left-color: @white;
}
@@ -456,8 +447,7 @@
color: @gray-8;
}
// Nuke hover/focus effects
.nav > .disabled > a:hover,
.nav > .disabled > a:focus {
.nav > .disabled > a:hover {
text-decoration: none;
background-color: transparent;
cursor: default;

1
src/Umbraco.Web.UI.Client/src/less/panel.less
View File

@@ -341,6 +341,7 @@
.umb-panel-header-icon {
cursor: pointer;
margin-right: 5px;
margin-top: -6px;
height: 50px;
display: flex;
justify-content: center;

17
src/Umbraco.Web.UI.Client/src/less/property-editors.less
View File

@@ -249,26 +249,11 @@
transition: all 150ms ease-in-out;
&:focus,
&:active,
&:hover {
color: @ui-action-discreet-type-hover;
border-color: @ui-action-discreet-type-hover;
}
&:focus {
outline: none;
.tabbing-active &:after {
content: '';
position: absolute;
z-index: 10000;
top: -6px;
bottom: -6px;
left: -6px;
right: -6px;
border-radius: 3px;
box-shadow: 0 0 2px @blueMid, inset 0 0 2px 1px @blueMid;
}
}
}
.umb-mediapicker .label {

16
src/Umbraco.Web.UI.Client/src/less/variables.less
View File

@@ -108,6 +108,7 @@
//@blueLight: #4f89de;
@blue: #2E8AEA;
@blueMid: #2152A3;// updated 2019
@blueMidLight: rgb(99, 174, 236);
@blueDark: #3544b1;// updated 2019
@blueExtraDark: #1b264f;// added 2019
@blueLight: #ADD8E6;
@@ -139,6 +140,9 @@
@ui-option-disabled-type-hover: @gray-5;
@ui-option-disabled-hover: @sand-7;
@ui-disabled-type: @gray-6;
@ui-disabled-border: @gray-6;
//@ui-active: #346ab3;
@ui-active: @pinkLight;
@ui-active-blur: @brownLight;
@@ -149,8 +153,8 @@
@ui-selected-hover: ligthen(@sand-5, 10);
@ui-selected-type: @blueExtraDark;
@ui-selected-type-hover: @blueMid;
@ui-selected-border: @pinkLight;
@ui-selected-border-hover: darken(@pinkLight, 10);
@ui-selected-border: @blueDark;
@ui-selected-border-hover: darken(@blueDark, 10);
@ui-light-border: @pinkLight;
@ui-light-type: @gray-4;
@@ -175,6 +179,8 @@
@ui-action-discreet-border: @gray-7;
@ui-action-discreet-border-hover: @blueMid;
@ui-outline: @blueMidLight;
@type-white: @white;
@type-black: @blueNight;
@@ -255,7 +261,7 @@
// Buttons
// -------------------------
@btnBackground: @gray-9;
@btnBackgroundHighlight: @gray-9;
@btnBackgroundHighlight: @gray-10;
@btnBorder: @gray-9;
@btnPrimaryBackground: @ui-btn-positive;
@@ -293,7 +299,7 @@
@inputBackground: @white;
@inputBorder: @gray-8;
@inputBorderFocus: @gray-7;
@inputBorderTabFocus: @blueExtraDark;
@inputBorderTabFocus: @ui-outline;
@inputBorderRadius: 0;
@inputDisabledBackground: @gray-10;
@formActionsBackground: @gray-9;
@@ -448,7 +454,7 @@
@successBorder: transparent;
@infoText: @white;
@infoBackground: @turquoise-d1;
@infoBackground: @blueDark;
@infoBorder: transparent;
@alertBorderRadius: 0;

22
src/Umbraco.Web.UI.Client/src/views/common/drawers/help/help.html
View File

@@ -17,17 +17,21 @@
<div class="umb-help-list">
<a href="" class="umb-help-list-item umb-help-list-item__content flex items-center justify-between" ng-click="tourGroup.open = !tourGroup.open">
<h5 class="umb-help-list-item__group-title">
<i ng-class="{'icon-navigation-right': !tourGroup.open, 'icon-navigation-down': tourGroup.open}"></i>
<button
type="button"
class="umb-help-list-item umb-help-list-item__content flex items-center justify-between"
ng-click="tourGroup.open = !tourGroup.open"
aria-expanded="{{tourGroup.open === undefined ? false : tourGroup.open }}">
<span class="umb-help-list-item__group-title bold">
<i ng-class="{'icon-navigation-right': !tourGroup.open, 'icon-navigation-down': tourGroup.open}" aria-hidden="true"></i>
<span ng-if="tourGroup.group !== 'undefined'">{{tourGroup.group}}</span>
<span ng-if="tourGroup.group === 'undefined'">Other</span>
</h5>
</span>
<umb-progress-circle
percentage="{{tourGroup.completedPercentage}}"
size="40">
</umb-progress-circle>
</a>
</button>
<div ng-if="tourGroup.open">
<div data-element="tour-{{tour.alias}}" class="umb-help-list-item" ng-repeat="tour in tourGroup.tours">
@@ -85,9 +89,9 @@
<ul class="umb-help-list">
<li class="umb-help-list-item" ng-repeat="video in vm.videos track by $index">
<a class="umb-help-list-item__content" data-element="help-article-{{video.title}}" target="_blank" ng-href="{{video.link}}?utm_source=core&utm_medium=help&utm_content=link&utm_campaign=tv">
<i class="umb-help-list-item__icon icon-tv-old"></i>
<i class="umb-help-list-item__icon icon-tv-old" aria-hidden="true"></i>
<span class="umb-help-list-item__title">{{video.title}}</span>
<i class="umb-help-list-item__open-icon icon-out"></i>
<i class="umb-help-list-item__open-icon icon-out" aria-hidden="true"></i>
</a>
</li>
</ul>
@@ -96,7 +100,7 @@
<!-- Links -->
<div class="umb-help-section" data-element="help-links" ng-if="vm.hasAccessToSettings">
<a data-element="help-link-umbraco-tv" class="umb-help-badge" target="_blank" href="https://umbraco.tv?utm_source=core&utm_medium=help&utm_content=link&utm_campaign=tv">
<i class="umb-help-badge__icon icon-tv-old"></i>
<i class="umb-help-badge__icon icon-tv-old" aria-hidden="true"></i>
<div class="umb-help-badge__title">Visit umbraco.tv</div>
<small>
<localize key="help_theBestUmbracoVideoTutorials">The best Umbraco video tutorials</localize>
@@ -104,7 +108,7 @@
</a>
<a data-element="help-link-our-umbraco" class="umb-help-badge" target="_blank" href="https://our.umbraco.com?utm_source=core&utm_medium=help&utm_content=link&utm_campaign=our">
<i class="umb-help-badge__icon icon-favorite"></i>
<i class="umb-help-badge__icon icon-favorite" aria-hidden="true"></i>
<div class="umb-help-badge__title">Visit our.umbraco.com</div>
<small>

42
src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediapicker/mediapicker.controller.js
View File

@@ -1,7 +1,7 @@
//used for the media picker dialog
angular.module("umbraco")
.controller("Umbraco.Editors.MediaPickerController",
function ($scope, $timeout, mediaResource, entityResource, userService, mediaHelper, mediaTypeHelper, eventsService, treeService, localStorageService, localizationService, editorService) {
function ($scope, $timeout, mediaResource, entityResource, userService, mediaHelper, mediaTypeHelper, eventsService, treeService, localStorageService, localizationService) {
var vm = this;
@@ -22,7 +22,6 @@ angular.module("umbraco")
vm.clickHandler = clickHandler;
vm.clickItemName = clickItemName;
vm.editMediaItem = editMediaItem;
vm.gotoFolder = gotoFolder;
var dialogOptions = $scope.model;
@@ -37,8 +36,7 @@ angular.module("umbraco")
$scope.cropSize = dialogOptions.cropSize;
$scope.lastOpenedNode = localStorageService.get("umbLastOpenedMediaNodeId");
$scope.lockedFolder = true;
$scope.allowMediaEdit = dialogOptions.allowMediaEdit ? dialogOptions.allowMediaEdit : false;
var userStartNodes = [];
var umbracoSettings = Umbraco.Sys.ServerVariables.umbracoSettings;
@@ -132,7 +130,7 @@ angular.module("umbraco")
// ID of a UDI or legacy int ID still could be null/undefinied here
// As user may dragged in an image that has not been saved to media section yet
if(id){
if (id) {
entityResource.getById(id, "Media")
.then(function (node) {
$scope.target = node;
@@ -144,8 +142,7 @@ angular.module("umbraco")
openDetailsDialog();
}
}, gotoStartNode);
}
else {
} else {
// No ID set - then this is going to be a tmpimg that has not been uploaded
// User editing this will want to be changing the ALT text
openDetailsDialog();
@@ -254,11 +251,14 @@ angular.module("umbraco")
}
}
function clickItemName(item) {
function clickItemName(item, event, index) {
if (item.isFolder) {
gotoFolder(item);
}
}
else {
$scope.clickHandler(item, event, index);
}
};
function selectMedia(media) {
if (!media.selectable) {
@@ -510,30 +510,6 @@ angular.module("umbraco")
}
}
function editMediaItem(item) {
var mediaEditor = {
id: item.id,
submit: function (model) {
editorService.close()
// update the media picker item in the picker so it matched the saved media item
// the media picker is using media entities so we get the
// entity so we easily can format it for use in the media grid
if (model && model.mediaNode) {
entityResource.getById(model.mediaNode.id, "media")
.then(function (mediaEntity) {
angular.extend(item, mediaEntity);
setMediaMetaData(item);
setUpdatedMediaNodes(item);
});
}
},
close: function (model) {
setUpdatedMediaNodes(item);
editorService.close();
}
};
editorService.mediaEditor(mediaEditor);
};
/**
* Called when the umbImageGravity component updates the focal point value

11
src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediapicker/mediapicker.html
View File

@@ -56,19 +56,19 @@
<div class="row umb-control-group" ng-show="!vm.searchOptions.filter">
<ul class="umb-breadcrumbs">
<li ng-hide="startNodeId != -1" class="umb-breadcrumbs__ancestor">
<button type="button" class="umb-breadcrumbs__action" ng-click="vm.gotoFolder()">
<button type="button" class="umb-breadcrumbs__action umb-outline umb-outline--surronding" ng-click="vm.gotoFolder()" ng-class="{'--current':path.length === 0}">
<localize key="treeHeaders_media">Media</localize>
</button>
<span class="umb-breadcrumbs__separator" aria-hidden="true">&#47;</span>
</li>
<li ng-repeat="item in path" class="umb-breadcrumbs__ancestor">
<button type="button" class="umb-breadcrumbs__action" ng-click="vm.gotoFolder(item)">{{item.name}}</button>
<button type="button" class="umb-breadcrumbs__action umb-outline umb-outline--surronding" ng-click="vm.gotoFolder(item)" ng-class="{'--current':$last}">{{item.name}}</button>
<span class="umb-breadcrumbs__separator" aria-hidden="true">&#47;</span>
</li>
<li class="umb-breadcrumbs__ancestor" ng-show="!lockedFolder">
<button type="button" class="umb-breadcrumbs__action" ng-hide="model.showFolderInput" ng-click="model.showFolderInput = true">
<button type="button" class="umb-breadcrumbs__action umb-outline umb-outline--surronding" ng-hide="model.showFolderInput" ng-click="model.showFolderInput = true">
<i class="icon icon-add small" aria-hidden="true"></i>
<span class="sr-only">
<localize key="visuallyHiddenTexts_createNewFolder">Create new folder</localize>
@@ -105,8 +105,6 @@
items="images"
on-click="vm.clickHandler"
on-click-name="vm.clickItemName"
on-click-edit="vm.editMediaItem(item)"
allow-on-click-edit="{{allowMediaEdit}}"
item-max-width="150"
item-max-height="150"
item-min-width="100"
@@ -115,7 +113,8 @@
only-images={{onlyImages}}
only-folders={{onlyFolders}}
include-sub-folders={{showChilds}}
current-folder-id="{{currentFolder.id}}">
current-folder-id="{{currentFolder.id}}"
allow-open-folder="!disableFolderSelect">
</umb-media-grid>

6
src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/querybuilder/querybuilder.controller.js
View File

@@ -31,7 +31,6 @@
vm.datePickerChange = datePickerChange;
vm.submit = submit;
vm.close = close;
vm.copyQuery = copyQuery;
function onInit() {
@@ -121,11 +120,6 @@
query.filters.push({});
}
function copyQuery() {
var copyText = $scope.model.result.queryExpression;
navigator.clipboard.writeText(copyText);
}
function trashFilter(query, filter) {
for (var i = 0; i < query.filters.length; i++) {
if (query.filters[i] == filter) {

11
src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/querybuilder/querybuilder.html
View File

@@ -113,11 +113,11 @@
</span>
<a href ng-click="vm.addFilter(vm.query)">
<i class="icon-add"></i>
<i class="icon-add" aria-hidden="true"></i>
</a>
<a href ng-click="vm.trashFilter(vm.query, filter)">
<i class="icon-trash"></i>
<i class="icon-trash" aria-hidden="true"></i>
</a>
</div>
@@ -159,14 +159,11 @@
<ul class="nav unstyled">
<li ng-repeat="item in model.result.sampleResults">
<i class="icon icon-document turquoise-d1"></i> {{item.name}}
<i class="icon icon-document turquoise-d1" aria-hidden="true"></i> {{item.name}}
</li>
</ul>
<pre>{{model.result.queryExpression}}</pre>
<a href ng-click="vm.copyQuery()">
<i class="icon-document"></i> <localize key="template_copyToClipboard">copy to clipboard</localize>
</a>
<umb-code-snippet language="'csharp'">{{model.result.queryExpression}}</umb-code-snippet>
</div>

37
src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/usergrouppicker/usergrouppicker.html
View File

@@ -13,10 +13,10 @@
<umb-editor-container>
<umb-load-indicator ng-if="vm.loading"></umb-load-indicator>
<umb-box>
<umb-box-content>
<div class="form-search" style="margin-bottom: 15px;">
<i class="icon-search"></i>
<input type="text"
@@ -27,26 +27,31 @@
umb-auto-focus
no-dirty-check />
</div>
<div class="umb-user-group-picker-list">
<a href="" class="umb-user-group-picker-list-item" ng-repeat="userGroup in vm.userGroups | filter:searchTerm" ng-click="vm.selectUserGroup(userGroup)">
<div class="umb-user-group-picker-list-item" ng-repeat="userGroup in vm.userGroups | filter:searchTerm">
<button type="button" class="umb-user-group-picker__action" ng-click="vm.selectUserGroup(userGroup)">
<span class="sr-only" ng-if="!userGroup.selected"><localize key="buttons_select">Select</localize> {{userGroup.name}}</span>
<span class="sr-only" ng-if="userGroup.selected">{{userGroup.name}} <localize key="general_selected">Selected</localize></span>
</button>
<div class="umb-user-group-picker-list-item__icon">
<i ng-if="!userGroup.selected" class="{{userGroup.icon}}"></i>
<i ng-if="!userGroup.selected" class="{{userGroup.icon}}" aria-hidden="true"></i>
<umb-checkmark ng-if="userGroup.selected" checked="userGroup.selected" size="xs"></umb-checkmark>
</div>
<div>
<div class="umb-user-group-picker-list-item__name">{{ userGroup.name }}</div>
<div class="umb-user-group-picker-list-item__permission" ng-if="userGroup.sections">
<span>
<span class="bold"><localize key="main_sections">Sections</localize>:</span>
<span ng-repeat="section in userGroup.sections">{{ section.name }}<span ng-if="!$last">, </span></span>
</span>
</div>
<div class="umb-user-group-picker-list-item__permission">
<span>
<span class="bold"><localize key="user_startnode">Content start node</localize>:</span>
@@ -54,7 +59,7 @@
<span ng-if="userGroup.contentStartNode">{{ userGroup.contentStartNode.name }}</span>
</span>
</div>
<div class="umb-user-group-picker-list-item__permission">
<span>
<span class="bold"><localize key="user_mediastartnode">Media start node</localize>:</span>
@@ -63,16 +68,16 @@
</span>
</div>
</div>
</a>
</div>
</div>
<umb-empty-state
ng-if="vm.userGroups.length === 0 && !vm.loading"
position="center">
No user groups have been added
<localize key="user_noUserGroupsAdded">No user groups have been added</localize>
</umb-empty-state>
</umb-box-content>
</umb-box>

2
src/Umbraco.Web.UI.Client/src/views/components/application/umb-tour.html
View File

@@ -29,7 +29,7 @@
total-steps="model.steps.length">
</umb-tour-step-counter>
<div ng-if="model.allowDisable && model.currentStep.type === 'intro'">
<button type="button" class="underline" ng-click="model.disableTour()" style="font-size: 13px; background: transparent; border: none; padding: 0;" prevent-default>Don't show this tour again</button>
<button type="button" class="underline" ng-click="model.disableTour()" prevent-default>Don't show this tour again</button>
</div>
</div>

21
src/Umbraco.Web.UI.Client/src/views/components/buttons/umb-button.html
View File

@@ -7,7 +7,12 @@
<div ng-if="vm.innerState !== 'init'" class="umb-button__overlay"></div>
</div>
<a ng-if="vm.type === 'link'" ng-href="{{vm.href}}" class="btn umb-button__button {{vm.style}} umb-button--{{vm.size}}" ng-click="vm.clickButton($event)" hotkey="{{vm.shortcut}}" hotkey-when-hidden="{{vm.shortcutWhenHidden}}">
<a ng-if="vm.type === 'link'"
ng-href="{{vm.href}}"
class="btn umb-button__button {{vm.style}} umb-button--{{vm.size}} umb-outline"
ng-click="vm.clickButton($event)"
hotkey="{{vm.shortcut}}"
hotkey-when-hidden="{{vm.shortcutWhenHidden}}">
<span class="umb-button__content" ng-class="{'-hidden': vm.innerState !== 'init'}">
<i ng-if="vm.icon" class="{{vm.icon}} umb-button__icon" aria-hidden="true"></i>
{{vm.buttonLabel}}
@@ -18,7 +23,7 @@
<button
ng-if="vm.type === 'button'"
type="button"
class="btn umb-button__button {{vm.style}} umb-button--{{vm.size}}"
class="btn umb-button__button {{vm.style}} umb-button--{{vm.size}} umb-outline"
ng-click="vm.clickButton($event)"
hotkey="{{vm.shortcut}}"
hotkey-when-hidden="{{vm.shortcutWhenHidden}}"
@@ -34,12 +39,20 @@
</span>
</button>
<button ng-if="vm.type === 'submit'" type="submit" class="btn umb-button__button {{vm.style}} umb-button--{{vm.size}}" hotkey="{{vm.shortcut}}" hotkey-when-hidden="{{vm.shortcutWhenHidden}}" ng-disabled="vm.disabled" umb-auto-focus="{{vm.autoFocus && !vm.disabled ? 'true' : 'false'}}">
<button
ng-if="vm.type === 'submit'"
type="submit"
class="btn umb-button__button {{vm.style}} umb-button--{{vm.size}} umb-outline"
hotkey="{{vm.shortcut}}"
hotkey-when-hidden="{{vm.shortcutWhenHidden}}"
ng-disabled="vm.disabled"
umb-auto-focus="{{vm.autoFocus && !vm.disabled ? 'true' : 'false'}}">
<span class="umb-button__content" ng-class="{'-hidden': vm.innerState !== 'init'}">
<i ng-if="vm.icon" class="{{vm.icon}} umb-button__icon" aria-hidden="true"></i>
{{vm.buttonLabel}}
<span ng-if="vm.showCaret" class="umb-button__caret caret" aria-hidden="true"></span>
</span>
</button>
</button
</div>

2
src/Umbraco.Web.UI.Client/src/views/components/content/umb-content-node-info.html
View File

@@ -169,7 +169,7 @@
ng-change="updateTemplate(node.template)">
<option value="">{{chooseLabel}}...</option>
</select>
<button ng-show="allowChangeTemplate && node.template !== null" class="umb-node-preview__action" style="margin-left:15px;" ng-click="openTemplate()">
<button type="button" ng-show="allowChangeTemplate && node.template !== null" class="umb-node-preview__action" style="margin-left:15px;" ng-click="openTemplate()">
<localize key="general_open">Open</localize>
</button>
</div>

8
src/Umbraco.Web.UI.Client/src/views/components/editor/umb-editor-content-header.html
View File

@@ -39,10 +39,10 @@
autocomplete="off" maxlength="255" />
</ng-form>
<a ng-if="content.variants.length > 0 && hideChangeVariant !== true" class="umb-variant-switcher__toggle" href="" ng-click="vm.dropdownOpen = !vm.dropdownOpen" ng-class="{'--error': vm.errorsOnOtherVariants}">
<button type="button" ng-if="content.variants.length > 0 && hideChangeVariant !== true" class="umb-variant-switcher__toggle umb-outline" href="" ng-click="vm.dropdownOpen = !vm.dropdownOpen" ng-class="{'--error': vm.errorsOnOtherVariants}">
<span>{{vm.currentVariant.language.name}}</span>
<ins class="umb-variant-switcher__expand" ng-class="{'icon-navigation-down': !vm.dropdownOpen, 'icon-navigation-up': vm.dropdownOpen}">&nbsp;</ins>
</a>
</button>
<span ng-if="hideChangeVariant" class="umb-variant-switcher__toggle">
<span>{{vm.currentVariant.language.name}}</span>
@@ -50,10 +50,10 @@
<umb-dropdown ng-if="vm.dropdownOpen" style="min-width: 100%; max-height: 250px; overflow-y: auto; margin-top: 5px;" on-close="vm.dropdownOpen = false" umb-keyboard-list>
<umb-dropdown-item class="umb-variant-switcher__item" ng-class="{'--current': variant.active, '--not-allowed': variantIsOpen(variant.language.culture), '--error': variantHasError(variant.language.culture)}" ng-repeat="variant in content.variants">
<a href="" class="umb-variant-switcher__name-wrapper" ng-click="selectVariant($event, variant)" prevent-default>
<button class="umb-variant-switcher__name-wrapper umb-outline umb-outline--thin" ng-click="selectVariant($event, variant)" prevent-default>
<span class="umb-variant-switcher__name">{{variant.language.name}}</span>
<umb-variant-state variant="variant" class="umb-variant-switcher__state"></umb-variant-state>
</a>
</button>
<div ng-if="splitViewOpen !== true && !variant.active" class="umb-variant-switcher__split-view" ng-click="openInSplitView($event, variant)">Open in split view</div>
</umb-dropdown-item>
</umb-dropdown>

18
src/Umbraco.Web.UI.Client/src/views/components/editor/umb-editor-header.html
View File

@@ -12,13 +12,17 @@
<div class="flex items-center" style="flex: 1;">
<ng-form data-element="editor-icon" name="iconForm">
<div class="umb-panel-header-icon" ng-if="!hideIcon" ng-click="openIconPicker()" ng-class="{'-placeholder': $parent.icon==='' || $parent.icon===null}"
title="{{$parent.icon}}">
<i class="icon {{$parent.icon}}" ng-if="$parent.icon!=='' && $parent.icon!==null"></i>
<div class="umb-panel-header-icon-text" ng-if="$parent.icon==='' || $parent.icon===null">
<localize key="settings_addIcon"></localize>
</div>
</div>
<button
type="button" class="umb-panel-header-icon"
ng-if="!hideIcon"
ng-click="openIconPicker()"
ng-class="{'-placeholder': $parent.icon==='' || $parent.icon===null}"
title="{{$parent.icon}}">
<i class="icon {{$parent.icon}}" ng-if="$parent.icon!=='' && $parent.icon!==null" aria-hidden="true"></i>
<div class="umb-panel-header-icon-text" ng-if="$parent.icon==='' || $parent.icon===null">
<localize key="settings_addIcon">Add icon</localize>
</div>
</button>
</ng-form>
<div id="nameField" class="umb-editor-header__name-and-description" style="flex: 1 1 auto;">

2
src/Umbraco.Web.UI.Client/src/views/components/editor/umb-editor-navigation-item.html
View File

@@ -4,7 +4,7 @@
hotkey="{{::vm.hotkey}}"
hotkey-when-hidden="true"
ng-class="{'is-active': vm.item.active, '-has-error': vm.item.hasError}"
class="umb-sub-views-nav-item__action">
class="umb-sub-views-nav-item__action umb-outline umb-outline--thin">
<i class="icon {{ vm.item.icon }}" aria-hidden="true"></i>
<span class="umb-sub-views-nav-item-text">{{ vm.item.name }}</span>
<div ng-show="vm.item.badge" class="badge -type-{{vm.item.badge.type}}">{{vm.item.badge.count}}</div>

2
src/Umbraco.Web.UI.Client/src/views/components/property/umb-property.html
View File

@@ -1,6 +1,6 @@
<div class="umb-property">
<ng-form name="propertyForm">
<div class="control-group umb-control-group" ng-class="{hidelabel:property.hideLabel}">
<div class="control-group umb-control-group" ng-class="{hidelabel:property.hideLabel, 'umb-control-group__listview': property.alias === '_umb_containerView'}">
<val-property-msg></val-property-msg>

2
src/Umbraco.Web.UI.Client/src/views/components/tree/umb-tree-item.html
View File

@@ -11,7 +11,7 @@
<i class="icon umb-tree-icon sprTree" ng-class="::node.cssClass" title="{{::node.title}}" ng-click="select(node, $event)" ng-style="::node.style" tabindex="-1"></i>
<span class="umb-tree-item__annotation"></span>
<a class="umb-tree-item__label umb-outline" ng-href="#/{{::node.routePath}}" ng-click="select(node, $event)" title="{{::node.title}}">{{node.name}}</a>
<a class="umb-tree-item__label" ng-href="#/{{::node.routePath}}" ng-click="select(node, $event)" title="{{::node.title}}">{{node.name}}</a>
<!-- NOTE: These are the 'option' elipses -->
<button data-element="tree-item-options" class="umb-options btn-reset sr-only sr-only--focusable sr-only--hoverable" ng-click="options(node, $event)" ng-if="::node.menuUrl" aria-label="{{optionsText}} {{node.name}}"><i></i><i></i><i></i></button>

2
src/Umbraco.Web.UI.Client/src/views/components/umb-checkmark.html
View File

@@ -1 +1 @@
<i class="icon-check umb-checkmark umb-checkmark--{{size}}" ng-class="{'umb-checkmark--checked': checked, 'cursor-auto': readonly}"></i>
<i class="icon-check umb-checkmark umb-checkmark--{{size}} umb-outline" ng-class="{'umb-checkmark--checked': checked, 'cursor-auto': readonly}"></i>

23
src/Umbraco.Web.UI.Client/src/views/components/umb-code-snippet.html Normal file
View File

@@ -0,0 +1,23 @@
<div class="umb-code-snippet">
<div class="umb-code-snippet__header">
<span class="language" ng-if="vm.language">{{vm.language}}</span>
<umb-button umb-clipboard
umb-clipboard-success="vm.copySuccess()"
umb-clipboard-error="vm.copyError()"
umb-clipboard-target="#umbCodeSnippet_{{vm.guid}}"
state="vm.page.copyCodeButtonState"
icon="icon-documents"
type="button"
size="s"
label="Copy"
label-key="general_copy">
</umb-button>
</div>
<div class="umb-code-snippet__content">
<pre id="umbCodeSnippet_{{vm.guid}}">
<code ng-transclude></code>
</pre>
</div>
</div>

4
src/Umbraco.Web.UI.Client/src/views/components/umb-content-grid.html
View File

@@ -1,14 +1,14 @@
<div class="umb-content-grid">
<div
class="umb-content-grid__item"
class="umb-content-grid__item umb-outline umb-outline--surrounding"
ng-repeat="item in content"
ng-class="{'-selected': item.selected}"
ng-click="clickItem(item, $event, $index)">
<div class="umb-content-grid__content">
<a class="umb-content-grid__item-name"
<a class="umb-content-grid__item-name umb-outline"
ng-href="{{'#' + item.editPath}}"
ng-click="clickItemName(item, $event, $index)"
ng-class="{'-light': !item.published && item.updater != null}">

24
src/Umbraco.Web.UI.Client/src/views/components/umb-grid-selector.html
View File

@@ -4,30 +4,34 @@
<div class="umb-grid-selector__item -default" ng-if="defaultItem !== null">
<div class="umb-grid-selector__item-content">
<i class="umb-grid-selector__item-icon {{ defaultItem.icon }}"></i>
<i class="umb-grid-selector__item-icon {{ defaultItem.icon }}" aria-hidden="true"></i>
<div class="umb-grid-selector__item-label">{{ defaultItem.name }}</div>
<div ng-show="defaultItem.id"><a href="" class="umb-grid-selector__item-default-label -blue" ng-click="openTemplate(defaultItem)"><localize key="general_open">Open</localize></a></div>
<div ng-show="defaultItem.id"><button class="umb-grid-selector__item-default-label btn-link -blue" ng-click="openTemplate(defaultItem)"><localize key="general_open">Open</localize></button></div>
<span class="umb-grid-selector__item-default-label">(<localize key="general_default">Default</localize> {{itemLabel}})</span>
</div>
<i class="umb-grid-selector__item-remove icon-trash" ng-if="selectedItems.length === 1" ng-click="removeDefaultItem()"></i>
</div>
<i class="umb-grid-selector__item-remove icon-trash" ng-if="selectedItems.length === 1" ng-click="removeDefaultItem()" aria-role="button">
<span class="sr-only">Remove Template</span>
</i>
</div>
<div class="umb-grid-selector__item" ng-repeat="selectedItem in selectedItems | filter: { alias:'!'+defaultItem.alias }:true">
<div class="umb-grid-selector__item-content">
<i class="umb-grid-selector__item-icon {{ selectedItem.icon }}"></i>
<i class="umb-grid-selector__item-icon {{ selectedItem.icon }}" aria-hidden="true"></i>
<div class="umb-grid-selector__item-label">{{ selectedItem.name }}</div>
<div><a href="" class="umb-grid-selector__item-default-label -blue" ng-click="openTemplate(selectedItem)"><localize key="general_open">Open</localize></a></div>
<div><a href="" class="umb-grid-selector__item-default-label -blue" ng-click="setAsDefaultItem(selectedItem)"><localize key="grid_setAsDefault">Set as default</localize></a></div>
<div><button class="umb-grid-selector__item-default-label btn-link -blue" ng-click="openTemplate(selectedItem)"><localize key="general_open">Open</localize></button></div>
<div><button class="umb-grid-selector__item-default-label btn-link -blue" ng-click="setAsDefaultItem(selectedItem)"><localize key="grid_setAsDefault">Set as default</localize></button></div>
</div>
<i class="umb-grid-selector__item-remove icon-trash" ng-click="removeItem(selectedItem)"></i>
<i class="umb-grid-selector__item-remove icon-trash" ng-click="removeItem(selectedItem)" aria-role="button">
<span class="sr-only">Remove Template</span>
</i>
</div>
<a href="" class="umb-grid-selector__item -placeholder" ng-if="(availableItems | compareArrays:selectedItems:'alias').length > 0" ng-click="openItemPicker($event)" hotkey="alt+shift+g">
<button class="umb-grid-selector__item -placeholder" ng-if="(availableItems | compareArrays:selectedItems:'alias').length > 0" ng-click="openItemPicker($event)" hotkey="alt+shift+g">
<div class="umb-grid-selector__item-content">
<div class="umb-grid-selector__item-label -blue" ng-if="defaultItem !== null"><localize key="grid_chooseExtra">Choose extra</localize> {{ itemLabel }}</div>
<div class="umb-grid-selector__item-label -blue" ng-if="defaultItem === null"><localize key="grid_chooseDefault">Choose default</localize> {{ itemLabel }}</div>
</div>
</a>
</button>
</div>

2
src/Umbraco.Web.UI.Client/src/views/components/umb-layout-selector.html
View File

@@ -1,6 +1,6 @@
<div class="umb-layout-selector" ng-show="vm.showLayoutSelector">
<button type="button" aria-expanded="{{vm.layoutDropDownIsOpen}}" class="umb-layout-selector__active-layout" ng-click="vm.toggleLayoutDropdown()" prevent-default>
<button type="button" aria-expanded="{{vm.layoutDropDownIsOpen}}" class="umb-layout-selector__active-layout umb-outline" ng-click="vm.toggleLayoutDropdown()" prevent-default>
<i class="{{ vm.activeLayout.icon }}" aria-hidden="true"></i>
<span class="sr-only">
<localize key="visuallyHiddenTexts_activeListLayout">Active layout:</localize>&nbsp;

20
src/Umbraco.Web.UI.Client/src/views/components/umb-media-grid.html
View File

@@ -1,13 +1,23 @@
<div data-element="media-grid" class="umb-media-grid">
<div data-element="media-grid-item-{{$index}}" class="umb-media-grid__item" title="{{item.name}}" ng-click="clickItem(item, $event, $index)" ng-repeat="item in items | filter:filterBy" ng-style="item.flexStyle" ng-class="{'-selected': item.selected, '-file': !item.thumbnail, '-svg': item.extension == 'svg', '-selectable': item.selectable, '-unselectable': !item.selectable}">
<div data-element="media-grid-item-{{$index}}"
class="umb-media-grid__item umb-outline umb-outline--surrounding"
title="{{item.name}}"
ng-click="clickItem(item, $event, $index)"
ng-repeat="item in items | filter:filterBy"
ng-style="item.flexStyle"
ng-class="{'-selected': item.selected, '-file': !item.thumbnail, '-folder': item.isFolder, '-svg': item.extension == 'svg', '-selectable': item.selectable, '-unselectable': !item.selectable}"
>
<div>
<!--<i ng-show="item.selected" class="icon-check umb-media-grid__checkmark"></i>-->
<a ng-if="allowOnClickEdit === 'true'" ng-click="clickEdit(item, $event)" ng-href="" class="icon-edit umb-media-grid__edit"></a>
<button data-element="media-grid-item-edit" class="umb-media-grid__item-overlay btn-reset" ng-class="{'-locked': item.selected || !item.file || !item.thumbnail}" ng-click="clickItemName(item, $event, $index)" type="button">
<div data-element="media-grid-item-edit"
class="umb-media-grid__item-overlay umb-outline"
ng-class="{'-locked': item.selected || !item.file || !item.thumbnail, '-can-open': (item.isFolder ? allowOpenFolder : allowOpenFile)}"
ng-click="clickItemName(item, $event, $index)"
tabindex="{{item.isFolder && item.selectable ? '0' : '-1'}}"
>
<i ng-if="onDetailsHover" class="icon-info umb-media-grid__info" ng-mouseover="hoverItemDetails(item, $event, true)" ng-mouseleave="hoverItemDetails(item, $event, false)"></i>
<div class="umb-media-grid__item-name">{{item.name}}</div>
</button>
</div>
<!-- Check backgrund -->
<div class="umb-media-grid__image-background" ng-if="item.thumbnail || item.extension === 'svg'"></div>

27
src/Umbraco.Web.UI.Client/src/views/components/umb-mini-list-view.html
View File

@@ -1,18 +1,18 @@
<div class="umb-minilistview">
<div class="umb-mini-list-view umb-animated"
ng-class="{'umb-mini-list-view--forward': listViewAnimation === 'in', 'umb-mini-list-view--backwards': listViewAnimation === 'out'}"
<div class="umb-mini-list-view umb-animated"
ng-class="{'umb-mini-list-view--forward': listViewAnimation === 'in', 'umb-mini-list-view--backwards': listViewAnimation === 'out'}"
ng-repeat="miniListView in miniListViews">
<div class="umb-mini-list-view__title">
<i class="umb-mini-list-view__title-icon {{ miniListView.node.icon }}"></i>
<i class="umb-mini-list-view__title-icon {{ miniListView.node.icon }}" aria-hidden="true"></i>
<h4 class="umb-mini-list-view__title-text">{{ miniListView.node.name }}</h4>
</div>
<div class="umb-mini-list-view__breadcrumb">
<a ng-if="showBackButton()" href="" class="umb-mini-list-view__back" ng-click="exitMiniListView()">
<i class="icon-arrow-left umb-mini-list-view__back-icon"></i>
<i class="icon-arrow-left umb-mini-list-view__back-icon" aria-hidden="true"></i>
<span class="umb-mini-list-view__back-text"><localize key="general_back">Back</localize></span> /
</a>
@@ -30,13 +30,12 @@
<!-- Head -->
<div class="umb-table-head">
<div class="umb-table-row">
<div class="umb-table-cell" style="display: none;"></div>
<div class="umb-table-cell" style="padding-top: 8px; padding-bottom: 8px;">
<form class="form-search -no-margin-bottom" style="width: 100%; margin-right: 0;" novalidate>
<div class="umb-table-cell no-display"></div>
<div class="umb-table-cell umb-table-cell-padding">
<form class="form-search -no-margin-bottom" novalidate>
<div class="inner-addon left-addon">
<i class="icon icon-search" style="font-size: 14px;"></i>
<i class="icon icon-search" aria-hidden="true"></i>
<input
style="width: 100%;"
class="form-control search-input"
type="text"
localize="placeholder"
@@ -60,15 +59,15 @@
</div>
<!-- Items -->
<div class="umb-table-row cursor-pointer"
<div class="umb-table-row cursor-pointer umb-outline"
ng-repeat="child in miniListView.children"
ng-click="selectNode(child)"
ng-class="{'-selected':child.selected, 'not-allowed':!child.allowed}">
<div class="umb-table-cell umb-table-cell--auto-width" ng-class="{'umb-table-cell--faded':child.published === false}">
<div class="flex items-center">
<ins class="icon-navigation-right umb-table__row-expand" ng-click="openNode($event, child)" ng-class="{'umb-table__row-expand--hidden': child.metaData.hasChildren !== true}">&nbsp;</ins>
<i class="umb-table-body__icon umb-table-body__fileicon {{child.icon}}"></i>
<i class="umb-table-body__icon umb-table-body__checkicon icon-check"></i>
<i class="umb-table-body__icon umb-table-body__fileicon {{child.icon}}" aria-hidden="true"></i>
<i class="umb-table-body__icon umb-table-body__checkicon icon-check" aria-hidden="true"></i>
</div>
</div>
<div class="umb-table-cell black" ng-class="{'umb-table-cell--faded':child.published === false}">{{ child.name }}</div>
@@ -76,8 +75,8 @@
<!-- Load indicator when the list doesn't have items -->
<div ng-if="!miniListView.loading && !miniListView.children" class="umb-table-row umb-table-row--empty">
<span ng-if="search === ''"><localize key="general_noItemsInList"></localize></span>
<span ng-if="search !== ''"><localize key="general_searchNoResult"></localize></span>
<span ng-if="search === ''"><localize key="general_noItemsInList">No items have been added</localize></span>
<span ng-if="search !== ''"><localize key="general_searchNoResult">Sorry, we can not find what you are looking for.</localize></span>
</div>
<!-- Load indicator when the list doesn't have items -->

14
src/Umbraco.Web.UI.Client/src/views/components/umb-mini-search/umb-mini-search.html Normal file
View File

@@ -0,0 +1,14 @@
<ng-form class="umb-mini-search" ng-class="{'--has-value': vm.model !== null && vm.model !== ''}" novalidate>
<i class="icon icon-search"></i>
<input
class="form-control search-input"
type="text"
localize="placeholder,label"
label="@general_typeToSearch"
placeholder="@general_typeToSearch"
ng-model="vm.model"
ng-change="vm.onChange()"
ng-keydown="vm.onKeyDown($event)"
prevent-enter-submit
no-dirty-check>
</ng-form>

49
src/Umbraco.Web.UI.Client/src/views/components/umb-mini-search/umbminisearch.component.js Normal file
View File

@@ -0,0 +1,49 @@
(function () {
'use strict';
angular
.module('umbraco')
.component('umbMiniSearch', {
templateUrl: 'views/components/umb-mini-search/umb-mini-search.html',
controller: UmbMiniSearchController,
controllerAs: 'vm',
bindings: {
model: "=",
onStartTyping: "&?",
onSearch: "&?"
}
});
function UmbMiniSearchController($scope) {
var vm = this;
var searchDelay = _.debounce(function () {
$scope.$apply(function () {
if (vm.onSearch) {
vm.onSearch();
}
});
}, 500);
vm.onKeyDown = function (ev) {
//13: enter
switch (ev.keyCode) {
case 13:
if (vm.onSearch) {
vm.onSearch();
}
break;
}
};
vm.onChange = function () {
if (vm.onStartTyping) {
vm.onStartTyping();
}
searchDelay();
};
}
})();

4
src/Umbraco.Web.UI.Client/src/views/components/umb-progress-bar.html
View File

@@ -1,3 +1,3 @@
<div class="umb-progress-bar umb-progress-bar--{{size}}">
<span class="umb-progress-bar umb-progress-bar--{{size}}">
<span class="umb-progress-bar__progress" style="width: {{percentage}}%"></span>
</div>
</span>

2
src/Umbraco.Web.UI.Client/src/views/components/umb-table.html
View File

@@ -37,7 +37,7 @@
</div>
<!-- Listview body section -->
<div class="umb-table-body">
<div class="umb-table-row -selectable"
<div class="umb-table-row -selectable umb-outline"
ng-repeat="item in vm.items track by $index"
ng-class="{'-selected':item.selected, '-light':!item.published && item.updater != null}"
ng-click="vm.selectItem(item, $index, $event)">

5
src/Umbraco.Web.UI.Client/src/views/components/upload/umb-property-file-upload.html
View File

@@ -44,9 +44,10 @@
</div>
</div>
</div>
<div>
<a href class="btn btn-link btn-crop-delete" ng-click="vm.clear()"><i class="icon-delete red"></i> <localize key="content_uploadClear">Remove file</localize></a>
<button class="btn btn-link btn-crop-delete" aria-hidden="true" ng-click="vm.clear()"><i class="icon-delete red"></i> <localize key="content_uploadClear">Remove file</localize></button>
<button class="sr-only" ng-if="file.isImage" ng-click="vm.clear()"><localize key="content_uploadClearImageContext">Click here to remove the image from the media item</localize></button>
<button class="sr-only" ng-if="!file.isImage" ng-click="vm.clear()"><localize key="content_uploadClearFileContext">Click here to remove the file from the media item</localize></button>
</div>
</div>

4
src/Umbraco.Web.UI.Client/src/views/components/users/change-password.html
View File

@@ -6,7 +6,7 @@
</div>
<div ng-switch="vm.changing">
<div ng-switch-when="false">
<button type="button" ng-click="vm.doChange()" class="btn umb-button__button btn-action">
<button type="button" ng-click="vm.doChange()" class="btn umb-button__button btn-action umb-outline umb-outline--thin">
<localize key="general_changePassword">Change password</localize>
</button>
</div>
@@ -59,7 +59,7 @@
</span>
</umb-control-group>
<button ng-click="vm.cancelChange()" ng-show="vm.showCancelBtn()" class="btn umb-button__button btn-cancel umb-button--">
<button ng-click="vm.cancelChange()" ng-show="vm.showCancelBtn()" class="btn umb-button__button btn-cancel umb-button-- umb-outline umb-outline--thin">
<localize key="general_cancel">Cancel</localize>
</button>

4
src/Umbraco.Web.UI.Client/src/views/components/users/umb-user-group-preview.html
View File

@@ -39,8 +39,8 @@
</div>
<div class="umb-user-group-preview__actions">
<a class="umb-user-group-preview__action" title="Edit" href="" ng-if="allowEdit" ng-click="onEdit()"><localize key="general_edit">Edit</localize></a>
<a class="umb-user-group-preview__action umb-user-group-preview__action--red" title="Remove" href="" ng-if="allowRemove" ng-click="onRemove()"><localize key="general_remove">Remove</localize></a>
<button class="btn-link umb-user-group-preview__action" title="Edit" ng-if="allowEdit" ng-click="onEdit()"><localize key="general_edit">Edit</localize></button>
<button class="btn-link umb-user-group-preview__action umb-user-group-preview__action--red" title="Remove" ng-if="allowRemove" ng-click="onRemove()"><localize key="general_remove">Remove</localize></button>
</div>
</div>

13
src/Umbraco.Web.UI.Client/src/views/content/assigndomain.html
View File

@@ -2,7 +2,7 @@
<umb-load-indicator ng-show="vm.loading"></umb-load-indicator>
<form name="vm.domainForm" ng-submit="vm.save()" novalidate>
<form name="vm.domainForm" ng-submit="vm.save()" id="assignDomain" novalidate>
<div ng-hide="vm.loading" class="umb-dialog-body">
@@ -24,11 +24,11 @@
</div>
<h5 class="umb-pane-title"><localize key="assignDomain_setDomains">Domains</localize></h5>
<small class="db" style="margin-bottom: 10px;">
<small class="db mb3">
<localize key="assignDomain_domainHelpWithVariants"></localize>
</small>
<div class="umb-el-wrap hidelabel">
<table class="table table-condensed table-bordered domains" style="margin-bottom: 10px;" ng-if="vm.domains.length > 0">
<table class="table table-condensed table-bordered domains mb3" ng-if="vm.domains.length > 0">
<thead>
<tr>
<th>
@@ -45,7 +45,9 @@
<tbody>
<tr ng-repeat="domain in vm.domains">
<td>
<input style="width: 100%; margin-bottom: 0;" type="text" ng-model="domain.name" name="domain_name_{{$index}}" required umb-auto-focus />
<input type="text" class="w-100" ng-model="domain.name" name="domain_name_{{$index}}" required umb-auto-focus />
<span ng-if="vm.domainForm.$submitted" ng-messages="vm.domainForm['domain_name_' + $index].$error">
<span class="help-inline" ng-message="required"><localize key="validation_invalidEmpty"></localize></span>
</span>
@@ -53,9 +55,8 @@
</td>
<td>
<select
style="width: 100%; margin-bottom: 0;"
name="domain_language_{{$index}}"
class="language"
class="language w-100"
ng-model="domain.lang"
ng-options="lang.name for lang in vm.languages"
required>

9
src/Umbraco.Web.UI.Client/src/views/content/content.assigndomain.controller.js
View File

@@ -1,7 +1,7 @@
(function () {
"use strict";
function AssignDomainController($scope, localizationService, languageResource, contentResource, navigationService) {
function AssignDomainController($scope, localizationService, languageResource, contentResource, navigationService, notificationsService) {
var vm = this;
vm.closeDialog = closeDialog;
@@ -114,8 +114,10 @@
// validation is interesting. Check if response is valid
if(response.valid) {
vm.submitButtonState = "success";
localizationService.localize('speechBubbles_editCulturesAndHostnamesSaved').then(function(value) {
notificationsService.success(value);
});
closeDialog();
// show validation messages for each domain
@@ -129,6 +131,9 @@
});
});
vm.submitButtonState = "error";
localizationService.localize('speechBubbles_editCulturesAndHostnamesError').then(function(value) {
notificationsService.error(value);
});
}
}, function (e) {

5
src/Umbraco.Web.UI.Client/src/views/content/create.html
View File

@@ -5,7 +5,7 @@
<div ng-if="!loading" class="umb-dialog-body with-footer" ng-cloak>
<div class="umb-pane">
<h5 ng-show="selectContentType"><localize key="create_createUnder">Create a page under</localize> {{currentNode.name}}</h5>
<h5 ng-show="selectContentType" id="selectContentType"><localize key="create_createUnder">Create a page under</localize> {{currentNode.name}}</h5>
<h5 ng-show="selectBlueprint"><localize key="blueprints_selectBlueprint">Select a blueprint</localize></h5>
<div ng-if="allowedTypes && allowedTypes.length === 0">
@@ -34,7 +34,7 @@
</div>
</div>
<ul class="umb-actions umb-actions-child" ng-if="selectContentType && allowedTypes.length > 0">
<ul class="umb-actions umb-actions-child" ng-if="selectContentType && allowedTypes.length > 0" aria-labelledby="selectContentType">
<li class="umb-action" data-element="action-create-{{docType.alias}}" ng-repeat="docType in allowedTypes | orderBy:'name':false">
<button class="umb-action-link umb-outline btn-reset" ng-click="createOrSelectBlueprintIfAny(docType)" umb-auto-focus ng-if="$index === 0">
@@ -58,6 +58,7 @@
</li>
</ul>
<ul class="umb-actions umb-actions-child" ng-if="selectBlueprint">
<li class="umb-action" ng-repeat="blueprint in selectableBlueprints | orderBy:'name':false track by $index">

21
src/Umbraco.Web.UI.Client/src/views/content/rights.html
View File

@@ -4,10 +4,10 @@
<div ng-show="vm.viewState === 'manageGroups'">
<div class="umb-dialog-body" ng-cloak>
<umb-load-indicator ng-if="vm.loading"></umb-load-indicator>
<umb-load-indicator ng-if="vm.loading"></umb-load-indicator>
<div class="umb-pane" ng-show="!vm.loading">
<form name="permissionsForm">
<div ng-show="vm.saveError">
@@ -27,21 +27,22 @@
<p class="abstract" style="margin-bottom: 20px;"><localize key="defaultdialogs_permissionsHelp"></localize></p>
<div style="position: relative; display: inline-block; margin-bottom: 20px;">
<umb-button
type="button"
button-style="info"
label-key="defaultdialogs_permissionsSet"
label-key="defaultdialogs_permissionsSet"
action="vm.groupsDropdownOpen = !vm.groupsDropdownOpen"
has-popup="true"
is-expanded="vm.groupsDropdownOpen === undefined ? false : vm.groupsDropdownOpen"
add-ellipsis="true">
</umb-button>
<umb-dropdown ng-if="vm.groupsDropdownOpen" on-close="vm.groupsDropdownOpen = false">
<umb-dropdown ng-if="vm.groupsDropdownOpen" on-close="vm.groupsDropdownOpen = false" deep-blur="vm.groupsDropdownOpen = !vm.groupsDropdownOpen">
<umb-dropdown-item ng-repeat="group in vm.availableUserGroups | filter:{selected: '!true'}">
<a href="" ng-click="vm.editPermissions(group)" prevent-default>
<i class="{{group.icon}}"></i>
<button type="button" ng-click="vm.editPermissions(group)">
<i class="{{group.icon}}" aria-hidden="true"></i>
{{group.name}}
</a>
</button>
</umb-dropdown-item>
</umb-dropdown>
@@ -61,7 +62,7 @@
on-edit="vm.editPermissions(group)">
</umb-user-group-preview>
</div>
</form>
</div>

8
src/Umbraco.Web.UI.Client/src/views/dashboard/content/redirecturls.html
View File

@@ -32,7 +32,12 @@
<ng-form class="form-search -no-margin-bottom pull-right" novalidate>
<div class="inner-addon left-addon">
<i class="icon icon-search"></i>
<label for="redirect-search" class="form-search__label-icon">
<i class="icon icon-search" aria-hidden="true"></i>
<span class="sr-only">
<localize key="visuallyHiddenTexts_redirectDashboardSearchLabel">Search the redirect dashboard</localize>
</span>
</label>
<input
class="form-control search-input"
type="text"
@@ -40,6 +45,7 @@
placeholder="@general_typeToSearch"
ng-model="vm.dashboard.searchTerm"
ng-change="vm.filter()"
id="redirect-search"
prevent-enter-submit
no-dirty-check>
</div>

8
src/Umbraco.Web.UI.Client/src/views/dashboard/default/StartupDashboardIntro.html
View File

@@ -40,8 +40,12 @@
<div style="max-width: 1200px" ng-if="vm.showDefault">
<div class="welcome-dashboard__intro">
<h1 class="welcome-dashboard__title">Welcome to The Friendly CMS</h1>
<p class="welcome-dashboard__intro-text">Thank you for choosing Umbraco - we think this could be the beginning of something beautiful. While it may feel overwhelming at first, we've done a lot to make the learning curve as smooth and fast as possible.</p>
<h1 class="welcome-dashboard__title">
<localize key="startupDashboard_fallbackHeadline">Welcome to The Friendly CMS</localize>
</h1>
<p class="welcome-dashboard__intro-text">
<localize key="startupDashboard_fallbackDescription">Thank you for choosing Umbraco - we think this could be the beginning of something beautiful. While it may feel overwhelming at first, we've done a lot to make the learning curve as smooth and fast as possible.</localize>
</p>
</div>
<div class="welcome-dashboard__info-box-boxes">

9
src/Umbraco.Web.UI.Client/src/views/dashboard/settings/examinemanagement.controller.js
View File

@@ -26,17 +26,16 @@ function ExamineManagementController($scope, $http, $q, $timeout, $location, umb
function showSearchResultDialog(values) {
if (vm.searchResults) {
localizationService.localize("examineManagement_fieldValues").then(function (value) {
vm.searchResults.overlay = {
editorService.open({
title: value,
searchResultValues: values,
size: "medium",
view: "views/dashboard/settings/examinemanagementresults.html",
close: function () {
vm.searchResults.overlay = null;
editorService.close();
}
};
});
});
}
}

6
src/Umbraco.Web.UI.Client/src/views/dashboard/settings/examinemanagement.html
View File

@@ -408,10 +408,4 @@
</div>
</div>
<umb-overlay ng-if="vm.searchResults.overlay"
position="center"
view="vm.searchResults.overlay.view"
model="vm.searchResults.overlay">
</umb-overlay>
</div>

55
src/Umbraco.Web.UI.Client/src/views/dashboard/settings/examinemanagementresults.html
View File

@@ -1,18 +1,41 @@
<div>
<table class="table table-bordered table-condensed">
<thead>
<tr>
<th class="score"><localize key="general_field">Field</localize></th>
<th class="id"><localize key="general_value">Value</localize></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="(key, val) in model.searchResultValues track by key">
<td>{{key}}</td>
<td>{{val}}</td>
</tr>
</tbody>
</table>
<umb-editor-view>
<umb-editor-header
name="model.title"
hide-icon="true"
hide-alias="true"
name-locked="true"
hide-description="true">
</umb-editor-header>
<umb-editor-container>
<umb-box>
<umb-box-content>
<table class="table table-bordered table-condensed">
<thead>
<tr>
<th class="score"><localize key="general_field">Field</localize></th>
<th class="id"><localize key="general_value">Value</localize></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="(key, val) in model.searchResultValues track by key">
<td>{{key}}</td>
<td style="word-break: break-word;">{{val}}</td>
</tr>
</tbody>
</table>
</umb-box-content>
</umb-box>
</umb-editor-container>
<umb-editor-footer>
<umb-editor-footer-content-right>
<umb-button
type="button"
button-style="link"
label-key="general_close"
action="model.close()">
</umb-button>
</umb-editor-footer-content-right>
</umb-editor-footer>
</umb-editor-view>
</div>

19
src/Umbraco.Web.UI.Client/src/views/dashboard/settings/healthcheck.html
View File

@@ -5,10 +5,10 @@
<umb-box>
<umb-box-content>
<div class="umb-healthcheck-help-text">
<p>
The health checker evaluates various areas of your site for best practice settings, configuration, potential problems, etc. You can easily fix problems by pressing a button.
You can add your own health checks, have a look at <a href="https://our.umbraco.com/documentation/Extending/Healthcheck/" target="_blank" class="btn-link -underline">the documentation for more information</a> about custom health checks.
</p>
<localize key="healthcheck_helpText">
<p>The health checker evaluates various areas of your site for best practice settings, configuration, potential problems, etc. You can easily fix problems by pressing a button.
You can add your own health checks, have a look at <a href="https://our.umbraco.com/documentation/Extending/Healthcheck/" target="_blank" class="btn-link -underline">the documentation for more information</a> about custom health checks.</p>
</localize>
</div>
<div class="umb-panel-group__details-status-actions">
<umb-button type="button"
@@ -75,7 +75,7 @@
<umb-editor-sub-header>
<umb-editor-sub-header-content-left>
<button type="button" class="umb-healthcheck-back-link" ng-click="vm.setViewState('list');">
<span aria-hidden="true">&larr;</span> Back to overview
<span aria-hidden="true">&larr;</span> <localize key="general_backToOverview">Back to overview</localize>
</button>
</umb-editor-sub-header-content-left>
</umb-editor-sub-header>
@@ -85,9 +85,12 @@
<div class="umb-panel-group__details-group">
<div class="umb-panel-group__details-group-title">
<div class="umb-panel-group__details-group-name">{{ vm.selectedGroup.name }}</div>
<umb-button type="button" button-style="success"
action="vm.checkAllInGroup(vm.selectedGroup, vm.selectedGroup.checks)"
label="Check group">
<umb-button
type="button"
button-style="success"
action="vm.checkAllInGroup(vm.selectedGroup, vm.selectedGroup.checks)"
label="Check group"
label-key="healthcheck_checkGroup">
</umb-button>
</div>

6
src/Umbraco.Web.UI.Client/src/views/logviewer/search.controller.js
View File

@@ -262,11 +262,7 @@
submitButtonLabel: "Save Search",
disableSubmitButton: true,
view: "logviewersearch",
query: {
filterExpression: vm.logOptions.filterExpression,
startDate: vm.logOptions.startDate,
endDate: vm.logOptions.endDate
},
query: vm.logOptions.filterExpression,
submit: function (model) {
//Resource call with two params (name & query)
//API that opens the JSON and adds it to the bottom

3
src/Umbraco.Web.UI.Client/src/views/macros/views/settings.html
View File

@@ -11,7 +11,7 @@
<umb-box>
<umb-box-header title="Macro partial view"></umb-box-header>
<umb-box-content>
<umb-control-group label="Macro partial view">
<umb-control-group label="Macro partial view" required="true">
<umb-node-preview ng-if="model.macro.node"
icon="model.macro.node.icon"
@@ -21,6 +21,7 @@
on-edit="model.openViewPicker()"
on-remove="model.removeMacroView()">
</umb-node-preview>
<input type="hidden" ng-model="mandatoryViewValidator" ng-required="!model.macro.node" />
<a href=""
ng-show="!model.macro.node"

2
src/Umbraco.Web.UI.Client/src/views/packages/views/installed.html
View File

@@ -18,7 +18,7 @@
<div class="umb-package-list__item-content">
<div class="umb-package-list__item-name">{{ installedPackage.name }}</div>
<div class="umb-package-list__item-description">
{{ installedPackage.version }} | <a href="{{ installedPackage.url }}" target="_blank">{{ installedPackage.url }}</a>| {{ installedPackage.author }}
{{ installedPackage.version }} | <a href="{{ installedPackage.url }}" target="_blank">{{ installedPackage.url }}</a> | {{ installedPackage.author }}
</div>
</div>
</td>

2
src/Umbraco.Web.UI.Client/src/views/prevalueeditors/imagepicker.html
View File

@@ -15,7 +15,7 @@
</li>
</ul>
<a href="#" class="add-link" ng-click="add()" ng-class="{'add-link-square': !model.value }" ng-hide="model.value" prevent-default>
<a href="#" class="add-link umb-outline umb-outline--surrounding" ng-click="add()" ng-class="{'add-link-square': !model.value }" ng-hide="model.value" prevent-default>
<i class="icon icon-add large"></i>
</a>

2
src/Umbraco.Web.UI.Client/src/views/prevalueeditors/mediafolderpicker.html
View File

@@ -27,7 +27,7 @@
</li>
<li style="border: none;" class="add-wrapper unsortable" ng-hide="model.value">
<button aria-label="Open media picker" data-element="sortable-thumbnails-add" class="add-link add-link-square btn-reset" ng-click="add()" prevent-default>
<button aria-label="Open media picker" data-element="sortable-thumbnails-add" class="add-link add-link-square btn-reset umb-outline umb-outline--surrounding" ng-click="add()" prevent-default>
<i class="icon icon-add large" aria-hidden="true"></i>
</button>
</li>

4
src/Umbraco.Web.UI.Client/src/views/prevalueeditors/multivalues.html
View File

@@ -9,12 +9,12 @@
</div>
<div ui-sortable="sortableOptions">
<div class="control-group umb-prevalues-multivalues__listitem" ng-repeat="item in model.value">
<i class="icon icon-navigation handle"></i>
<i class="icon icon-navigation handle" aria-hidden="true"></i>
<div class="umb-prevalues-multivalues__left">
<input type="text" ng-model="item.value" val-server="item_{{$index}}" required />
</div>
<div class="umb-prevalues-multivalues__right">
<a class="umb-node-preview__action umb-node-preview__action--red" ng-click="remove(item, $event)"><localize key="general_remove">Remove</localize></a>
<button class="umb-node-preview__action umb-node-preview__action--red" ng-click="remove(item, $event)"><localize key="general_remove">Remove</localize></button>
</div>
</div>
</div>

15
src/Umbraco.Web.UI.Client/src/views/prevalueeditors/treesource.controller.js
View File

@@ -19,15 +19,16 @@ angular.module('umbraco')
};
}
if($scope.model.value.id && $scope.model.value.type !== "member"){
entityResource.getById($scope.model.value.id, entityType()).then(function(item){
if($scope.model.value.id && $scope.model.value.type !== "member"){
entityResource.getById($scope.model.value.id, entityType()).then(function(item){
populate(item);
});
});
}
else {
$timeout(function () {
treeSourceChanged();
}, 100);
}
$timeout(function () {
treeSourceChanged();
}, 100);
function entityType() {
var ent = "Document";

6
src/Umbraco.Web.UI.Client/src/views/prevalueeditors/treesourcetypepicker.controller.js
View File

@@ -7,7 +7,6 @@ function TreeSourceTypePickerController($scope, contentTypeResource, mediaTypeRe
var allItemTypes = null;
var currentItemType = null;
var initialLoad = true;
function init() {
vm.loading = true;
@@ -86,13 +85,12 @@ function TreeSourceTypePickerController($scope, contentTypeResource, mediaTypeRe
}
eventsService.on("treeSourceChanged", function (e, args) {
currentItemType = args.value;
// reset the model value if we changed node type (but not on the initial load)
if (!initialLoad) {
if (!!currentItemType && currentItemType !== args.value) {
vm.itemTypes = [];
updateModel();
}
initialLoad = false;
currentItemType = args.value;
init();
});
}

66
src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/rowdeleteconfirm.html
View File

@@ -1,53 +1,45 @@
<div class="usky-grid usky-grid-configuration" ng-controller="Umbraco.PropertyEditors.GridPrevalueEditor.DeleteRowConfirmController">
<umb-editor-view>
<umb-editor-container>
<umb-box>
<umb-box-content>
<h3 class="alert alert-danger ng-scope"><localize key="grid_warning">Warning!</localize></h3>
<umb-editor-view>
<p>
<localize key="grid_youAreDeleting">You are deleting the row configuration </localize> <strong>{{model.dialogData.rowName}}</strong>
</p>
<umb-editor-container>
<umb-box>
<umb-box-content>
<p>
<localize key="grid_deletingARow">
Modifying a row configuration name will result in loss of
data for any existing content that is based on this configuration.
</localize>
</p>
<p>
<localize key="general_areyousure">Are you sure?</localize>
</p>
</umb-box-content>
</umb-box>
</umb-editor-container>
<h3 class="alert alert-warn ng-scope">Warning!</h3>
<p>
You are deleting the row configuration '<strong>{{model.dialogData.rowName}}</strong>'
</p>
<p>
Modifying a row configuration name will result in loss of
data for any existing content that is based on this configuration.
</p>
<p>
<localize key="general_areyousure">Are you sure?</localize>
</p>
</umb-box-content>
</umb-box>
</umb-editor-container>
<umb-editor-footer>
<umb-editor-footer-content-right>
<umb-button
type="button"
<umb-editor-footer>
<umb-editor-footer-content-right>
<umb-button type="button"
button-style="link"
label-key="general_close"
shortcut="esc"
action="close()">
</umb-button>
<umb-button
type="button"
button-style="warning"
</umb-button>
<umb-button type="button"
button-style="danger"
label-key="general_delete"
action="submit(model)">
</umb-button>
</umb-editor-footer-content-right>
</umb-editor-footer>
</umb-button>
</umb-editor-footer-content-right>
</umb-editor-footer>
</umb-editor-view>

3
src/Umbraco.Web.UI.Client/src/views/propertyeditors/imagecropper/imagecropper.html
View File

@@ -41,7 +41,8 @@
on-value-changed="focalPointChanged(left, top)"
on-image-loaded="imageLoaded(isCroppable, hasDimensions)">
</umb-image-gravity>
<a href class="btn btn-link btn-crop-delete" ng-click="clear()"><i class="icon-delete red"></i> <localize key="content_uploadClear">Remove file</localize></a>
<button class="btn btn-link btn-crop-delete" aria-hidden="true" ng-click="clear()"><i class="icon-delete red"></i> <localize key="content_uploadClear">Remove file</localize></button>
<button class="sr-only" ng-click="vm.clear()"><localize key="content_uploadClearImageContext">Click here to remove the image from the media item</localize></button>
</div>

4
src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/layouts/grid/grid.html
View File

@@ -52,7 +52,9 @@
<umb-media-grid items="vm.itemsWithoutFolders"
on-details-hover="vm.hoverMediaItemDetails"
on-click="vm.selectItem"
on-click-name="vm.goToItem">
on-click-name="vm.goToItem"
allow-open-folder="true"
allow-open-file="true">
</umb-media-grid>
<umb-tooltip ng-if="vm.mediaDetailsTooltip.show"

26
src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/listview.controller.js
View File

@@ -324,33 +324,19 @@ function listViewController($scope, $interpolate, $routeParams, $injector, $time
});
};
var searchListView = _.debounce(function () {
$scope.$apply(function () {
makeSearch();
});
}, 500);
$scope.forceSearch = function (ev) {
//13: enter
switch (ev.keyCode) {
case 13:
makeSearch();
break;
}
};
$scope.enterSearch = function () {
$scope.viewLoaded = false;
searchListView();
};
function makeSearch() {
$scope.makeSearch = function() {
if ($scope.options.filter !== null && $scope.options.filter !== undefined) {
$scope.options.pageNumber = 1;
$scope.reloadView($scope.contentId);
}
}
$scope.onSearchStartTyping = function() {
$scope.viewLoaded = false;
}
$scope.selectedItemsCount = function () {
return $scope.selection.length;
};

27
src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/listview.html
View File

@@ -14,14 +14,14 @@
<!-- Renders when it's only possible to create one specific document type for, which no blueprint exists-->
<div class="btn-group" ng-show="createAllowedButtonSingle">
<button type="button" class="btn btn-white" ng-click="createBlank(entityType,listViewAllowedTypes[0].alias)" prevent-default>
<button type="button" class="btn btn-outline umb-outline" ng-click="createBlank(entityType,listViewAllowedTypes[0].alias)" prevent-default>
<localize key="actions_create">Create</localize> {{listViewAllowedTypes[0].name}}
</button>
</div>
<!-- Renders when it's only possible to create one specific document type for which a blueprint exits-->
<div class="btn-group" ng-show="createAllowedButtonSingleWithBlueprints" deep-blur="leaveDropdown()">
<button type="button" class="btn btn-white dropdown-toggle" aria-expanded="{{page.createDropdownOpen}}" data-toggle="dropdown" ng-click="toggleDropdown()" prevent-default>
<button type="button" class="btn btn-outline umb-outline dropdown-toggle" aria-expanded="{{page.createDropdownOpen}}" data-toggle="dropdown" ng-click="toggleDropdown()" prevent-default>
<span>
<localize key="actions_create">Create</localize> {{listViewAllowedTypes[0].name}}
</span>
@@ -46,11 +46,11 @@
<!-- Renders when it's possible to create multiple document types and blueprints for one or more of the document types-->
<div class="btn-group" ng-show="createAllowedButtonMultiWithBlueprints" deep-blur="leaveDropdown()">
<button type="button" class="btn btn-white dropdown-toggle" aria-expanded="{{page.createDropdownOpen === undefined ? false : page.createDropdownOpen}}" data-toggle="dropdown" ng-click="toggleDropdown()">
<button type="button" class="btn btn-outline umb-outline dropdown-toggle" aria-expanded="{{page.createDropdownOpen === undefined ? false : page.createDropdownOpen}}" data-toggle="dropdown" ng-click="toggleDropdown()">
<localize key="actions_create">Create</localize>
<span class="caret" aria-hidden="true"></span>
</button>
<umb-dropdown ng-if="page.createDropdownOpen" on-close="page.createDropdownOpen = false">
<umb-dropdown-item ng-repeat="contentType in listViewAllowedTypes track by contentType.key | orderBy:'name':false">
<button type="button" ng-click="createBlank(entityType,contentType.alias)" prevent-default>
@@ -126,21 +126,10 @@
</umb-editor-sub-header-section>
<umb-editor-sub-header-section ng-show="(selection.length == 0)">
<ng-form class="form-search -no-margin-bottom pull-right" novalidate>
<div class="inner-addon left-addon">
<i class="icon icon-search" ng-click="enterSearch($event)"></i>
<input
class="form-control search-input"
type="text"
localize="placeholder"
placeholder="@general_typeToSearch"
ng-model="options.filter"
ng-change="enterSearch()"
ng-keydown="forceSearch($event)"
prevent-enter-submit
no-dirty-check>
</div>
</ng-form>
<umb-mini-search model="options.filter" on-search="makeSearch()" on-start-typing="onSearchStartTyping()">
</umb-mini-search>
</umb-editor-sub-header-section>
<umb-editor-sub-header-section ng-show="(selection.length > 0)">

2
src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.controller.js
View File

@@ -205,7 +205,7 @@ angular.module('umbraco').controller("Umbraco.PropertyEditors.MediaPickerControl
multiPicker: multiPicker,
onlyImages: onlyImages,
disableFolderSelect: disableFolderSelect,
allowMediaEdit: true,
submit: function (model) {
editorService.close();

2
src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.html
View File

@@ -45,7 +45,7 @@
</div>
</li>
<li style="border: none;" class="add-wrapper unsortable" ng-if="vm.showAdd() && allowAddMedia">
<button aria-label="Open media picker" data-element="sortable-thumbnails-add" class="add-link btn-reset" ng-click="vm.add()" ng-class="{'add-link-square': (mediaItems.length === 0 || isMultiPicker)}" prevent-default>
<button aria-label="Open media picker" data-element="sortable-thumbnails-add" class="add-link btn-reset umb-outline umb-outline--surrounding" ng-click="vm.add()" ng-class="{'add-link-square': (mediaItems.length === 0 || isMultiPicker)}" prevent-default>
<i class="icon icon-add large" aria-hidden="true"></i>
</button>
</li>

3
src/Umbraco.Web.UI.Client/src/views/propertyeditors/multiurlpicker/multiurlpicker.controller.js
View File

@@ -19,7 +19,10 @@ function multiUrlPickerController($scope, angularHelper, localizationService, en
var currentForm = angularHelper.getCurrentForm($scope);
$scope.sortableOptions = {
axis: "y",
containment: "parent",
distance: 10,
opacity: 0.7,
tolerance: "pointer",
scroll: true,
zIndex: 6000,

Some files were not shown because too many files have changed in this diff Show More