blob: 393415d1a4cb90b4332b941028456ee96eea6c67 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
|
<!doctype html>
<html ng-app="testPadding">
<head>
<meta charset="utf-8">
<title>ngDialog padding test</title>
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
<link rel="stylesheet" href="../css/ngDialog.css">
<link rel="stylesheet" href="../css/ngDialog-theme-default.css">
<style>
body {
height: 4000px;
}
.paddingHeader {
position: fixed;
right: 0;
top: 0;
width: 100px;
text-align: right;
}
</style>
</head>
<body ng-controller="MainCtrl">
<!-- Buttons and links -->
<header class="paddingHeader">Fixed header</header>
<a href="" class="openPaddingLink" ng-click="open()">Open dialog</a>
<!-- Template -->
<script type="text/ng-template" id="firstDialogId">
Wow a thing
</script>
<!-- Scripts -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
<script>window.angular || document.write('<script src="../bower_components/angular/angular.min.js">\x3C/script>')</script>
<script src="../js/ngDialog.js"></script>
<!-- App -->
<script>
var app = angular.module('testPadding', ['ngDialog']);
app.config(['ngDialogProvider', function (ngDialogProvider) {
ngDialogProvider.setDefaults({
className: 'ngdialog-theme-default',
});
}]);
app.controller('MainCtrl', function ($scope, $rootScope, ngDialog, $timeout) {
$scope.open = function () {
ngDialog.open({ template: 'firstDialogId' });
};
$rootScope.$on('ngDialog.setPadding', function (event, padding)
{
angular.element( document.querySelector('.paddingHeader') ).css('padding-right', padding + 'px');
});
});
</script>
</body>
</html>
|
