Bienvenido a aRgento - FeniX GT
Acá la pasas...
Bienvenido a aRgento - FeniX GT
Bienvenido a aRgento - FeniX GT
Bienvenido a aRgento - FeniX GT
Bienvenido a aRgento - FeniX GT
Bienvenido a aRgento - FeniX GT

1 2 3 4 5 6 7

Ultimas Novedades // Gadgets

Ultimas Noticias de Hard

 

Novedades // Game Reviews

Batman: Arkham Knight en PC Lanzamiento con muchas dificultades

Batman: Arkham Knight en PC Lanzamiento con muchas dificultades

Batman: Arkham Knight en PC Lanzamiento con muchas dificultades
Mientras que hace años los ...

Read more

Star Wars Battlefront, uno de los más impactantes juegos de la E3

Star Wars Battlefront, uno de los más impactantes juegos de la E3

Primer encuentro con el Star Wars Battlefront, uno de los más impactantes juegos de la E3
 ...

Read more

Nuevo DLC de Arma 3, Tanoa. para 2016 - PC

Nuevo DLC de Arma 3, Tanoa. para 2016 - PC

Tanoa: Nuevo DLC para  Arma 3 disponible para 2016 - PC
 
Bohemia ha mostrado oficia...

Read more

Battlefield Hardline, disponible para descarga

Battlefield Hardline, disponible para descarga


La nueva versión del popular título tiene a policías y delincuentes como protagonistas y agr...

Read more

SE MUESTRA EL MOTOR CRYENGINE EN LA GDC 2015

SE MUESTRA EL MOTOR CRYENGINE EN LA GDC 2015


Crytek mostró lo mejor de su motor CryEngine en el GDC de 2015, donde han revelado un par de...

Read more

Batman: Arkham Knight en PC Lanzamiento con muchas dificultades
Batman: Arkham Knight en PC Lanzamiento con muchas...
Star Wars Battlefront, uno de los más impactantes juegos de la E3
Star Wars Battlefront, uno de los más impactantes...
Nuevo DLC de Arma 3, Tanoa. para 2016 - PC
Nuevo DLC de Arma 3, Tanoa. para 2016...
Battlefield Hardline, disponible para descarga
Battlefield Hardline, disponible para descarga
SE MUESTRA EL MOTOR CRYENGINE EN LA GDC 2015
SE MUESTRA EL MOTOR CRYENGINE EN LA GDC...

Responsive Design

A responsive template that fits all devices

The big word for Joomla 3.0 is Bootstrap. With basic CSS already integrated into Joomla 3.0, it is aiming for a much better UX for the end-user. Moreover, BootStrap includes responsive CSS, which allows a website to fit all devices, screen size.

LayoutLayout WidthGridColumnGutter Width
Large Desktop min: 1200px 12 40px
Default min-980px, max-1199px 12 40px
Normal Desktop & Tablet min-768px, max-979px 12 40px
Mobile max-767px 12 20px

Live fluid grid example

The fluid grid system uses percents instead of pixels for column widths. It has the same responsive capabilities as our fixed grid system, ensuring proper proportions for key screen resolutions and devices.

1
1
1
1
1
1
1
1
1
1
1
1
4
4
4
4
8
6
6
12

The file bootstrap-responsive.less in folder: templates/ja_t3v3_blank/assets/less is to define media queries:

// RESPONSIVE CLASSES
// ------------------

@import "../../../plugins/system/jat3v3/t3v3base/bootstrap/less/responsive-utilities.less";


// MEDIA QUERIES
// ------------------

// Large desktops
@import "../../../plugins/system/jat3v3/t3v3base/bootstrap/less/responsive-1200px-min.less";

// Tablets to regular desktops
@import "../../../plugins/system/jat3v3/t3v3base/bootstrap/less/responsive-768px-979px.less";

// Phones to portrait tablets and narrow desktops
@import "../../../plugins/system/jat3v3/t3v3base/bootstrap/less/responsive-767px-max.less";


// RESPONSIVE NAVBAR
// ------------------

// From 979px and below, show a button to toggle navbar contents
@import "../../../plugins/system/jat3v3/t3v3base/bootstrap/less/component-animations.less";
@import "../../../plugins/system/jat3v3/t3v3base/bootstrap/less/responsive-navbar.less";

By default, the responsive files are located in: plugins/system/jat3v3/t3v3base/bootstrap/less

The list responsive files include:

  • responsive.less
  • responsive-767px-max.less
  • responsive-768px-979px.less
  • responsive-1200px-min.less
  • responsive-navbar.less
  • responsive-utilities.less
  • component-animations.less
  • responsive-navbar.less

Responsive utility classes

ClassMobile max-767pxTablets 768px to 979pxDesktop min-980px
.visible-phone Visible
.visible-tablet Visible
.visible-desktop Visible
.hidden-phone Visible Visible
.hidden-tablet Visible Visible
.hidden-desktop Visible Visible

Tablet and Regular Desktop Layout

The file responsive-768px-979px.less is the style file for Tablet and regular desktop layout. When the screen size is smaller than 979px and bigger than 768px, the template runs on the responsive-768px-979px.less file.

@media (min-width: 768px) and (max-width: 979px) {

// Fixed grid
#grid > .core(@gridColumnWidth768, @gridGutterWidth768);

// Fluid grid
#grid > .fluid(@fluidGridColumnWidth768, @fluidGridGutterWidth768);

// Input grid
#grid > .input(@gridColumnWidth768, @gridGutterWidth768);

// No need to reset .thumbnails here since it's the same @gridGutterWidth

}

Large Desktop Layout

The file responsive-1200px.less is the style file for large desktop layout (width size > 1200px} and regular desktop layout. When the screen size is smaller than 979px and bigger than 768px, the template runs on the responsive-1200px-min.less file.

@media (min-width: 1200px) {

// Fixed grid
#grid > .core(@gridColumnWidth1200, @gridGutterWidth1200);

// Fluid grid
#grid > .fluid(@fluidGridColumnWidth1200, @fluidGridGutterWidth1200);

// Input grid
#grid > .input(@gridColumnWidth1200, @gridGutterWidth1200);

// Thumbnails
.thumbnails {
margin-left: -@gridGutterWidth1200;
}
.thumbnails > li {
margin-left: @gridGutterWidth1200;
}
.row-fluid .thumbnails {
margin-left: 0;
}

}
  • Mobile Layout

    The file responsive-767px-max.less is the style file for Mobile layout. the elements are defined to fit the mobile device. When the screen size is smaller than 767px, the template runs on the responsive-767px-max.less file.

    • Logo is now on top
    • Menu is collapsed
    • One Column Content display
    • Modules blocks is in one column display as well
    • Responsive media (image, video, ...) are defined to fit the mobile layout.

Responsive CSS file

The file bootstrap-responsive.lessin folder: templates/ja_t3v3_blank/assets/less will be compiled to a CSS file named: bootstrap-responsive.css and the file is located in folder: plugins/system/jat3v3/t3v3base/bootstrap/css.

Novedades Juegos

Encuesta


Cual es tu vehículo favorito BF3?
Jet
Blindados
Helicoptero
Jeep
JetPack
1
2
1
2
1
2
1
2
1
2

Powered by you