-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathstyle-guide.html
189 lines (153 loc) · 21.5 KB
/
style-guide.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
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
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
<!DOCTYPE html>
<html lang="en-US"><!-- Events Wrapper --><head><meta http-equiv="content-type" content="text/html; charset=utf-8"><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"><link rel="profile" href="http://gmpg.org/xfn/11"><link rel="pingback" href="http://www.battlegroundtexas.com/xmlrpc.php"><link rel="icon" type="image/x-icon" href="http://www.battlegroundtexas.com/wp-content/uploads/2015/06/favicon.ico"><title>Battleground Texas | Style Guide</title><link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet"><link rel="stylesheet" href="proparty-style.css" type="text/css" media="all">
<link rel="stylesheet" href="proparty-skin.css" type="text/css" media="all"><link rel="stylesheet" href="proparty-child-style.css" type="text/css" media="all"><link rel="canonical" href="http://join.battlegroundtexas.com/page/content/style-guide/"><script type="text/javascript"></script></head><body>
<div class="body_wrap">
<div class="page_wrap">
<header class="top_panel_wrap"><div class="menu_user_wrap top-bar-menu">
<div class="content_wrap clearfix">
<div class="menu_user_area menu_user_right menu_user_nav_area">
<ul id="menu_user" class="menu_user_nav"><li id="menu-item-4269" class="header_social_icons menu-item menu-item-type-custom menu-item-object-custom menu-item-4269">
<a href="http://www.facebook.com/battlegroundtexas"><img src="http://www.battlegroundtexas.com/wp-content/themes/proparty/images/social/facebook_header_icon.png"></a></li>
<li id="menu-item-4270" class="header_social_icons menu-item menu-item-type-custom menu-item-object-custom menu-item-4270"><a href="https://twitter.com/intent/user?screen_name=bgtx"><img src="http://www.battlegroundtexas.com/wp-content/themes/proparty/images/social/twitter_header_icon.png"></a></li>
<li id="menu-item-4271" class="header_social_icons menu-item menu-item-type-custom menu-item-object-custom menu-item-4271"><a href="https://www.instagram.com/bgtxpics/"><img src="http://www.battlegroundtexas.com/wp-content/themes/proparty/images/social/instagram_header_icon.png"></a></li>
<li id="menu-item-4272" class="header_social_icons header_social_icons_last menu-item menu-item-type-custom menu-item-object-custom menu-item-4272"><a href="https://www.youtube.com/user/BattlegroundTexas"><img src="http://www.battlegroundtexas.com/wp-content/themes/proparty/images/social/youtube_header_icon.png"></a></li>
<li id="menu-item-4225" class="donate-now menu-item menu-item-type-custom menu-item-object-custom menu-item-4225"><a href="https://secure.battlegroundtexas.com/page/contribute/donate-1">Donate Now</a></li>
</ul></div> <!-- menu_user_area menu_user_right -->
</div> <!-- content_wrap -->
</div> <!-- menu_user_wrap -->
<div class="content_wrap nav-container">
<div class="logo">
<a href="http://www.battlegroundtexas.com"><img src="http://www.battlegroundtexas.com/wp-content/uploads/2016/04/logo.png" class="logo_main" alt="Battleground Texas Logo"></a>
</div> <!-- logo -->
<nav role="navigation" class="main-nav Xmenu_main_nav_area"><label for="show-menu" class="menu-toggle"></label>
<input type="checkbox" class="menu_main_responsive_button" id="show-menu" role="button"><ul id="menu_main" class="menu_main_nav"><li><a href="http://www.battlegroundtexas.com/">Home</a></li>
<li><a href="http://www.battlegroundtexas.com/about-us/">About</a></li>
<li><a href="http://join.battlegroundtexas.com/page/s/get-involved">Get Involved</a></li>
<li><a href="http://battletx.bluestatedigital.com/page/event/search_simple">Events</a></li>
<li><a href="http://www.battlegroundtexas.com/blog/">Blog</a></li>
<li><a href="https://secure.battlegroundtexas.com/page/contribute/donate-1">Donate</a></li>
<li><a href="http://store.battlegroundtexas.com/">Store</a></li>
</ul></nav></div><!-- .content_wrap -->
</header><div class="page_content_wrap wrap_custom">
<div class="content_wrap">
<div class="content">
<h1>CSS Basic Elements</h1>
<p>The purpose of this HTML is to help determine what default settings are with CSS and to make sure that all possible HTML Elements are included in this HTML so as to not miss any possible Elements when designing a site.</p>
<hr><h1 id="headings">Headings</h1>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
<hr><h1 id="paragraph">Paragraph</h1>
<p>Lorem ipsum dolor sit amet, <a href="#" title="test link">test link</a> adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.</p>
<p>Lorem ipsum dolor sit amet, <em>emphasis</em> consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.</p>
<hr><h1 id="list_types">List Types</h1>
<h3>Definition List</h3>
<dl><dt>Definition List Title</dt>
<dd>This is a definition list division.</dd>
</dl><h3>Ordered List</h3>
<ol><li>List Item 1</li>
<li>List Item 2</li>
<li>List Item 3</li>
</ol><h3>Unordered List</h3>
<ul><li>List Item 1</li>
<li>List Item 2</li>
<li>List Item 3</li>
</ul><hr><h1 id="form_elements">Fieldsets, Legends, and Form Elements</h1>
<fieldset><legend>Legend</legend>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus.</p>
<form name="signup" class="bsd-signup-4" action="#" method="post" id="signup">
<table id="signuptable"><tbody><tr><td>
<table width="100%"><tbody><tr><td valign="top">
<div class="fieldset" id="bsd-field-email">
<div class="label"><label class="field">Email<span class="required">*</span></label></div>
<div class="input"><input type="email" class="text" size="48" id="email" name="email"></div></div>
</td></tr></tbody></table></td></tr><tr><td><table width="100%"><tbody><tr><td valign="top">
<div class="fieldset" id="bsd-field-firstname">
<div class="label"><label class="field">First Name / Nombre</label></div>
<div class="input"><input size="16" id="firstname" name="firstname" type="text"></div></div>
</td></tr></tbody></table></td></tr><tr><td><table width="100%"><tbody><tr><td valign="top">
<div class="fieldset" id="bsd-field-lastname">
<div class="label"><label class="field">Last Name / Apellido</label></div>
<div class="input"><input size="25" id="lastname" name="lastname" type="text"></div></div>
</td></tr></tbody></table></td></tr><tr><td><table width="100%"></table></td></tr><tr><td><table width="100%"><tbody><tr><td valign="top">
<div class="fieldset" id="bsd-field-zip">
<div class="label"><label class="field">Zip / Código Postal<span class="required">*</span></label></div>
<div class="input"><input size="8" id="zip" name="zip" type="text"></div></div>
</td></tr></tbody></table></td></tr><tr><td><table width="100%"><tbody><tr><td valign="top">
<div class="fieldset" id="bsd-field-phone">
<div class="label"><label class="field">Phone / Teléfono</label></div>
<div class="input"><input type="tel" class="text" size="15" id="phone" name="phone"></div></div>
</td></tr></tbody></table></td></tr><tr><td><table width="100%"><tbody><tr><td valign="top">
<div class="fieldset" id="bsd-field-custom-51-group">
<div class="label"><label class="field">I'm interested in: / Estoy interesado en:<span class="required">*</span></label></div>
<div class="input"><input id="custom-51_0" class="custom-51" name="__custom-51[0]" type="checkbox" value="1" onclick="if (this.checked) { this.form['custom-51[0]'].value='Getting deputized to register voters / Obtener la certificación necesaria para registrar a votantes'; }else { this.form['custom-51[0]'].value=''; } "><label for="custom-51_0">Getting deputized to register voters / Obtener la certificación necesaria para registrar a votantes<br></label><input type="hidden" name="custom-51[0]" value=""><input id="custom-51_1" class="custom-51" name="__custom-51[1]" type="checkbox" value="1" onclick="if (this.checked) { this.form['custom-51[1]'].value='Calling Texans to build support for Battleground Texas / Hacer llamadas telefónicas invitando a la gente a formar parte de Battleground Texas'; }else { this.form['custom-51[1]'].value=''; } "><label for="custom-51_1">Calling Texans to build support for Battleground Texas / Hacer llamadas telefónicas invitando a la gente a formar parte de Battleground Texas<br></label><input type="hidden" name="custom-51[1]" value=""><input id="custom-51_2" class="custom-51" name="__custom-51[2]" type="checkbox" value="1" onclick="if (this.checked) { this.form['custom-51[2]'].value='Hosting an organizer or intern in my home / Hacer disponible mi hogar para que se lleve a cabo un evento de Battleground Texas'; }else { this.form['custom-51[2]'].value=''; } "><label for="custom-51_2">Hosting an organizer or intern in my home / Hacer disponible mi hogar para que se lleve a cabo un evento de Battleground Texas<br></label><input type="hidden" name="custom-51[2]" value=""><input id="custom-51_3" class="custom-51" name="__custom-51[3]" type="checkbox" value="1" onclick="if (this.checked) { this.form['custom-51[3]'].value='Becoming a Neighborhood Team Leader / Ser un organizador en mi vecindario'; }else { this.form['custom-51[3]'].value=''; } "><label for="custom-51_3">Becoming a Neighborhood Team Leader / Ser un organizador en mi vecindario<br></label><input type="hidden" name="custom-51[3]" value=""><input id="custom-51_4" class="custom-51" name="__custom-51[4]" type="checkbox" value="1" onclick="if (this.checked) { this.form['custom-51[4]'].value='Donating to Battleground Texas / Donar a Battleground Texas'; }else { this.form['custom-51[4]'].value=''; } "><label for="custom-51_4">Donating to Battleground Texas / Donar a Battleground Texas<br></label><input type="hidden" name="custom-51[4]" value=""><input id="custom-51_5" class="custom-51" name="__custom-51[5]" type="checkbox" value="1" onclick="if (this.checked) { this.form['custom-51[5]'].value='Other / Otra'; }else { this.form['custom-51[5]'].value=''; } "><label for="custom-51_5">Other / Otra<br></label><input type="hidden" name="custom-51[5]" value=""></div></div>
</td></tr></tbody></table></td></tr><tr><td><table width="100%"><tbody><tr><td valign="top">
<div class="fieldset" id="bsd-field-custom-52">
<div class="label"><label class="field">If you selected "Other", please let us know how you'd like to help / Si selecciono "Otra," por favor díganos de que manera le gustaría participar:</label></div>
<div class="input"><input size="10" id="custom-52" name="custom-52" type="text"></div></div>
</td></tr></tbody></table></td></tr><tr><td><table width="100%"><tbody><tr><td valign="top">
<div class="fieldset">
<div class="label custom-1573"><label class="field">Hablo español</label></div>
<div class="input"><input id="custom-1573" name="custom-1573" type="checkbox" value="1"><label for="custom-1573"><label class="field"></label></label></div></div>
</td></tr></tbody></table></td></tr><tr><td><div style="display: none"><label for="best-contact-time">Please leave this field blank:</label> <input id="best-contact-time" name="best-contact-time" type="text"></div><table width="100%"><tbody><tr><td valign="top">
<div class="fieldset" id="bsd-field-submit-btn">
<div class="label"><label class="field"></label></div>
<div class="input"><input name="submit-btn" value="Join Us" type="submit"></div></div>
</td></tr></tbody></table></td></tr><tr><td><table width="100%"><tbody><tr><td id="required_note"><span class="required">*</span><span style="font-size: 80%;"> denotes required field</span></td></tr><input name="country" type="hidden" value="US"><input name="redirect_url" type="hidden" value=""><input id="_guid" name="_guid" type="hidden" value=""></tbody></table></td>
</tr></tbody></table></form>
<form method="post" action="#">
<h2>Form Element</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui.</p>
<p><label for="text_field">Text Field:</label><br><input type="text" id="text_field" name="text_field"></p>
<p><label for="text_area">Text Area:</label><br><textarea id="text_area" name="textarea" rows="5" cols="20"></textarea></p>
<p><label for="select_element">Select Element:</label><br><select name="select_element" id="select_element"><optgroup label="Option Group 1"><option value="1">Option 1</option><option value="2">Option 2</option><option value="3">Option 3</option></optgroup><optgroup label="Option Group 2"><option value="1">Option 1</option><option value="2">Option 2</option><option value="3">Option 3</option></optgroup></select></p>
<p><label>Radio Buttons:</label><br><input type="radio" class="radio" name="radio_button" value="radio_1"> Radio 1<br><input type="radio" class="radio" name="radio_button" value="radio_2"> Radio 2<br><input type="radio" class="radio" name="radio_button" value="radio_3"> Radio 3<br></p>
<p><label>Checkboxes:</label><br><input type="checkbox" class="checkbox" name="checkboxes" value="check_1"> Radio 1<br><input type="checkbox" class="checkbox" name="checkboxes" value="check_2"> Radio 2<br><input type="checkbox" class="checkbox" name="checkboxes" value="check_3"> Radio 3<br></p>
<p><label>Fancy Checkboxes:</label><br><input id="custom-51_0" class="custom-51" name="__custom-51[0]" type="checkbox" value="1" onclick="if (this.checked) { this.form['custom-51[0]'].value='Getting deputized to register voters / Obtener la certificación necesaria para registrar a votantes'; }else { this.form['custom-51[0]'].value=''; } "><label for="custom-51_0">Getting deputized to register voters / Obtener la certificación necesaria para registrar a votantes<br></label><input type="hidden" name="custom-51[0]" value=""><input id="custom-51_1" class="custom-51" name="__custom-51[1]" type="checkbox" value="1" onclick="if (this.checked) { this.form['custom-51[1]'].value='Calling Texans to build support for Battleground Texas / Hacer llamadas telefónicas invitando a la gente a formar parte de Battleground Texas'; }else { this.form['custom-51[1]'].value=''; } "><label for="custom-51_1">Calling Texans to build support for Battleground Texas / Hacer llamadas telefónicas invitando a la gente a formar parte de Battleground Texas<br></label><input type="hidden" name="custom-51[1]" value=""><input id="custom-51_2" class="custom-51" name="__custom-51[2]" type="checkbox" value="1" onclick="if (this.checked) { this.form['custom-51[2]'].value='Hosting an organizer or intern in my home / Hacer disponible mi hogar para que se lleve a cabo un evento de Battleground Texas'; }else { this.form['custom-51[2]'].value=''; } "><label for="custom-51_2">Hosting an organizer or intern in my home / Hacer disponible mi hogar para que se lleve a cabo un evento de Battleground Texas<br></label><input type="hidden" name="custom-51[2]" value=""><input id="custom-51_3" class="custom-51" name="__custom-51[3]" type="checkbox" value="1" onclick="if (this.checked) { this.form['custom-51[3]'].value='Becoming a Neighborhood Team Leader / Ser un organizador en mi vecindario'; }else { this.form['custom-51[3]'].value=''; } "><label for="custom-51_3">Becoming a Neighborhood Team Leader / Ser un organizador en mi vecindario<br></label><input type="hidden" name="custom-51[3]" value=""><input id="custom-51_4" class="custom-51" name="__custom-51[4]" type="checkbox" value="1" onclick="if (this.checked) { this.form['custom-51[4]'].value='Other / Otra'; }else { this.form['custom-51[4]'].value=''; } "><label for="custom-51_4">Other / Otra<br></label><input type="hidden" name="custom-51[4]" value=""></p>
<p><label for="password">Password:</label><br><input type="password" class="password" id="password" name="password"></p>
<p><label for="file">File Input:</label><br><input type="file" class="file" id="file" name="file"></p>
<p>
<button>Submit</button> <button type="reset">Clear</button>
</p>
</form>
</fieldset><hr><h1 id="tables">Tables</h1>
<table><caption>Table Caption Goes Here</caption>
<thead><tr><th>Table Header 1</th><th>Table Header 2</th><th>Table Header 3</th>
</tr></thead><tfoot><tr><th>Footer 1</th><th>Footer 2</th><th>Footer 3</th>
</tr></tfoot><tbody><tr><td>Division 1</td><td>Division 2</td><td>Division 3</td>
</tr><tr class="even"><td>Division 1</td><td>Division 2</td><td>Division 3</td>
</tr><tr><td>Division 1</td><td>Division 2</td><td>Division 3</td>
</tr></tbody></table><hr><h1 id="misc">Misc Stuff - abbr, acronym, pre, code, sub, sup, etc.</h1>
<p>Lorem <sup>superscript</sup> dolor <sub>subscript</sub> amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. <cite>cite</cite>. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. <acronym title="National Buttars Association">NBA</acronym> Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus. <abbr title="Avenue">AVE</abbr></p>
<pre>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. <acronym title="National Buttars Association">NBA</acronym> Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus. <abbr title="Avenue">AVE</abbr></pre>
<blockquote>
<p>This stylesheet is going to help so freaking much.</p>
<p>-Blockquote</p>
</blockquote><div id="fb-root"></div> </div> <!-- </div> class="content"> -->
</div> <!-- </div> class="content_wrap"> -->
</div> <!-- </.page_content_wrap> -->
<footer class="footer_wrap bg_tint_dark footer_style_dark widget_area"><div class="content_wrap">
<div class="columns_wrap">
<aside id="axiom_widget_socials-4" class="widget_number_1 column-1_4 widget widget_socials"><div class="widget_inner">
<div class="logo"><a href="http://www.battlegroundtexas.com"><img src="http://www.battlegroundtexas.com/wp-content/uploads/2016/05/logo_footer.png" alt=""></a></div>
<div class="sc_socials sc_socials_size_small"><div class="sc_socials_item"><a href="#" target="_blank" class="social_icons social_facebook icons"><span class="icon-facebook"></span></a></div><div class="sc_socials_item"><a href="#" target="_blank" class="social_icons social_dribbble icons"><span class="icon-dribbble"></span></a></div><div class="sc_socials_item"><a href="#" target="_blank" class="social_icons social_gplus icons"><span class="icon-gplus"></span></a></div><div class="sc_socials_item"><a href="#" target="_blank" class="social_icons social_twitter icons"><span class="icon-twitter"></span></a></div></div></div>
</aside></div> <!-- /.columns_wrap -->
</div> <!-- /.content_wrap -->
</footer><!-- /.footer_wrap --><div class="copyright_wrap">
<div class="content_wrap"><p>Political advertising paid for by Battleground Texas, www.BattlegroundTexas.com, not authorized by any federal candidate or candidate’s committee.</p>
<div class="copyright"><p>Battleground Texas © 2016 All Rights Reserved. <a href="#">Terms of use</a> and <a href="#">Privacy Policy</a></p></div>
<ul id="menu_copy" class="menu_copy_nav"><li><a href="http://www.battlegroundtexas.com/">Home</a></li>
<li><a href="http://www.battlegroundtexas.com/about-us/">About</a></li>
<li><a href="http://join.battlegroundtexas.com/page/s/get-involved">Get Involved</a></li>
<li><a href="http://battletx.bluestatedigital.com/page/event/search_simple">Events</a></li>
<li><a href="http://www.battlegroundtexas.com/blog/">Blog</a></li>
<li><a href="https://secure.battlegroundtexas.com/page/contribute/donate-1">Donate</a></li>
<li><a href="http://store.battlegroundtexas.com/">Store</a></li>
</ul></div>
</div>
</div> <!-- /.page_wrap -->
</div> <!-- /.body_wrap -->
</body></html>