From 99425998f46be1b481e37fd3101cd6dcb7fad4da Mon Sep 17 00:00:00 2001
From: Fran Exposito <8macau8@gmail.com>
Date: Fri, 3 Jul 2015 20:28:17 +0200
Subject: [PATCH 1/9] Panel de notificiacion creado

---
 _dt/css/main.css     | 64 +++++++++++++++++++++++++++++++++++++++++++-
 templates/index.html | 26 ++++++++++++++++--
 2 files changed, 87 insertions(+), 3 deletions(-)

diff --git a/_dt/css/main.css b/_dt/css/main.css
index 78c4c3d..f44376a 100644
--- a/_dt/css/main.css
+++ b/_dt/css/main.css
@@ -78,7 +78,7 @@ body {
 /******** NavBar estilos *********/
 /*********************************/
 .navbar-evenge i {
-  font-size: 2em;
+  font-size: 1.7em;
 }
 
 .navbar-evenge a {
@@ -586,3 +586,65 @@ form .btn-form:focus {
 .consejos ul li {
   margin-bottom: 5px;
 }
+
+/* notifications panel */
+.notifications-content {
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 1000;
+  display: block;
+  padding: 0;
+  width: 240px;
+  min-height: 100%;
+  overflow-x: hidden;
+  overflow-y: auto;
+  background-color: #fbfbfb;
+  border-left: 1px solid #e0e0e0;
+}
+
+.notifications-content .menu-title {
+  width: 100%;
+  height: 50px;
+  background: #ffffff;
+}
+
+.notifications-content .menu-title h1 {
+  padding: 0;
+  margin: 0;
+  color: #d43539;
+  text-align: center;
+  line-height: 50px;
+  font-size: 1.5em;
+  font-weight: bold;
+}
+
+.notifications-content .notifications {
+  padding: 0;
+  margin: 0;
+  list-style: none;
+}
+
+.notifications-content .notifications li {
+  padding: 0;
+  margin: 0;
+}
+
+.notifications-content .notifications li a {
+  display: block;
+  padding: 20px 15px;
+  position: relative;
+}
+
+.notifications-content .notifications li a:after {
+  content: "";
+  display: block;
+  width: 80%;
+  margin-left: auto;
+  margin-right: auto;
+  height: 1px;
+  background: rgba(212, 53, 57, 0.49);
+  position: absolute;
+  bottom: 0;
+}
diff --git a/templates/index.html b/templates/index.html
index 8e0f5a8..4823591 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -94,14 +94,36 @@ <h1><a href="/cuenta?id={{ usuario.getKey() }}">{{usuario.nombre}} {{usuario.ape
             <li><a href="#"><i class="fa fa-circle fa-fw"></i> Por mes</a></li>
           </ul>
         </li>
+
+        <li>
+          <a class="titulo-menu" href="/logout"> <i class="fa fa-sign-out fa-fw"></i> Cerrar sesión</a>
+        </li>
       </ul>
     </div>
   </nav>
+
+  <nav id="notifications-div" class="notifications-content">
+    <div class="menu-title">
+      <h1>Notificaciones</h1>
+    </div>
+
+    <ul class="notifications">
+      <li>
+        <a href="">Hay un nuevo asistente en <b>Congreso de...</b></a>
+      </li>
+      <li>
+        <a href="">Hay un nuevo asistente en <b>Congreso de...</b></a>
+      </li>
+      <li>
+        <a href="">Hay un nuevo asistente en <b>Congreso de...</b></a>
+      </li>
+    </ul>
+  </nav>
   {% endif %}
   <!-- fin menu -->
 
   <!--nav -->
-  <main class="main-body pad120">
+  <main style="padding-right: 240px;" class="main-body pad120">
     <nav class="navbar-evenge">
       <div class="container-fluid">
         <div class="men pull-left">
@@ -138,7 +160,7 @@ <h1><a href="/cuenta?id={{ usuario.getKey() }}">{{usuario.nombre}} {{usuario.ape
               </div>
             </div>
           </li>
-          <li><a class="nav-li" href="/logout"> <i class="fa fa-sign-out"></i></a></li>
+          <li><a class="nav-li" href="/logout"> <i class="fa fa-bell"></i></a></li>
         </ul>
         {% endblock %}
       </div>

From 1fe75484dc7b8f1a175c8dcffeca8f716649fba5 Mon Sep 17 00:00:00 2001
From: Fran Exposito <8macau8@gmail.com>
Date: Fri, 3 Jul 2015 21:12:59 +0200
Subject: [PATCH 2/9] funcionalidad para abrir y cerrar menu de notificaciones

---
 _dt/css/main.css     | 16 ++++++++++++++--
 _dt/js/general.js    | 18 ++++++++++++++++++
 templates/index.html |  4 ++--
 3 files changed, 34 insertions(+), 4 deletions(-)

diff --git a/_dt/css/main.css b/_dt/css/main.css
index f44376a..54a995f 100644
--- a/_dt/css/main.css
+++ b/_dt/css/main.css
@@ -596,17 +596,29 @@ form .btn-form:focus {
   z-index: 1000;
   display: block;
   padding: 0;
-  width: 240px;
+  width: 0;
   min-height: 100%;
   overflow-x: hidden;
   overflow-y: auto;
   background-color: #fbfbfb;
-  border-left: 1px solid #e0e0e0;
+}
+
+.notifications-content:before {
+  content: '';
+  display: inline-block;
+  border-style: solid;
+  border-width: 10px 0px 10px 15px;
+  border-color: transparent transparent transparent #c11f23;
+  position: absolute;
+  z-index: 1;
+  top: 14px;
+  right: 230px;
 }
 
 .notifications-content .menu-title {
   width: 100%;
   height: 50px;
+  position: relative;
   background: #ffffff;
 }
 
diff --git a/_dt/js/general.js b/_dt/js/general.js
index aacc88b..8996995 100644
--- a/_dt/js/general.js
+++ b/_dt/js/general.js
@@ -51,6 +51,24 @@ $(document).ready(function () {
     evt.stopPropagation();
   });
 
+  $('#noti-bottom').on('click', function (evt) {
+    if ($(this).hasClass('active')) {
+      $(this).removeClass('active');
+      $(function () {
+        $(".notifications-content").animate({width: '0'}, { duration: 200, queue: false });
+        $(".pad120").animate({padding: '0'}, { duration: 200, queue: false });
+      });
+    } else {
+      $(this).addClass('active');
+      $(function () {
+        $(".notifications-content").animate({width: '240px'}, { duration: 200, queue: false });
+        $(".pad120").animate({padding: '0 240px 0 0'}, { duration: 200, queue: false });
+      });
+    }
+    evt.preventDefault();
+    evt.stopPropagation();
+  });
+
   $('.menu-content .dropdown').on('show.bs.dropdown', function(e) {
     $(this).find('.dropdown-menu').first().stop(true, true).slideDown();
   });
diff --git a/templates/index.html b/templates/index.html
index 4823591..036fc84 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -123,7 +123,7 @@ <h1>Notificaciones</h1>
   <!-- fin menu -->
 
   <!--nav -->
-  <main style="padding-right: 240px;" class="main-body pad120">
+  <main class="main-body pad120">
     <nav class="navbar-evenge">
       <div class="container-fluid">
         <div class="men pull-left">
@@ -160,7 +160,7 @@ <h1>Notificaciones</h1>
               </div>
             </div>
           </li>
-          <li><a class="nav-li" href="/logout"> <i class="fa fa-bell"></i></a></li>
+          <li><a id="noti-bottom" class="nav-li" href="/logout"> <i class="fa fa-bell"></i></a></li>
         </ul>
         {% endblock %}
       </div>

From c77b7502248b2031ffbc61bfd7ffb44e7ef16aef Mon Sep 17 00:00:00 2001
From: Fran Exposito <8macau8@gmail.com>
Date: Fri, 3 Jul 2015 21:22:45 +0200
Subject: [PATCH 3/9] =?UTF-8?q?cerrar=20uno=20de=20los=20men=C3=BAs=20late?=
 =?UTF-8?q?rales=20al=20abrir=20el=20otro=20#254?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 _dt/js/general.js | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/_dt/js/general.js b/_dt/js/general.js
index 8996995..4c174c9 100644
--- a/_dt/js/general.js
+++ b/_dt/js/general.js
@@ -45,6 +45,11 @@ $(document).ready(function () {
       $(function () {
         $(".menu-content").animate({width: '220px'}, { duration: 200, queue: false });
         $(".pad120").animate({padding: '0 0 0 220px'}, { duration: 200, queue: false });
+
+        if ($('#noti-bottom').hasClass('active')) {
+          $(".notifications-content").animate({width: '0'}, { duration: 200, queue: false });
+          $('#noti-bottom').removeClass('active');
+        }
       });
     }
     evt.preventDefault();
@@ -63,6 +68,11 @@ $(document).ready(function () {
       $(function () {
         $(".notifications-content").animate({width: '240px'}, { duration: 200, queue: false });
         $(".pad120").animate({padding: '0 240px 0 0'}, { duration: 200, queue: false });
+
+        if ($('#menu-bottom').hasClass('active')) {
+          $(".menu-content").animate({width: '0'}, { duration: 200, queue: false });
+          $('#menu-bottom').removeClass('active');
+        }
       });
     }
     evt.preventDefault();

From 42ca6f90a3a8de929b967cbf00cd07a0410f81e2 Mon Sep 17 00:00:00 2001
From: franexposito <8macau8@gmail.com>
Date: Fri, 7 Aug 2015 12:00:57 +0200
Subject: [PATCH 4/9] =?UTF-8?q?mejora=20del=20dise=C3=B1o=20del=20panel=20?=
 =?UTF-8?q?de=20notificacion=20#254?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 _dt/css/main.css     | 8 +++++++-
 templates/index.html | 1 +
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/_dt/css/main.css b/_dt/css/main.css
index 54a995f..4efbcef 100644
--- a/_dt/css/main.css
+++ b/_dt/css/main.css
@@ -645,7 +645,7 @@ form .btn-form:focus {
 
 .notifications-content .notifications li a {
   display: block;
-  padding: 20px 15px;
+  padding: 10px 15px 5px 10px;
   position: relative;
 }
 
@@ -660,3 +660,9 @@ form .btn-form:focus {
   position: absolute;
   bottom: 0;
 }
+
+#clean {
+  padding: 10px 15px;
+  display: block;
+  text-align: right;
+}
diff --git a/templates/index.html b/templates/index.html
index 036fc84..9b04f1f 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -107,6 +107,7 @@ <h1><a href="/cuenta?id={{ usuario.getKey() }}">{{usuario.nombre}} {{usuario.ape
       <h1>Notificaciones</h1>
     </div>
 
+    <a id="clean" href="#"><i class="fa fa-check"></i> Borrar todas</a>
     <ul class="notifications">
       <li>
         <a href="">Hay un nuevo asistente en <b>Congreso de...</b></a>

From 97ed6c14880dd0b344a1f0c9fcf49ce8365f0e8a Mon Sep 17 00:00:00 2001
From: franexposito <8macau8@gmail.com>
Date: Fri, 7 Aug 2015 12:21:27 +0200
Subject: [PATCH 5/9] cambio de color clean notifiacion

---
 _dt/css/main.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/_dt/css/main.css b/_dt/css/main.css
index 4efbcef..1ad70b2 100644
--- a/_dt/css/main.css
+++ b/_dt/css/main.css
@@ -665,4 +665,5 @@ form .btn-form:focus {
   padding: 10px 15px;
   display: block;
   text-align: right;
+  color: darkgray;
 }

From af16f2f0829c63219baedd127be2f9b7a721e84d Mon Sep 17 00:00:00 2001
From: franexposito <8macau8@gmail.com>
Date: Sun, 16 Aug 2015 11:42:40 +0200
Subject: [PATCH 6/9] menu modificado

---
 _dt/css/main.css     | 228 +++++++++++++++++++++++--------------------
 _dt/js/general.js    | 111 ++++++++++++---------
 templates/index.html |  84 +++++++++-------
 3 files changed, 240 insertions(+), 183 deletions(-)

diff --git a/_dt/css/main.css b/_dt/css/main.css
index 1ad70b2..7c61ff8 100644
--- a/_dt/css/main.css
+++ b/_dt/css/main.css
@@ -21,6 +21,20 @@ GNU General Public License for more details.
   background: rgba(62, 62, 62, 0.62);
 }
 
+::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 10px;
+  background: rgba(57, 57, 57, 0.2);
+}
+
 a,
 button {
   -o-transition:.5s;
@@ -56,14 +70,14 @@ body {
   font-size: 12px;
   background-color: #edecec;
   margin-bottom: 50px;
+  width: 100%;
+  height: 100%;
+  margin-bottom: 0;
 }
 
 .main-body {
   padding: 0;
-}
-
-.main-body.pad120 {
-  padding: 0;
+  background-color: #edecec;
 }
 
 .always-bar {
@@ -91,8 +105,7 @@ body {
 
 .navbar-evenge {
   z-index: 10;
-  height: 50px;
-  padding: 0;
+  padding: 0 5px;
   width: 100%;
   top: 0;
   background-color: #C11F23;
@@ -130,12 +143,14 @@ body {
 }
 
 #menu-bottom {
-  margin-top: -1px;
-  padding: 0 10px 0 7px;
+  margin: 0px;
+  padding: 0 15px;
   background: none;
   border: none;
   border-radius: 0;
   color: #fff;
+  line-height: 50px;
+  height: 50px;
 }
 
 #menu-bottom:hover,
@@ -175,6 +190,7 @@ body {
 
 .navbar-evenge .navbar-nav li a.nav-li i {
   line-height: 50px;
+  font-size: 1.3em;
 }
 
 .navbar-evenge .navbar-nav li:focus {
@@ -189,23 +205,13 @@ body {
 
 .navbar-evenge .navbar-nav .dropdown .dropdown-menu {
   background: white;
-  right: 0;
+  right: 2px;
+  top: 45px;
   left: auto;
   min-width: 260px;
   text-align: center;
   border-radius: 0;
-}
-
-.navbar-evenge .dropdown-menu:before {
-  content: '';
-  display: inline-block;
-  border-left: 7px solid transparent;
-  border-right: 7px solid transparent;
-  border-bottom: 7px solid #fff;
-  border-bottom-color: #ffffff;
-  position: absolute;
-  top: -7px;
-  right: 18px;
+  box-shadow: 0 2px 10px rgba(0,0,0,.2)
 }
 
 .navbar-evenge .navbar-nav .dropdown .dropdown-menu a {
@@ -263,29 +269,48 @@ body {
 /*************************************************/
 /*************** menu estilos ********************/
 /*************************************************/
-#menu-div {
-  /*display: none;*/
-}
-
-.menu-content {
+#menuM {
   position: fixed;
+  left: 0;
   top: 0;
   bottom: 0;
-  left: 0;
-  z-index: 1000;
-  display: block;
+  right: 0;
+  z-index: 0;
+  width: 256px;
+  overflow: hidden;
+  -webkit-overflow-scrolling: touch;
+  display: none;
   padding: 0;
-  width: 0;
-  min-height: 100%;
-  overflow-x: hidden;
+}
+
+.scrollable {
   overflow-y: auto;
+  height: 100%;
+}
+
+#panel {
+  position:relative;
+  z-index: 1;
+}
+
+.menu-open,
+.menu-open body,
+.menu-open #panel {
+  overflow: hidden;
+}
+
+.menu-open #menuM {
+  display: block;
+}
+
+.menu-content {
   background-color: #c11f23;
 }
 
 .menu-content .menu-title {
   width: 100%;
   height: 50px;
-  background: #aa1b1f;
+  border-right: 1px solid #aa1b1f;
 }
 
 .menu-content .menu-title h1 {
@@ -299,38 +324,32 @@ body {
 }
 
 .menu-content .menu-user {
-  width: 100%;
-  padding-top: 10px;
-  border-bottom: 1px solid #ae1c20;
+  padding: 15px 0;
+  background: #ae1c20;
 }
 
 .menu-content .menu-user .gravatar {
-  width: 80px;
-  height: 80px;
-  background: #d43539;
-  margin-left: auto;
-  margin-right: auto;
-  border-radius: 100px;
-  line-height: 95px;
-  text-align: center;
+  height: 95%;
+  width: 95%;
+  padding: 0;
 }
 
-.menu-content .menu-user .gravatar h1 {
-  padding: 0;
-  margin: 0;
-  display: inline-block;
-  font-size: 2.3em;
-  color: #fff;
+.menu-content .menu-user .gravatar img {
+  max-width: 100%;
+  max-height: 100%;
+  border-radius: 100px;
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
 }
 
 .menu-content .menu-user h1 {
   padding: 0;
   margin: 0;
   color: #fff;
-  text-align: center;
-  font-size: 1.2em;
+  font-size: 1em;
   font-weight: bold;
-  padding: 10px 0;
+  padding: 5px 0;
 }
 
 .menu-content .menu-user h1 a {
@@ -398,11 +417,26 @@ body {
   margin-top: 3px;
 }
 
+.menu-content .menu .title-menu {
+  padding: 10px;
+  margin: 0;
+  font-size: 10px;
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .divisor {
-  width: 80%;
   padding-top: 10px;
-  border-top: 1px solid #b2b2b2;
-  margin-left: 20px;
+  width: 100%;
+  border-top: 4px solid #ae1c20;
+}
+
+.menu {
+  padding: 0;
+  overflow-y: auto;
+}
+
+.menu-user .name {
+  padding: 0;
 }
 
 /*************************************************/
@@ -588,65 +622,54 @@ form .btn-form:focus {
 }
 
 /* notifications panel */
-.notifications-content {
-  position: fixed;
-  top: 0;
-  bottom: 0;
-  right: 0;
-  z-index: 1000;
-  display: block;
+.noti-drop {
   padding: 0;
-  width: 0;
-  min-height: 100%;
-  overflow-x: hidden;
-  overflow-y: auto;
-  background-color: #fbfbfb;
 }
 
-.notifications-content:before {
-  content: '';
-  display: inline-block;
-  border-style: solid;
-  border-width: 10px 0px 10px 15px;
-  border-color: transparent transparent transparent #c11f23;
-  position: absolute;
-  z-index: 1;
-  top: 14px;
-  right: 230px;
+.noti-drop .noti-title {
+  border-bottom: 1px solid #e1e1e1;
 }
 
-.notifications-content .menu-title {
-  width: 100%;
-  height: 50px;
-  position: relative;
-  background: #ffffff;
+.noti-drop .noti-title h1 {
+  padding: 10px;
+  margin: 0;
+  color: #262626;
+  font-size: 1.1em;
 }
 
-.notifications-content .menu-title h1 {
+.noti-drop ul {
   padding: 0;
-  margin: 0;
-  color: #d43539;
-  text-align: center;
-  line-height: 50px;
-  font-size: 1.5em;
-  font-weight: bold;
 }
 
-.notifications-content .notifications {
-  padding: 0;
+.noti-drop .notificacion {
+
+}
+
+.noti-drop .notificacion p,
+.noti-drop .notificacion i {
+  font-size: 14px;
+}
+
+.noti-drop .notificacion p {
+  color: #888888;
+  padding: 20px 0;
   margin: 0;
-  list-style: none;
 }
 
-.notifications-content .notifications li {
-  padding: 0;
+.noti-drop .clear-all {
+  border-top: 1px solid #f7f7f7;
+  color: #e1e1e1;
+  height: 30px;
   margin: 0;
+  padding: 0;
 }
 
-.notifications-content .notifications li a {
-  display: block;
-  padding: 10px 15px 5px 10px;
-  position: relative;
+.noti-drop .clear-all a {
+  font-size: 10px;
+  text-align: center;
+  margin: 0;
+  padding: 0;
+  line-height: 30px;
 }
 
 .notifications-content .notifications li a:after {
@@ -660,10 +683,3 @@ form .btn-form:focus {
   position: absolute;
   bottom: 0;
 }
-
-#clean {
-  padding: 10px 15px;
-  display: block;
-  text-align: right;
-  color: darkgray;
-}
diff --git a/_dt/js/general.js b/_dt/js/general.js
index 4c174c9..685e677 100644
--- a/_dt/js/general.js
+++ b/_dt/js/general.js
@@ -15,68 +15,81 @@
 /*jslint browser: true*/
 /*global $, jQuery, alert*/
 
-jQuery.validator.addMethod("twitter", function(value, element) {
+//variable para obtener el prefijo del navegador
+var prefix = (function prefix() {
+  var regex = /^(Webkit|Khtml|Moz|ms|O)(?=[A-Z])/;
+  var styleDeclaration = document.getElementsByTagName('script')[0].style;
+  for (var prop in styleDeclaration) {
+    if (regex.test(prop)) {
+      return '-' + prop.match(regex)[0].toLowerCase() + '-';
+    }
+  }
+  // Nothing found so far? Webkit does not enumerate over the CSS properties of the style object.
+  // However (prop in style) returns the correct value, so we'll have to test for
+  // the precence of a specific property
+  if ('WebkitOpacity' in styleDeclaration) { return '-webkit-'; }
+  if ('KhtmlOpacity' in styleDeclaration) { return '-khtml-'; }
+  return '';
+}());
+
+//inicializamos las opciones del menu
+var _menu = document.getElementById('menuM'),
+    _panel = document.getElementById('panel'),
+    _opened = false,
+    _duration = 300;
+
+jQuery.validator.addMethod("twitter", function (value, element) {
   return this.optional(element) || /@([A-Za-z0-9_])+/.test(value);
 }, "No es una cuenta de twitter correcta");
 
-jQuery.validator.addMethod("web", function(value, element) {
+jQuery.validator.addMethod("web", function (value, element) {
   return this.optional(element) || /^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \?=.-]*)*\/?$/.test(value);
 }, "No es una web correcta");
 
-jQuery.validator.addMethod("telefono", function(value, element) {
+jQuery.validator.addMethod("telefono", function (value, element) {
   return this.optional(element) ||  /^((\+?34([ \t|\-])?)?[9|6|7]((\d{1}([ \t|\-])?[0-9]{3})|(\d{2}([ \t|\-])?[0-9]{2}))([ \t|\-])?[0-9]{2}([ \t|\-])?[0-9]{2})$/.test(value);
 }, "No es un telefono correcto");
 
-jQuery.validator.addMethod("mail", function(value, element) {
+jQuery.validator.addMethod("mail", function (value, element) {
   return this.optional(element) || /^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$/.test(value);
 }, "No es un email correcto");
 
+function setTransform(offset) {
+  _panel.style[prefix + 'transform'] = _panel.style.transform = 'translate3d('+offset+'px, 0, 0)';
+}
+
+function setTransition() {
+  _panel.style[prefix + 'transform'] = _panel.style.transition = prefix + 'transform ' +_duration+'ms ease';
+}
+
+function open() {
+  $('html').addClass( "menu-open");
+  setTransition();
+  _opened = true;
+  setTimeout( function () {
+    setTransform(256);
+  }, _duration + 50);
+}
+
+function close() {
+  setTransition()
+  _opened = false;
+  setTransform(0);
+  setTimeout( function () {
+    $('html').removeClass('menu-open');
+  }, _duration + 50);
+}
+
 $(document).ready(function () {
   'use strict';
-  $('#menu-bottom').on('click', function (evt) {
-    if ($(this).hasClass('active')) {
-      $(this).removeClass('active');
-      $(function () {
-        $(".menu-content").animate({width: '0'}, { duration: 200, queue: false });
-        $(".pad120").animate({padding: '0'}, { duration: 200, queue: false });
-      });
-    } else {
-      $(this).addClass('active');
-      $(function () {
-        $(".menu-content").animate({width: '220px'}, { duration: 200, queue: false });
-        $(".pad120").animate({padding: '0 0 0 220px'}, { duration: 200, queue: false });
-
-        if ($('#noti-bottom').hasClass('active')) {
-          $(".notifications-content").animate({width: '0'}, { duration: 200, queue: false });
-          $('#noti-bottom').removeClass('active');
-        }
-      });
-    }
-    evt.preventDefault();
-    evt.stopPropagation();
-  });
 
-  $('#noti-bottom').on('click', function (evt) {
-    if ($(this).hasClass('active')) {
-      $(this).removeClass('active');
-      $(function () {
-        $(".notifications-content").animate({width: '0'}, { duration: 200, queue: false });
-        $(".pad120").animate({padding: '0'}, { duration: 200, queue: false });
-      });
+  $('#menu-bottom').on('click', function (evt) {
+    if ( _opened ) {
+      close();
     } else {
-      $(this).addClass('active');
-      $(function () {
-        $(".notifications-content").animate({width: '240px'}, { duration: 200, queue: false });
-        $(".pad120").animate({padding: '0 240px 0 0'}, { duration: 200, queue: false });
-
-        if ($('#menu-bottom').hasClass('active')) {
-          $(".menu-content").animate({width: '0'}, { duration: 200, queue: false });
-          $('#menu-bottom').removeClass('active');
-        }
-      });
+      open();
     }
     evt.preventDefault();
-    evt.stopPropagation();
   });
 
   $('.menu-content .dropdown').on('show.bs.dropdown', function(e) {
@@ -88,6 +101,16 @@ $(document).ready(function () {
     $(this).find('.dropdown-menu').first().stop(true, true).slideUp();
   });
 
+  $('.navbar-nav .dropdown').on('show.bs.dropdown', function(e) {
+    $(this).find('.dropdown-menu').first().stop(true, true).show('slide', {direction: 'right'}, 300);
+  });
+
+  // ADD SLIDEUP ANIMATION TO DROPDOWN //
+  $('.navbar-nav .dropdown').on('hide.bs.dropdown', function(e) {
+    $(this).find('.dropdown-menu').first().stop(true, true).hide('slide', {direction: 'right'}, 300);
+  });
+
+
 });
 
 !function (d, s, id) {
diff --git a/templates/index.html b/templates/index.html
index 9b04f1f..04f9282 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -47,24 +47,35 @@
 <body>
   <!-- menu -->
   {% if usuario %}
-  <div class="always-bar"></div>
-  <nav id="menu-div" class="menu-content col-sm-3 col-md-2">
+  <!--<div class="always-bar"></div>-->
+  <nav id="menuM" class="menu-content">
     <div class="menu-title">
       <h1>MENÚ</h1>
     </div>
-    <div class="menu-user">
-      <div class="gravatar">
-        <h1>{{info.gravatar}}</h1>
+    <div class="scrollable">
+      <div class="menu-user col-sm-12">
+      <div class="col-sm-4">
+        <div class="gravatar">
+          {% if usuario.avatar %}
+          <img alt="avatar" src="gImagenUsuario?tipo=1&id={{ usuario.getKey() }}">
+          {% else %}
+          <img alt="avatar" src="/_dt/img/default_avatar.png">
+          {% endif %}
+        </div>
+      </div>
+      <div class="col-sm-8 name">
+        <h1><a href="/cuenta?id={{ usuario.getKey() }}">{{usuario.nombre}} {{usuario.apellidos}}</a></h1>
       </div>
-      <h1><a href="/cuenta?id={{ usuario.getKey() }}">{{usuario.nombre}} {{usuario.apellidos}}</a></h1>
+
     </div>
-    <div class="menu">
+      <div class="menu col-sm-12">
+      <h1 class="title-menu">Opciones</h1>
       <ul class="nav menu-nav">
         <li>
           <a class="titulo-menu" href="/micuenta"><i class="fa fa-cog fa-fw"></i> Configuración</a>
         </li>
 
-        <li class="dropdown open">
+        <li class="dropdown">
           <a class="titulo-menu dropdown-toggle" href="#" data-toggle="dropdown" role="button" aria-expanded="false">
             <i class="fa fa-newspaper-o fa-fw"></i> Eventos <i class="fa2 fa fa-circle-o"></i>
           </a>
@@ -94,42 +105,34 @@ <h1><a href="/cuenta?id={{ usuario.getKey() }}">{{usuario.nombre}} {{usuario.ape
             <li><a href="#"><i class="fa fa-circle fa-fw"></i> Por mes</a></li>
           </ul>
         </li>
+      </ul>
 
-        <li>
-          <a class="titulo-menu" href="/logout"> <i class="fa fa-sign-out fa-fw"></i> Cerrar sesión</a>
-        </li>
+      <div class="divisor"></div>
+      <h1 class="title-menu">Redes sociales</h1>
+      <ul class="nav menu-nav">
+        <li><a class="titulo-menu" href="https://twitter.com/GrupoEvenge"><i class="fa fa-twitter fa-fw"></i> @GrupoEvenge</a></li>
+        <li><a class="titulo-menu" href="http://evenge.github.io"><i class="fa fa-newspaper-o fa-fw"></i> Blog</a></li>
       </ul>
-    </div>
-  </nav>
 
-  <nav id="notifications-div" class="notifications-content">
-    <div class="menu-title">
-      <h1>Notificaciones</h1>
-    </div>
+      <h1 class="title-menu">Miscelanea</h1>
+      <ul class="nav menu-nav">
+        <li><a class="titulo-menu" href="https://github.com/evenge/EVENGE"><i class="fa fa-github fa-fw"></i> Fork GitHub</a></li>
+        <li><a class="titulo-menu" href="/logout"> <i class="fa fa-sign-out fa-fw"></i> Cerrar sesión</a></li>
+      </ul>
 
-    <a id="clean" href="#"><i class="fa fa-check"></i> Borrar todas</a>
-    <ul class="notifications">
-      <li>
-        <a href="">Hay un nuevo asistente en <b>Congreso de...</b></a>
-      </li>
-      <li>
-        <a href="">Hay un nuevo asistente en <b>Congreso de...</b></a>
-      </li>
-      <li>
-        <a href="">Hay un nuevo asistente en <b>Congreso de...</b></a>
-      </li>
-    </ul>
+    </div>
+    </div>
   </nav>
   {% endif %}
   <!-- fin menu -->
 
   <!--nav -->
-  <main class="main-body pad120">
+  <main id="panel" class="main-body">
     <nav class="navbar-evenge">
       <div class="container-fluid">
         <div class="men pull-left">
           {% if usuario %}
-          <button id="menu-bottom" type="button" class="btn btn-default navbar-btn"><i class="fa fa-bars"></i></button>
+          <a id="menu-bottom" class="btn btn-default navbar-btn"><i class="fa fa-bars"></i></a>
           {% endif %}
           <a class="logo-en" href="/"><img src="/_dt/img/logo_white_50.png" alt="logo"> EVENGE</a>
         </div>
@@ -161,7 +164,22 @@ <h1>Notificaciones</h1>
               </div>
             </div>
           </li>
-          <li><a id="noti-bottom" class="nav-li" href="/logout"> <i class="fa fa-bell"></i></a></li>
+          <li class="dropdown">
+            <a class="nav-li" href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"> <i class="fa fa-bell"></i></a>
+            <div class="dropdown-menu noti-drop" role="menu">
+              <div class="noti-title col-sm-12">
+                <h1>Notificaciones</h1>
+              </div>
+              <ul>
+                <li class="notificacion col-sm-12">
+                  <p>No tienes notificaciones <i class="fa fa-frown-o"></i></p>
+                </li>
+              </ul>
+              <div class="clear-all col-sm-12">
+                <a href="#">Borrar todas</a>
+              </div>
+            </div>
+          </li>
         </ul>
         {% endblock %}
       </div>
@@ -210,9 +228,9 @@ <h5><strong>Asistencia:</strong> {{n.asistencia}}</h5>
   <script src="https://code.jquery.com/ui/1.11.2/jquery-ui.min.js"></script>
   <script src="//oss.maxcdn.com/jquery.form/3.50/jquery.form.min.js"></script>
   <script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.min.js"></script>
+  <script src="/_dt/js/general.js"></script>
   {% block scriptFooter %}
   {% endblock %}
-  <script src="/_dt/js/general.js"></script>
   <!-- scripts -->
 </body>
 </html>

From 4ac7ac58518fac7ae8f4d2c4b2729f8f3dc89297 Mon Sep 17 00:00:00 2001
From: franexposito <8macau8@gmail.com>
Date: Sun, 16 Aug 2015 11:45:52 +0200
Subject: [PATCH 7/9] general.js al final

---
 templates/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/index.html b/templates/index.html
index 04f9282..db1eaf2 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -228,9 +228,9 @@ <h5><strong>Asistencia:</strong> {{n.asistencia}}</h5>
   <script src="https://code.jquery.com/ui/1.11.2/jquery-ui.min.js"></script>
   <script src="//oss.maxcdn.com/jquery.form/3.50/jquery.form.min.js"></script>
   <script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.min.js"></script>
-  <script src="/_dt/js/general.js"></script>
   {% block scriptFooter %}
   {% endblock %}
+  <script src="/_dt/js/general.js"></script>
   <!-- scripts -->
 </body>
 </html>

From 4873fb7441165959656993456ad7d9c33677d7c4 Mon Sep 17 00:00:00 2001
From: franexposito <8macau8@gmail.com>
Date: Wed, 19 Aug 2015 20:13:34 +0200
Subject: [PATCH 8/9] creado opciones avanzadas

---
 _dt/css/main.css                |  66 ++++++++++++++++++++++++++++----
 _dt/img/advanced_icon.png       | Bin 0 -> 7077 bytes
 _dt/js/general.js               |  13 +++++++
 templates/templateMyEvents.html |  32 +++++++++++++++-
 4 files changed, 102 insertions(+), 9 deletions(-)
 create mode 100644 _dt/img/advanced_icon.png

diff --git a/_dt/css/main.css b/_dt/css/main.css
index 7c61ff8..0318582 100644
--- a/_dt/css/main.css
+++ b/_dt/css/main.css
@@ -22,8 +22,8 @@ GNU General Public License for more details.
 }
 
 ::-webkit-scrollbar {
-  width: 8px;
-  height: 8px;
+  width: 4px;
+  height: 4px;
 }
 
 ::-webkit-scrollbar-track {
@@ -31,8 +31,11 @@ GNU General Public License for more details.
 }
 
 ::-webkit-scrollbar-thumb {
-  border-radius: 10px;
-  background: rgba(57, 57, 57, 0.2);
+  background: #d43539;
+}
+
+.scrollable::-webkit-scrollbar-thumb {
+  background: rgba(0, 0, 0, 0.2);
 }
 
 a,
@@ -48,7 +51,8 @@ a {
   color: #c11f23;
 }
 
-a:hover {
+a:hover,
+a:focus {
   color: #781316;
   text-decoration: none;
 }
@@ -254,6 +258,51 @@ body {
 #buscadorHeader::-moz-placeholder { color: fff; }
 #buscadorHeader::-moz-placeholder { color: fff; }
 
+/************** advanced options *****************/
+.advanced-options {
+  background: #fff;
+  padding: 20px 100px;
+  display: none;
+}
+
+.advanced-options .adv {
+  list-style: none;
+}
+
+.advanced-options .adv li a {
+  color: #d44549;
+  font-size: 1em;
+  padding: 5px 0;
+}
+
+.advanced-options .adv .adv-h1 {
+  padding: 5px 0;
+  margin: 0;
+  color: #898989;
+  font-size: 12px;
+}
+
+.advanced-options-bottom {
+  color: #898989;
+  font-size: 13px;
+  position: absolute;
+  padding: 0;
+  margin: 0;
+  top: 8px;
+  right: 20px;
+}
+
+.advanced-options-bottom:hover,
+.advanced-options-bottom:focus {
+  color: #898989;
+}
+
+.advanced-options-bottom img {
+  height: 25px;
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+
 /*************************************************/
 /************** template Ponentes ****************/
 /*************************************************/
@@ -289,8 +338,9 @@ body {
 }
 
 #panel {
-  position:relative;
+  position: relative;
   z-index: 1;
+  min-height: 100vh;
 }
 
 .menu-open,
@@ -449,14 +499,14 @@ body {
 .individual-menu-cont {
   padding: 0;
   margin: 0;
+  background-color: white;
+  border-bottom: 1px solid #ccc;
 }
 
 .individual-menu {
   width: 100%;
   display: block;
   height: 40px;
-  background-color: white;
-  border-bottom: 1px solid #ccc;
   text-align: center;
 }
 
diff --git a/_dt/img/advanced_icon.png b/_dt/img/advanced_icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..4367e616012e1298b875e67f387de607cd6f93a1
GIT binary patch
literal 7077
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

literal 0
HcmV?d00001

diff --git a/_dt/js/general.js b/_dt/js/general.js
index 685e677..10516d7 100644
--- a/_dt/js/general.js
+++ b/_dt/js/general.js
@@ -38,6 +38,9 @@ var _menu = document.getElementById('menuM'),
     _opened = false,
     _duration = 300;
 
+//inicializamos variables opciones avanzadas
+var _openedA = false;
+
 jQuery.validator.addMethod("twitter", function (value, element) {
   return this.optional(element) || /@([A-Za-z0-9_])+/.test(value);
 }, "No es una cuenta de twitter correcta");
@@ -110,6 +113,16 @@ $(document).ready(function () {
     $(this).find('.dropdown-menu').first().stop(true, true).hide('slide', {direction: 'right'}, 300);
   });
 
+  $('.advanced-options-bottom').on('click', function () {
+    if (_openedA) {
+      $('.advanced-options').slideUp();
+      _openedA = false;
+    } else {
+      $('.advanced-options').slideDown();
+      _openedA = true;
+    }
+  });
+
 
 });
 
diff --git a/templates/templateMyEvents.html b/templates/templateMyEvents.html
index 7bce5b5..6e35ee4 100644
--- a/templates/templateMyEvents.html
+++ b/templates/templateMyEvents.html
@@ -31,9 +31,39 @@
       <li role="presentation" class="individual-opt"><a data-toggle="tab" href="#eventos-org">Organizacion</a></li>
       {% endif %}
     </ul>
+    <a class="advanced-options-bottom" href="#">Opciones <img src="../_dt/img/advanced_icon.png"></a>
+    <div class="advanced-options col-sm-12">
+      <ul class="col-sm-3 col-xs-6 adv">
+        <h1 class="adv-h1">Eventos</h1>
+        <li>
+          <a href="/iEvento"><i class="fa fa-plus fa-fw"></i> Nuevo evento</a>
+        </li>
+      </ul>
+      <ul class="col-sm-3 col-xs-6 adv">
+        <h1 class="adv-h1">Vista</h1>
+        <a href="/iPonente">
+          <span><i class="fa fa-graduation-cap"></i></span>
+          <small>Nuevo ponente</small>
+        </a>
+      </ul>
+      <ul class="col-sm-3 col-xs-6 adv">
+        <h1 class="adv-h1">Fecha</h1>
+        <a href="/iPonente">
+          <span><i class="fa fa-graduation-cap"></i></span>
+          <small>Nuevo ponente</small>
+        </a>
+      </ul>
+      <ul class="col-sm-3 col-xs-6 adv">
+        <h1 class="adv-h1">Búsqueda</h1>
+        <a href="/iPonente">
+          <span><i class="fa fa-graduation-cap"></i></span>
+          <small>Nuevo ponente</small>
+        </a>
+      </ul>
+      <div class="clearfix visible-xs-block"></div>
+    </div>
   </div>
 
-
   <div class="col-md-12">
 
     <div class="tab-content">

From 10392b63d12c129fa1d458ced727fbb00f6dac6b Mon Sep 17 00:00:00 2001
From: franexposito <8macau8@gmail.com>
Date: Thu, 20 Aug 2015 14:08:09 +0200
Subject: [PATCH 9/9] opciones avanzadas: estilos

---
 _dt/css/main.css                |  24 +++++-
 templates/index.html            | 126 ++++++++++++++++----------------
 templates/templateMyEvents.html |  23 +++---
 3 files changed, 94 insertions(+), 79 deletions(-)

diff --git a/_dt/css/main.css b/_dt/css/main.css
index 0318582..d08fcb8 100644
--- a/_dt/css/main.css
+++ b/_dt/css/main.css
@@ -271,7 +271,7 @@ body {
 
 .advanced-options .adv li a {
   color: #d44549;
-  font-size: 1em;
+  font-size: 1.08em;
   padding: 5px 0;
 }
 
@@ -303,6 +303,27 @@ body {
   filter: alpha(opacity=50);
 }
 
+.adv .input-group {
+  padding: 5px 0;
+}
+
+.adv .input-group .input-group-addon {
+  border: 1px solid #d44549;
+  border-right: none;
+  background: white;
+  color: #d44549;
+}
+
+.adv .input-group .form-control {
+  border: 1px solid #d44549;
+  border-left: none;
+}
+
+.adv .input-group .form-control:focus {
+  box-shadow: none;
+  border-color: #c11f23;
+}
+
 /*************************************************/
 /************** template Ponentes ****************/
 /*************************************************/
@@ -506,7 +527,6 @@ body {
 .individual-menu {
   width: 100%;
   display: block;
-  height: 40px;
   text-align: center;
 }
 
diff --git a/templates/index.html b/templates/index.html
index db1eaf2..517b341 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -54,73 +54,73 @@ <h1>MENÚ</h1>
     </div>
     <div class="scrollable">
       <div class="menu-user col-sm-12">
-      <div class="col-sm-4">
-        <div class="gravatar">
-          {% if usuario.avatar %}
-          <img alt="avatar" src="gImagenUsuario?tipo=1&id={{ usuario.getKey() }}">
-          {% else %}
-          <img alt="avatar" src="/_dt/img/default_avatar.png">
-          {% endif %}
+        <div class="col-xs-4">
+          <div class="gravatar">
+            {% if usuario.avatar %}
+            <img alt="avatar" src="gImagenUsuario?tipo=1&id={{ usuario.getKey() }}">
+            {% else %}
+            <img alt="avatar" src="/_dt/img/default_avatar.png">
+            {% endif %}
+          </div>
         </div>
+        <div class="col-xs-8 name">
+          <h1><a href="/cuenta?id={{ usuario.getKey() }}">{{usuario.nombre}} {{usuario.apellidos}}</a></h1>
+        </div>
+        <div class="clearfix visible-xs-block"></div>
       </div>
-      <div class="col-sm-8 name">
-        <h1><a href="/cuenta?id={{ usuario.getKey() }}">{{usuario.nombre}} {{usuario.apellidos}}</a></h1>
-      </div>
-
-    </div>
       <div class="menu col-sm-12">
-      <h1 class="title-menu">Opciones</h1>
-      <ul class="nav menu-nav">
-        <li>
-          <a class="titulo-menu" href="/micuenta"><i class="fa fa-cog fa-fw"></i> Configuración</a>
-        </li>
-
-        <li class="dropdown">
-          <a class="titulo-menu dropdown-toggle" href="#" data-toggle="dropdown" role="button" aria-expanded="false">
-            <i class="fa fa-newspaper-o fa-fw"></i> Eventos <i class="fa2 fa fa-circle-o"></i>
-          </a>
-          <ul class="dropdown-menu" role="menu">
-            <li><a href="/miseventos"><i class="fa fa-circle fa-fw"></i> Mis Eventos ({{ info.numeroEventos }})</a></li>
-            <li><a href="/iEvento"><i class="fa fa-circle fa-fw"></i> Nuevo Evento</a></li>
-          </ul>
-        </li>
-
-        <li class="dropdown">
-          <a href="#" class="titulo-menu dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
-            <i class="fa fa-graduation-cap fa-fw">
-            </i> Ponentes <i class="fa2 fa fa-circle-o"></i>
-          </a>
-          <ul class="dropdown-menu" role="menu">
-            <li><a href="/misponentes"><i class="fa fa-circle fa-fw"></i> Mis Ponentes ({{ info.numeroPonentes }})</a></li>
-            <li><a href="/iPonente"><i class="fa fa-circle fa-fw"></i> Nuevo Ponente</a></li>
-          </ul>
-        </li>
-
-        <li class="dropdown">
-          <a class="titulo-menu dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" href="/misinformes">
-            <i class="fa fa-bar-chart fa-fw"></i> Informes <i class="fa2 fa fa-circle-o"></i>
-          </a>
-          <ul class="dropdown-menu" role="menu">
-            <li><a href="#"><i class="fa fa-circle fa-fw"></i> Por año</a></li>
-            <li><a href="#"><i class="fa fa-circle fa-fw"></i> Por mes</a></li>
-          </ul>
-        </li>
-      </ul>
-
-      <div class="divisor"></div>
-      <h1 class="title-menu">Redes sociales</h1>
-      <ul class="nav menu-nav">
-        <li><a class="titulo-menu" href="https://twitter.com/GrupoEvenge"><i class="fa fa-twitter fa-fw"></i> @GrupoEvenge</a></li>
-        <li><a class="titulo-menu" href="http://evenge.github.io"><i class="fa fa-newspaper-o fa-fw"></i> Blog</a></li>
-      </ul>
-
-      <h1 class="title-menu">Miscelanea</h1>
-      <ul class="nav menu-nav">
-        <li><a class="titulo-menu" href="https://github.com/evenge/EVENGE"><i class="fa fa-github fa-fw"></i> Fork GitHub</a></li>
-        <li><a class="titulo-menu" href="/logout"> <i class="fa fa-sign-out fa-fw"></i> Cerrar sesión</a></li>
-      </ul>
+        <h1 class="title-menu">Opciones</h1>
+        <ul class="nav menu-nav">
+          <li>
+            <a class="titulo-menu" href="/micuenta"><i class="fa fa-cog fa-fw"></i> Configuración</a>
+          </li>
 
-    </div>
+          <li class="dropdown">
+            <a class="titulo-menu dropdown-toggle" href="#" data-toggle="dropdown" role="button" aria-expanded="false">
+              <i class="fa fa-newspaper-o fa-fw"></i> Eventos <i class="fa2 fa fa-circle-o"></i>
+            </a>
+            <ul class="dropdown-menu" role="menu">
+              <li><a href="/miseventos"><i class="fa fa-circle fa-fw"></i> Mis Eventos ({{ info.numeroEventos }})</a></li>
+              <li><a href="/iEvento"><i class="fa fa-circle fa-fw"></i> Nuevo Evento</a></li>
+            </ul>
+          </li>
+
+          <li class="dropdown">
+            <a href="#" class="titulo-menu dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
+              <i class="fa fa-graduation-cap fa-fw">
+              </i> Ponentes <i class="fa2 fa fa-circle-o"></i>
+            </a>
+            <ul class="dropdown-menu" role="menu">
+              <li><a href="/misponentes"><i class="fa fa-circle fa-fw"></i> Mis Ponentes ({{ info.numeroPonentes }})</a></li>
+              <li><a href="/iPonente"><i class="fa fa-circle fa-fw"></i> Nuevo Ponente</a></li>
+            </ul>
+          </li>
+
+          <li class="dropdown">
+            <a class="titulo-menu dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" href="/misinformes">
+              <i class="fa fa-bar-chart fa-fw"></i> Informes <i class="fa2 fa fa-circle-o"></i>
+            </a>
+            <ul class="dropdown-menu" role="menu">
+              <li><a href="#"><i class="fa fa-circle fa-fw"></i> Por año</a></li>
+              <li><a href="#"><i class="fa fa-circle fa-fw"></i> Por mes</a></li>
+            </ul>
+          </li>
+        </ul>
+
+        <div class="divisor"></div>
+        <h1 class="title-menu">Redes sociales</h1>
+        <ul class="nav menu-nav">
+          <li><a class="titulo-menu" href="https://twitter.com/GrupoEvenge"><i class="fa fa-twitter fa-fw"></i> @GrupoEvenge</a></li>
+          <li><a class="titulo-menu" href="http://evenge.github.io"><i class="fa fa-newspaper-o fa-fw"></i> Blog</a></li>
+        </ul>
+
+        <h1 class="title-menu">Miscelanea</h1>
+        <ul class="nav menu-nav">
+          <li><a class="titulo-menu" href="https://github.com/evenge/EVENGE"><i class="fa fa-github fa-fw"></i> Fork GitHub</a></li>
+          <li><a class="titulo-menu" href="/logout"> <i class="fa fa-sign-out fa-fw"></i> Cerrar sesión</a></li>
+        </ul>
+
+      </div>
     </div>
   </nav>
   {% endif %}
diff --git a/templates/templateMyEvents.html b/templates/templateMyEvents.html
index 6e35ee4..1688c1b 100644
--- a/templates/templateMyEvents.html
+++ b/templates/templateMyEvents.html
@@ -41,25 +41,20 @@ <h1 class="adv-h1">Eventos</h1>
       </ul>
       <ul class="col-sm-3 col-xs-6 adv">
         <h1 class="adv-h1">Vista</h1>
-        <a href="/iPonente">
-          <span><i class="fa fa-graduation-cap"></i></span>
-          <small>Nuevo ponente</small>
-        </a>
+        <li><a href=""><i class="fa fa-th fa-fw"></i> Vista cuadrícula</a></li>
+        <li><a href=""><i class="fa fa-list fa-fw"></i> Vista lista</a></li>
       </ul>
       <ul class="col-sm-3 col-xs-6 adv">
         <h1 class="adv-h1">Fecha</h1>
-        <a href="/iPonente">
-          <span><i class="fa fa-graduation-cap"></i></span>
-          <small>Nuevo ponente</small>
-        </a>
+
       </ul>
-      <ul class="col-sm-3 col-xs-6 adv">
+      <div class="col-sm-3 col-xs-6 adv">
         <h1 class="adv-h1">Búsqueda</h1>
-        <a href="/iPonente">
-          <span><i class="fa fa-graduation-cap"></i></span>
-          <small>Nuevo ponente</small>
-        </a>
-      </ul>
+        <div class="input-group">
+          <span class="input-group-addon" id="basic-addon1"><i class="fa fa-search fa-fw"></i></span>
+          <input type="text" class="form-control" placeholder="Buscar..." aria-describedby="basic-addon1">
+        </div>
+      </div>
       <div class="clearfix visible-xs-block"></div>
     </div>
   </div>