Skip to content

facade assets css miplugin.css

Proyecto SIG Corporativo de la Junta de Andalucía edited this page Oct 3, 2017 · 1 revision

Este fichero contendrá los estilos necesarios para la interfaz del plugin, usados en su template, mediante la especificación CSS3. A partir de la definición de la clase 'm-plugin', que la herramienta genera automáticamente, se pueden añadir los estilos específicos de los elementos html. Esto podrá incluir también estilos para contenedores, paneles, y otros elementos que puedan existir, por ejemplo:

 .m-layerswitcher-container {
   position: absolute;
   top: 0.5em;
   right: 0.5em;
   text-align: left;
   overflow-y: auto !important;
   width: 100%;
}

.m-layerswitcher-container ul {
   padding-left: 0;
   list-style: none;
   margin: 0;
}

Mediante la regla @media, los plugins pueden ofrecer una interfaz diferente según las características del dispositivo que se esté usando. Esto permite por ejemplo establecer un estilo específico para móviles, donde el tamaño de la pantalla puede presentar limitaciones respecto a las interfaces de escritorio debido a sus dimensiones reducidas.

@media only screen and (max-width: 768px) {
    .m-areas > div.m-area > div.m-panel.m-attributions.opened > button.m-panel-btn {
      background-color: transparent !important;
      // ...
      // otros atributos css3
   }

En los plugins de Mapea se establece como norma general un ancho máximo de 768px para diferenciar entre interfaz móvil y de escritorio.