cksource-archive / samples-framework

☠☠☠ This repository is no longer used ☠☠☠
Other
0 stars 0 forks source link

button-a doesn't work properly on button element #26

Closed adelura closed 9 years ago

adelura commented 9 years ago

On <a> elements everything is fine as expected but with <button> elements it doesn't work for font and color style. The problem is because this styles are overwritten by this ones. I created https://github.com/cksource/samples-framework/compare/t/26 with example to show problem.

adelura commented 9 years ago

Solution is to make this selector less strict: from button to button:not( button-a ).

oleq commented 9 years ago

Is there any use case for it? I mean <button class="button-a">?

adelura commented 9 years ago

I've got buttons in toolbar configurator.

oleq commented 9 years ago

I pushed a commit to t/26b which does something similar to jQuery Mobile, e.g. it enforces component styles by increasing selector specificity (http://demos.jquerymobile.com/1.4.5/button-markup/)

a.button-a, button.button-a, input.button-a {} 

It looks like the easiest solution.


Anyway, as for https://github.com/cksource/samples-framework/blob/master/components/content/content.less#L72, they don't seem to work if you port some <select> and <textarea> from sdk.ckeditor.com. There's a solution for it in http://stackoverflow.com/questions/5345897/html-select-font-size, i.e.

input, select, textarea:not( .cke_source ), button {
    font: inherit;
    color: inherit;

    // This is to hack the default select appearance in Chrome.
    // See: http://stackoverflow.com/questions/5345897/html-select-font-size
    .box-shadow( 0 0 0 transparent );
    border-color: darken( @global-box-border-color, 10% );
}

This should be fixed in a separate ticket.