yosoyhendrix
/
vesta


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694
							<!doctype html>
<html>

<head>
	<title>Vesta | Web domain</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta http-equiv="imagetoolbar" content="false" />

	<link rel="stylesheet" media="all" type="text/css" href="css/reset2.css" />
	<link rel="stylesheet" media="all" type="text/css" href="css/chosen.css" />
	<link rel="stylesheet" media="all" type="text/css" href="css/vesta.css" />

	<!--[if lt IE 8]>
		<link rel="stylesheet" type="text/css" href="css/ie.css" />
    <![endif]-->

	<script type="text/javascript" src="js/custom-form-elements.js"></script>
	<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
	<script type="text/javascript" src="js/chosen.jquery.min.js"></script>
	<script type="text/javascript" src="js/chosen.init.js"></script>
	
</head>

<body>
<div id="page">
	<div class="outer">
		<div id="header">
			<div class="logo-box">
				<h1 class="logo"><a href="#">Vesta panel <span>&nbsp;</span></a></h1>
			</div>
			<ul class="settings">
				<li class="settings-item">
					<span class="logged-as">Fabricius Euphranor von Neoptolemos</span>
					<a class="item-title" href="#">Profile</a>
				</li>
				<li class="settings-item"><a class="item-title" href="#">Settings</a></li>
				<li class="logout"><a class="item-title" href="#"><span class="item-title-inner">Exit</span></a></li>
			</ul>
			<ul class="extra-services">
				<li class="service-item active">
					<span class="item-title">Backups</span>
					<i class="item-devider"></i>
				</li>
				<li class="service-item">
					<span class="item-title">Stats</span>
					<i class="item-devider"></i>
				</li>
			</ul>
		</div>
		<div id="primary-nav-box">
			<ul class="primary-nav cc">
				<li class="section">
					<div class="section-inner">
						<dl class="users-nav-item">
							<dt class="section-title cc">
								<span class="to-section">Users</span> 
								<i class="add-entry">&nbsp;</i>
							</dt>
							<dd class="section-contains">
								<span class="def">386 users</span>
								<span class="def">7 blocked</span>
							</dd>
						</dl>
					</div>
					<i class="section-devider"></i>
				</li>
				<li class="section active">
					<div class="section-inner">
						<dl class="domains-nav-item">
							<dt class="section-title cc">
								<span class="to-section">Web</span>
								<i class="add-entry">&nbsp;</i>
							</dt>
							<dd class="section-contains">
								<span class="def">580 domains</span>
								<span class="def">22 out of mem</span>
								<span class="def">3 waiting</span>
							</dd>
						</dl>
					</div>
					<i class="section-devider"></i>
				</li>
				<li class="section">
					<div class="section-inner">
						<dl class="mail-nav-item">
							<dt class="section-title cc">
								<span class="to-section">Mail</span>
								<i class="add-entry">&nbsp;</i>
							</dt>
							<dd class="section-contains">
								<span class="def">320 domains</span>
								<span class="def">1209 mailboxes</span>
								<span class="def">25 full</span>
							</dd>
						</dl>
					</div>
					<i class="section-devider"></i>
				</li>
				<li class="section">
					<div class="section-inner">
						<dl class="db-nav-item">
							<dt class="section-title cc">
								<span class="to-section">DB</span>
								<i class="add-entry">&nbsp;</i>
							</dt>
							<dd class="section-contains">
								<span class="def">7 db</span>
							</dd>
						</dl>
					</div>
					<i class="section-devider"></i>
				</li>
				<li class="section">
					<div class="section-inner">
						<dl class="dns-nav-item">
							<dt class="section-title cc">
								<span class="to-section">Dns</span>
								<i class="add-entry">&nbsp;</i>
							</dt>
							<dd class="section-contains">
								<span class="def">289 records</span>
							</dd>
						</dl>
					</div>
					<i class="section-devider"></i>
				</li>
				<li class="section">
					<div class="section-inner">
						<dl class="dnstpl-nav-item">
							<dt class="section-title cc">
								<span class="to-section">IP</span> 
								<i class="add-entry">&nbsp;</i>
							</dt>
							<dd class="section-contains">
								<span class="def">7 templates</span>
							</dd>
						</dl>
					</div>
					<i class="section-devider"></i>
				</li>
				<li class="section last-section">
					<div class="section-inner">
						<dl class="cron-nav-item">
							<dt class="section-title cc">
								<span class="to-section">Cron</span>
								<i class="add-entry">&nbsp;</i>
							</dt>
							<dd class="section-contains">
								<span class="def">15 records</span>
							</dd>
						</dl>
					</div>
					<i class="section-devider"></i>
				</li>
			</ul>
		</div>
		<div id="console">
			<div class="b-console">
				<div class="b-console-wrap">
					<form class="b-console-form cc" action="#" method="post">
						<fieldset>
							<input class="b-console-field" type="text" value="/"/>
							<input class="b-console-btn" type="submit" value="Go" />
						</fieldset>
					</form>
				</div>
				<div class="b-console-results"></div>
			</div>
		</div>
		<!-- actions toolbar -->
		<div id="actions-toolbar" class="cc">
			<a class="add-btn" href="#"><i class="add-btn-icon">&nbsp;</i>add web domain</a>
			
			<div class="row-filters cc">
				<div class="b-row-selector">
					<div class="checkbox-selector cc">
						<input class="styled" type="checkbox" value="" />
						<span class="selector-title">385 Selected</span>
					</div>
					<div class="context-actions">
						<div class="b-cust-sel b-cust-sel_inactive">
							<span class="title">Action</span>
							<div class="cust-sel-arrow"><i>&nbsp;</i></div>
							<div class="cust-sel-options">
								<div class="cust-sel-option ico_gray">Suspend</div>
								<div class="cust-sel-option ico_green">Unsuspend</div>
								<div class="cust-sel-option ico_red">Delete</div>
							</div>
						</div>
					</div>
				</div>
				<!-- visible only for admin -->
				<div class="domain-groups-selector">
					<div class="selector-wrap">
						<strong class="selector-title">Show:</strong>
						<span class="selected-groups">mine, vesta, Chronos, vasya (and 35 more)</span>
					</div>
				</div><!-- // visible only for admin -->
				
			</div>
			
		</div><!-- // actions toolbar -->
		<div id="content">
			<div class="content-inner">
				<div class="domains-list">
					<!-- row 1 -->
					<div class="row first-row domain-details-row">
						<div class="row-actions-box cc">
							<div class="check-this check-control"></div>
							<div class="row-operations">
								<span class="ip-status-info ip-enabled-status"><span class="ip-status-text">active</span></span>
							</div>
						</div>
						<div class="row-meta">
							<div class="entry-created">12.11.2010</div>
						</div>
						<div class="row-details cc">
							<div class="names">
								<strong class="domain-name primary">naumov-socolov.co.uk</strong>
								<span class="alias-title">Alias:</span>
								<span class="domain-name">naumov-socolov.org.ua,</span>
								<span class="domain-name">naumov-socolov.org.md,</span>
								<span class="domain-name">naumov-socolov.to</span>
							</div>
							<div class="props-main">
								<div class="ip-adr-box">
									<span class="ip-adr">192<span class="dot">.</span>52<span class="dot">.</span>107<span class="dot">.</span>26</span>
									<span class="prop-box template-box">
										<span class="prop-title">template:</span>
										<span class="prop-value">default</span>
									</span>
								</div>
								<!-- disk usage block -->
								<div class="b-usage-box disk-usage cc">
									<span class="prop-title">disk usage:</span>
									<div class="usage-box">
										<div class="value-box">
											<span class="value">900</span>
											<div class="graph low">
												<span class="bar" style="width:25%;"></span>
											</div>
										</div>
										<div class="max-size">3 000 <span class="units">Mb</span></div>
									</div>
								</div><!-- // disk usage block -->
								<!-- bandwidth usage block -->
								<div class="b-usage-box bandwidth-box cc">
									<span class="prop-title">bandwidth:</span>
									<div class="usage-box">
										<div class="value-box">
											<span class="value">2572</span>
											<div class="graph low">
												<span class="bar" style="width:30%;"></span>
											</div>
										</div>
										<div class="max-size">5 000 <span class="units">Mb</span></div>
									</div>
								</div><!-- // bandwidth usage block -->
							</div>
							<div class="props-additional">
								<span class="prop-box php-box">
									<span class="prop-title">php:</span>
									<span class="prop-value">cgi</span>
								</span>
								<span class="prop-box cgi-box">
									<span class="prop-title">cgi:</span>
									<span class="prop-value">yes</span>
								</span>
								<span class="prop-box elog-box">
									<span class="prop-title">elog:</span>
									<span class="prop-value">no</span>
								</span>
								<span class="prop-box stats-box">
									<span class="prop-title">stats:</span>
									<span class="prop-value">yes</span>
									<span class="stats-auth stats-auth-on">
										<span class="stats-auth-text">auth</span>
									</span>
								</span>
							</div>
							<div class="props-ext">
								<span class="prop-box ssl-box">
									<span class="prop-title">ssl:</span>
									<span class="prop-value">yes</span>
								</span>
								<span class="prop-box nginx-box">
									<span class="prop-title">nginx:</span>
									<span class="prop-value">yes</span>
									<span class="nginx-ext-list">extension list</span>
								</span>
							</div>							
						</div><!-- // .row-details -->
					</div><!-- // .row 1 -->

					<!-- row 2 -->
					<div class="row domain-details-row">
						<div class="row-actions-box cc">
							<div class="check-this check-control"></div>
							<div class="row-operations">
								<span class="ip-status-info ip-enabled-status"><span class="ip-status-text">active</span></span>
							</div>
						</div>
						<div class="row-meta">
							<div class="entry-created">12.11.2010</div>
						</div>
						<div class="row-details cc">
							<div class="names">
								<strong class="domain-name primary">www.baden-wuerttemberg.de</strong>
								<span class="alias-title">Alias:</span>
								<span class="domain-name">mecklenburg-vorpommern.eu,</span>
								<span class="domain-name">www.ostprignitz-ruppin.de,</span>
								<span class="domain-name">potsdam-mittelmark.de,</span>
								<span class="domain-name">maerkisch-oderland.de</span>
							</div>
							<div class="props-main">
								<div class="ip-adr-box">
									<span class="ip-adr">192<span class="dot">.</span>52<span class="dot">.</span>107<span class="dot">.</span>26</span>
									<span class="prop-box template-box">
										<span class="prop-title">template:</span>
										<span class="prop-value">default</span>
									</span>
								</div>
								<!-- disk usage block -->
								<div class="b-usage-box disk-usage cc">
									<span class="prop-title">disk usage:</span>
									<div class="usage-box">
										<div class="value-box">
											<span class="value">1600</span>
											<div class="graph middle">
												<span class="bar" style="width:55%;"></span>
											</div>
										</div>
										<div class="max-size">3 000 <span class="units">Mb</span></div>
									</div>
								</div><!-- // disk usage block -->
								<!-- bandwidth usage block -->
								<div class="b-usage-box bandwidth-box cc">
									<span class="prop-title">bandwidth:</span>
									<div class="usage-box">
										<div class="value-box">
											<span class="value">3800</span>
											<div class="graph middle">
												<span class="bar" style="width:70%;"></span>
											</div>
										</div>
										<div class="max-size">5 000 <span class="units">Mb</span></div>
									</div>
								</div><!-- // bandwidth usage block -->
							</div>
							<div class="props-additional">
								<span class="prop-box php-box">
									<span class="prop-title">php:</span>
									<span class="prop-value">cgi</span>
								</span>
								<span class="prop-box cgi-box">
									<span class="prop-title">cgi:</span>
									<span class="prop-value">yes</span>
								</span>
								<span class="prop-box elog-box">
									<span class="prop-title">elog:</span>
									<span class="prop-value">no</span>
								</span>
								<span class="prop-box stats-box">
									<span class="prop-title">stats:</span>
									<span class="prop-value">yes</span>
									<span class="stats-auth stats-auth-on">
										<span class="stats-auth-text">auth</span>
									</span>
								</span>
							</div>
							<div class="props-ext">
								<span class="prop-box ssl-box">
									<span class="prop-title">ssl:</span>
									<span class="prop-value">yes</span>
								</span>
								<span class="prop-box nginx-box">
									<span class="prop-title">nginx:</span>
									<span class="prop-value">yes</span>
									<span class="nginx-ext-list">extension list</span>
								</span>
							</div>							
						</div><!-- // .row-details -->
					</div><!-- // .row 2 -->

					<!-- row 3 -->
					<div class="row domain-details-row">
						<div class="row-actions-box cc">
							<div class="check-this check-control"></div>
							<div class="row-operations">
								<span class="ip-status-info ip-enabled-status"><span class="ip-status-text">active</span></span>
							</div>
						</div>
						<div class="row-meta">
							<div class="entry-created">25.12.2010</div>
						</div>
						<div class="row-details cc">
							<div class="names">
								<strong class="domain-name primary">www.digital-photography-school.com</strong>
								<span class="alias-title">Alias:</span>
								<span class="domain-name">www.designer-daily.com,</span>
								<span class="domain-name">whatismyipaddress.com,</span>
								<span class="domain-name">theoryandpractice.ru,</span>
								<span class="domain-name">www.the-north-pole.com</span>
							</div>
							<div class="props-main">
								<div class="ip-adr-box">
									<span class="ip-adr">192<span class="dot">.</span>52<span class="dot">.</span>107<span class="dot">.</span>26</span>
									<span class="prop-box template-box">
										<span class="prop-title">template:</span>
										<span class="prop-value">default</span>
									</span>
								</div>
								<!-- disk usage block -->
								<div class="b-usage-box disk-usage cc">
									<span class="prop-title">disk usage:</span>
									<div class="usage-box">
										<div class="value-box">
											<span class="value">2700</span>
											<div class="graph critical">
												<span class="bar" style="width:91%;"></span>
											</div>
										</div>
										<div class="max-size">3 000 <span class="units">Mb</span></div>
									</div>
								</div><!-- // disk usage block -->
								<!-- bandwidth usage block -->
								<div class="b-usage-box bandwidth-box cc">
									<span class="prop-title">bandwidth:</span>
									<div class="usage-box">
										<div class="value-box">
											<span class="value">4980</span>
											<div class="graph critical">
												<span class="bar" style="width:97%;"></span>
											</div>
										</div>
										<div class="max-size">5 000 <span class="units">Mb</span></div>
									</div>
								</div><!-- // bandwidth usage block -->
							</div>
							<div class="props-additional">
								<span class="prop-box php-box">
									<span class="prop-title">php:</span>
									<span class="prop-value">cgi</span>
								</span>
								<span class="prop-box cgi-box">
									<span class="prop-title">cgi:</span>
									<span class="prop-value">yes</span>
								</span>
								<span class="prop-box elog-box">
									<span class="prop-title">elog:</span>
									<span class="prop-value">no</span>
								</span>
								<span class="prop-box stats-box">
									<span class="prop-title">stats:</span>
									<span class="prop-value">yes</span>
									<span class="stats-auth stats-auth-on">
										<span class="stats-auth-text">auth</span>
									</span>
								</span>
							</div>
							<div class="props-ext">
								<span class="prop-box ssl-box">
									<span class="prop-title">ssl:</span>
									<span class="prop-value">yes</span>
								</span>
								<span class="prop-box nginx-box">
									<span class="prop-title">nginx:</span>
									<span class="prop-value">yes</span>
									<span class="nginx-ext-list">extension list</span>
								</span>
							</div>							
						</div><!-- // .row-details -->
					</div><!-- // .row 3 -->
					
					<!-- row 4, suspended status -->
					<div class="row domain-details-row suspended-row">
						<div class="row-actions-box cc">
							<div class="check-this check-control"></div>
							<div class="row-operations">
								<span class="ip-status-info ip-suspended-status"><span class="ip-status-text">suspended</span></span>
							</div>
						</div>
						<div class="row-meta">
							<div class="entry-created">25.12.2010</div>
						</div>
						<div class="row-details cc">
							<div class="names">
								<strong class="domain-name primary">www.digital-photography-school.com</strong>
								<span class="alias-title">Alias:</span>
								<span class="domain-name">www.designer-daily.com,</span>
								<span class="domain-name">whatismyipaddress.com,</span>
								<span class="domain-name">theoryandpractice.ru,</span>
								<span class="domain-name">www.the-north-pole.com</span>
							</div>
							<div class="props-main">
								<div class="ip-adr-box">
									<span class="ip-adr">192<span class="dot">.</span>52<span class="dot">.</span>107<span class="dot">.</span>26</span>
									<span class="prop-box template-box">
										<span class="prop-title">template:</span>
										<span class="prop-value">default</span>
									</span>
								</div>
								<!-- disk usage block -->
								<div class="b-usage-box disk-usage cc">
									<span class="prop-title">disk usage:</span>
									<div class="usage-box">
										<div class="value-box">
											<span class="value">2700</span>
											<div class="graph critical">
												<span class="bar" style="width:91%;"></span>
											</div>
										</div>
										<div class="max-size">3 000 <span class="units">Mb</span></div>
									</div>
								</div><!-- // disk usage block -->
								<!-- bandwidth usage block -->
								<div class="b-usage-box bandwidth-box cc">
									<span class="prop-title">bandwidth:</span>
									<div class="usage-box">
										<div class="value-box">
											<span class="value">4980</span>
											<div class="graph critical">
												<span class="bar" style="width:97%;"></span>
											</div>
										</div>
										<div class="max-size">5 000 <span class="units">Mb</span></div>
									</div>
								</div><!-- // bandwidth usage block -->
							</div>
							<div class="props-additional">
								<span class="prop-box php-box">
									<span class="prop-title">php:</span>
									<span class="prop-value">cgi</span>
								</span>
								<span class="prop-box cgi-box">
									<span class="prop-title">cgi:</span>
									<span class="prop-value">yes</span>
								</span>
								<span class="prop-box elog-box">
									<span class="prop-title">elog:</span>
									<span class="prop-value">no</span>
								</span>
								<span class="prop-box stats-box">
									<span class="prop-title">stats:</span>
									<span class="prop-value">yes</span>
									<span class="stats-auth stats-auth-on">
										<span class="stats-auth-text">auth</span>
									</span>
								</span>
							</div>
							<div class="props-ext">
								<span class="prop-box ssl-box">
									<span class="prop-title">ssl:</span>
									<span class="prop-value">yes</span>
								</span>
								<span class="prop-box nginx-box">
									<span class="prop-title">nginx:</span>
									<span class="prop-value">yes</span>
									<span class="nginx-ext-list">extension list</span>
								</span>
							</div>							
						</div><!-- // .row-details -->
					</div><!-- // .row 4 -->


					<!-- form -->
					<div class="b-new-entry b-new-entry_domain">
						<div class="entry-header">New web domain</div>
						<div class="form-row cc">
							<label class="field-label" for="#"><span class="mandatory">domain:</span></label>
							<input class="text-field rule-required" type="text" value="www.digital-photography-school.com" />
						</div>
						<div class="form-row cc">
							<label class="field-label" for="#"><span class="mandatory">ip:</span></label>
							<div class="autocomplete-box">
								<input class="text-field rule-required" type="text" value="192.168.64.19" />
								<i class="arrow">&nbsp;</i>
							</div>
						</div>

						<div class="form-row cc">
							<label class="field-label" for="#">template:</label>
							<select class="styled" name="template">
								<option value="1" selected="selected">default</option>
								<option value="2">custom</option>
								<option value="3">advanced</option>
							</select>
						</div>
					
						<div class="form-row cc">
							<label class="field-label" for="#">suspended:</label>
							<input class="styled" type="checkbox" value="" />
						</div>

						<!-- advanced options -->
						<div class="form-options-group">
							<div class="group-header cc expanded">
								<span class="group-title-outer">
									<span class="group-title-inner">
										<span class="group-title">Advanced options</span>
									</span>
								</span>									
							</div>
							<div class="form-row cc">
								<label class="field-label" for="#">alias list:</label>
								<textarea class="textarea"></textarea>
							</div>

							<div class="form-row cc">
								<label class="field-label" for="#">statistics:</label>
								<input class="styled" type="checkbox" value="" />
							</div>
							
							<!-- stats settings -->
							<div class="stats-settings">
								<div class="form-row cc">
									<label class="field-label" for="#">stats auth:</label>
									<input class="styled" type="checkbox" value="" />
								</div>
								<div class="form-row cc">
									<label class="field-label" for="#">login:</label>
									<input class="text-field disabled" type="text" value="disabled field example" disabled="disabled" />
								</div>
								<div class="form-row pwd-box cc">
									<label class="field-label" for="#">password:</label>
									<input class="text-field" type="password" value=""/>
									<span class="generate-pwd">Generate</span>
								</div>
							</div><!-- // stats settings -->

							<div class="form-row cc">
								<label class="field-label" for="#">ssl:</label>
								<input class="styled" type="checkbox" value="" />
							</div>

							<div class="form-row cc">
								<label class="field-label" for="#">ssl home:</label>
								<input class="disabled text-field" type="text" value="disabled field example" disabled="disabled"/>
							</div>

							<div class="form-row ssl-crtfct-box cc">
								<label class="field-label" for="#">ssl certificate: <span class="remark">(upload file or insert text)</span></label>
								<input class="file-upload" size="43" type="file" value="" />
								<textarea class="textarea"></textarea>
							</div>
						</div><!-- // advanced options -->

						<!-- DNS options -->
						<div class="form-options-group">
							<div class="group-header cc expanded">
								<span class="group-title-outer">
									<span class="group-title-inner">								
										<span class="group-title">DNS options</span>
									</span>
								</span>									
							</div>

							<div class="form-row cc">
								<label class="field-label" for="#">create dns domain:</label>
								<input class="styled" type="checkbox" value="" />
							</div>
							
						</div><!-- DNS options -->

						<!-- Mail options -->
						<div class="form-options-group mail-options-group">
							<div class="group-header cc collapsed">
								<span class="group-title-outer">
									<span class="group-title-inner">								
										<span class="group-title">Mail options</span>
									</span>
								</span>									
							</div>

							<div class="form-row cc hidden">
								<label class="field-label" for="#">create mail domain:</label>
								<input class="styled" type="checkbox" value="" />
							</div>

						</div><!-- Mail options -->

						<div class="form-row buttons-row cc">
							<input class="add-entry-btn" type="submit" value="add" />
							<span class="cancel-btn">Cancel</span>
							<span class="delete-btn">Delete</span>
						</div>
					</div><!-- // form -->
				</div><!-- // .domain-list -->
			</div>
		</div><!-- // #content -->
	</div>
</div>
</body>
</html>