Motivation of this specification is to improve close button located in the tabs in Editor. Our users usually critize the proportions of close button. They think the close button is to small. Besides of proportions of the close button some users critize quantity of close button in the non active tabs. In non active tabs the IDE shows this icon . Each tab has this icon. Quantity of this icon doesn't look nice.
Goal
The goal of this specification is to improve appearance of the close button.
The close button appearance and behavior
During the work on this specification I found 3 variants of solutions for the close button. This is reason why this specification has three chapters. Each chapter = Variant shows appearance and behavior of the close button. The main difference between all of variants is in the visibility of close buttons on the non-active tabs. Therefore each version has number and description of difference.
Variant 3 - Close buttons visible on mouse over, the place for close button not reserved
Table of variants
State
Appearance of close button
non active
mouse over /pressed
active tab - mouse over/ pressed
selected tab
Variant 1
Variant 2
Variant 3
Variant 1
The current close button for non active tab Figure 1 we will change on less contrast button Figure 2. If we implement the still visible close buttons, the less contrast button will look better like current.
Figure 1
Figure 2
The colors of the close button (when we will implement always visible close button)
The appearance of editor tabs
All close buttons are always visible
The flash model
Variant 2
The appearance of editor tabs
All close buttons are visible only on the active tab. The places for close button are reserved in all tabs.
The flash model
Variant 3
The appearance of editor tabs
All close buttons are visible only on the active tab. The tabs don't have reserved place for close button in the not active state.