¿Combinar puntos de interrupción de diseño en Compass Susy?

Estoy empezando a usar Susy

He definido mis diseños, necesitaba comenzar con la versión de escritorio y agregar 2 más: uno para tabletas y otro para teléfonos:

$total-columns  : 12;
$column-width   : 4em;
$gutter-width   : 1.4em;
$grid-padding   : $gutter-width;

$phone: 4 35em;
$tablet: 35em 8 70em;

Parece estar funcionando. Mis problemas surgen cuando hay un cambio que necesito hacer en algo que debería aparecer en el escritorio pero no en NINGUNO de los otros 2, me encuentro repitiendo:

#my-div {
@include span-columns(3 omega,7);
     @include at-breakpoint($tablet) {
    display:none;
    }
 @include at-breakpoint($phone) {
    display:none;
    }
}

¿Cómo puedo simplificar esto?

preguntado el 12 de junio de 12 a las 18:06

1 Respuestas

En ese caso, no necesita susy, solo necesita una consulta de medios CSS básica con un ancho máximo de 70 em. la única razón para at-breakpoint es obtener una combinación de consulta de medios/cambio de diseño. Alternativamente, agregue '$pequeño: 8 70em;' y usa eso.

Respondido el 15 de junio de 12 a las 08:06

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.