search

vaadin / sass-compiler

A Java Sass compiler implementation
53 stars 25 forks source link

Regression in SASS compiler in 7.3.8 that breaks valo-menu responsive behavior #287

Closed vaadin-bot closed 9 years ago

vaadin-bot commented 9 years ago

Originally by inahas

In 7.3.8 the SASS compiler generates invalid specification for valo menus which breaks its responsive behavior.

Using the Quicktickets-dashboard application as an example:

In 7.3.7, the generated styles.css contains the following:

.v-vaadin-version:after {
    content: "7.3.7";
}

...

.dashboard .v-ui[width-range~="801px-1100px"] .valo-menu-part {
    background-color: #414B56;
    min-width: 74px;
    max-width: 111px;
}

.dashboard .v-ui[width-range~="801px-1100px"] .valo-menu-part .valo-menu-title {
    font-size: 12px;
}

.dashboard .v-ui[width-range~="801px-1100px"] .valo-menu-part .valo-menu-title .v-label-undef-w {
    white-space: normal;
}

... several other similar blocks

However, in 7.3.8, the same theme generates the following:

.v-vaadin-version:after {
    content: "7.3.8";
}

...

.dashboard .v-ui.valo-menu-responsive[width-range~="801px-1100px"] .valo-menu-part {
    background-color: #414B56;
    min-width: 74px;
    max-width: 111px;
}

.dashboard .v-ui.valo-menu-responsive[width-range~="801px-1100px"] .valo-menu-part .valo-menu-title {
    font-size: 12px;
}

.dashboard .v-ui.valo-menu-responsive[width-range~="801px-1100px"] .valo-menu-part .valo-menu-title .v-label-undef-w {
    white-space: normal;
}

... several other similar blocks with the same change

The additional ".valo-menu-responsive" designation makes the specification unrecognizable by the browser.

Imported from https://dev.vaadin.com/ issue #16473

vaadin-bot commented 9 years ago

Originally by inahas

Just tested this in 7.3.9 and 7.4.0beta1 and the issue still exists.

In fact, the project that gets created using the maven archetype 'vaadin-archetype-application' produces an application that doesn't work properly when the browser is resized.

vaadin-bot commented 9 years ago

Originally by @jouni

Actually, this is not a defect, but a change in the framework because of #14679

So the additional .valo-menu-responsive is the new ValoTheme.UI_WITH_MENU style that you need to add to your UI instance in order to make the responsive menu work.

vaadin-bot commented 9 years ago

Originally by inahas

Sounds good. So it's a documentation issue.

You probably should update the maven archetype project and the dashboard demos to use the new convention because most people will want to use the most recent version of Vaadin when building a new project.

vaadin-bot commented 9 years ago

Originally by @jouni

Indeed. This change was not communicated very well, even within the company.

I created a ticket for the archetype: #16528. The Dashboard demo has been updated a while ago already when it updated to Vaadin 7.3.8.