Revision d442d17f
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/icon_guide.html | ||
|---|---|---|
| 143 | 143 |
</div> |
| 144 | 144 |
<div class="glyph"> |
| 145 | 145 |
<div class="fs1" aria-hidden="true" data-icon="z"></div> |
| 146 |
<input type="text" readonly="readonly" value="" /> |
|
| 146 |
<input type="text" readonly="readonly" value="z" />
|
|
| 147 | 147 |
</div> |
| 148 | 148 |
</section> |
| 149 | 149 |
|
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/images/font-icons/kpal/DASHboard.svg | ||
|---|---|---|
| 1 |
<?xml version="1.0" encoding="utf-8"?> |
|
| 2 |
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> |
|
| 3 |
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> |
|
| 4 |
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" |
|
| 5 |
width="250px" height="250px" viewBox="0 0 250 250" enable-background="new 0 0 250 250" xml:space="preserve"> |
|
| 6 |
<g> |
|
| 7 |
<g> |
|
| 8 |
<path d="M124.5,52.625c-45.479,0-82.479,37.086-82.479,82.671c0,23.117,9.438,44.786,27.294,61.87L69.75,198h109.494l0.436-0.834 |
|
| 9 |
c17.858-17.086,27.299-38.564,27.299-61.718C206.979,89.895,169.979,52.625,124.5,52.625z M178.038,195H70.957 |
|
| 10 |
c-16.971-17-25.936-37.191-25.936-59.285c0-43.93,35.654-79.881,79.479-79.881s79.479,36.029,79.479,79.929 |
|
| 11 |
C203.979,157.891,195.012,178,178.038,195z"/> |
|
| 12 |
<rect x="123" y="68" width="3" height="19"/> |
|
| 13 |
<rect x="174" y="132" width="19" height="3"/> |
|
| 14 |
<rect x="57" y="132" width="19" height="3"/> |
|
| 15 |
<rect x="73.77" y="91.088" transform="matrix(-0.7071 -0.7071 0.7071 -0.7071 76.6672 217.3087)" width="19.135" height="3.377"/> |
|
| 16 |
<rect x="158.188" y="91.088" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -16.4706 145.788)" width="19.135" height="3.377"/> |
|
| 17 |
<path d="M123.065,96.925l-5.212,69.183l-0.099,1.596L117.059,170h0.371h0.524c0.699,3,3.19,5.336,7.021,5.336 |
|
| 18 |
c3.87,0,6.372-2.336,7.041-5.336h0.372l-6.333-72.674L123.065,96.925z M129.188,167.592c-0.129,2.736-1.429,3.957-4.212,3.957 |
|
| 19 |
c-2.784,0-4.083-1.221-4.213-3.958l-0.007-0.099l3.918-51.987l4.532,51.698L129.188,167.592z"/> |
|
| 20 |
</g> |
|
| 21 |
</g> |
|
| 22 |
</svg> |
|
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/images/font-icons/kpal/HDD.svg | ||
|---|---|---|
| 1 |
<?xml version="1.0" encoding="utf-8"?> |
|
| 2 |
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> |
|
| 3 |
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> |
|
| 4 |
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" |
|
| 5 |
width="250px" height="250px" viewBox="0 0 250 250" enable-background="new 0 0 250 250" xml:space="preserve"> |
|
| 6 |
<g> |
|
| 7 |
<path d="M200.03,118.521c0-38.625-31.429-70.049-70.06-70.049c-38.625,0-70.048,31.424-70.048,70.049 |
|
| 8 |
c0,2.055,0.106,4.202,0.304,6.381c-0.201,2.821-0.304,4.438-0.304,6.515c0,8.582,1.566,17.082,4.619,25.077L48.97,164.63 |
|
| 9 |
l16.436,19.553l9.196-9.772c13.214,17.013,33.752,27.118,55.309,27.118c38.591,0,69.986-31.394,69.986-69.98 |
|
| 10 |
c0-1.777-0.083-3.656-0.252-5.734C199.897,123.365,200.03,120.912,200.03,118.521z M67.201,155.104 |
|
| 11 |
c-1.739-4.618-2.952-9.375-3.632-14.229c1.518,4.503,3.504,8.85,5.951,13.017L67.201,155.104z M53.67,165.56l13.438-7.022l0,0 |
|
| 12 |
l5.215-2.725l-0.022-0.042h0l0.022,0.042l30.813-16.104l-22.634,24.054l0,0l-1.082,1.149l0,0l-5.788,6.15l-8.101,8.608 |
|
| 13 |
L53.67,165.56z M129.91,198.528c-20.789,0-40.591-9.818-53.229-26.328l3.326-3.535l0.527-0.56 |
|
| 14 |
c13.224,13.204,30.716,20.456,49.436,20.456c30.441,0,56.585-19.307,66.164-46.901C191.244,173.812,163.408,198.528,129.91,198.528 |
|
| 15 |
z M129.971,185.562c-17.945,0-34.7-6.98-47.365-19.656l28.81-30.616l-1.787-2.357l-37.367,19.215 |
|
| 16 |
C67.214,143.67,64.164,134,63.232,124h-0.019c-0.189-2-0.291-3.83-0.291-5.793c0-36.971,30.078-66.893,67.048-66.893 |
|
| 17 |
c36.977,0,67.06,30.156,67.06,67.127c0,2.34-0.128,4.779-0.382,7.175C193.033,159.769,164.367,185.562,129.971,185.562z"/> |
|
| 18 |
<path d="M129.971,104.235c-7.867,0-14.268,6.408-14.268,14.285c0,7.867,6.4,14.268,14.268,14.268c7.866,0,14.267-6.4,14.267-14.268 |
|
| 19 |
C144.237,110.644,137.837,104.235,129.971,104.235z M129.971,129.788c-6.213,0-11.268-5.055-11.268-11.268 |
|
| 20 |
c0-6.223,5.054-11.285,11.268-11.285c6.213,0,11.267,5.062,11.267,11.285C141.237,124.733,136.184,129.788,129.971,129.788z"/> |
|
| 21 |
</g> |
|
| 22 |
</svg> |
|
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/images/font-icons/kpal/PC.svg | ||
|---|---|---|
| 1 |
<?xml version="1.0" encoding="utf-8"?> |
|
| 2 |
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> |
|
| 3 |
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> |
|
| 4 |
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" |
|
| 5 |
width="250px" height="250px" viewBox="0 0 250 250" enable-background="new 0 0 250 250" xml:space="preserve"> |
|
| 6 |
<g> |
|
| 7 |
<g> |
|
| 8 |
<path d="M193.764,197.29H56.236v-37.092h58.324v-11.113H64.255V52.997h121.479v96.088h-47.302v11.113h55.332V197.29z |
|
| 9 |
M59.236,194.29h131.527v-31.092h-55.332v-17.113h47.302V55.997H67.255v90.088h50.306v17.113H59.236V194.29z"/> |
|
| 10 |
</g> |
|
| 11 |
</g> |
|
| 12 |
</svg> |
|
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/images/font-icons/kpal/PC_fill.svg | ||
|---|---|---|
| 1 |
<?xml version="1.0" encoding="utf-8"?> |
|
| 2 |
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> |
|
| 3 |
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> |
|
| 4 |
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" |
|
| 5 |
width="250px" height="250px" viewBox="0 0 250 250" enable-background="new 0 0 250 250" xml:space="preserve"> |
|
| 6 |
<g> |
|
| 7 |
<g> |
|
| 8 |
<path d="M193.764,197.29H56.236v-37.092h58.324v-11.113H64.255V52.997h121.479v96.088h-47.303v11.113h55.332V197.29 |
|
| 9 |
L193.764,197.29z"/> |
|
| 10 |
</g> |
|
| 11 |
</g> |
|
| 12 |
</svg> |
|
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/images/font-icons/kpal/Pithos.svg | ||
|---|---|---|
| 1 |
<?xml version="1.0" encoding="utf-8"?> |
|
| 2 |
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> |
|
| 3 |
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> |
|
| 4 |
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" |
|
| 5 |
width="250px" height="250px" viewBox="0 0 250 250" enable-background="new 0 0 250 250" xml:space="preserve"> |
|
| 6 |
<g> |
|
| 7 |
<g> |
|
| 8 |
<path d="M123.796,74.069c0.225,0.002,0.447,0.003,0.672,0.003c13.821,0,28.525-3.833,29.043-11.08l-3.105-0.221 |
|
| 9 |
c-0.284,3.982-11.272,8.295-26.582,8.185c-14.676-0.12-25.063-4.442-25.209-8.247l-3.111,0.119 |
|
| 10 |
C95.775,69.981,110.284,73.959,123.796,74.069z"/> |
|
| 11 |
<path d="M92.085,80.197c0.348,6.349,16.639,9.351,31.627,9.453c0.277,0.002,0.554,0.003,0.831,0.003 |
|
| 12 |
c15.777,0,31.772-3.164,32.358-9.325l-3.1-0.295c-0.223,2.342-10.763,6.637-30.068,6.504c-18.511-0.127-28.419-4.306-28.54-6.51 |
|
| 13 |
L92.085,80.197z"/> |
|
| 14 |
<path d="M123.368,113.409c0.456,0.004,0.909,0.007,1.363,0.007c11.561,0,22.509-1.393,30.96-3.948 |
|
| 15 |
c9.432-2.852,14.599-6.767,14.94-11.321l-3.104-0.232c-0.446,5.941-18.044,12.388-42.78,12.388c-0.447,0-0.899-0.002-1.352-0.006 |
|
| 16 |
c-24.752-0.201-41.671-6.622-41.941-12.494l-3.11,0.145C78.797,107.756,101.881,113.234,123.368,113.409z"/> |
|
| 17 |
<path d="M123.133,138.985c0.465,0.004,0.928,0.005,1.392,0.005c14.299,0,27.833-1.616,38.243-4.576 |
|
| 18 |
c7.985-2.271,17.615-6.345,18.147-12.86l-3.104-0.254c-0.293,3.59-6.235,7.372-15.896,10.119 |
|
| 19 |
c-10.471,2.978-24.231,4.548-38.761,4.453c-30.689-0.221-51.644-7.779-51.96-14.7l-3.11,0.143 |
|
| 20 |
C68.599,132.539,96.83,138.796,123.133,138.985z"/> |
|
| 21 |
<path d="M184.676,145.062c-0.702,8.311-25.678,16.991-61.685,16.696c-15.896-0.103-30.786-2.03-41.925-5.427 |
|
| 22 |
c-10.44-3.184-16.54-7.352-16.734-11.434l-3.11,0.148c0.603,12.621,32.264,19.635,61.746,19.825 |
|
| 23 |
c0.547,0.005,1.094,0.007,1.642,0.007c30.525,0,62.126-7.204,63.169-19.555L184.676,145.062z"/> |
|
| 24 |
<path d="M123.396,184.286c-24.746-0.194-41.665-7.213-41.941-13.646l-3.11,0.133c0.398,9.279,19.756,16.427,45.025,16.626 |
|
| 25 |
c0.354,0.003,0.708,0.005,1.062,0.005c22.334,0,45.479-6.065,46.201-16.434l-3.106-0.217 |
|
| 26 |
C166.956,178.949,143.843,184.501,123.396,184.286z"/> |
|
| 27 |
<path d="M123.828,203.922c-14.847-0.173-24.972-5.22-25.112-9.824l-3.112,0.096c0.218,7.137,12.337,12.657,28.191,12.842 |
|
| 28 |
c0.227,0.002,0.45,0.003,0.676,0.003c15.824,0,28.474-5.525,28.928-12.707l-3.107-0.197 |
|
| 29 |
C149.916,200.053,136.064,204.08,123.828,203.922z"/> |
|
| 30 |
<path d="M94.872,52.26c7.621,1.589,17.775,2.489,28.59,2.536l1.139,0.003c14.324,0,41.664-2.005,42.605-9.596l0.216-1.739 |
|
| 31 |
L124.5,43.249l-42.797,0.064l0.085,1.636C81.951,48.066,86.231,50.457,94.872,52.26z M124.494,46.362l37.647,0.188 |
|
| 32 |
c-4.67,2.352-17.51,5.135-37.541,5.135l-1.123-0.003c-20.01-0.087-32.558-2.925-36.885-5.263L124.494,46.362z"/> |
|
| 33 |
</g> |
|
| 34 |
</g> |
|
| 35 |
</svg> |
|
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/images/font-icons/kpal/network.svg | ||
|---|---|---|
| 1 |
<?xml version="1.0" encoding="utf-8"?> |
|
| 2 |
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> |
|
| 3 |
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> |
|
| 4 |
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" |
|
| 5 |
width="250px" height="250px" viewBox="0 0 250 250" enable-background="new 0 0 250 250" xml:space="preserve"> |
|
| 6 |
<g> |
|
| 7 |
<path d="M195.619,158.137c-1.938-1.934-4.513-2.998-7.248-2.998c-2.734,0-5.306,1.065-7.238,2.999 |
|
| 8 |
c-0.175,0.175-0.334,0.36-0.495,0.546l-47.731-29.869c0.3-0.933,0.462-1.898,0.488-2.869l36.092-0.037 |
|
| 9 |
c0.671,5.01,4.958,8.889,10.142,8.889c5.649,0,10.246-4.601,10.246-10.256c0-5.648-4.597-10.244-10.246-10.244 |
|
| 10 |
c-5.19,0-9.481,3.885-10.145,8.896l-36.376,0.037c-0.394-1.631-1.191-3.179-2.392-4.491l41.051-42.554 |
|
| 11 |
c1.699,1.252,3.791,2.002,6.059,2.002c5.648,0,10.244-4.596,10.244-10.244c0-5.654-4.596-10.254-10.244-10.254 |
|
| 12 |
c-5.649,0-10.245,4.6-10.245,10.254c0,2.473,0.881,4.743,2.345,6.515l-41.013,42.708c-1.182-0.801-1.912-1.336-3.912-1.587V61.805 |
|
| 13 |
c2-0.364,3.924-1.334,5.426-2.834c3.982-3.994,3.98-10.494-0.004-14.491c-1.938-1.936-4.514-3.001-7.253-3.001 |
|
| 14 |
c-2.736,0-5.31,1.063-7.248,2.996c-3.993,3.991-3.985,10.495,0.012,14.497c1.651,1.654,4.066,2.666,6.066,2.927v53.586 |
|
| 15 |
c-1,0.164-2.823,0.634-4.059,1.369l-39-39.496c1.237-1.693,1.976-3.771,1.976-6.023c0-5.654-4.596-10.254-10.245-10.254 |
|
| 16 |
s-10.245,4.6-10.245,10.254c0,5.648,4.596,10.244,10.244,10.244c2.403,0,4.611-0.838,6.36-2.229l38.692,39.275 |
|
| 17 |
c-1.255,1.328-2.083,2.911-2.49,4.581l-42.451-0.111c-0.287-2.233-1.289-4.301-2.908-5.919c-1.937-1.938-4.51-3.005-7.245-3.005 |
|
| 18 |
c-2.736,0-5.309,1.067-7.243,3.004c-1.938,1.936-3.004,4.51-3.004,7.249c0,2.737,1.066,5.312,3.005,7.252 |
|
| 19 |
c1.935,1.928,4.505,2.989,7.237,2.989l0,0c2.737,0,5.312-1.065,7.249-3c1.604-1.604,2.601-3.647,2.899-5.855l42.169,0.111 |
|
| 20 |
c0.013,0.463,0.057,0.925,0.132,1.382l-42.291,17.475c-1.775-3.054-5.076-5.117-8.855-5.117c-5.648,0-10.244,4.596-10.244,10.244 |
|
| 21 |
s4.596,10.244,10.244,10.244s10.244-4.596,10.244-10.244c0-0.906-0.13-1.781-0.353-2.618l42.049-17.372 |
|
| 22 |
c0.493,1.082,1.174,2.1,2.062,2.989c0.196,0.197,0.404,0.38,0.614,0.559L95.869,169.23c-1.243-0.522-2.589-0.799-3.976-0.799 |
|
| 23 |
c-2.734,0-5.306,1.065-7.238,2.999c-1.937,1.935-3.002,4.508-3.001,7.244c0.001,2.74,1.07,5.317,3.013,7.256 |
|
| 24 |
c1.931,1.929,4.502,2.991,7.239,2.991s5.311-1.062,7.251-2.994c3.985-4.003,3.984-10.503-0.005-14.492 |
|
| 25 |
c-0.299-0.299-0.618-0.568-0.945-0.824l20.622-35.679c1.343,0.63,2.814,0.974,4.343,0.974c0.401,0,0.798-0.029,1.19-0.075 |
|
| 26 |
l12.465,54.145c-3.876,1.462-6.646,5.198-6.646,9.579c0,5.654,4.596,10.254,10.244,10.254c5.65,0,10.247-4.6,10.247-10.254 |
|
| 27 |
c0-5.648-4.597-10.244-10.247-10.244c-0.321,0-0.64,0.02-0.954,0.049l-12.475-54.192c1.267-0.509,2.431-1.271,3.426-2.265 |
|
| 28 |
c0.501-0.502,0.938-1.045,1.313-1.617l47.41,29.666c-0.659,1.369-1.018,2.875-1.017,4.438c0.001,2.736,1.068,5.308,3.002,7.235 |
|
| 29 |
c1.937,1.944,4.513,3.015,7.254,3.015h0.001c2.735,0,5.306-1.067,7.235-3.003C199.618,168.637,199.617,162.134,195.619,158.137z |
|
| 30 |
M61.927,157.148c-3.995,0-7.244-3.25-7.244-7.244s3.249-7.244,7.244-7.244c3.994,0,7.244,3.25,7.244,7.244 |
|
| 31 |
S65.921,157.148,61.927,157.148z M97.035,183.807c-1.369,1.364-3.191,2.115-5.129,2.115c-1.937,0-3.755-0.75-5.12-2.114 |
|
| 32 |
c-1.374-1.372-2.132-3.195-2.132-5.134c-0.001-1.935,0.753-3.753,2.122-5.121c1.367-1.368,3.185-2.121,5.117-2.121 |
|
| 33 |
c1.938,0,3.764,0.756,5.14,2.127C99.853,176.379,99.852,180.978,97.035,183.807z M147.672,199.555c0,4-3.251,7.254-7.247,7.254 |
|
| 34 |
c-3.994,0-7.244-3.254-7.244-7.254c0-3.994,3.25-7.244,7.244-7.244C144.421,192.311,147.672,195.561,147.672,199.555z |
|
| 35 |
M179.628,117.297c3.995,0,7.246,3.25,7.246,7.244c0,4.001-3.251,7.256-7.246,7.256c-3.994,0-7.244-3.255-7.244-7.256 |
|
| 36 |
C172.384,120.547,175.634,117.297,179.628,117.297z M177.825,60.689c3.995,0,7.244,3.254,7.244,7.254 |
|
| 37 |
c0,3.994-3.249,7.244-7.244,7.244s-7.245-3.25-7.245-7.244C170.58,63.943,173.83,60.689,177.825,60.689z M118.041,46.598 |
|
| 38 |
c1.37-1.367,3.19-2.119,5.127-2.119c1.938,0,3.761,0.754,5.13,2.121c2.817,2.827,2.817,7.427,0.002,10.251 |
|
| 39 |
c-1.37,1.368-3.191,2.122-5.128,2.122c-1.936,0-3.754-0.753-5.12-2.12C115.223,54.02,115.219,49.419,118.041,46.598z |
|
| 40 |
M70.671,78.578c-3.995,0-7.244-3.25-7.244-7.244c0-4,3.249-7.254,7.244-7.254c3.994,0,7.244,3.254,7.244,7.254 |
|
| 41 |
C77.915,75.328,74.665,78.578,70.671,78.578z M65.753,129.542c-1.371,1.369-3.192,2.123-5.129,2.123 |
|
| 42 |
c-1.933,0-3.751-0.751-5.117-2.112c-1.371-1.371-2.125-3.192-2.125-5.129c0-1.938,0.754-3.758,2.125-5.127 |
|
| 43 |
c1.369-1.371,3.188-2.126,5.122-2.126c1.934,0,3.753,0.755,5.124,2.127c1.369,1.368,2.124,3.188,2.124,5.122 |
|
| 44 |
S67.122,128.174,65.753,129.542z M128.3,130.782c-1.371,1.369-3.191,2.124-5.128,2.124c-1.936,0-3.754-0.754-5.12-2.122 |
|
| 45 |
c-2.829-2.833-2.833-7.434-0.011-10.255c1.369-1.366,3.19-2.118,5.127-2.118c1.938,0,3.761,0.754,5.13,2.12 |
|
| 46 |
C131.115,123.358,131.115,127.958,128.3,130.782z M193.498,170.518c-1.364,1.368-3.18,2.122-5.112,2.122h-0.001 |
|
| 47 |
c-1.938,0-3.759-0.757-5.133-2.136c-1.368-1.364-2.122-3.182-2.123-5.116c-0.001-1.937,0.754-3.758,2.125-5.128 |
|
| 48 |
c1.367-1.368,3.185-2.121,5.117-2.121c1.936,0,3.758,0.754,5.129,2.121C196.327,163.086,196.326,167.687,193.498,170.518z"/> |
|
| 49 |
</g> |
|
| 50 |
</svg> |
|
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/index.html | ||
|---|---|---|
| 21 | 21 |
<h2>Misc</h2> |
| 22 | 22 |
<ul> |
| 23 | 23 |
<li><a href="icon_guide.html">Info about Icon-Font</a></li> |
| 24 |
<li><a href="vm_list_test_icon.html">Icon-Font samples in UI</a></li> |
|
| 24 | 25 |
</ul> |
| 25 | 26 |
|
| 26 | 27 |
<h2>Kpal original designs</h2> |
| ... | ... | |
| 28 | 29 |
<li><a href="vm_list.html">VMs list page</a> (kpal original design)</li> |
| 29 | 30 |
<li><a href="vm_details.html">VM details page</a> (kpal original design)</li> |
| 30 | 31 |
<li><a href="vm_create_a.html">Create new machine</a> (kpal original design)</li> |
| 31 |
<li><a href="network_list_.html">Networks list page</a> (kpal original design)</li>
|
|
| 32 |
<li><a href="network_list.html">Networks list page</a> (kpal original design)</li> |
|
| 32 | 33 |
<li><a href="network_details.html">Network details page</a> (kpal original design) |
| 33 | 34 |
<li><a href="network_create.html">Create new network</a></li> |
| 34 | 35 |
|
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/network_list_test_icon.html | ||
|---|---|---|
| 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 | Network list</title> |
|
| 11 |
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin,greek-ext,greek' rel='stylesheet' type='text/css'> |
|
| 12 |
<link rel="stylesheet" href="stylesheets/font_custom.css" /> |
|
| 13 |
<link rel="stylesheet" href="stylesheets/styles_test_icon.css" /> |
|
| 14 |
<link rel="stylesheet" href="stylesheets/normalize.css" /> |
|
| 15 |
<link rel="stylesheet" href="stylesheets/app.css" /> |
|
| 16 |
<link rel="stylesheet" href="stylesheets/jquery.jscrollpane.css" media="all" /> |
|
| 17 |
<script src="javascripts/vendor/custom.modernizr.js"></script> |
|
| 18 |
|
|
| 19 |
</head> |
|
| 20 |
<body> |
|
| 21 |
<div class="dummy-navigation"> |
|
| 22 |
<a href="" class="close">X</a> |
|
| 23 |
<a href="index.html">Homepage</a><br> |
|
| 24 |
<a href="" class="our" data-our="questions">Show/Hide questions</a><br> |
|
| 25 |
<a href="" class="our" data-our="suggestions">Show/Hide suggestions</a><br> |
|
| 26 |
<a href="" class="our" data-our="problems">Show/Hide problems</a><br> |
|
| 27 |
</div> |
|
| 28 |
<div class="row-full"> |
|
| 29 |
<header class="header"> |
|
| 30 |
|
|
| 31 |
<div class="logo"> |
|
| 32 |
<a href="index.html"><img src="images/logo_01.png" alt="software logo"></a> |
|
| 33 |
</div> |
|
| 34 |
|
|
| 35 |
<nav class="top-nav menu2 icons-nav"> |
|
| 36 |
|
|
| 37 |
<ul> |
|
| 38 |
<li><a href="pithos_list_test_icon.html" data-tooltip class="has-tip" title="Storage" ><span class="snf-font">y</span></a></li> |
|
| 39 |
<li><a href="vm_list_test_icon.html" data-tooltip class="has-tip" title="Machines"><span class="snf-font">w</span></a></li> |
|
| 40 |
|
|
| 41 |
<li><a href="" data-tooltip class="has-tip" title="Disks"><span class="snf-font">u</span></a></li> |
|
| 42 |
<li><a href="network_list_test_icon.html" data-tooltip class="has-tip" title="Networks"><span class="snf-font">v</span></a></li> |
|
| 43 |
<li><a href="" data-tooltip class="has-tip" title="Dashboard"><span class="snf-font">z</span></a></li> |
|
| 44 |
</ul> |
|
| 45 |
|
|
| 46 |
</nav> |
|
| 47 |
|
|
| 48 |
<div class="login"> |
|
| 49 |
<a href="">test@grnet.gr</a> |
|
| 50 |
</div> |
|
| 51 |
<div class="actions clearfix"> |
|
| 52 |
|
|
| 53 |
<div class="lt-actions"> |
|
| 54 |
<div class="new-btn"><a href="network_create.html"><span>+</span> NEW NETWORK</a></div> |
|
| 55 |
</div> |
|
| 56 |
<div class="main-actions"> |
|
| 57 |
<ul> |
|
| 58 |
<li class="running single"><a href="">Add machine</a></li> |
|
| 59 |
<li class="both"><a href="">Destroy</a></li> |
|
| 60 |
</ul> |
|
| 61 |
</div> |
|
| 62 |
</div> |
|
| 63 |
</div> |
|
| 64 |
</header> |
|
| 65 |
<div class="info top-info alert"> |
|
| 66 |
<div class="wrap"> |
|
| 67 |
<p>ALERT!</p> |
|
| 68 |
|
|
| 69 |
<p>Nunc at velit quis lectus nonummy eleifend. Curabitur eros. Aenean ligula dolor, gravida auctor, auctor et, neque ut neque. In at libero. </p> |
|
| 70 |
</div> |
|
| 71 |
<a href="#" class="close" title="hide message">close</a> |
|
| 72 |
</div> |
|
| 73 |
|
|
| 74 |
</div> |
|
| 75 |
<div class="row-full wrapper"> |
|
| 76 |
|
|
| 77 |
|
|
| 78 |
<!-- main area --> |
|
| 79 |
<section class="main onecol"> |
|
| 80 |
|
|
| 81 |
<div class="networks entities"> |
|
| 82 |
<ul class="items-list small-block-grid-2 large-block-grid-3 sortable"> |
|
| 83 |
<li data-order="0"> |
|
| 84 |
<div class="container"> |
|
| 85 |
<div class="options"> |
|
| 86 |
<div class="wrap"> |
|
| 87 |
<a href="network_details.html">details</a> |
|
| 88 |
</div> |
|
| 89 |
</div> |
|
| 90 |
<div class="img-wrap"> |
|
| 91 |
<div class="img running"> |
|
| 92 |
<div class="snf-font">v</div> |
|
| 93 |
</div> |
|
| 94 |
</div> |
|
| 95 |
|
|
| 96 |
<p class="visible-info"> |
|
| 97 |
<span><em>IPv4 83.212.97.127</em></span> |
|
| 98 |
<span class="title"><em>Network Name</em></span> |
|
| 99 |
</p> |
|
| 100 |
<a href="" class="check"><span class="custom_checkbox snf-custom-checkbox">a</span></a> |
|
| 101 |
|
|
| 102 |
</div> |
|
| 103 |
</li> |
|
| 104 |
<li data-order="1"> |
|
| 105 |
<div class="container"> |
|
| 106 |
<div class="options"> |
|
| 107 |
<div class="wrap"> |
|
| 108 |
|
|
| 109 |
<a href="network_details.html">details</a> |
|
| 110 |
|
|
| 111 |
</div> |
|
| 112 |
</div> |
|
| 113 |
<div class="img-wrap"> |
|
| 114 |
<div class="img running"> |
|
| 115 |
<div class="snf-font">v</div> |
|
| 116 |
|
|
| 117 |
</div> |
|
| 118 |
</div> |
|
| 119 |
|
|
| 120 |
<p class="visible-info"> |
|
| 121 |
<span><em>IPv4 83.212.97.127</em></span> |
|
| 122 |
<span class="title"><em>Network Name</em></span> |
|
| 123 |
</p> |
|
| 124 |
<a href="" class="check"><span class="custom_checkbox snf-custom-checkbox">a</span></a> |
|
| 125 |
|
|
| 126 |
</div> |
|
| 127 |
</li> |
|
| 128 |
|
|
| 129 |
<li data-order="2"> |
|
| 130 |
<div class="container"> |
|
| 131 |
<div class="options"> |
|
| 132 |
<div class="wrap"> |
|
| 133 |
|
|
| 134 |
<a href="network_details.html">details</a> |
|
| 135 |
|
|
| 136 |
</div> |
|
| 137 |
</div> |
|
| 138 |
<div class="img-wrap"> |
|
| 139 |
<div class="img running"> |
|
| 140 |
<div class="snf-font bolding">v</div> |
|
| 141 |
</div> |
|
| 142 |
</div> |
|
| 143 |
|
|
| 144 |
<p class="visible-info"> |
|
| 145 |
<span><em>IPv4 83.212.97.127</em></span> |
|
| 146 |
<span class="title"><em>Network Name</em></span> |
|
| 147 |
</p> |
|
| 148 |
<a href="" class="check"><span class="custom_checkbox snf-custom-checkbox">a</span></a> |
|
| 149 |
|
|
| 150 |
</div> |
|
| 151 |
</li> |
|
| 152 |
|
|
| 153 |
|
|
| 154 |
<li data-order="3"> |
|
| 155 |
<div class="add-new"><a href="network_create.html">NEW<br>NETWORK</a></div> |
|
| 156 |
</li> |
|
| 157 |
|
|
| 158 |
</ul> |
|
| 159 |
</div> |
|
| 160 |
</section> |
|
| 161 |
</div> |
|
| 162 |
<div class="extras"> |
|
| 163 |
<span data-tooltip class="has-tip ours suggestions" title="Μήπως να είναι λίγο πιο έντονα τα χρώματα; Μοιάζουν απενεργοποιημένα..." style="top:0;left:200px">:)</span> |
|
| 164 |
<span data-tooltip class="has-tip ours questions" title="Πόσο θα είναι το μέγιστο πλάτος της κύριας περιοχής" style="top:240px;left:20px">?</span> |
|
| 165 |
<span data-tooltip class="has-tip ours problems" title="Πώς θα έχουμε δράσεις όπως filters κτλ" style="top:140px;left:250px">!!</span> |
|
| 166 |
</div> |
|
| 167 |
<div id="vm-connect" class="reveal-modal medium"> |
|
| 168 |
<p>A direct connection to this machine can be established using the <a target="_blank" href="http://en.wikipedia.org/wiki/Secure_Shell">SSH Protocol</a>. To do so open a terminal and type the following at the prompt to connect to your machine:</p> |
|
| 169 |
<p class="ssh"><span>ssh user@snf-38389.vm.okeanos.grnet.gr</spam></p> |
|
| 170 |
|
|
| 171 |
<p class="info">Keep in mind that recently rebooted or created VMs may take up to 5 minutes to connect to them.</p> |
|
| 172 |
<p class="info">Keep in mind that recently rebooted or created VMs may take up to 5 minutes to connect to them.</p> |
|
| 173 |
<a class="close-reveal-modal" title="close window">×</a> |
|
| 174 |
</div> |
|
| 175 |
|
|
| 176 |
<script src="javascripts/vendor/jquery.js"></script> |
|
| 177 |
<script src="javascripts/jquery-ui-1.10.3.custom.min.js"></script> |
|
| 178 |
<script src="javascripts/foundation/foundation.js"></script> |
|
| 179 |
|
|
| 180 |
<script src="javascripts/foundation/foundation.alerts.js"></script> |
|
| 181 |
|
|
| 182 |
<script src="javascripts/foundation/foundation.clearing.js"></script> |
|
| 183 |
|
|
| 184 |
<script src="javascripts/foundation/foundation.cookie.js"></script> |
|
| 185 |
|
|
| 186 |
<script src="javascripts/foundation/foundation.dropdown.js"></script> |
|
| 187 |
|
|
| 188 |
<script src="javascripts/foundation/foundation.forms.js"></script> |
|
| 189 |
|
|
| 190 |
<script src="javascripts/foundation/foundation.joyride.js"></script> |
|
| 191 |
|
|
| 192 |
<script src="javascripts/foundation/foundation.magellan.js"></script> |
|
| 193 |
|
|
| 194 |
<script src="javascripts/foundation/foundation.orbit.js"></script> |
|
| 195 |
|
|
| 196 |
<script src="javascripts/foundation/foundation.placeholder.js"></script> |
|
| 197 |
|
|
| 198 |
<script src="javascripts/foundation/foundation.reveal.js"></script> |
|
| 199 |
|
|
| 200 |
<script src="javascripts/foundation/foundation.section.js"></script> |
|
| 201 |
|
|
| 202 |
<script src="javascripts/foundation/foundation.tooltips.js"></script> |
|
| 203 |
|
|
| 204 |
<script src="javascripts/foundation/foundation.topbar.js"></script> |
|
| 205 |
<script type="text/javascript" src="javascripts/dropzone.js"></script> |
|
| 206 |
|
|
| 207 |
<script src="javascripts/common.js"></script> |
|
| 208 |
<script type="text/javascript" src="javascripts/jquery.mousewheel.js"></script> |
|
| 209 |
<script type="text/javascript" src="javascripts/jquery.jscrollpane.js"></script> |
|
| 210 |
<script type="text/javascript" src="javascripts/dropzone.js"></script> |
|
| 211 |
<script src="javascripts/glafkopis.js"></script> |
|
| 212 |
<script> |
|
| 213 |
$(document).foundation(); |
|
| 214 |
</script> |
|
| 215 |
</body> |
|
| 216 |
</html> |
|
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/pithos_list_test_icon.html | ||
|---|---|---|
| 1 |
|
|
| 2 |
<!DOCTYPE html> |
|
| 3 |
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]--> |
|
| 4 |
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]--> |
|
| 5 |
|
|
| 6 |
<head> |
|
| 7 |
<meta charset="utf-8" /> |
|
| 8 |
<meta name="viewport" content="width=device-width" /> |
|
| 9 |
<title>Synnefo | Pithos list</title> |
|
| 10 |
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin,greek-ext,greek' rel='stylesheet' type='text/css'> |
|
| 11 |
<link rel="stylesheet" href="stylesheets/normalize.css" /> |
|
| 12 |
<link rel="stylesheet" href="stylesheets/app.css" /> |
|
| 13 |
<link rel="stylesheet" href="stylesheets/styles_test_icon.css" /> |
|
| 14 |
<link rel="stylesheet" href="stylesheets/font_custom.css" /> |
|
| 15 |
<link rel="stylesheet" href="stylesheets/magnific-popup.css" /> |
|
| 16 |
|
|
| 17 |
<link rel="stylesheet" href="stylesheets/jquery.jscrollpane.css" media="all" /> |
|
| 18 |
<script src="javascripts/vendor/custom.modernizr.js"></script> |
|
| 19 |
|
|
| 20 |
</head> |
|
| 21 |
<body> |
|
| 22 |
|
|
| 23 |
<div class="row-full"> |
|
| 24 |
<header class="header"> |
|
| 25 |
|
|
| 26 |
<div class="logo"> |
|
| 27 |
<img src="images/logo_01.png" alt="software logo"> |
|
| 28 |
</div> |
|
| 29 |
|
|
| 30 |
<nav class="top-nav menu3 icons-nav"> |
|
| 31 |
|
|
| 32 |
<ul> |
|
| 33 |
<li><a href="pithos_list_test_icon.html" data-tooltip class="has-tip" title="Storage" ><span class="snf-font">s</span></a></li> |
|
| 34 |
<li><a href="vm_list_test_icon.html" data-tooltip class="has-tip" title="Machines"><span class="snf-font">w</span></a></li> |
|
| 35 |
|
|
| 36 |
<li><a href="" data-tooltip class="has-tip" title="Disks"><span class="snf-font">t</span></a></li> |
|
| 37 |
<li><a href="network_list_test_icon.html" data-tooltip class="has-tip" title="Networks"><span class="snf-font">v</span></a></li> |
|
| 38 |
<li><a href="" data-tooltip class="has-tip" title="Dashboard"><span class="snf-font">z</span></a></li> |
|
| 39 |
</ul> |
|
| 40 |
|
|
| 41 |
</nav> |
|
| 42 |
|
|
| 43 |
<div class="login"> |
|
| 44 |
<a href="">test@grnet.gr</a> |
|
| 45 |
</div> |
|
| 46 |
<div class="actions clearfix"> |
|
| 47 |
|
|
| 48 |
<div class="lt-actions"> |
|
| 49 |
<div class="new-btn"><a href="#" data-overlay-id="#uploader"><span>+</span> UPLOAD </a></div> |
|
| 50 |
</div> |
|
| 51 |
<div class="main-actions"> |
|
| 52 |
<ul> |
|
| 53 |
<li class="running"><a href="" class="active">Action 1</a></li> |
|
| 54 |
<li class="both"><a href="" class="active">Action 2</a></li> |
|
| 55 |
</ul> |
|
| 56 |
</div> |
|
| 57 |
</div> |
|
| 58 |
</header> |
|
| 59 |
<div class="info top-info alert"> |
|
| 60 |
<div class="wrap"> |
|
| 61 |
<p>ALERT!</p> |
|
| 62 |
|
|
| 63 |
<p>Nunc at velit quis lectus nonummy eleifend. Curabitur eros. Aenean ligula dolor, gravida auctor, auctor et, neque ut neque. In at libero. </p> |
|
| 64 |
</div> |
|
| 65 |
<a href="#" class="close" title="hide message"></a> |
|
| 66 |
</div> |
|
| 67 |
|
|
| 68 |
</div> |
|
| 69 |
<div class="row-full overlay-wrapper storage"> |
|
| 70 |
<div class="overlay-area"> |
|
| 71 |
<a href="" class="close">close</a> |
|
| 72 |
<div id="uploader" class="overlay-div upload-widget"> |
|
| 73 |
<form action="#" class="dropzone" id="files-dropzone"> |
|
| 74 |
|
|
| 75 |
<h2>Drag and drop files here</h2> |
|
| 76 |
<ul class="breadcrumbs"> |
|
| 77 |
<li><a href="">shared by me</a></li> |
|
| 78 |
<li><a href="">folder 1</a></li> |
|
| 79 |
<li>folder 2</li> |
|
| 80 |
</ul> |
|
| 81 |
<ul class="files dropzone-files"></ul> |
|
| 82 |
|
|
| 83 |
</form> |
|
| 84 |
<div class="btns"> |
|
| 85 |
<a href="" class="browse-files">browse files</a> |
|
| 86 |
<a href="">change folder</a> |
|
| 87 |
<a href="">ok</a> |
|
| 88 |
</div> |
|
| 89 |
|
|
| 90 |
</div> |
|
| 91 |
|
|
| 92 |
</div> |
|
| 93 |
<div class="onecol"> |
|
| 94 |
<!-- sidebar --> |
|
| 95 |
<div class="lt-sidebar"> |
|
| 96 |
<nav class="sidenav"> |
|
| 97 |
<ul> |
|
| 98 |
<li><a href="">trash</a><span>></span></li> |
|
| 99 |
<li><a href="">shared with me</a><span>></span></li> |
|
| 100 |
<li><a href="">shared by me</a><span>></span></li> |
|
| 101 |
<li><a href="">groups</a><span>></span></li> |
|
| 102 |
</ul> |
|
| 103 |
</nav> |
|
| 104 |
<form action="" method=""> |
|
| 105 |
<input type="text" placeholder="search"> |
|
| 106 |
</form> |
|
| 107 |
</div> |
|
| 108 |
|
|
| 109 |
<div class="main content"> |
|
| 110 |
|
|
| 111 |
|
|
| 112 |
<div class="confirmation"></div> |
|
| 113 |
<ul class="breadcrumbs"> |
|
| 114 |
<li><a href="">shared by me</a></li> |
|
| 115 |
<li><a href="">folder 1</a></li> |
|
| 116 |
<li>folder 2</li> |
|
| 117 |
</ul> |
|
| 118 |
<ul class="files"> |
|
| 119 |
<li class="titles"> |
|
| 120 |
<div class="name-col">name</div> |
|
| 121 |
<div class="size-col">size</div> |
|
| 122 |
<div class="date-col">last modified</div> |
|
| 123 |
<div class="actions-col"> </div> |
|
| 124 |
</li> |
|
| 125 |
<li> |
|
| 126 |
<div class="name-col folder has-tip" data-tooltip title="metadata or info (ex. contains 3 files)">folder1</div> |
|
| 127 |
<div class="size-col">123KB</div> |
|
| 128 |
<div class="date-col">23/12/12 6:23 am</div> |
|
| 129 |
<div class="actions-col"> |
|
| 130 |
<a href="" class="delete has-tip" data-tooltip title="Delete"><span class="snf-font">n</span></a> |
|
| 131 |
<a href="" class="copy has-tip" data-tooltip title="Copy"><span class="snf-font">q</span></a> |
|
| 132 |
</div> |
|
| 133 |
</li> |
|
| 134 |
<li> |
|
| 135 |
<div class="name-col image">Image.png</div> |
|
| 136 |
<div class="size-col">123KB</div> |
|
| 137 |
<div class="date-col">23/12/12 4:23 pm</div> |
|
| 138 |
<div class="actions-col"> |
|
| 139 |
<a href="" class="delete has-tip" data-tooltip title="Delete"><span class="snf-font">n</span></a> |
|
| 140 |
<a href="" class="copy has-tip" data-tooltip title="Copy"><span class="snf-font">q</span></a> |
|
| 141 |
<a href="http://farm9.staticflickr.com/8235/8559402846_8b7f82e05d_b.jpg" class="show has-tip image" data-tooltip title="Copy" data-title="my Image">Show</a> |
|
| 142 |
</div> |
|
| 143 |
</li> |
|
| 144 |
<li> |
|
| 145 |
<div class="name-col image has-tip" data-tooltip title="metadata or info (ex. has been modified 3 times)">Myimage.jpg</div> |
|
| 146 |
<div class="size-col">5MB</div> |
|
| 147 |
<div class="date-col">23/12/12 6:23 am</div> |
|
| 148 |
<div class="actions-col"> |
|
| 149 |
<a href="" class="delete has-tip" data-tooltip title="Delete"><span class="snf-font">n</span></a> |
|
| 150 |
<a href="" class="copy has-tip" data-tooltip title="Copy"><span class="snf-font">q</span></a> |
|
| 151 |
<a href="http://farm9.staticflickr.com/8235/8559402846_8b7f82e05d_b.jpg" class="show has-tip image" data-tooltip title="Copy" data-title="yet another image">Show</a> |
|
| 152 |
</div> |
|
| 153 |
</li> |
|
| 154 |
<li> |
|
| 155 |
<div class="name-col pdf">mypdfile.pdf</div> |
|
| 156 |
<div class="size-col">123KB</div> |
|
| 157 |
<div class="date-col">23/12/12 6:23 am</div> |
|
| 158 |
<div class="actions-col"> |
|
| 159 |
<a href="" class="delete has-tip" data-tooltip title="Delete"><span class="snf-font">n</span></a> |
|
| 160 |
<a href="" class="copy has-tip" data-tooltip title="Copy"><span class="snf-font">q</span></a> |
|
| 161 |
</div> |
|
| 162 |
</li> |
|
| 163 |
<li> |
|
| 164 |
<div class="name-col folder">folder1</div> |
|
| 165 |
<div class="size-col">123KB</div> |
|
| 166 |
<div class="date-col">23/12/12 6:23 am</div> |
|
| 167 |
<div class="actions-col"> |
|
| 168 |
<a href="" class="delete has-tip" data-tooltip title="Delete"><span class="snf-font">n</span></a> |
|
| 169 |
<a href="" class="copy has-tip" data-tooltip title="Copy"><span class="snf-font">q</span></a> |
|
| 170 |
</div> |
|
| 171 |
</li> |
|
| 172 |
<li> |
|
| 173 |
<div class="name-col image">cool.jpg</div> |
|
| 174 |
<div class="size-col">5MB</div> |
|
| 175 |
<div class="date-col">23/12/12 6:23 am</div> |
|
| 176 |
<div class="actions-col"> |
|
| 177 |
<a href="" class="delete has-tip" data-tooltip title="Delete"><span class="snf-font">n</span></a> |
|
| 178 |
<a href="" class="copy has-tip" data-tooltip title="Copy"><span class="snf-font">q</span></a> |
|
| 179 |
<a href="http://farm9.staticflickr.com/8382/8558295631_0f56c1284f_b.jpg" class="show has-tip image" data-tooltip title="Copy" data-title="love this pic">Show</a> |
|
| 180 |
</div> |
|
| 181 |
</li> |
|
| 182 |
<li> |
|
| 183 |
<div class="name-col pdf">mypdfile.pdf</div> |
|
| 184 |
<div class="size-col">123KB</div> |
|
| 185 |
<div class="date-col">23/12/12 6:23 am</div> |
|
| 186 |
<div class="actions-col"> |
|
| 187 |
<a href="http://www.synnefo.org/images/synnefo-logo@2x.png" class="delete has-tip" data-tooltip title="Delete"><span class="snf-font">n</span></a> |
|
| 188 |
<a href="" class="copy has-tip" data-tooltip title="Copy"><span class="snf-font">q</span></a> |
|
| 189 |
</div> |
|
| 190 |
</li> |
|
| 191 |
<li> |
|
| 192 |
<div class="name-col folder">folder1</div> |
|
| 193 |
<div class="size-col">123KB</div> |
|
| 194 |
<div class="date-col">23/12/12 6:23 am</div> |
|
| 195 |
<div class="actions-col"> |
|
| 196 |
<a href="http://www.synnefo.org/images/synnefo-logo@2x.png" class="delete has-tip" data-tooltip title="Delete"><span class="snf-font">n</span></a> |
|
| 197 |
<a href="" class="copy has-tip" data-tooltip title="Copy"><span class="snf-font">q</span></a> |
|
| 198 |
</div> |
|
| 199 |
</li> |
|
| 200 |
<li> |
|
| 201 |
<div class="name-col txt">file1.txt</div> |
|
| 202 |
<div class="size-col">5MB</div> |
|
| 203 |
<div class="date-col">23/12/12 6:23 am</div> |
|
| 204 |
<div class="actions-col"> |
|
| 205 |
<a href="http://www.synnefo.org/images/synnefo-logo@2x.png" class="delete has-tip" data-tooltip title="Delete"><span class="snf-font">n</span></a> |
|
| 206 |
<a href="" class="copy has-tip" data-tooltip title="Copy"><span class="snf-font">q</span></a> |
|
| 207 |
<a href="http://farm9.staticflickr.com/8382/8558295631_0f56c1284f_b.jpg" class="show has-tip txt" data-tooltip title="Copy">Show</a> |
|
| 208 |
</div> |
|
| 209 |
</li> |
|
| 210 |
<li> |
|
| 211 |
<div class="name-col pdf">mypdfile.pdf</div> |
|
| 212 |
<div class="size-col">123KB</div> |
|
| 213 |
<div class="date-col">23/12/12 6:23 am</div> |
|
| 214 |
<div class="actions-col"> |
|
| 215 |
<a href="http://www.synnefo.org/images/synnefo-logo@2x.png" class="delete has-tip" data-tooltip title="Delete"><span class="snf-font">n</span></a> |
|
| 216 |
<a href="" class="copy has-tip" data-tooltip title="Copy"><span class="snf-font">q</span></a> |
|
| 217 |
</div> |
|
| 218 |
</li> |
|
| 219 |
</ul> |
|
| 220 |
|
|
| 221 |
</div> |
|
| 222 |
</div> |
|
| 223 |
<div class="progress-bar"> |
|
| 224 |
<div class="onecol"> |
|
| 225 |
<span class="counter">6 files uploading</span> |
|
| 226 |
<div class="progress-wrap"><div class="progress"><span class="meter" style="width:25%"></span></div></div> |
|
| 227 |
<span class="more"><a href="">details ></a></span> |
|
| 228 |
</div> |
|
| 229 |
</div> |
|
| 230 |
</div> |
|
| 231 |
|
|
| 232 |
|
|
| 233 |
<script src="javascripts/vendor/jquery.js"></script> |
|
| 234 |
<script src="javascripts/foundation/foundation.js"></script> |
|
| 235 |
|
|
| 236 |
<script src="javascripts/foundation/foundation.alerts.js"></script> |
|
| 237 |
|
|
| 238 |
<script src="javascripts/foundation/foundation.clearing.js"></script> |
|
| 239 |
|
|
| 240 |
<script src="javascripts/foundation/foundation.cookie.js"></script> |
|
| 241 |
|
|
| 242 |
<script src="javascripts/foundation/foundation.dropdown.js"></script> |
|
| 243 |
|
|
| 244 |
<script src="javascripts/foundation/foundation.forms.js"></script> |
|
| 245 |
|
|
| 246 |
<script src="javascripts/foundation/foundation.joyride.js"></script> |
|
| 247 |
|
|
| 248 |
<script src="javascripts/foundation/foundation.magellan.js"></script> |
|
| 249 |
|
|
| 250 |
<script src="javascripts/foundation/foundation.orbit.js"></script> |
|
| 251 |
|
|
| 252 |
<script src="javascripts/foundation/foundation.placeholder.js"></script> |
|
| 253 |
|
|
| 254 |
<script src="javascripts/foundation/foundation.reveal.js"></script> |
|
| 255 |
|
|
| 256 |
<script src="javascripts/foundation/foundation.section.js"></script> |
|
| 257 |
|
|
| 258 |
<script src="javascripts/foundation/foundation.tooltips.js"></script> |
|
| 259 |
|
|
| 260 |
<script src="javascripts/foundation/foundation.topbar.js"></script> |
|
| 261 |
<script type="text/javascript" src="javascripts/jquery.mousewheel.js"></script> |
|
| 262 |
<script type="text/javascript" src="javascripts/jquery.jscrollpane.js"></script> |
|
| 263 |
<script type="text/javascript" src="javascripts/jquery.magnific-popup.js"></script> |
|
| 264 |
<script type="text/javascript" src="javascripts/dropzone.js"></script> |
|
| 265 |
|
|
| 266 |
<script src="javascripts/common.js"></script> |
|
| 267 |
|
|
| 268 |
|
|
| 269 |
<script> |
|
| 270 |
$(document).foundation(); |
|
| 271 |
</script> |
|
| 272 |
</body> |
|
| 273 |
</html> |
|
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/stylesheets/styles_test_icon.css | ||
|---|---|---|
| 1 |
|
|
| 2 |
/* styles for selection window (used for vm_list_v1.html) */ |
|
| 3 |
|
|
| 4 |
.vm_options{
|
|
| 5 |
display: none; |
|
| 6 |
border: 1px solid #ff7bac; |
|
| 7 |
position: absolute; |
|
| 8 |
top: -20%; |
|
| 9 |
width: 100%; |
|
| 10 |
height: 100%; |
|
| 11 |
font-size: 27px; |
|
| 12 |
font-weight: bold; |
|
| 13 |
text-align: left; |
|
| 14 |
background-color: white; |
|
| 15 |
line-height: 45px; |
|
| 16 |
padding-left: 1em; |
|
| 17 |
padding-top: 0.65em; |
|
| 18 |
} |
|
| 19 |
|
|
| 20 |
.vm_options .custom_checkbox{
|
|
| 21 |
display: inline-block; |
|
| 22 |
margin: 0; |
|
| 23 |
padding-left: 1em; |
|
| 24 |
color: #ff7bac; |
|
| 25 |
} |
|
| 26 |
|
|
| 27 |
a.option:hover{
|
|
| 28 |
color: #ff7bac; |
|
| 29 |
} |
|
| 30 |
|
|
| 31 |
.vm_container{
|
|
| 32 |
width: 200px; |
|
| 33 |
display: inline-block; |
|
| 34 |
height: 187px; |
|
| 35 |
position: relative; |
|
| 36 |
|
|
| 37 |
} |
|
| 38 |
|
|
| 39 |
|
|
| 40 |
/* styles for the detailed info of each vm (used for vm_details_v1.html) */ |
|
| 41 |
|
|
| 42 |
|
|
| 43 |
.graph_container{
|
|
| 44 |
padding-bottom: 2em; |
|
| 45 |
|
|
| 46 |
} |
|
| 47 |
|
|
| 48 |
|
|
| 49 |
.wrap{
|
|
| 50 |
position: relative; |
|
| 51 |
} |
|
| 52 |
|
|
| 53 |
.section_header{
|
|
| 54 |
float: left; |
|
| 55 |
width:23%; |
|
| 56 |
margin-right: 2%; |
|
| 57 |
font-weight: bold; |
|
| 58 |
} |
|
| 59 |
|
|
| 60 |
.right_side{
|
|
| 61 |
overflow: hidden; |
|
| 62 |
width: 75%; |
|
| 63 |
} |
|
| 64 |
|
|
| 65 |
|
|
| 66 |
|
|
| 67 |
.info_simple{
|
|
| 68 |
display: inline-block; |
|
| 69 |
margin-right: 10px; |
|
| 70 |
} |
|
| 71 |
|
|
| 72 |
|
|
| 73 |
.action_links{
|
|
| 74 |
display: inline-block; |
|
| 75 |
|
|
| 76 |
} |
|
| 77 |
.action_links a:hover {
|
|
| 78 |
text-decoration: underline; |
|
| 79 |
} |
|
| 80 |
|
|
| 81 |
.btn_pinkb{
|
|
| 82 |
width: 11.5em; |
|
| 83 |
height: 3.8em; |
|
| 84 |
line-height: 3.8em; |
|
| 85 |
border: 1px solid #ff7bac; |
|
| 86 |
position: absolute; |
|
| 87 |
top: 0; |
|
| 88 |
right: 0; |
|
| 89 |
} |
|
| 90 |
|
|
| 91 |
.btn_pinkb a{
|
|
| 92 |
display: block; |
|
| 93 |
padding-left: 1em; |
|
| 94 |
} |
|
| 95 |
|
|
| 96 |
.btn_pinkb a:hover, a.black:hover{
|
|
| 97 |
color: #ff7bac; |
|
| 98 |
} |
|
| 99 |
|
|
| 100 |
|
|
| 101 |
.btn_pinkb a img{
|
|
| 102 |
position: absolute; |
|
| 103 |
right: 0.6em; |
|
| 104 |
top: 0.6em; |
|
| 105 |
height: 2.5em; |
|
| 106 |
} |
|
| 107 |
|
|
| 108 |
|
|
| 109 |
.action_links span:first-child{
|
|
| 110 |
margin-right: 5px; |
|
| 111 |
} |
|
| 112 |
|
|
| 113 |
.action_links a{
|
|
| 114 |
color: #ff7bac; |
|
| 115 |
margin-right: 5px; |
|
| 116 |
} |
|
| 117 |
|
|
| 118 |
.row{
|
|
| 119 |
margin: 0 0 0.4em 0; |
|
| 120 |
} |
|
| 121 |
.middle_side{
|
|
| 122 |
max-width: 70%; |
|
| 123 |
} |
|
| 124 |
|
|
| 125 |
.txt_size{
|
|
| 126 |
height: 0.8em; |
|
| 127 |
vertical-align: baseline; |
|
| 128 |
} |
|
| 129 |
|
|
| 130 |
a.black{
|
|
| 131 |
color: black; |
|
| 132 |
} |
|
| 133 |
|
|
| 134 |
a.black:hover{
|
|
| 135 |
color: #ff7bac; |
|
| 136 |
} |
|
| 137 |
|
|
| 138 |
|
|
| 139 |
|
|
| 140 |
/* styles for network details */ |
|
| 141 |
|
|
| 142 |
.big{
|
|
| 143 |
width: 60%; |
|
| 144 |
} |
|
| 145 |
|
|
| 146 |
.small{
|
|
| 147 |
width: 170px; |
|
| 148 |
} |
|
| 149 |
|
|
| 150 |
.wrapper .details .top{
|
|
| 151 |
padding: 70px 2.5em; |
|
| 152 |
} |
|
| 153 |
|
|
| 154 |
.wrapper .details .top .actions ul li{
|
|
| 155 |
margin: 0 30px; |
|
| 156 |
} |
|
| 157 |
|
|
| 158 |
.height_up{
|
|
| 159 |
line-height: 1.3em; |
|
| 160 |
} |
|
| 161 |
|
|
| 162 |
.set{
|
|
| 163 |
margin-bottom: 1em; |
|
| 164 |
} |
|
| 165 |
|
|
| 166 |
/* main icon in details page */ |
|
| 167 |
.network .top .img {
|
|
| 168 |
background: url("../images/network-green102x116.png") no-repeat center center;
|
|
| 169 |
width: 102px; |
|
| 170 |
height: 116px; |
|
| 171 |
display: inline-block; |
|
| 172 |
text-indent: -2000px; |
|
| 173 |
overflow: hidden; |
|
| 174 |
background-size: 100%; |
|
| 175 |
} |
|
| 176 |
|
|
| 177 |
|
|
| 178 |
/* scroll bar */ |
|
| 179 |
.networks .items-list .img {
|
|
| 180 |
background: url("../images/network-green102x116.png") no-repeat center center;
|
|
| 181 |
height: 58px; |
|
| 182 |
width: 51px; |
|
| 183 |
display: inline-block; |
|
| 184 |
text-indent: -2000px; |
|
| 185 |
overflow: hidden; |
|
| 186 |
background-size: 80%; |
|
| 187 |
} |
|
| 188 |
|
|
| 189 |
.network .close-font{
|
|
| 190 |
position: absolute; |
|
| 191 |
right: 0.8em; |
|
| 192 |
top: 2em; |
|
| 193 |
font-size: 2em; |
|
| 194 |
color: #b3b3b3; |
|
| 195 |
|
|
| 196 |
} |
|
| 197 |
|
|
| 198 |
|
|
| 199 |
/* styles for network list */ |
|
| 200 |
|
|
| 201 |
.networks .items-list .container .img {
|
|
| 202 |
background: url("../images/network-green102x116.png") no-repeat center center;
|
|
| 203 |
height: 58px; |
|
| 204 |
width: 51px; |
|
| 205 |
text-indent: -2000px; |
|
| 206 |
overflow: hidden; |
|
| 207 |
background-size: 100% |
|
| 208 |
} |
|
| 209 |
|
|
| 210 |
|
|
| 211 |
|
|
| 212 |
/* detailed pages: about the gaps that separate the area with the big img and the buttons from the rest of the page */ |
|
| 213 |
|
|
| 214 |
|
|
| 215 |
.details .top .actions ul{
|
|
| 216 |
padding: 1em 1em 0; |
|
| 217 |
margin-bottom: 0; |
|
| 218 |
} |
|
| 219 |
|
|
| 220 |
|
|
| 221 |
/* |
|
| 222 |
to be transfered to sass |
|
| 223 |
*/ |
|
| 224 |
|
|
| 225 |
.items-list li .container .options .wrap a {
|
|
| 226 |
width: 50%; |
|
| 227 |
} |
|
| 228 |
.content {
|
|
| 229 |
position: relative; |
|
| 230 |
} |
|
| 231 |
.content .overlay-modal {
|
|
| 232 |
position: absolute; |
|
| 233 |
left:0; |
|
| 234 |
top:0; |
|
| 235 |
width: 100%; |
|
| 236 |
height: 100%; |
|
| 237 |
z-index:98; |
|
| 238 |
background: #ff7bac; |
|
| 239 |
} |
|
| 240 |
|
|
| 241 |
|
|
| 242 |
.content .overlay-div {
|
|
| 243 |
position:absolute; top:20%; left:25%; width:50%; |
|
| 244 |
padding:25px; |
|
| 245 |
background:white; |
|
| 246 |
display:none; z-index:100; |
|
| 247 |
} |
|
| 248 |
|
|
| 249 |
.content .overlay-div .buttons {
|
|
| 250 |
margin-bottom:0; |
|
| 251 |
} |
|
| 252 |
|
|
| 253 |
.content .overlay-div .buttons a {
|
|
| 254 |
margin-right:20px; |
|
| 255 |
} |
|
| 256 |
|
|
| 257 |
/* line 133, ../sass/app.scss */ |
|
| 258 |
.btn4 {
|
|
| 259 |
color: white; |
|
| 260 |
border-color: #ff7bac; |
|
| 261 |
background: #ff7bac; |
|
| 262 |
} |
|
| 263 |
/* line 139, ../sass/app.scss */ |
|
| 264 |
.btn4:hover, .btn4.current {
|
|
| 265 |
border-color: #ff7bac; |
|
| 266 |
color:#ff7bac; |
|
| 267 |
background: white; |
|
| 268 |
} |
|
| 269 |
|
|
| 270 |
|
|
| 271 |
.overlay .lt-sidebar.nav ul li:hover {
|
|
| 272 |
background-color: transparent; |
|
| 273 |
} |
|
| 274 |
|
|
| 275 |
.lt-sidebar.nav {
|
|
| 276 |
font-size: 1em |
|
| 277 |
} |
|
| 278 |
|
|
| 279 |
.overlay .lt-sidebar.nav {
|
|
| 280 |
overflow: auto; |
|
| 281 |
} |
|
| 282 |
|
|
| 283 |
|
|
| 284 |
/* styles for close icons (created with fontIcon "snf-font") */ |
|
| 285 |
|
|
| 286 |
.overlay .close_char {
|
|
| 287 |
background: none; |
|
| 288 |
text-indent: 0; |
|
| 289 |
font-size: 1.8em; /* for the the character e (for d we can put 2em) */ |
|
| 290 |
color: white; |
|
| 291 |
} |
|
| 292 |
|
|
| 293 |
|
|
| 294 |
|
|
| 295 |
/* create network styles */ |
|
| 296 |
|
|
| 297 |
.create-network {
|
|
| 298 |
color: white; |
|
| 299 |
} |
|
| 300 |
|
|
| 301 |
.create-network .check{
|
|
| 302 |
color: white; |
|
| 303 |
} |
|
| 304 |
|
|
| 305 |
.create-network p {
|
|
| 306 |
font-size: 0.8em; |
|
| 307 |
font-style: italic; |
|
| 308 |
margin: 5px 0 0; |
|
| 309 |
width: 545px; |
|
| 310 |
} |
|
| 311 |
|
|
| 312 |
|
|
| 313 |
.create-network li {
|
|
| 314 |
list-style: none outside none; |
|
| 315 |
} |
|
| 316 |
|
|
| 317 |
.subnet_options {
|
|
| 318 |
margin: 0; |
|
| 319 |
} |
|
| 320 |
|
|
| 321 |
.network_options .check {
|
|
| 322 |
position: absolute; |
|
| 323 |
right: 0; |
|
| 324 |
} |
|
| 325 |
|
|
| 326 |
.create-network .custom_checkbox {
|
|
| 327 |
font-size: 1.3em; |
|
| 328 |
} |
|
| 329 |
|
|
| 330 |
|
|
| 331 |
.network_options {
|
|
| 332 |
position: relative; |
|
| 333 |
width: 350px; |
|
| 334 |
min-height: 285px; |
|
| 335 |
|
|
| 336 |
} |
|
| 337 |
|
|
| 338 |
.network_options li {
|
|
| 339 |
display: block; |
|
| 340 |
margin-bottom: 13px; |
|
| 341 |
} |
|
| 342 |
|
|
| 343 |
.subnet_options li {
|
|
| 344 |
margin-bottom: 6px; |
|
| 345 |
padding-left: 155px; |
|
| 346 |
} |
|
| 347 |
|
|
| 348 |
|
|
| 349 |
.network_options li form {
|
|
| 350 |
margin: 0; |
|
| 351 |
} |
|
| 352 |
.network_options li form input {
|
|
| 353 |
position: absolute; |
|
| 354 |
display: inline-block; |
|
| 355 |
right: 0; |
|
| 356 |
width: 200px; |
|
| 357 |
height: 20px; |
|
| 358 |
font-size: 0.9em; |
|
| 359 |
} |
|
| 360 |
|
|
| 361 |
.network_options li.manual form input {
|
|
| 362 |
right: -160px; |
|
| 363 |
width: 150px; |
|
| 364 |
} |
|
| 365 |
|
|
| 366 |
|
|
| 367 |
.network_options li form input.hidden {
|
|
| 368 |
display: none; |
|
| 369 |
} |
|
| 370 |
|
|
| 371 |
span.sub_title {
|
|
| 372 |
position: absolute; |
|
| 373 |
} |
|
| 374 |
|
|
| 375 |
|
|
| 376 |
/* pithos: list of uploading files */ |
|
| 377 |
|
|
| 378 |
.upload-widget .files {
|
|
| 379 |
color: white; |
|
| 380 |
} |
|
| 381 |
|
|
| 382 |
.upload-widget .files li {
|
|
| 383 |
padding: 10px 120px; |
|
| 384 |
border: none; |
|
| 385 |
position: relative; |
|
| 386 |
} |
|
| 387 |
.upload-widget .files div{
|
|
| 388 |
display: inline-block; |
|
| 389 |
} |
|
| 390 |
|
|
| 391 |
.upload-widget .files .progress-bar {
|
|
| 392 |
position: static; |
|
| 393 |
padding: 0; |
|
| 394 |
width: 25%; |
|
| 395 |
border: none; |
|
| 396 |
background-color: transparent; |
|
| 397 |
} |
|
| 398 |
|
|
| 399 |
.upload-widget .files .progress-bar .progress-wrap {
|
|
| 400 |
width: 100%; |
|
| 401 |
margin: 0; |
|
| 402 |
} |
|
| 403 |
|
|
| 404 |
|
|
| 405 |
.upload-widget .files .progress-bar .progress-wrap .progress {
|
|
| 406 |
display: block; |
|
| 407 |
margin: 0; |
|
| 408 |
border: 2px solid white; |
|
| 409 |
padding: 0; |
|
| 410 |
background-color: #ff7bac; |
|
| 411 |
} |
|
| 412 |
|
|
| 413 |
.upload-widget .files .progress-bar .progress-wrap .progress .meter {
|
|
| 414 |
background-color: white; |
|
| 415 |
} |
|
| 416 |
|
|
| 417 |
.upload-widget .files li .name-col {
|
|
| 418 |
width: 34%; |
|
| 419 |
|
|
| 420 |
} |
|
| 421 |
|
|
| 422 |
.upload-widget .files li .size-col {
|
|
| 423 |
text-align: left; |
|
| 424 |
float: none; |
|
| 425 |
} |
|
| 426 |
|
|
| 427 |
.upload-widget .files li .dz-success-mark {
|
|
| 428 |
margin-left:10px; |
|
| 429 |
} |
|
| 430 |
|
|
| 431 |
|
|
| 432 |
.upload-widget .files li .dz-error-mark {
|
|
| 433 |
display: none; |
|
| 434 |
} |
|
| 435 |
|
|
| 436 |
.upload-widget .files li .cancel-col {
|
|
| 437 |
width: 100px; |
|
| 438 |
position: absolute; |
|
| 439 |
right: 50px; |
|
| 440 |
top: 9px; |
|
| 441 |
} |
|
| 442 |
|
|
| 443 |
.upload-widget .files li .cancel-col .cancel span {
|
|
| 444 |
display: block; |
|
| 445 |
text-align: right; |
|
| 446 |
} |
|
| 447 |
|
|
| 448 |
/*.storage .upload-widget .files li {
|
|
| 449 |
clear: none; |
|
| 450 |
}*/ |
|
| 451 |
|
|
| 452 |
|
|
| 453 |
/* after sass for sure */ |
|
| 454 |
|
|
| 455 |
.menu1 ul li a .snf-font {
|
|
| 456 |
font-size: 25px; |
|
| 457 |
color: black; |
|
| 458 |
} |
|
| 459 |
|
|
| 460 |
body .menu1 ul li {
|
|
| 461 |
margin-right: 9px; |
|
| 462 |
} |
|
| 463 |
|
|
| 464 |
body .menu1 ul li a:hover span {
|
|
| 465 |
color: #3582ac; |
|
| 466 |
} |
|
| 467 |
|
|
| 468 |
.menu2 ul li a .snf-font {
|
|
| 469 |
font-size: 25px; |
|
| 470 |
font-weight: bold; |
|
| 471 |
color: #919194; |
|
| 472 |
} |
|
| 473 |
|
|
| 474 |
.menu3 ul li a .snf-font {
|
|
| 475 |
font-size: 25px; |
|
| 476 |
color: #919194; |
|
| 477 |
} |
|
| 478 |
|
|
| 479 |
|
|
| 480 |
body .menu2 ul li {
|
|
| 481 |
margin-right: 9px; |
|
| 482 |
} |
|
| 483 |
|
|
| 484 |
body .menu2 ul li a:hover span{
|
|
| 485 |
color: #3582ac; |
|
| 486 |
} |
|
| 487 |
|
|
| 488 |
body .vms .items-list .img.running, body .vms .items-list .img.stopped, body .networks .items-list .img.running, body .networks .items-list .img.stopped{
|
|
| 489 |
background: none; |
|
| 490 |
text-indent: 0; |
|
| 491 |
width: 60px; |
|
| 492 |
height: 60px; |
|
| 493 |
} |
|
| 494 |
|
|
| 495 |
body .img .snf-font {
|
|
| 496 |
font-size: 60px; |
|
| 497 |
} |
|
| 498 |
|
|
| 499 |
body .networks .img .snf-font.bolding {
|
|
| 500 |
font-weight: bold; |
|
| 501 |
font-size: 57px; |
|
| 502 |
top: 6px; |
|
| 503 |
} |
|
| 504 |
body .networks .img .snf-font {
|
|
| 505 |
position: relative; |
|
| 506 |
top: 2px; |
|
| 507 |
} |
|
| 508 |
|
|
| 509 |
body .networks .running .snf-font {
|
|
| 510 |
color: #79c79e; |
|
| 511 |
} |
|
| 512 |
|
|
| 513 |
body .running .snf-font {
|
|
| 514 |
color: #75c046; |
|
| 515 |
} |
|
| 516 |
|
|
| 517 |
|
|
| 518 |
body .stopped .snf-font {
|
|
| 519 |
color: #e00e63; |
|
| 520 |
} |
|
| 521 |
|
|
| 522 |
|
|
| 523 |
body .vms .items-list .img .os {
|
|
| 524 |
left:19px; |
|
| 525 |
} |
|
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/vm_list_test_icon.html | ||
|---|---|---|
| 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 href='https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin,greek-ext,greek' rel='stylesheet' type='text/css'> |
|
| 12 |
<link rel="stylesheet" href="stylesheets/font_custom.css" /> |
|
| 13 |
<link rel="stylesheet" href="stylesheets/normalize.css" /> |
|
| 14 |
<link rel="stylesheet" href="stylesheets/app.css" /> |
|
| 15 |
<link rel="stylesheet" href="stylesheets/styles_test_icon.css" /> |
|
| 16 |
<link rel="stylesheet" href="stylesheets/jquery.jscrollpane.css" media="all" /> |
|
| 17 |
<script src="javascripts/vendor/custom.modernizr.js"></script> |
|
| 18 |
|
|
| 19 |
</head> |
|
| 20 |
<body> |
|
| 21 |
<div class="row-full"> |
|
| 22 |
<header class="header"> |
|
| 23 |
|
|
| 24 |
<div class="logo"> |
|
| 25 |
<a href="index.html"><img src="images/logo_01.png" alt="software logo"></a> |
|
| 26 |
</div> |
|
| 27 |
|
|
| 28 |
<nav class="top-nav menu1 icons-nav"> |
|
| 29 |
|
|
| 30 |
<ul> |
|
| 31 |
<li><a href="pithos_list_test_icon.html" data-tooltip class="has-tip" title="Storage" ><span class="snf-font">y</span></a></li> |
|
| 32 |
<li><a href="vm_list_test_icon.html" data-tooltip class="has-tip" title="Machines"><span class="snf-font">w</span></a></li> |
|
| 33 |
|
|
| 34 |
<li><a href="" data-tooltip class="has-tip" title="Disks"><span class="snf-font">u</span></a></li> |
|
| 35 |
<li><a href="network_list_test_icon.html" data-tooltip class="has-tip" title="Networks"><span class="snf-font">v</span></a></li> |
|
| 36 |
<li><a href="" data-tooltip class="has-tip" title="Dashboard"><span class="snf-font">z</span></a></li> |
|
| 37 |
</ul> |
|
| 38 |
|
|
| 39 |
</nav> |
|
| 40 |
|
|
| 41 |
<div class="login"> |
|
| 42 |
<a href="">test@grnet.gr</a> |
|
| 43 |
</div> |
|
| 44 |
<div class="actions clearfix"> |
|
| 45 |
|
|
| 46 |
<div class="lt-actions"> |
|
| 47 |
<div class="new-btn"><a href="vm_create_a.html"><span>+</span> NEW MACHINE </a></div> |
|
| 48 |
</div> |
|
| 49 |
<div class="main-actions"> |
|
| 50 |
<ul> |
|
| 51 |
<li class="running" ><a href="" data-overlay-id="#overlay1">Reboot</a></li> |
|
| 52 |
<li class="running"><a href="" data-overlay-id="#overlay1">Shutdown</a></li> |
|
| 53 |
<li class="both"><a href="">Destroy</a></li> |
|
| 54 |
<li class="stopped"><a href="">Start</a></li> |
|
| 55 |
<!-- in case we want an action always activated |
|
| 56 |
<li class="pernament"><a href="" class="active">Action</a></li> --> |
|
| 57 |
|
|
| 58 |
</ul> |
|
| 59 |
</div> |
|
| 60 |
</div> |
|
| 61 |
</header> |
|
| 62 |
<div class="info top-info alert"> |
|
| 63 |
<div class="wrap"> |
|
| 64 |
<p>ALERT!</p> |
|
| 65 |
|
|
| 66 |
<p>Nunc at velit quis lectus nonummy eleifend. Curabitur eros. Aenean ligula dolor, gravida auctor, auctor et, neque ut neque. In at libero. </p> |
|
| 67 |
</div> |
|
| 68 |
<a href="#" class="close" title="hide message">close</a> |
|
| 69 |
</div> |
|
| 70 |
|
|
| 71 |
</div> |
|
| 72 |
<div class="row-full content overlay-wrapper "> |
|
| 73 |
<div class="overlay-area"> |
|
| 74 |
<a href="" class="close">close</a> |
|
| 75 |
<div id="overlay1" class="overlay-div"> |
|
| 76 |
<p>Are you sure you want to reboot your machine?</p> |
|
| 77 |
<p class="buttons"><a href="" class="btn4">YES</a><a href="" class="btn4">NO</a></p> |
|
| 78 |
</div> |
|
| 79 |
<div id="overlay2" class="overlay-div"> |
|
| 80 |
<p>Are you sure you want to shutdown your machine?</p> |
|
| 81 |
<p class="buttons"><a href="" class="btn4">YES</a><a href="" class="btn4">NO</a></p> |
|
| 82 |
</div> |
|
| 83 |
</div> |
|
| 84 |
<!-- main area --> |
|
| 85 |
<section class="main onecol"> |
|
| 86 |
|
|
| 87 |
<div class="vms entities"> |
|
| 88 |
<ul class="items-list small-block-grid-2 large-block-grid-3 sortable"> |
|
| 89 |
<li data-order="0"> |
|
| 90 |
<div class="container"> |
|
| 91 |
<div class="options"> |
|
| 92 |
<div class="wrap"> |
|
| 93 |
<a href="vm_details.html" class="details">details</a> |
|
| 94 |
<a href="#" data-reveal-id="vm-connect" class="connect">connect</a> |
|
| 95 |
</div> |
|
| 96 |
</div> |
|
| 97 |
<div class="img-wrap"> |
|
| 98 |
<div class="img running"> |
|
| 99 |
<div class="snf-font">x</div> |
|
| 100 |
<span class="os windows">windows</span> |
|
| 101 |
</div> |
|
| 102 |
</div> |
|
| 103 |
|
|
| 104 |
<p class="visible-info"> |
|
| 105 |
<span><em>IPv4 83.212.97.127</em></span> |
|
| 106 |
<span class="title"><em>vm name 1 really large name</em></span> |
|
| 107 |
</p> |
|
| 108 |
<a href="" class="check"><span class="custom_checkbox snf-custom-checkbox">a</span></a> |
|
| 109 |
<div class="info-box"> |
|
| 110 |
<h2>VM full name</h2> |
|
| 111 |
<p>blah blah</p> |
|
| 112 |
<dl> |
|
| 113 |
<dt>Status</dt> |
|
| 114 |
<dd>running</dd> |
|
| 115 |
<dt>OS</dt> |
|
| 116 |
<dd><img class="txt_size" src="images/os-windows.png"> Windows</dd> |
|
| 117 |
<dt>IPv4</dt> |
|
| 118 |
<dd>83.212.97.127</dd> |
|
| 119 |
</dl> |
|
| 120 |
</div> |
|
| 121 |
</div> |
|
| 122 |
</li> |
|
| 123 |
<li data-order="1"> |
|
| 124 |
<div class="container"> |
|
| 125 |
<div class="options"> |
|
| 126 |
<div class="wrap"> |
|
| 127 |
|
|
| 128 |
<a href="vm_details.html" class="details">details</a> |
|
| 129 |
<a href="#" data-reveal-id="vm-connect" class="connect">connect</a> |
|
| 130 |
</div> |
|
| 131 |
</div> |
|
| 132 |
<div class="img-wrap"> |
|
| 133 |
<div class="img running"> |
|
| 134 |
<div class="snf-font">x</div> |
|
| 135 |
<span class="os windows">windows</span> |
|
| 136 |
</div> |
|
| 137 |
</div> |
|
| 138 |
|
|
| 139 |
<p class="visible-info"> |
|
| 140 |
<span><em>IPv4 83.212.97.127</em></span> |
|
| 141 |
<span class="title"><em>vm name 2</em></span> |
|
| 142 |
</p> |
|
| 143 |
<a href="" class="check"><span class="custom_checkbox snf-custom-checkbox">a</span></a> |
|
| 144 |
<div class="info-box"> |
|
| 145 |
<h2>VM full name</h2> |
|
| 146 |
<p>blah blah</p> |
|
| 147 |
<dl> |
|
| 148 |
<dt>Status</dt> |
|
| 149 |
<dd>running</dd> |
|
| 150 |
<dt>OS</dt> |
|
| 151 |
<dd><img class="txt_size" src="images/os-windows.png"> Windows</dd> |
|
| 152 |
<dt>IPv4</dt> |
|
| 153 |
<dd>83.212.97.127</dd> |
|
| 154 |
</dl> |
|
| 155 |
</div> |
|
| 156 |
</div> |
|
| 157 |
</li> |
|
| 158 |
<li data-order="2"> |
|
| 159 |
<div class="container"> |
|
| 160 |
<div class="options"> |
|
| 161 |
<div class="wrap"> |
|
| 162 |
|
|
| 163 |
<a href="vm_details.html" class="details">details</a> |
|
| 164 |
<a href="#" data-reveal-id="vm-connect" class="connect">connect</a> |
|
| 165 |
</div> |
|
| 166 |
</div> |
|
| 167 |
<div class="img-wrap"> |
|
| 168 |
<div class="img stopped"> |
|
| 169 |
<div class="snf-font">x</div> |
|
| 170 |
<span class="os fedora">fedora</span> |
|
| 171 |
</div> |
|
| 172 |
</div> |
|
| 173 |
|
|
| 174 |
<p class="visible-info"> |
|
| 175 |
<span><em>IPv4 83.212.97.127</em></span> |
|
| 176 |
<span class="title"><em>vm name 3</em></span> |
|
| 177 |
</p> |
|
| 178 |
<a href="" class="check"><span class="custom_checkbox snf-custom-checkbox">a</span></a> |
|
| 179 |
<div class="info-box"> |
|
| 180 |
<h2>VM full name</h2> |
|
| 181 |
<p>blah blah</p> |
|
| 182 |
<dl> |
|
| 183 |
<dt>Status</dt> |
|
| 184 |
<dd>running</dd> |
|
| 185 |
<dt>OS</dt> |
|
| 186 |
<dd><img class="txt_size" src="images/os-windows.png"> Windows</dd> |
|
| 187 |
<dt>IPv4</dt> |
|
| 188 |
<dd>83.212.97.127</dd> |
|
| 189 |
</dl> |
|
| 190 |
</div> |
|
| 191 |
</div> |
|
| 192 |
</li> |
|
| 193 |
<li data-order="3"> |
|
| 194 |
<div class="container"> |
|
| 195 |
<div class="options"> |
|
| 196 |
<div class="wrap"> |
|
| 197 |
|
|
| 198 |
<a href="vm_details.html" class="details">details</a> |
|
| 199 |
<a href="#" data-reveal-id="vm-connect" class="connect">connect</a> |
|
| 200 |
</div> |
|
| 201 |
</div> |
|
| 202 |
<div class="img-wrap"> |
|
| 203 |
<div class="img running"> |
|
| 204 |
<div class="snf-font">x</div> |
|
| 205 |
<span class="os">unknown</span> |
|
| 206 |
</div> |
|
| 207 |
</div> |
|
| 208 |
|
|
| 209 |
<p class="visible-info"> |
|
| 210 |
<span><em>IPv4 83.212.97.127</em></span> |
|
| 211 |
<span class="title"><em>vm name 4</em></span> |
|
| 212 |
</p> |
|
| 213 |
<a href="" class="check"><span class="custom_checkbox snf-custom-checkbox">a</span></a> |
|
| 214 |
<div class="info-box"> |
|
| 215 |
<h2>VM full name</h2> |
|
| 216 |
<p>blah blah</p> |
|
| 217 |
<dl> |
|
| 218 |
<dt>Status</dt> |
|
| 219 |
<dd>running</dd> |
|
| 220 |
<dt>OS</dt> |
|
| 221 |
<dd><img class="txt_size" src="images/os-windows.png"> Windows</dd> |
|
| 222 |
<dt>IPv4</dt> |
|
| 223 |
<dd>83.212.97.127</dd> |
|
| 224 |
</dl> |
|
| 225 |
</div> |
|
| 226 |
</div> |
|
| 227 |
</li> |
|
| 228 |
<li data-order="4"> |
|
| 229 |
<div class="container"> |
|
| 230 |
<div class="options"> |
|
| 231 |
<div class="wrap"> |
|
| 232 |
|
|
| 233 |
<a href="vm_details.html" class="details">details</a> |
|
Also available in: Unified diff