Forms
- -CentOS Forms Visual Style Guide.
- -Table of contents
Elements
- - - -Recommendations
- --
-
- ... -
diff --git a/Identity/Webenv/App/Home/forms.html b/Identity/Webenv/App/Home/forms.html deleted file mode 100644 index 28eba79..0000000 --- a/Identity/Webenv/App/Home/forms.html +++ /dev/null @@ -1,422 +0,0 @@ - - - -
- - - - - - - - -CentOS Forms Visual Style Guide.
- -CentOS Forms Visual Style Guide.
+ +CentOS Headings Visual Style Guide.
- -<h1><a name="head-5871b1272673f7cf89bcaf48972c848a" href="#head-5871b1272673f7cf89bcaf48972c848a">Heading Level 1</a></h1>- -
<h2><a name="head-d33a28a4193cffb949f506cfdf770f05" href="#head-d33a28a4193cffb949f506cfdf770f05">Heading Level 2</a></h2>- -
<h3><a name="head-82dd23c665d8ee437a980459c8b80d7a" href="#head-82dd23c665d8ee437a980459c8b80d7a">Heading Level 3</a></h3>- -
<h4><a name="head-157dc030ea314f4b53a6ed238113a3f8" href="#head-157dc030ea314f4b53a6ed238113a3f8">Heading Level 4</a></h4>- -
<h5><a name="head-33628cc07bcbefc4e4732407b8680bf6" href="#head-33628cc07bcbefc4e4732407b8680bf6">Heading Level 5</a></h5>- -
<h6><a name="head-93b42a4a61a0b05a81aff6224555603c" href="#head-93b42a4a61a0b05a81aff6224555603c">Heading Level 5</a></h6>- -
As heading design recommendations:
- -When defining headings, make them accessible - using the following structure:
- -<h1><a name="head-a1811f6545db914813115417011b2df9">Heading</a></h1>- -
Where a1811f6545db914813115417011b2df9 is the - result of applying md5sum command to - Heading string. In this case, - Heading is the heading name.
- -Sometimes headings are used as links. For those - cases, use the following structure:
<h1><a href="#head-a1811f6545db914813115417011b2df9">Heading</a></h1>- -
or the following, if you want to make a heading an - anchor and link of itself:
- -<h1><a name="head-a1811f6545db914813115417011b2df9" href="#head-a1811f6545db914813115417011b2df9">Heading</a></h1>- -
Avoid using more than 4 levels of headings. If - you think you need to, you probably do; but consider - splitting your content in several pages instead. Too - many headings could affect your content - readability.
CentOS Headings Visual Style Guide.
+ +<h1><a name="head-5871b1272673f7cf89bcaf48972c848a" href="#head-5871b1272673f7cf89bcaf48972c848a">Heading Level 1</a></h1>+ +
<h2><a name="head-d33a28a4193cffb949f506cfdf770f05" href="#head-d33a28a4193cffb949f506cfdf770f05">Heading Level 2</a></h2>+ +
<h3><a name="head-82dd23c665d8ee437a980459c8b80d7a" href="#head-82dd23c665d8ee437a980459c8b80d7a">Heading Level 3</a></h3>+ +
<h4><a name="head-157dc030ea314f4b53a6ed238113a3f8" href="#head-157dc030ea314f4b53a6ed238113a3f8">Heading Level 4</a></h4>+ +
<h5><a name="head-33628cc07bcbefc4e4732407b8680bf6" href="#head-33628cc07bcbefc4e4732407b8680bf6">Heading Level 5</a></h5>+ +
<h6><a name="head-93b42a4a61a0b05a81aff6224555603c" href="#head-93b42a4a61a0b05a81aff6224555603c">Heading Level 5</a></h6>+ +
As heading design recommendations:
+ +When defining headings, make them accessible + using the following structure:
+ +<h1><a name="head-a1811f6545db914813115417011b2df9">Heading</a></h1>+ +
Where a1811f6545db914813115417011b2df9 is the + result of applying md5sum command to + Heading string. In this case, + Heading is the heading name.
+ +Sometimes headings are used as links. For those + cases, use the following structure:
<h1><a href="#head-a1811f6545db914813115417011b2df9">Heading</a></h1>+ +
or the following, if you want to make a heading an + anchor and link of itself:
+ +<h1><a name="head-a1811f6545db914813115417011b2df9" href="#head-a1811f6545db914813115417011b2df9">Heading</a></h1>+ +
Avoid using more than 4 levels of headings. If + you think you need to, you probably do; but consider + splitting your content in several pages instead. Too + many headings could affect your content + readability.
CentOS Links Visual Style Guide.
- -This is a common text link style
-This is a common nonexistant text link style
- -http://www.centos.org/. This is - the "www" and "http" link style. It is generally used to link - external sites.
- -centos-devel@centos.org. This - is the "mailto" link style. It is generally used to - display email addresses.
- -header-bg.jpg. This is the - "attachment" link style. It is generally used to display - an attachment.
- -CentOS Links Visual Style Guide.
+ +This is a common text link style
+This is a common nonexistant text link style
+ +http://www.centos.org/. This is + the "www" and "http" link style. It is generally used to link + external sites.
+ +centos-devel@centos.org. This + is the "mailto" link style. It is generally used to + display email addresses.
+ +header-bg.jpg. This is the + "attachment" link style. It is generally used to display + an attachment.
+ +CentOS Lists Visual Style Guide.
- -This section illustrates the visual style of unordered lists.
- -This section illustrates the visual style of ordered lists.
- -This section illustrates the visual style of definition lists.
- -Lists may also be nested and different list types may be - used together, as in the following example, which is a - definition list that contains an unordered list (the - ingredients) and an ordered list (the procedure):
- -CentOS Lists Visual Style Guide.
+ +This section illustrates the visual style of unordered lists.
+ +This section illustrates the visual style of ordered lists.
+ +This section illustrates the visual style of definition lists.
+ +Lists may also be nested and different list types may be + used together, as in the following example, which is a + definition list that contains an unordered list (the + ingredients) and an ordered list (the procedure):
+ +CentOS Pagination Visual Style Guide.
- -CentOS Pagination Visual Style Guide.
+ +CentOS Tables Visual Style Guide.
- -The HTML table model allows authors to arrange data -- - text, preformatted text, images, links, forms, form fields, - other tables, etc. -- into rows and columns of cells.
- -- | Average | -Red eyes |
- |
---|---|---|---|
height | -weight | -||
Males | -1.9 | -0.003 | -40% | -
Females | -1.7 | -0.002 | -43% | -
CentOS Tables Visual Style Guide.
+ +The HTML table model allows authors to arrange data -- + text, preformatted text, images, links, forms, form + fields, other tables, etc. -- into rows and columns of + cells.
+ ++ | Average | +Red eyes |
+ |
---|---|---|---|
height | +weight | +||
Males | +1.9 | +0.003 | +40% | +
Females | +1.7 | +0.002 | +43% | +
CentOS Texts Visual Style Guide.
- -Designates a fragment of computer code.
CentOS is an - Enterprise-class Linux Distribution derived from sources freely - provided to the public by a prominent North American Enterprise - Linux vendor. CentOS conforms fully with the upstream vendors - redistribution policy and aims to be 100% binary compatible. - (CentOS mainly changes packages to remove upstream vendor branding - and artwork.)
- -CentOS is developed by a small but growing team of core - developers. In turn the core developers are supported by an - active user community including system administrators, network - administrators, enterprise users, managers, core Linux - contributors and Linux enthusiasts from around the world.
- -CentOS has numerous advantages including: an active and growing - user community, quickly rebuilt, tested, and QA'ed errata - packages, an extensive mirror - network, developers who are contactable and responsive - reliable Enterprise Linux class distribution, multiple free - support avenues including a wiki, IRC - Chat, Email - Lists, Forums,and a - dynamic FAQ. -
- - -This is a small one-line pre formatted element.- -
This is a long one-line pre formatted element to illustrate how the content is scrollable when it doesn't fit the current screen area.- -
-- -The simplest quotation.
-<blockquote> - <p>The simplest quotation.</p> -</blockquote>-
-- -Tip
-The simplest quotation using heading.
-<blockquote> - <h3>Tip</h3> - <p>The simplest quotation using heading.</p> -</blockquote>-
- -- - - - - - - -Tip
-Simple quotations can be combined with color classes, icons - and headings to make your message more attractive. To set - quotation with icons, use the icon class in the - blockquote html tag. The heading is set using - h3 heading level.
-<blockquote class="icon orange"> - <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-idea.png" alt="Tip" /> - <h3>Tip</h3> - <p>This is a simple quotation with an icon.</p> -</blockquote>-The following color classes are available:
- --
- -- blue
-- orange
-- green
-- violet
-- red
-The following icon paths are available:
--
-- -- /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-idea.png -- -- /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-info.png -- -- /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-attention.png -- -- /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-alert.png -- -- /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-ruler.png -- -- /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-star.png -- -- /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-error.png -- -- /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-success.png -As you probably have noted, it is possible to use pre-formatted - texts, lists, tables and several paragraphs inside one admonition. - In fact, it is possible to use any html code inside admonitions. - Feel yourself free to experiment new combinations.
-
The Community Enterprise
- Operating System
is a GNU/Linux Distribution based on the
- freely available sources of a prominet Linux vendor.
<p>The <q cite="http://www.centos.org/">Community Enterprise -Operating System</q> is a GNU/Linux Distribution based on the freely -available sources of a prominet Linux vendor.</p>- -
John said, I saw Lucy at lunch, she told me
-
Mary wants you to get some ice cream on your
- way home.
I think I will get some at Ben and Jerry’s, on
- Gloucester Road.
<p>John said, <q lang="en-US">I saw Lucy at lunch, -she told me <q lang="en-US">Mary wants you to get some ice cream -on your way home.</q> I think I will get some at Ben and -Jerry’s, on Gloucester Road.</q></p>- -
In order to maintain a consistent quotation style, consider the - following recomendations:
- -- -- -Note
-Use this quotation style to remark notes inside your content.
-<blockquote class="icon blue"> - <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-info.png" alt="Note" /> - <h3>Note</h3> - <p>Use this quotation style to remark notes inside your content.</p> -</blockquote>-
- -- -Tip
-Use this quotation style to remark tips inside your content.
-<blockquote class="icon orange"> - <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-idea.png" alt="Tip" /> - <h3>Tip</h3> - <p>Use this quotation style to remark tips inside your content.</p> -</blockquote>-
- -- -Important
-Use this quotation style to remark important ideas inside your - content.
-<blockquote class="icon orange"> - <h3>Important</h3> - <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-star.png" alt="Important" /> - <p>Use this quotation style to remark important ideas inside your content.</p> -</blockquote>-
- -- -Convenction
-Use this quotation style to remark convenctions inside your - content.
-<blockquote class="icon orange"> - <h3>Convenction</h3> - <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-ruler.png" alt="Convenction" /> - <p>Use this quotation style to remark convenctions inside your content.</p> -</blockquote>-
- -- -Warning
-Use this quotation style to remark warnings inside your content.
-<blockquote class="icon orange"> - <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-alert.png" alt="Alert" /> - <h3>Warning</h3> - <p>Use this quotation style to remark warnings inside your content.</p> -</blockquote>-
- -- -Caution
-Use this quotation style to remark caution ideas inside your - content.
-<blockquote class="icon orange"> - <h3>Caution</h3> - <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-attention.png" alt="Important" /> - <p>Use this quotation style to remark caution ideas inside your content.</p> -</blockquote>-
CentOS Texts Visual Style Guide.
+ +Designates a fragment of computer code.
CentOS is an + Enterprise-class Linux Distribution derived from sources + freely provided to the public by a prominent North + American Enterprise Linux vendor. CentOS conforms fully + with the upstream vendors redistribution policy and aims + to be 100% binary compatible. (CentOS mainly changes + packages to remove upstream vendor branding and + artwork.)
+ +CentOS is developed by a small but growing team of core + developers. In turn the core developers are + supported by an active user community including system + administrators, network administrators, enterprise users, + managers, core Linux contributors and Linux enthusiasts + from around the world.
+ +CentOS has numerous advantages including: an active and + growing user community, quickly rebuilt, tested, and QA'ed + errata packages, an extensive mirror + network, developers who are contactable and responsive + reliable Enterprise Linux class distribution, multiple + free support avenues including a wiki, IRC + Chat, Email + Lists, Forums,and + a dynamic FAQ. +
+ + +This is a small one-line pre formatted element.+ +
This is a long one-line pre formatted element to illustrate how the content is scrollable when it doesn't fit the current screen area.+ +
++ +The simplest quotation.
+<blockquote> + <p>The simplest quotation.</p> +</blockquote>+
++ +Tip
+The simplest quotation using heading.
+<blockquote><h3>Tip</h3> + <p>The simplest quotation using heading.</p> +</blockquote>+
+ ++ + + + + + + +Tip
+Simple quotations can be combined with color classes, icons + and headings to make your message more attractive. To set + quotation with icons, use the icon class in the + blockquote html tag. The heading is set using + h3 heading level.
+<blockquote class="icon orange"> + <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-idea.png" alt="Tip" /> + <h3>Tip</h3> + <p>This is a simple quotation with an icon.</p> +</blockquote>+The following color classes are available:
+ ++
+ +- blue
+- orange
+- green
+- violet
+- red
+The following icon paths are available:
++
++ ++ /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-idea.png ++ ++ /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-info.png ++ ++ /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-attention.png ++ ++ /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-alert.png ++ ++ /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-ruler.png ++ ++ /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-star.png ++ ++ /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-error.png ++ ++ /home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-success.png +As you probably have noted, it is possible to use pre-formatted + texts, lists, tables and several paragraphs inside one admonition. + In fact, it is possible to use any html code inside admonitions. + Feel yourself free to experiment new combinations.
+
The Community Enterprise
+ Operating System
is a GNU/Linux Distribution based on the
+ freely available sources of a prominet Linux vendor.
<p>The <q cite="http://www.centos.org/">Community Enterprise +Operating System</q> is a GNU/Linux Distribution based on the freely +available sources of a prominet Linux vendor.</p>+ +
John said, I saw Lucy at lunch, she told me
+
Mary wants you to get some ice cream on your
+ way home.
I think I will get some at Ben and Jerry’s, on
+ Gloucester Road.
<p>John said, <q lang="en-US">I saw Lucy at lunch, +she told me <q lang="en-US">Mary wants you to get some ice cream +on your way home.</q> I think I will get some at Ben and +Jerry’s, on Gloucester Road.</q></p>+ +
In order to maintain a consistent quotation style, consider the + following recomendations:
+ ++ ++ +Note
+Use this quotation style to remark notes inside your content.
+<blockquote class="icon blue"> + <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-info.png" alt="Note" /> + <h3>Note</h3> + <p>Use this quotation style to remark notes inside your content.</p> +</blockquote>+
+ ++ +Tip
+Use this quotation style to remark tips inside your content.
+<blockquote class="icon orange"> + <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-idea.png" alt="Tip" /> + <h3>Tip</h3> + <p>Use this quotation style to remark tips inside your content.</p> +</blockquote>+
+ ++ +Important
+Use this quotation style to remark important ideas inside your + content.
+<blockquote class="icon orange"> + <h3>Important</h3> + <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-star.png" alt="Important" /> + <p>Use this quotation style to remark important ideas inside your content.</p> +</blockquote>+
+ ++ +Convenction
+Use this quotation style to remark convenctions inside your + content.
+<blockquote class="icon orange"> + <h3>Convenction</h3> + <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-ruler.png" alt="Convenction" /> + <p>Use this quotation style to remark convenctions inside your content.</p> +</blockquote>+
+ ++ +Warning
+Use this quotation style to remark warnings inside your content.
+<blockquote class="icon orange"> + <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-alert.png" alt="Alert" /> + <h3>Warning</h3> + <p>Use this quotation style to remark warnings inside your content.</p> +</blockquote>+
+ ++ +Caution
+Use this quotation style to remark caution ideas inside your + content.
+<blockquote class="icon orange"> + <h3>Caution</h3> + <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/icon-admonition-attention.png" alt="Important" /> + <p>Use this quotation style to remark caution ideas inside your content.</p> +</blockquote>+