) We can copy the CSS directly from here, but let??™s hold
off on that. Instead, let??™s continue to style the other components that we used in the Atom Reader.
The Style Explorer stores all the changes that we make for all the components, and we will be able to
copy all the CSS together into Flex Builder.
Figure 2-10. The CSS for our
button with two properties set
31
STYLING
Styling panels, text areas, and text inputs
As you??™ll recall, the other major components that we used in the previous chapter were the Panel,
TextArea, and TextInput.
5. Let??™s start with the Panel tab (Figure 2-12)??”select it now.
Figure 2-12. The Panel controls
The Panel tab has a few major areas that can be modified. There is the border, the area that surrounds
the white content area in the middle. You can set the border style (there are three options), the size,
and the color of this area. On top of this color we have the header and footer areas. These use a similar
combination of two colors and alpha fades to create a gradient, giving the panel a bit of depth on
the top and bottom. The Background Color and Background Alpha define the content area. Figure 2-13
shows an example of a Panel with many of the attributes modified.
You can modify the Title font using the Title Styles tab.
32
CHAPTER 2
Figure 2-13. Our modifed Panel component
6. Take some time out now to play with the panel styles.
Both the TextArea and TextInput components can be found in the Form Elements folder (Figure 2-14).
Pages:
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51