Advertisement
Guest User

Untitled

a guest
Sep 5th, 2015
147
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 3.08 KB | None | 0 0
  1. <!DOCTYPE HTML>
  2. <html lang="es" ng-app="myApp">
  3.     <head>
  4.         <meta charset="utf-8">
  5.         <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.         <title>Prueba</title>
  7.         <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  8.         <!-- Hojas de estilo y fuentes de LumX -->
  9.         <link rel="stylesheet" href="bower_components/lumx/dist/lumx.css">
  10.         <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Roboto:300,400,500,700">
  11.     </head>
  12.    
  13.  
  14. <body>
  15.  
  16. <!-- comienzo diálogos -->
  17. <button class="btn btn--m btn--black btn--flat" ng-click="opendDialog('test')" lx-ripple>Abrir diálogo</button>
  18.  
  19. <lx-dialog class="dialog dialog--l" id="test" auto-close="true" onclose="closingDialog()" onscrollend="scrollEndDialog()">
  20.     <div class="dialog__header">
  21.         <div class="toolbar bgc-light-blue-500 pl++">
  22.             <span class="toolbar__label tc-white fs-title">
  23.                 Lorem Ipsum
  24.             </span>
  25.  
  26.             <div class="toolbar__right">
  27.                 <button class="btn btn--l btn--white btn--icon" lx-ripple ng-click="addPerson()">
  28.                     <i class="mdi mdi-plus"></i>
  29.                 </button>
  30.             </div>
  31.         </div>
  32.     </div>
  33.  
  34.     <div class="dialog__content">
  35.         <lx-tabs links-tc="light" links-bgc="light-blue-500" indicator="yellow-500" no-divider="true" layout="inline">
  36.             <lx-tab heading="Lorem Ipsum 1">
  37.                 <div class="p++">
  38.                     <div ng-repeat="person in people">
  39.                         {{ person.name }} - {{ person.email }} - {{ person.age }}
  40.                     </div>
  41.                 </div>
  42.             </lx-tab>
  43.  
  44.             <lx-tab heading="Lorem Ipsum 2">
  45.                 <div class="p+">
  46.                     <p>Lorem Ipsum Content 2</p>
  47.  
  48.                     <lx-text-field label="Description">
  49.                         <textarea ng-model="textFields.description"></textarea>
  50.                     </lx-text-field>
  51.                 </div>
  52.             </lx-tab>
  53.  
  54.             <lx-tab heading="Lorem Ipsum 3">
  55.                 <p class="p++">Lorem Ipsum Content 3</p>
  56.             </lx-tab>
  57.         </lx-tabs>
  58.     </div>
  59.  
  60.     <div class="dialog__actions">
  61.         <button class="btn btn--m btn--black btn--flat" lx-ripple lx-dialog-close>Cancel</button>
  62.         <button class="btn btn--m btn--black btn--flat" lx-ripple>Lorem Ipsum</button>
  63.     </div>
  64. </lx-dialog>
  65.  
  66. <script>
  67. $scope.opendDialog = function(dialogId)
  68. {
  69.     LxDialogService.open(dialogId);
  70. };
  71.  
  72. $scope.closingDialog = function()
  73. {
  74.     LxNotificationService.info('Dialog closed!');
  75. };
  76. </script>
  77. <!-- fin diálogos -->
  78.        
  79.         <!-- Scripts para la página -->
  80.         <script src="bower_components/jquery/dist/jquery.js"></script>
  81.         <script src="velocity.js"></script>
  82.         <script src="bower_components/moment/min/moment-with-locales.js"></script>
  83.         <script src="bower_components/angular/angular.js"></script>
  84.         <script src="bower_components/lumx/dist/lumx.js"></script>
  85.         <script>
  86.             angular.module('myApp', ['lumx']);
  87.         </script>
  88.        
  89.        
  90.        
  91.     </body>
  92. <html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement