projects / angular-drzb / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: 98a11f6)
converted first part of form to bootstrap
authorDobrica Pavlinusic <dpavlin@rot13.org>
Sun, 6 Jan 2013 15:41:52 +0000 (16:41 +0100)
committerDobrica Pavlinusic <dpavlin@rot13.org>
Sun, 6 Jan 2013 15:41:52 +0000 (16:41 +0100)
app/css/app.css patch | blob | history
app/index.html patch | blob | history
app/js/directives.js patch | blob | history
app/partials/registration.html patch | blob | history

diff --git a/app/css/app.css b/app/css/app.css
index 9fe378b..5f3209f 100644 (file)
--- a/app/css/app.css
+++ b/app/css/app.css
@@ -53,41 +53,6 @@ p.left {
        margin-top: 0;
 }
 
-/* my-input */
-
-div.my-input {
-       float: left;
-       margin-right: 0.5em;
-       margin-bottom: 0.5em;
-}
-
-div.my-input input,
-div.my-input textarea,
-div.my-input label {
-       display: block;
-}
-
-div.w1 input {
-       clear: both;
-       width: 60em;
-}
-
-div.w2 input {
-       width: 29.75em; /* 60 / 2 - 0.5 */
-}
-
-div.w3 input {
-       width: 19.5em; /* 60 - 3 * 0.5 / 3 */
-}
-
-div.w4 input {
-       width: 14.5em; /* 60 - 4 * 0.5 / 4 */
-}
-
-h1, h2, h3 {
-       clear: both;
-}
-
 div.persons {
        display: block;
        float: left;
@@ -98,3 +63,8 @@ div.persons a {
        float: left;
 }
 
+/* Twitter bootstrap specific */
+
+div.controls > input {
+       width: 100%; /* match outher span class */
+}
diff --git a/app/index.html b/app/index.html
index 23b68fc..676ba18 100644 (file)
--- a/app/index.html
+++ b/app/index.html
@@ -2,7 +2,12 @@
 <html lang="en" ng-app="myApp" xmlns:ng="http://angularjs.org">
 <head>
   <meta charset="utf-8">
-  <title>My AngularJS App</title>
+  <title>DRZB conference</title>
+
+  <!-- Twtitter bootstrap -->
+  <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" />
+  <link rel="stylesheet" href="bootstrap/css/bootstrap-responsive.min.css" />
+
   <link rel="stylesheet" href="css/app.css"/>
 
     <!--[if lte IE 8]>
@@ -39,7 +44,7 @@
   <![endif]-->
 
 
-  <div ng-view></div>
+  <div class="container" ng-view></div>
 
   <div>Angular seed app: v<span app-version></span></div>
 
diff --git a/app/js/directives.js b/app/js/directives.js
index 87b0094..fb7b81e 100644 (file)
--- a/app/js/directives.js
+++ b/app/js/directives.js
@@ -13,7 +13,14 @@ angular.module('myApp.directives', []).
     return {
                restrict: 'C',
                compile: function(element, attrs) {
-                       element.replaceWith('<div class="'+attrs['class']+'"><label for="'+attrs.ngModel+'">' + attrs.placeholder + '</label><input type="'+ ( attrs.type || 'text' ) +'" name="'+attrs.ngModel+'" ng-model="' + attrs.ngModel + '" ng-required="' + attrs.ngRequired + '" placeholder="' + attrs.placeholder + '" /></div>');
+                       var my_class = attrs['class'] || '';
+                       var my_type  = attrs['type']  || 'text';
+                       var html = '<div class="controls '+my_class+'">'
+                               +'<label for="'+attrs.ngModel+'">' + attrs.placeholder + '</label>'
+                               +'<input type="'+my_type+'" name="'+attrs.ngModel+'" ng-model="' + attrs.ngModel + '" ng-required="' + attrs.ngRequired + '" placeholder="' + attrs.placeholder + '" />'
+                               +'</div>'
+                       ;
+                       element.replaceWith(html);
                }
     };
   });
diff --git a/app/partials/registration.html b/app/partials/registration.html
index 4a97916..baeccc6 100644 (file)
--- a/app/partials/registration.html
+++ b/app/partials/registration.html
@@ -8,33 +8,44 @@ Svi sudionici skupa, bez obzira na to jesu li izlagači, suautori ili slušači,
 
 <h2>Odaberite tip registracije</h2>
 
-<label class="left"><input type="radio" ng-model="user.registration_type" value="lecture" >Prijava usmenog izlaganja - <i>popunjava prvi autor, odnosno osoba koja će izložiti rad. Ostali autori trebaju se samo registrirati.</i></label>
-<label class="left"><input type="radio" ng-model="user.registration_type" value="poster" >Prijava poster prezentacije - <i>popunjava prvi autor, ondnosno osoba koja će izložiti rad. Ostali autori trebaju se samo registrirati.</i></label>
-<label class="left"><input type="radio" ng-model="user.registration_type" value="symposium" >Prijava simpozija - <i>popunjava organizator simpozija, upisuje sažetke svih radova. Autori radova na simpoziju trebaju se samo registrirati.</i></label>
-<label class="left"><input type="radio" ng-model="user.registration_type" value="round" >Prijava okruglog stola - <i>popunjava organizator okruglog stola. Sudionici se trebaju registrirati.</i></label>
+<label class="radio"><input type="radio" ng-model="user.registration_type" value="lecture" >Prijava usmenog izlaganja - <i>popunjava prvi autor, odnosno osoba koja će izložiti rad. Ostali autori trebaju se samo registrirati.</i></label>
+<label class="radio"><input type="radio" ng-model="user.registration_type" value="poster" >Prijava poster prezentacije - <i>popunjava prvi autor, ondnosno osoba koja će izložiti rad. Ostali autori trebaju se samo registrirati.</i></label>
+<label class="radio"><input type="radio" ng-model="user.registration_type" value="symposium" >Prijava simpozija - <i>popunjava organizator simpozija, upisuje sažetke svih radova. Autori radova na simpoziju trebaju se samo registrirati.</i></label>
+<label class="radio"><input type="radio" ng-model="user.registration_type" value="round" >Prijava okruglog stola - <i>popunjava organizator okruglog stola. Sudionici se trebaju registrirati.</i></label>
 <hr />
-<label class="left"><input type="radio" ng-model="user.registration_type" value="participant" >Registracija - <i>popunjavaju slušači i suatori, te autori i suatori radova na simpoziju i sudionici okruglog stola.</i></label>
-<label class="left"><input type="radio" ng-model="user.registration_type" value="accomp" >Registracija za osobe u pratnji.</label>
+<label class="radio"><input type="radio" ng-model="user.registration_type" value="participant" >Registracija - <i>popunjavaju slušači i suatori, te autori i suatori radova na simpoziju i sudionici okruglog stola.</i></label>
+<label class="radio"><input type="radio" ng-model="user.registration_type" value="accomp" >Registracija za osobe u pratnji.</label>
 
-<div ng-show="user.registration_type">
 
-<h2>Registracija - podaci za kontakt</h2>
+<fieldset ng-show="user.registration_type">
 
-<input class="my-input w2 left" ng-model="user.firstname" placeholder="Ime" ng-required="true" />
-<input class="my-input w2" ng-model="user.surname"   placeholder="Prezime" ng-required="true" />
+<legend>Registracija kontakt podaci</legend>
 
-<input class="my-input w1 left" ng-model="user.organization" placeholder="Ustanova" >
+<div class="controls controls-row">
+<input class="my-input span6" ng-model="user.firstname" placeholder="Ime" ng-required="true" />
+<input class="my-input span6" ng-model="user.surname"   placeholder="Prezime" ng-required="true" />
+</div>
 
-<input class="my-input w1 left" ng-model="user.address" placeholder="Adresa" >
+<div class="controls controls-row">
+<input class="my-input span12" ng-model="user.organization" placeholder="Ustanova" >
+</div>
 
-<input class="my-input w3 left" ng-model="user.city" placeholder="Grad" ng-required="true" >
-<input class="my-input w3" ng-model="user.zip_code" placeholder="Poštanski br." >
-<input class="my-input w3" ng-model="user.country" placeholder="Zemlja" >
+<div class="controls controls-row">
+<input class="my-input span12" ng-model="user.address" placeholder="Adresa" >
+</div>
 
-<input class="my-input w2 left" ng-model="user.email" type="email" placeholder="E-pošta" ng-required="true" />
-<input class="my-input w2" ng-model="user.phone" placeholder="Tel. broj" />
+<div class="controls controls-row">
+<input class="my-input span4" ng-model="user.city" placeholder="Grad" ng-required="true" >
+<input class="my-input span4" ng-model="user.zip_code" placeholder="Poštanski br." >
+<input class="my-input span4" ng-model="user.country" placeholder="Zemlja" >
+</div>
 
-<label class="left">
+<div class="controls controls-row">
+<input class="my-input span6" ng-model="user.email" type="email" placeholder="E-pošta" ng-required="true" />
+<input class="my-input span6" ng-model="user.phone" placeholder="Tel. broj" />
+</div>
+
+<label class="checkbox">
 <input ng-model="user.student" type="checkbox" ng-change="change_student()">
 Označite ako ste student.
 </label>
@@ -80,7 +91,7 @@ Trebam R-1 račun
 
 </div><!-- not student -->
 
-</div><!-- selected registration_type -->
+</fieldset><!-- selected registration_type -->
 
 
 <div ng-show="has_work">
Unnamed repository; edit this file 'description' to name the repository.