Skip to content

Commit 57bc578

Browse files
author
Per Ploug Krogslund
committed
css stuff
1 parent 8fb1732 commit 57bc578

22 files changed

+415
-286
lines changed

‎src/Umbraco.Web.UI.Client/bower.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,9 @@
1717
],
1818
"dependencies": {
1919
"typeahead.js": "~0.10.2",
20-
"ace-builds": "~1.1.3",
20+
"angular": "~1.2.18",
21+
"angular-route": "~1.2.18",
22+
"angular-touch": "~1.2.18",
2123
"rgrove-lazyload": "*"
2224
}
2325
}

‎src/Umbraco.Web.UI.Client/src/common/directives/editors/umbcontentname.directive.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -49,8 +49,7 @@ angular.module("umbraco.directives")
4949
if (distance <= 155) {
5050

5151
distance = 1 - (100 / 150 * distance / 100);
52-
inputElement.css("border", "1px solid rgba(175,175,175, " + distance + ")");
53-
inputElement.css("background-color", "rgba(255,255,255, " + distance + ")");
52+
inputElement.css("border", "1px solid rgba(255,255,255, " + distance + ")");
5453
}
5554
}
5655

‎src/Umbraco.Web.UI.Client/src/common/directives/html/umbtabnav.directive.js

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
/**
2+
* @ngdoc directive
3+
* @name umbraco.directives.directive:umbTabView
4+
* @restrict E
5+
**/
6+
angular.module("umbraco.directives")
7+
.directive('umbTabNav', function($timeout, $log, $parse){
8+
return {
9+
restrict: 'E',
10+
replace: false,
11+
transclude: 'true',
12+
templateUrl: 'views/directives/umb-tab-nav.html',
13+
scope: {
14+
tabs: "="
15+
},
16+
link: function (scope, iElement, iAttrs) {
17+
18+
var maxTabs = 4;
19+
function collectFromDom(activeTab){
20+
var $panes = $('div.tab-content');
21+
angular.forEach($panes.find('.tab-pane'), function (pane, index) {
22+
var $this = angular.element(pane);
23+
var id = $this.attr("rel");
24+
var label = $this.attr("label");
25+
26+
var tab = {id: id, label: label, active: false};
27+
if(!activeTab){
28+
tab.active = true;
29+
activeTab = tab;
30+
}
31+
32+
if ($this.attr("rel") === String(activeTab.id)) {
33+
$this.addClass('active');
34+
}
35+
else {
36+
$this.removeClass('active');
37+
}
38+
39+
if(label){
40+
scope.visibleTabs.push(tab);
41+
}
42+
});
43+
}
44+
45+
scope.showTabs = iAttrs.tabs ? true : false;
46+
scope.visibleTabs = [];
47+
scope.overflownTabs = [];
48+
49+
$timeout(function () {
50+
collectFromDom(undefined);
51+
}, 500);
52+
53+
54+
//when the tabs change, we need to hack the planet a bit and force the first tab content to be active,
55+
//unfortunately twitter bootstrap tabs is not playing perfectly with angular.
56+
scope.$watch("tabs", function (newValue, oldValue) {
57+
angular.forEach(newValue, function(val, index){
58+
var tab = {id: val.id, label: val.label};
59+
scope.visibleTabs.push(tab);
60+
});
61+
62+
63+
//don't process if we cannot or have already done so
64+
if (!newValue) {return;}
65+
66+
if (!newValue.length || newValue.length === 0){return;}
67+
68+
var activeTab = _.find(newValue, function (item) {
69+
return item.active;
70+
});
71+
72+
//we need to do a timeout here so that the current sync operation can complete
73+
// and update the UI, then this will fire and the UI elements will be available.
74+
$timeout(function () {
75+
collectFromDom(activeTab);
76+
}, 500);
77+
78+
});
79+
}
80+
};
81+
});

‎src/Umbraco.Web.UI.Client/src/common/directives/html/umbtabview.directive.js

Lines changed: 0 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -12,73 +12,6 @@ angular.module("umbraco.directives")
1212
templateUrl: 'views/directives/umb-tab-view.html',
1313
scope: {
1414
tabs: "="
15-
},
16-
link: function (scope, iElement, iAttrs) {
17-
18-
var maxTabs = 4;
19-
function collectFromDom(activeTab){
20-
var $panes = $('div.tab-content');
21-
22-
angular.forEach($panes.find('.tab-pane'), function (pane, index) {
23-
var $this = angular.element(pane);
24-
25-
var id = $this.attr("rel");
26-
var label = $this.attr("label");
27-
28-
var tab = {id: id, label: label, active: false};
29-
if(!activeTab){
30-
tab.active = true;
31-
activeTab = tab;
32-
}
33-
34-
if ($this.attr("rel") === String(activeTab.id)) {
35-
$this.addClass('active');
36-
}
37-
else {
38-
$this.removeClass('active');
39-
}
40-
41-
if(label){
42-
scope.visibleTabs.push(tab);
43-
}
44-
});
45-
46-
}
47-
48-
scope.showTabs = iAttrs.tabs ? true : false;
49-
scope.visibleTabs = [];
50-
scope.overflownTabs = [];
51-
52-
$timeout(function () {
53-
collectFromDom(undefined);
54-
}, 500);
55-
56-
57-
//when the tabs change, we need to hack the planet a bit and force the first tab content to be active,
58-
//unfortunately twitter bootstrap tabs is not playing perfectly with angular.
59-
scope.$watch("tabs", function (newValue, oldValue) {
60-
angular.forEach(newValue, function(val, index){
61-
var tab = {id: val.id, label: val.label};
62-
scope.visibleTabs.push(tab);
63-
});
64-
65-
66-
//don't process if we cannot or have already done so
67-
if (!newValue) {return;}
68-
69-
if (!newValue.length || newValue.length === 0){return;}
70-
71-
var activeTab = _.find(newValue, function (item) {
72-
return item.active;
73-
});
74-
75-
//we need to do a timeout here so that the current sync operation can complete
76-
// and update the UI, then this will fire and the UI elements will be available.
77-
$timeout(function () {
78-
collectFromDom(activeTab);
79-
}, 500);
80-
81-
});
8215
}
8316
};
8417
});

‎src/Umbraco.Web.UI.Client/src/common/mocks/resources/_utils.js

Lines changed: 0 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -72,54 +72,6 @@ angular.module('umbraco.mocks').
7272
{ alias: "media", label: "Media picker", view: "mediapicker", value: "1234,23242,23232,23231", config: {multiPicker: 1} }
7373
]
7474
},
75-
{
76-
label: "Sample Editor",
77-
id: 3,
78-
properties: [
79-
{ alias: "datepicker", label: "Datepicker", view: "datepicker", config: { pickTime: false, format: "yyyy-MM-dd" } },
80-
{ alias: "tags", label: "Tags", view: "tags", value: "" }
81-
]
82-
},
83-
{
84-
label: "This",
85-
id: 4,
86-
properties: [
87-
{ alias: "valTest4", label: "Validation test", view: "validationtest", value: "asdfasdf" },
88-
{ alias: "bodyText4", label: "Body Text", description: "Here you enter the primary article contents", view: "rte", value: "<p>askjdkasj lasjd</p>", config: {} },
89-
{ alias: "textarea4", label: "textarea", view: "textarea", value: "ajsdka sdjkds", config: { rows: 4 } },
90-
{ alias: "content4", label: "Content picker", view: "contentpicker", value: "1234,23242,23232,23231" }
91-
]
92-
},
93-
{
94-
label: "Is",
95-
id: 5,
96-
properties: [
97-
{ alias: "valTest5", label: "Validation test", view: "validationtest", value: "asdfasdf" },
98-
{ alias: "bodyText5", label: "Body Text", description: "Here you enter the primary article contents", view: "rte", value: "<p>askjdkasj lasjd</p>", config: {} },
99-
{ alias: "textarea5", label: "textarea", view: "textarea", value: "ajsdka sdjkds", config: { rows: 4 } },
100-
{ alias: "content5", label: "Content picker", view: "contentpicker", value: "1234,23242,23232,23231" }
101-
]
102-
},
103-
{
104-
label: "Overflown",
105-
id: 6,
106-
properties: [
107-
{ alias: "valTest6", label: "Validation test", view: "validationtest", value: "asdfasdf" },
108-
{ alias: "bodyText6", label: "Body Text", description: "Here you enter the primary article contents", view: "rte", value: "<p>askjdkasj lasjd</p>", config: {} },
109-
{ alias: "textarea6", label: "textarea", view: "textarea", value: "ajsdka sdjkds", config: { rows: 4 } },
110-
{ alias: "content6", label: "Content picker", view: "contentpicker", value: "1234,23242,23232,23231" }
111-
]
112-
},
113-
{
114-
label: "Tab # 7",
115-
id: 7,
116-
properties: [
117-
{ alias: "valTest7", label: "Validation test", view: "validationtest", value: "asdfasdf" },
118-
{ alias: "bodyText7", label: "Body Text", description: "Here you enter the primary article contents", view: "rte", value: "<p>askjdkasj lasjd</p>", config: {} },
119-
{ alias: "textarea7", label: "textarea", view: "textarea", value: "ajsdka sdjkds", config: { rows: 4 } },
120-
{ alias: "content7", label: "Content picker", view: "contentpicker", value: "1234,23242,23232,23231" }
121-
]
122-
},
12375
{
12476
label: "Grid",
12577
id: 8,

‎src/Umbraco.Web.UI.Client/src/common/services/navigation.service.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -657,7 +657,7 @@ function navigationService($rootScope, $routeParams, $log, $location, $q, $timeo
657657

658658
var dialog = dialogService.open(
659659
{
660-
container: $("#dialog div.umb-modalcolumn-body"),
660+
container: $(".app-navigation-dialog .umb-modalcolumn-body"),
661661
//The ONLY reason we're passing in scope to the dialogService (which is legacy functionality) is
662662
// for backwards compatibility since many dialogs require $scope.currentNode or $scope.currentAction
663663
// to exist

‎src/Umbraco.Web.UI.Client/src/index.html

Lines changed: 123 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,126 @@
11
<!doctype html>
22
<html lang="en">
3-
<head>
4-
<base href="/belle/" />
5-
<meta charset="utf-8">
6-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7-
8-
<title ng-bind="locationTitle">Umbraco</title>
9-
<link rel="stylesheet" href="assets/css/umbraco.css" />
10-
</head>
11-
12-
<body ng-class="{touch:touchDevice}" ng-controller="Umbraco.MainController" id="umbracoMainPageBody">
13-
<div ng-hide="!authenticated" ng-cloak id="mainwrapper" class="clearfix" ng-click="closeDialogs($event)">
14-
<umb-navigation></umb-navigation>
15-
16-
<section id="contentwrapper">
17-
<div id="contentcolumn">
18-
<div class="content-column-body" ng-view></div>
19-
</div>
20-
</section>
21-
</div>
22-
<umb-notifications></umb-notifications>
23-
24-
25-
<script src="lib/lazyload/lazyload.min.js"></script>
26-
<script src="js/loader.js"></script>
27-
</body>
3+
<head>
4+
<base href="/belle/" />
5+
<meta charset="utf-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
8+
<title ng-bind="locationTitle">Umbraco</title>
9+
<link rel="stylesheet" href="assets/css/umbraco.css" />
10+
</head>
11+
12+
<body
13+
ng-class="{touch:touchDevice}"
14+
ng-controller="Umbraco.MainController"
15+
id="umbracoMainPageBody">
16+
17+
<div
18+
ng-hide="!authenticated"
19+
ng-cloak
20+
class="app-wrapper umb-abs-fullsize"
21+
ng-click="closeDialogs($event)">
22+
23+
<header class="app-header">
24+
<div class="app-header-avatar">
25+
<a href
26+
ng-click="avatarClick()"
27+
hotkey="ctrl+shift+u"
28+
title="{{user.name}}" prevent-default>
29+
<img id="avatar-img" ng-src="{{avatar}}" />
30+
</a>
31+
</div>
32+
33+
<div class="app-header-search">
34+
<input type="text" placeholder="Type to search..." value="" />
35+
</div>
36+
37+
<div class="app-header-toolbar">
38+
<ul class="inline pull-right">
39+
<li>
40+
<a href class="action-help" hotkey="ctrl+shift+h" ng-click="helpClick()">
41+
<i class="icon-help-alt"></i>
42+
<span><localize key="sections_help">Help</localize></span>
43+
</a>
44+
</li>
45+
46+
<li>
47+
<a href class="action-logout">
48+
<i class="icon-logout"></i>
49+
</a>
50+
</li>
51+
52+
</ul>
53+
54+
</div>
55+
56+
57+
</header>
58+
59+
<main class="app-layout">
60+
61+
<nav class="app-navigation"
62+
ng-controller="Umbraco.NavigationController"
63+
ng-mouseleave="leaveTree($event)"
64+
ng-mouseenter="enterTree($event)">
65+
66+
<div class="app-navigation-sections umb-abs-fullsize ">
67+
<umb-sections sections="sections"></umb-sections>
68+
</div>
69+
70+
71+
<div class="app-navigation-tree umb-abs-fullsize">
72+
<umb-tree
73+
cachekey="_"
74+
eventhandler="treeEventHandler"
75+
section="{{currentSection}}" >
76+
</umb-tree>
77+
</div>
78+
79+
80+
<div
81+
class="app-navigation-menu umb-abs-fullsize"
82+
ng-swipe-left="nav.hideMenu()"
83+
ng-show="showContextMenu"
84+
ng-animate="'slide'">
85+
86+
<umb-context-menu
87+
menu-dialog-title="{{menuDialogTitle}}"
88+
current-section="{{currentSection}}"
89+
current-node="menuNode"
90+
menu-actions="menuActions">
91+
</umb-context-menu>
92+
</div>
93+
94+
95+
<div
96+
class="app-navigation-dialog umb-abs-fullsize"
97+
ng-swipe-left="nav.hideDialog()"
98+
ng-show="showContextMenuDialog"
99+
ng-animate="'slide'">
100+
101+
<div class='umb-modalcolumn-header'>
102+
<h1>{{menuDialogTitle}}</h1>
103+
</div>
104+
105+
<div class='umb-modalcolumn-body'>
106+
107+
</div>
108+
</div>
109+
110+
111+
</nav>
112+
113+
<section class="app-content" ng-view>
114+
115+
</section>
116+
</main>
117+
</div>
118+
119+
<div class="app-notifications">
120+
<umb-notifications></umb-notifications>
121+
</div>
122+
123+
<script src="lib/lazyload/lazyload.min.js"></script>
124+
<script src="js/loader.js"></script>
125+
</body>
28126
</html>

0 commit comments

Comments
 (0)