Estilo CSS SuperHero de Bootstrap

Author: danielgara - Date: 2013-01-07 01:24:36
 
Gracias a los estilos bootswatch y con unas pequeñas modificaciones que se detallan a continuación podemos usar la aplicación con estilo SuperHero

bootstrap-superhero282157.jpg

Para cambiar tu estilo se deben:
  1. Descargar estos 2 archivos: bootstrap-superhero.css y t_dark_superhero.css y copiarlos en la carpeta work/css/
  2. Modificar el archivo header.tpl de la ruta work/templates/t_dark/header.tpl de la siguiente manera
    • Buscar la linea:
      Code:
      <style type="text/css"> @import url({/literal}{$gvar.l_global}{literal}css/bootstrap.css); </style>
      Y reemplazarla por:
      Code:
      <style type="text/css"> @import url({/literal}{$gvar.l_global}{literal}css/bootstrap-superhero.css); </style>
    • Buscar la linea:
      Code:
      <style type="text/css"> @import url({/literal}{$gvar.l_global}{literal}css/t_dark.css); </style>
      Y reemplazarla por:
      Code:
      <style type="text/css"> @import url({/literal}{$gvar.l_global}{literal}css/t_dark_superhero.css); </style>
    • Buscar el inicio y el final de la navegación:
      Code:
      <!-- Begin Navigation --> ----- <!-- End Navigation -->
      Y reemplazar todo su contenido por:
      Code:
      <br /> <ul class="breadcrumb"> {section name=i loop=$where}{if !empty($where[i].link)} <li><a href="{$where[i].link}">{/if}{$where[i].name} {if !empty($where[i].link)}</a></li>{/if} {if $smarty.section.i.total == 1} {else}{if $smarty.section.i.rownum == $smarty.section.i.total}{else} <li><span class="divider">/</span> </li> {$i.index}{/if}{/if} {/section} </ul>

Finalmente accedemos a localhost/work/ y actualizamos el navegador y veremos nuestro nuevo estilo.

Comments

Alerts There are not comments, be the first
Alerts To post comments, you must be a registered