root / snf-cyclades-app / synnefo / ui / new_ui / ui / vm_list_v1.html @ 7b381e90
History | View | Annotate | Download (6.8 kB)
| 1 |
|
|---|---|
| 2 |
<!DOCTYPE html>
|
| 3 |
<!--[if lte IE 7]><script src="javascripts/lte-ie7.js"></script><![endif]-->
|
| 4 |
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
|
| 5 |
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]--> |
| 6 |
|
| 7 |
<head>
|
| 8 |
<meta charset="utf-8" /> |
| 9 |
<meta name="viewport" content="width=device-width" /> |
| 10 |
<title>Synnefo | VM list</title> |
| 11 |
<link rel="stylesheet" href="stylesheets/font_custom.css" /> |
| 12 |
<link rel="stylesheet" href="stylesheets/gp-stylesheet.css" /> |
| 13 |
<link rel="stylesheet" href="stylesheets/normalize.css" /> |
| 14 |
<link rel="stylesheet" href="stylesheets/app.css" /> |
| 15 |
<script src="javascripts/vendor/custom.modernizr.js"></script> |
| 16 |
|
| 17 |
</head>
|
| 18 |
<body>
|
| 19 |
<div class="dummy-navigation"> |
| 20 |
<a href="" class="close">X</a> |
| 21 |
<a href="index.html">Homepage</a><br> |
| 22 |
<a href="" class="our" data-our="questions">Show/Hide questions</a><br> |
| 23 |
<a href="" class="our" data-our="suggestions">Show/Hide suggestions</a><br> |
| 24 |
<a href="" class="our" data-our="problems">Show/Hide problems</a><br> |
| 25 |
</div>
|
| 26 |
<div class="row-full"> |
| 27 |
<header class="header"> |
| 28 |
<!-- logo -->
|
| 29 |
<div class="logo"> |
| 30 |
<img src="http://dummyimage.com/300x100/000/fff" alt="software logo"> |
| 31 |
</div>
|
| 32 |
<div class="new-btn"><a href=""><span>+</span> NEW MACHINE </a></div> |
| 33 |
<!-- icons-nav -->
|
| 34 |
<nav class="top-nav icons-nav"> |
| 35 |
|
| 36 |
<ul>
|
| 37 |
<li><a href="" data-tooltip ="has-tip" title="Storage"><img src="images/menu-icon-storage.png" alt="vm"></a></li> |
| 38 |
<li><a href="" data-tooltip ="has-tip" title="Compute"><img src="images/menu-icon-compute.png" alt="vm"></a></li> |
| 39 |
|
| 40 |
<li><a href="" data-tooltip ="has-tip" title="Disks"><img src="images/menu-icon-disks.png" alt="vm"></a></li> |
| 41 |
<li><a href="" data-tooltip ="has-tip" title="Networks"><img src="images/menu-icon-networks.png" alt="vm"></a></li> |
| 42 |
</ul>
|
| 43 |
|
| 44 |
</nav>
|
| 45 |
|
| 46 |
<!-- login functionality -->
|
| 47 |
<div class="login"> |
| 48 |
<a href="">test@grnet.gr</a> |
| 49 |
</div>
|
| 50 |
<!-- extra actions -->
|
| 51 |
<div class="actions"> |
| 52 |
|
| 53 |
<div class="lt-actions"></div> |
| 54 |
<div class="main-actions"> |
| 55 |
<ul>
|
| 56 |
<li><a href="">Reboot</a></li> |
| 57 |
<li><a href="">Shutdown</a></li> |
| 58 |
<li><a href="">Console</a></li> |
| 59 |
<li><a href="">Action1</a></li> |
| 60 |
<li><a href="">Action2</a></li> |
| 61 |
</ul>
|
| 62 |
</div>
|
| 63 |
</div>
|
| 64 |
</header>
|
| 65 |
<div class="info top-info success"> |
| 66 |
<div class="wrap"> |
| 67 |
|
| 68 |
<p>Nunc at velit quis lectus nonummy eleifend. Curabitur eros. Aenean ligula dolor, gravida auctor, auctor et, suscipit in, erat. Sed malesuada, enim ut congue pharetra, massa elit convallis pede, ornare scelerisque libero neque ut neque. In at libero. </p> |
| 69 |
</div>
|
| 70 |
<a href="#" class="close" title="hide message">close</a> |
| 71 |
</div>
|
| 72 |
|
| 73 |
</div>
|
| 74 |
<div class="row-full wrapper"> |
| 75 |
|
| 76 |
|
| 77 |
<!-- main area -->
|
| 78 |
<section class="main"> |
| 79 |
|
| 80 |
<div class="vms"> |
| 81 |
<ul class="items-list small-block-grid-2 large-block-grid-4"> |
| 82 |
<li>
|
| 83 |
<div class="img running"> |
| 84 |
VM running |
| 85 |
<span class="os windows">os</span> |
| 86 |
</div>
|
| 87 |
<p class="visible-info"> |
| 88 |
<span>IPv4 83.212.97.127</span> |
| 89 |
<span>my awsome machine</span> |
| 90 |
|
| 91 |
</p>
|
| 92 |
</li>
|
| 93 |
<li>
|
| 94 |
<div class="vm_container"> |
| 95 |
<div class="img running"> |
| 96 |
VM running |
| 97 |
<span class="os fedora">os</span> |
| 98 |
</div>
|
| 99 |
<p class="visible-info"> |
| 100 |
<span>IPv4 83.212.97.127</span> |
| 101 |
<span>my awsome machine</span> |
| 102 |
</p>
|
| 103 |
|
| 104 |
<!-- selection window -->
|
| 105 |
<div class="vm_options invisible"> |
| 106 |
<a class="select" href="">select |
| 107 |
<span aria-hidden="true" class="custom_checkbox checkbox-unchecked"> |
| 108 |
a |
| 109 |
</span>
|
| 110 |
</a><br> |
| 111 |
<a href="" class="option">connect</a><br> |
| 112 |
<a href="vm_details_v1.html" class="option">details</a> |
| 113 |
</div>
|
| 114 |
|
| 115 |
</div>
|
| 116 |
</li>
|
| 117 |
<li>
|
| 118 |
<div class="img stopped"> |
| 119 |
VM running |
| 120 |
<span class="os kubuntu">os</span> |
| 121 |
</div>
|
| 122 |
<p class="visible-info"> |
| 123 |
<span>IPv4 83.212.97.127</span> |
| 124 |
<span>my awsome machine</span> |
| 125 |
</p>
|
| 126 |
|
| 127 |
</li>
|
| 128 |
<li>
|
| 129 |
<div class="img running"> |
| 130 |
VM running |
| 131 |
<span class="os windows">os</span> |
| 132 |
</div>
|
| 133 |
<p class="visible-info"> |
| 134 |
<span>IPv4 83.212.97.127</span> |
| 135 |
<span>my awsome machine</span> |
| 136 |
</p>
|
| 137 |
</li>
|
| 138 |
<li>
|
| 139 |
<div class="img running"> |
| 140 |
VM running |
| 141 |
<span class="os kubuntu">os</span> |
| 142 |
</div>
|
| 143 |
<p class="visible-info"> |
| 144 |
<span>IPv4 83.212.97.127</span> |
| 145 |
<span>my awsome machine</span> |
| 146 |
</p>
|
| 147 |
</li>
|
| 148 |
<li>
|
| 149 |
<div class="img running"> |
| 150 |
VM running |
| 151 |
<span class="os">os</span> |
| 152 |
</div>
|
| 153 |
<p class="visible-info"> |
| 154 |
<span>IPv4 83.212.97.127</span> |
| 155 |
<span>my awsome machine</span> |
| 156 |
</p>
|
| 157 |
</li>
|
| 158 |
<li>
|
| 159 |
<div class="img running"> |
| 160 |
VM running |
| 161 |
<span class="os windows">os</span> |
| 162 |
</div>
|
| 163 |
<p class="visible-info"> |
| 164 |
<span>IPv4 83.212.97.127</span> |
| 165 |
<span>my awsome machine</span> |
| 166 |
</p>
|
| 167 |
</li>
|
| 168 |
</ul>
|
| 169 |
</div>
|
| 170 |
</section>
|
| 171 |
</div>
|
| 172 |
<div class="extras"> |
| 173 |
<span data-tooltip ="has-tip suggestions" title="Μήπως να είναι λίγο πιο έντονα τα χρώματα; Μοιάζουν απενεργοποιημένα..." style="top:0;left:200px">:)</span> |
| 174 |
<span data-tooltip ="has-tip questions" title="Πόσο θα είναι το μέγιστο πλάτος της κύριας περιοχής" style="top:240px;left:20px">?</span> |
| 175 |
<span data-tooltip ="has-tip problems" title="Πώς θα έχουμε δράσεις όπως filters κτλ" style="top:140px;left:250px">!!</span> |
| 176 |
</div>
|
| 177 |
|
| 178 |
|
| 179 |
<script src="javascripts/vendor/jquery.js"></script> |
| 180 |
<script src="javascripts/foundation/foundation.js"></script> |
| 181 |
|
| 182 |
<script src="javascripts/foundation/foundation.alerts.js"></script> |
| 183 |
|
| 184 |
<script src="javascripts/foundation/foundation.clearing.js"></script> |
| 185 |
|
| 186 |
<script src="javascripts/foundation/foundation.cookie.js"></script> |
| 187 |
|
| 188 |
<script src="javascripts/foundation/foundation.dropdown.js"></script> |
| 189 |
|
| 190 |
<script src="javascripts/foundation/foundation.forms.js"></script> |
| 191 |
|
| 192 |
<script src="javascripts/foundation/foundation.joyride.js"></script> |
| 193 |
|
| 194 |
<script src="javascripts/foundation/foundation.magellan.js"></script> |
| 195 |
|
| 196 |
<script src="javascripts/foundation/foundation.orbit.js"></script> |
| 197 |
|
| 198 |
<script src="javascripts/foundation/foundation.placeholder.js"></script> |
| 199 |
|
| 200 |
<script src="javascripts/foundation/foundation.reveal.js"></script> |
| 201 |
|
| 202 |
<script src="javascripts/foundation/foundation.section.js"></script> |
| 203 |
|
| 204 |
<script src="javascripts/foundation/foundation.tooltips.js"></script> |
| 205 |
|
| 206 |
<script src="javascripts/foundation/foundation.topbar.js"></script> |
| 207 |
<script src="javascripts/common.js"></script> |
| 208 |
|
| 209 |
|
| 210 |
<script src="javascripts/gp-script.js"></script> |
| 211 |
|
| 212 |
<script>
|
| 213 |
$(document).foundation();
|
| 214 |
</script>
|
| 215 |
</body>
|
| 216 |
</html>
|