gomita / tabscope

Tab Scope, a Firefox extension.
http://www.xuldev.org/tabscope/
Other
17 stars 9 forks source link

Restore Aero Glass support #45

Open Infocatcher opened 10 years ago

Infocatcher commented 10 years ago

Also suggested here: https://addons.mozilla.org/addon/tab-scope/reviews/user:1735045 And here: https://addons.mozilla.org/addon/tab-scope/reviews/493762/

I think, extension should use system or browser appearance (if possible, of course).

Let's see. This is Windows 7 with Tab Scope 1.2: Screenshot: Windows 7 + Tab Scope 1.2 Style of Tab Scope's popup/panel is very similar to window style.

And now Windows 7 with Tab Scope 1.3.3: Screenshot: Windows 7 + Tab Scope 1.3.3 May be good on Windows 8, but looks a bit "not from here" on Windows 7.

Also I tried to write style for userChrome.css, but unfortunately still see strange glitch on bottom-right corner: Screenshot: Windows 7 + Tab Scope 1.3.3 + custom CSS Style:

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@-moz-document url("chrome://browser/content/browser.xul") {
    /* Aero glass for Tab Scope 1.3.3+, based on styles from Tab Scope 1.2 */
    #tabscope-popup:-moz-system-metric(windows-compositor) {
        background: transparent !important;
        -moz-appearance: -moz-win-glass !important;
        box-shadow: none !important;
        border: none !important;
        border-radius: 0 !important;
        color: black !important;
        text-shadow: white -1px -1px .5em, white -1px 1px .5em, white 1px 1px .5em, white 1px -1px .5em !important;
    }
    #tabscope-container:-moz-system-metric(windows-compositor) {
        margin: 1px !important;
        background: transparent !important;
        -moz-appearance: none !important;
        box-shadow: none !important;
        border: none !important;
        border-radius: 0 !important;
    }
}

So, I propose to restore glass for Windows 7 and leave new flat style for Windows 8.

gomita commented 10 years ago

I can take back the Aero Glass support. However there is a problem, if the 'Popup fade-in / fade-out' option which was added to ver.1.3.3 is enabled, the popup opens a bit strangely. So, I have a plan to make the Aero Glass as an option and if you enable it, 'Popup fade-in / fade-out' option will be disabled forcibly.

Infocatcher commented 10 years ago

So, I have a plan to make the Aero Glass as an option and if you enable it, 'Popup fade-in / fade-out' option will be disabled forcibly.

Sounds like a good solution, thanks. Also you can try to use opacity for fade-in/fade-out animation, pseudo code:

#tabscope-popup[animation] {
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}
#tabscope-popup[animation][visible] {
    opacity: 1;
}
gomita commented 10 years ago

You can try a new beta version here: http://www.xuldev.org/tabscope/tabscope-1.5a1.xpi

Now we can choose 'Popup Appearance' from 'Flat (Default)', 'Dark' and 'Aero Glass'. Note that 'Aero Glass' doesn't apply immediately, you should open a new window.

popupappearance

Infocatcher commented 10 years ago

http://www.xuldev.org/tabscope/tabscope-1.5a1.xpi

Thanks! Missing all three tabscope.popup_style* entities in all locales, but all other works fine, if I replace them.

Note that 'Aero Glass' doesn't apply immediately, you should open a new window.

Oh, yes, I noticed this when tried to write custom CSS using Stylish. :)

Infocatcher commented 10 years ago

Could you please also use #tabscope-popup selector to change font styles? I don't like to copy parts of your styles into my Tab Scope Tweaker... E.g.

#tabscope-title {
    ...
    color: -moz-DialogText;
}

=>

#tabscope-popup {
    ...
    color: -moz-DialogText;
}

And

#tabscope-popup[_style="dark"] #tabscope-title {
    color: rgb(166,166,166) !important;
}

=>

#tabscope-popup[_style="dark"] {
    color: rgb(166,166,166) !important;
}
gomita commented 10 years ago

I have just uploaded ver.1.5a2. http://www.xuldev.org/tabscope/tabscope-1.5a2.xpi

Infocatcher commented 10 years ago

Thanks! Also should be

#tabscope-popup:not([_os="Mac"]) #tabscope-container {
    margin: 0 0 4px 0 !important;
}

instead of 0 4px 4px 0 for Aero Glass style.

gomita commented 10 years ago

I think we need margin-right: 4px for the shadow right-side of the popup.

Infocatcher commented 10 years ago

I see following (as is => with margin: 0 0 4px 0): Default theme: Default theme => Default theme + style

Modified theme (from screenshots in my first post): My theme => My theme + style

Windows 7 SP 1, Firefox 22.0.

gomita commented 10 years ago

I understand what does it mean. I have just uploaded ver.1.5a3. http://www.xuldev.org/tabscope/tabscope-1.5a3.xpi