Jump to content
  • Sky
  • Blueberry
  • Slate
  • Blackcurrant
  • Watermelon
  • Strawberry
  • Orange
  • Banana
  • Apple
  • Emerald
  • Chocolate
  • Charcoal

Recommended Posts

Hola, bueno como dice el titulo será nuevo diseño de hovercard, y lo que se hará es cambiar un diseño puro css, osea que no utilizará js para ver las animaciones, trataré dejar un demo para que lo puedan comprobar...

 

Pero debo darla algunos detalles y estará.

 

EFA.png

 

Llevará el fondo de portada, como el mismo fondo que estan viendo, y en el caso que no lleve imagen de portada "de perfil" se colocará una imagen por defecto...

Compartir este post


Enlace al post
Compartir en otros sitios
hace 9 minutos, Altffenser dijo:

No sé pero... No queda xD

Eso depende, no específicamente tiene que usar ese diseño, para eso existe el CSS que se puede modificar tranquilamente y darle formato diferente, el que la quiere, que lo use el que no....No pasa nada, no están obligados a usarlos...

Compartir este post


Enlace al post
Compartir en otros sitios

no tiene sentido hacer un hovercard que le tengas que hacer otro hover aunque la animacion es buena la experiencia del usuario sera mala:S

Compartir este post


Enlace al post
Compartir en otros sitios
hace 16 horas, bits4me dijo:

no tiene sentido hacer un hovercard que le tengas que hacer otro hover aunque la animacion es buena la experiencia del usuario sera mala:S

Por esa razón está en extras, no es obligación... Los Extras son modificaciones para ser usadas o no! 

 

  • Me gusta 1

Compartir este post


Enlace al post
Compartir en otros sitios

  • Similar Content

    • Por Miguel92
      Bueno hace rato que no tocaba a MOZZFIRE v4.1.x ya que me encontraba ayudando en otros proyectos.
       
      CAMBIOS:
      + En los últimos posts el diseño de las "Card"
      + La anchura de la home al 100%
      + Reducción del registro
      + Notificaciones/Mensajes 
      + Diseño de la portada al ver el posts
       
      FALTA:
      - Diseño de los posts importantes
      - Perfil (nuevo) No estoy seguro si lo haré
      - Sidebar del home
      - Footer (nuevo)
       
      REGISTRO REDUCIDO (Se que se ve feo, pero funciona)

       
      AL ACCEDER A POST PRIVADO/ELIMINADO/INEXISTENTE

    • Por Miguel92
      Blog del Autor: https://pratikborsadiya.in/blog/vali-admin/
      Autor: Pratik Borsadiya
      Demo: https://pratikborsadiya.in/vali-admin/
       
      - Theme Vali con:
      -- Jquery v3.3.1
      -- Bootstra v4.1 (css | js)
       
      - Se ha modificado la estructura.
      -- Buscar en inc/class/c.core.php y debajo de
      $this->settings['css'] = $this->settings['tema']['t_url'].'/css'; $this->settings['js'] = $this->settings['tema']['t_url'].'/js'; Agregan lo siguiente
       
      $this->settings['va'] = $this->settings['tema']['t_url'].'/ValiAssets';
      - Se eliminaron archivos totalmente innecesarios y/o que no se usan!
      - Algunas cosas del theme las tome de mi theme anterior MozzFire porque básicamente era lo mismo así que copie y pegue jajaja
       
      Plugins que contiene del template original:
      -- Fliping Toggle Button
      ---------- Esto es puro css3 hace que el botón se voltee!
       
      -- Loarder Circular
      ---------- Esta hecho con SVG
       
      -- taginput.js
      ---------- No sé si se llamará así, pero me tome la libertad de tomarlo del theme Taringa V5 ya que me agradaba!
       
      -- main.js
      ---------- Inicialización de los complementos de Bootstrap 4
       
      -- jquery.countTo.min.js
      ---------- Contará hacia arriba (o hacia abajo) un número objetivo a una velocidad especificada, renderizado dentro de un elemento HTML DOM.
       
      -- pace.min.js
      ---------- Loader parecido al de Youtube
       
      -- select2.min.js
      ---------- Es una manera más rápida de buscar lo que deseas en el <select></select>
       
      -- jquery.dataTables.min.js
      -- dataTables.bootstrap.min.js
      ---------- Esto hace lo mismo que el select2 pero haciendo uso de las tablas, en vez de estar navegando buscando a un usuario por ejemplo, con este plugin solo basta escribir el nombre y listo ya lo tienes a la vista...

      pd: Y te olvidas del paginador original del script ya que este plugins ya trae uno incorporado!
       
      ENLACE ACTUALIZADO 21/03/18
      Descarga+Actualización desde MEGA
       
      Ver demoVideo
       
      Nota:
      Luego haré otra versión en el cual incuiré el smarty 3.1.32 para evitar el problema que se me paso por alto y evitan usar tanto {literal}...{/literal} y no importará si tienen esta versión o no!
       
       
      Fix del día: 21/06/2018 (si lo bajaste antes de la actualización haz esto)
      Abris el Vali/ValiAssets/js/acciones.js y debajo de
      var proc = Array(); if(!lang) var lang = Array(); pegas esto
      lang['error procesar'] = 'Error al intentar procesar lo solicitado'; lang['posts url categorias'] = 'posts'; lang['comunidades url'] = 'comunidades'; lang['html tema confirma borrar'] = "Seguro que deseas borrar este tema?"; y listo eso es todo..
       
      Fix del día: 15/07/2018
      Buscas en templates/modules/posts/m.posts_comments.tpl y en línea 40 hasta 44 reemplazas
      <script type="text/javascript"> $(document).ready(function(){ comentario.cargar({$tsPages.post_id}, 1, {$tsPages.autor}); }); </script> por este
      <script type="text/javascript">{literal} $(document).ready(function(){ comentario.cargar({$tsPages.post_id}, 1, {$tsPages.autor}); }); {/literal}</script>  
      si esto no llega a funcionar reemplazalo con este
      <script type="text/javascript"> // {literal} $(document).ready(function(){ /* top_cmt = $("#offset_cmts").offset().top; // function check_load(){ if (!comentario.cargado && $(window).scrollTop() + $(window).height() > top_cmt ) { // {/literal} */ comentario.cargar({$tsPages.post_id}, 1, {$tsPages.autor}); /* // {literal} comentario.cargado = true; } } $(window).scroll(check_load); check_load();*/ }); // {/literal} </script> otro cambio....
      en la misma carpeta en el archivo m.posts_content.tpl y buscas (línea 44)
      <section class="clearfix"> y la cambias por
      <section class="clearfix" style="padding-top: 50px;">  
      si el cuadrito sigue tapando un poco el post aumenta de 50 a 60 px o más en el caso que lo precises....
       
      Noticia: 07/09/2018:
      Al ver los comentarios me lleva a realizar una modificaciones al theme para evitar los problemas que se obtiene al querer subir una imagen al post, aunque no debe dar problemas ya que a mi me funciona bien, le quitaré algunas cosas ya que ahora lo veo demás en el theme.
      + Le pondré el mod de portadas y una forma de subir la portada desde la pc y no con url!
      + Haré cambios en el home.
      + Actualizaré a bootstrap a la última versión y a font awesome también.
      * Lo único que no se podrá hacer correctamente es poner color en los post ya que causa problemas con popper.min.js de bootstrap
      + Le agregaré la función al menú si el usuario quiere dejarlo desplegado o no.
       
       
    • Por Miguel92
      Theme original: hecho por @DarkMagican
       
      Se actualizó:
      - Theme AdminLTE por DarkMagican
      -- Jquery v1.7.1 a v3.3.1
      -- Bootstra v3.3.4 a v3.3.7 (css | js)
      -- AdminLTE 2.0 a 2.4 (con los complementos del mismo)
      -- Todos los js fuerón actualizados
      -- En este caso se ha dejado el autogrow
       
      ¿Porque con bootstrap 3.3.7 y no con bootrap 4.1?
      La verdad es que boostrap 4.1 ha sufrido muchos cambios(para bien) y al implementarlo deformaba todo el diseño y las funciones que tiene bs3 ya han sido eliminadas y es por esa razón que no use bs4 para poder actualizarlo.
       
      ¿Pero se puede hacer la actualización a bootstrap 4.1?
      Si pero esto llevará mucho tiempo y esfuerzo
       
      Se ha modificado la estructura.
      -- Buscar en inc/class/c.core.php y debajo de
      $this->settings['css'] = $this->settings['tema']['t_url'].'/css'; $this->settings['js'] = $this->settings['tema']['t_url'].'/js'; Agregan lo siguiente
      $this->settings['AdminLTE'] = $this->settings['tema']['t_url'].'/AdminLTE';  
      - Se cambio de lugar las redes sociales del posts.
       
      - Se integró el editor wysibb
       
      - Se eliminaron archivos totalmente innecesarios y/o que no se usan!
       
      En el caso que no se haya actualizado el iupload.php lo dejaré dentro del archivo y lo debe agregar en inc/php/
       
      Descargar Theme AdminLTE2.4
      Se instala con el mismo nombre.
      En el caso de encontrar errores por favor avisarme!
       
      Contiene un archivo leeme.txt que dice parte de este topic!
      Aviso es solo actualización, no he modificado el theme!
       
      ATENCIÓN: [No posee el archivo c.admin.php y c.registro.php] (actualizar registro topic actualizado)
      Se me olvido de poner el recaptcha v2 para el registro descargan este archivo AdminLTE2.4[registro] el cual solo tiene
      - registro.js [/js]
      - m.register-admin.tpl [/templates/modules/complementos]
      - m.admin_configs.tpl [/templates/admin_mods]
       
      30/05/2018
      He cometido un error he modificado el archivo m.register-admin.tpl y tenia que modificar el p.registro.form.tpl se puede comparar ambos archivos para realizar el cambio a p.registro.form.tpl con la ayuda de m.registrer-admin.tpl ya que ambos son muy similares..
       
      Acá le dejó en el caso que no quieran comparar, buscamos en p.registro.form.tpl
      <div class="input-group"> <label for="recaptcha_response_field">Ingresa el código de la imagen:</label> <div id="recaptcha_ajax"> <div id="recaptcha_image"></div> <input type="text" id="recaptcha_response_field" name="recaptcha_response_field" /> </div> <div class="help recaptcha"><span><em></em></span></div> </div> y la reemplazamos por
      <div class="input-group"> <label>Confirme humanidad:</label> <div class="g-recaptcha" data-sitekey="{$tsConfig.pkey}"></div> <div class="help"><span><em></em></span></div> </div> luego más abajo buscan
      y lo reemplazan por
      <script src="https://www.google.com/recaptcha/api.js" async defer></script> <script type="text/javascript"> $.getScript("{$tsConfig.js}/registro.js{literal}", function(){ registro.change_paso(1); mydialog.procesando_fin(); }); </script>  
      28/06/2018 (Hecho el día 03/06)
      Modificación para mostrar los iconos en los comentarios!

      Bueno para que aparezcan busca en AdminLTE->cool.css en la línea 1901
      background: url('images/sprite-comment.png') no-repeat; reemplazarlo con
      background: url('../images/sprite-comment.png') no-repeat;
  • Navegando Recientemente   0 miembros

    No registered users viewing this page.

  • Patrocinador



  • ×