[Kimchi-devel] [PATCH 07/10] [new-ui] Kimchi config and Guests tab
sguimaraes943 at gmail.com
sguimaraes943 at gmail.com
Tue Nov 10 21:17:36 UTC 2015
From: samhenri <samuel.guimaraes at eldorado.org.br>
Signed-off-by: samhenri <samuel.guimaraes at eldorado.org.br>
---
src/wok/plugins/kimchi/ui/config/tab-ext.xml | 8 +-
.../kimchi/ui/css/theme-default/guest-edit.css | 8 +-
.../kimchi/ui/js/src/kimchi.guest_add_main.js | 10 +-
.../kimchi/ui/js/src/kimchi.guest_edit_main.js | 63 +++---------
.../plugins/kimchi/ui/pages/guest-add.html.tmpl | 114 ++++++++++-----------
.../plugins/kimchi/ui/pages/guest-edit.html.tmpl | 97 ++++++------------
.../kimchi/ui/pages/guest-storage-add.html.tmpl | 21 ++--
src/wok/plugins/kimchi/ui/pages/guests.html.tmpl | 61 +++++++----
ui/css/src/modules/_guests.scss | 92 +++++++++++++++++
9 files changed, 255 insertions(+), 219 deletions(-)
create mode 100644 ui/css/src/modules/_guests.scss
diff --git a/src/wok/plugins/kimchi/ui/config/tab-ext.xml b/src/wok/plugins/kimchi/ui/config/tab-ext.xml
index 48ec9ec..415dbf1 100644
--- a/src/wok/plugins/kimchi/ui/config/tab-ext.xml
+++ b/src/wok/plugins/kimchi/ui/config/tab-ext.xml
@@ -3,28 +3,28 @@
<tab>
<access role="admin" mode="admin"/>
<access role="user" mode="byInstance"/>
-
+ <class>guests</class>
<title>Guests</title>
<path>plugins/kimchi/guests.html</path>
</tab>
<tab>
<access role="admin" mode="admin"/>
<access role="user" mode="none"/>
-
+ <class>templates</class>
<title>Templates</title>
<path>plugins/kimchi/templates.html</path>
</tab>
<tab>
<access role="admin" mode="admin"/>
<access role="user" mode="read-only"/>
-
+ <class>storage</class>
<title>Storage</title>
<path>plugins/kimchi/storage.html</path>
</tab>
<tab>
<access role="admin" mode="admin"/>
<access role="user" mode="read-only"/>
-
+ <class>network</class>
<title>Network</title>
<path>plugins/kimchi/network.html</path>
</tab>
diff --git a/src/wok/plugins/kimchi/ui/css/theme-default/guest-edit.css b/src/wok/plugins/kimchi/ui/css/theme-default/guest-edit.css
index b661159..98901da 100644
--- a/src/wok/plugins/kimchi/ui/css/theme-default/guest-edit.css
+++ b/src/wok/plugins/kimchi/ui/css/theme-default/guest-edit.css
@@ -10,16 +10,12 @@
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
+ * distributed under the License is distributed on an "AS IS" BASIS,pick 3b4871a Squash with SCSS patch
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-#guest-edit-window {
- font-size: 13px;
- height: 420px;
- width: 820px;
-}
#guest-edit-window #action-button-container {
padding-right: 0;
diff --git a/src/wok/plugins/kimchi/ui/js/src/kimchi.guest_add_main.js b/src/wok/plugins/kimchi/ui/js/src/kimchi.guest_add_main.js
index 6be6f9a..ef8324a 100644
--- a/src/wok/plugins/kimchi/ui/js/src/kimchi.guest_add_main.js
+++ b/src/wok/plugins/kimchi/ui/js/src/kimchi.guest_add_main.js
@@ -22,6 +22,10 @@ kimchi.guest_add_main = function() {
if (result && result.length) {
$('#prompt-create-template').addClass('hidden');
$('#prompt-choose-template').removeClass('hidden');
+ $('#guest-add-window .guest-pager').animate({
+ height: "530px"
+ });
+
var html = '';
var tmpl = $('#tmpl-template').html();
$.each(result, function(index, value) {
@@ -34,13 +38,17 @@ kimchi.guest_add_main = function() {
$('#btn-create-template').on('click', function(event) {
wok.topic('templateCreated').subscribe(showTemplates);
- wok.window.open('plugins/kimchi/template-add.html');
+ wok.window.open('plugins/kimchi/template-add.html','extendCreateTemplate');
event.preventDefault();
});
$('#prompt-choose-template').addClass('hidden');
$('#prompt-create-template').removeClass('hidden');
+ $('#guest-add-window .guest-pager').animate({
+ height: "90px"
+ });
+
}, function(err) {
wok.message.error(err.responseJSON.reason);
});
diff --git a/src/wok/plugins/kimchi/ui/js/src/kimchi.guest_edit_main.js b/src/wok/plugins/kimchi/ui/js/src/kimchi.guest_edit_main.js
index 46de868..44dd1fd 100644
--- a/src/wok/plugins/kimchi/ui/js/src/kimchi.guest_edit_main.js
+++ b/src/wok/plugins/kimchi/ui/js/src/kimchi.guest_edit_main.js
@@ -50,36 +50,18 @@ kimchi.guest_edit_main = function() {
container.append(templated);
});
- $('.replace', container).button({
- icons: {
- primary: 'ui-icon-pencil'
- },
- text: false
- });
+ $('.replace', container).button();
+
+ $('.detach', container).button();
- $('.detach', container).button({
- icons: {
- primary: 'ui-icon-trash'
- },
- text: false
- });
if (kimchi.thisVMState === 'running') {
$('.detach[data-type="cdrom"]', container).remove();
}
- $('.save', container).button({
- icons: {
- primary: 'ui-icon-disk'
- },
- text: false
- });
+ $('.save', container).button();
+
+ $('.cancel', container).button();
- $('.cancel', container).button({
- icons: {
- primary: 'ui-icon-arrowreturnthick-1-w'
- },
- text: false
- });
});
};
@@ -158,10 +140,7 @@ kimchi.guest_edit_main = function() {
};
var setupInterface = function() {
- $(".add", "#form-guest-edit-interface").button({
- icons: { primary: "ui-icon-plusthick" },
- text: false
- }).click(function(evt){
+ $(".add", "#form-guest-edit-interface").button().click(function(evt){
evt.preventDefault();
addItem({
id: -1,
@@ -189,11 +168,7 @@ kimchi.guest_edit_main = function() {
if(data.network!==""){
$("select", itemNode).val(data.network);
}
- $(".edit", itemNode).button({
- disabled: kimchi.thisVMState === "running",
- icons: { primary: "ui-icon-pencil" },
- text: false
- }).click(function(evt){
+ $(".edit", itemNode).button({ disabled: kimchi.thisVMState === "running" }).click(function(evt){
evt.preventDefault();
toggleEdit($(this).closest('div'), true, data.id);
});
@@ -207,10 +182,7 @@ kimchi.guest_edit_main = function() {
item.remove();
});
});
- $(".save", itemNode).button({
- icons: { primary: "ui-icon-disk" },
- text: false
- }).click(function(evt){
+ $(".save", itemNode).button().click(function(evt){
evt.preventDefault();
var item = $(this).parent().parent();
var interface = {
@@ -241,10 +213,7 @@ kimchi.guest_edit_main = function() {
}
}
});
- $(".cancel", itemNode).button({
- icons: { primary: "ui-icon-arrowreturnthick-1-w" },
- text: false
- }).click(function(evt){
+ $(".cancel", itemNode).button().click(function(evt){
evt.preventDefault();
var item = $(this).parent().parent();
$("label", item).text()==="" ? item.remove() : toggleEdit(item, false, data.id);
@@ -269,10 +238,7 @@ kimchi.guest_edit_main = function() {
var setupPermission = function() {
//set up for LDAP
- $(".add", "#form-guest-edit-permission").button({
- icons: { primary: "ui-icon-plusthick" },
- text: false
- }).click(function(evt){
+ $(".add", "#form-guest-edit-permission").button().click(function(evt){
evt.preventDefault();
addItem({
user: "",
@@ -285,10 +251,7 @@ kimchi.guest_edit_main = function() {
var addItem = function(data) {
var itemNode = $.parseHTML(wok.substitute($('#ldap-user-tmpl').html(),data));
$(".body", "#form-guest-edit-permission .ldap").append(itemNode);
- $(".delete", itemNode).button({
- icons: { primary: "ui-icon-trash" },
- text: false
- }).click(function(evt){
+ $(".delete", itemNode).button().click(function(evt){
evt.preventDefault();
var item = $(this).parent().parent();
item.remove();
@@ -667,7 +630,7 @@ kimchi.guest_edit_main = function() {
text: false
}).click(function(event) {
event.preventDefault();
- wok.window.open("plugins/kimchi/guest-storage-add.html");
+ wok.window.open('plugins/kimchi/guest-storage-add.html','extendCreateStorage');
});
if ((kimchi.thisVMState === "running") || (kimchi.thisVMState === "paused")) {
$("#form-guest-edit-general input").prop("disabled", true);
diff --git a/src/wok/plugins/kimchi/ui/pages/guest-add.html.tmpl b/src/wok/plugins/kimchi/ui/pages/guest-add.html.tmpl
index 3770d96..614606c 100644
--- a/src/wok/plugins/kimchi/ui/pages/guest-add.html.tmpl
+++ b/src/wok/plugins/kimchi/ui/pages/guest-add.html.tmpl
@@ -24,72 +24,64 @@
<!DOCTYPE html>
<html>
<body>
-<div class="window" style="width: 900px;height: 580px;">
- <header>
- <h1 class="title h1 grey">$_("Create a New Virtual Machine")</h1>
- </header>
- <div class="content">
- <form id="form-vm-add">
- <section class="form-section">
- <h2>1. $_("Virtual Machine Name")</h2>
- <div class="field">
- <input type="text" class="text" style="width: 300px" name="name"><br>
- <div class="icon-info-circled light-grey c1 help-inline"></div>
- <p class="text-help help-inline">
- $_("The name used to identify the virtual machine. If omitted, a name will be chosen based on the template used.")
- </p>
+<div id="guest-add-window" class="window modal-content">
+ <div class="modal-header">
+ <h4 class="modal-title" id="guestsModalLabel">$_("Create a New Virtual Machine")</h4>
</div>
- </section>
- <section class="form-section">
- <h2>2. $_("Template")</h2>
- <div class="field">
- <div class="text-help">
- <div id="prompt-create-template" class="hidden">
- <div class="icon-info-circled light-grey c1 help-inline"></div>
- <div class="text-help help-inline">$_("Please create a template first.")</div>
- <a id="btn-create-template" class="btn-normal" href="templates.html">
- <span class="text">$_("Create a Template")</span>
- </a>
+ <div class="modal-body">
+ <form id="form-vm-add">
+ <div class="guest-modal-container">
+ <div class="form-group">
+ <label for="guest-vm-name">$_("Virtual Machine Name")</label>
+ <input type="text" class="form-control" name="name" id="guest-vm-name" />
+ <p class="help-block"><i class="fa fa-info-circle"></i> $_("The name used to identify the virtual machine. If omitted, a name will be chosen based on the template used.")
+ </p>
+ </div>
</div>
- <div id="prompt-choose-template" class="hidden">
- <span class="icon-info-circled light-grey c1"></span>
- <span class="text-help">$_("Please choose a template.")</span>
- </div>
- </div>
- <ul id="templateTile" class="tile-check tile-template">
- </ul>
- <script type="html/text" id="tmpl-template" class="tmpl-html">
- <li>
- <label>
- <input type="radio" name="template" value="/plugins/kimchi/templates/{name}">
- <div class="info">
- <div class="summary os-icon">
- <img src="{icon}">
- <span class="title">{name}</span>
- </div>
- <ul class="list-info">
- <li><label>$_("OS")</label><span>{os_distro}</span></li>
- <li><label>$_("OS Version")</label><span>{os_version}</span></li>
- <li><label>$_("CPUS")</label><span>{cpus}</span></li>
- <li><label>$_("Memory")</label><span>{memory}M</span></li>
- </ul>
+ <div class="guest-pager">
+ <div class="page-list">
+ <div class="page">
+ <div class="row">
+ <div id="prompt-create-template" class="hidden">
+ <p>$_("Please create a template first.")</p>
+ <a id="btn-create-template" class="btn btn-primary" href="templates.html">$_("Create a Template")</a>
+ </div>
+ <p id="prompt-choose-template" class="hidden">$_("Please choose a template.")</p>
+ </div>
+ <ul id="templateTile" class="list-template tile-check tile-template">
+ </ul>
+ <script type="html/text" id="tmpl-template" class="tmpl-html">
+ <li class="col-md-3">
+ <label class="box-iso-outer">
+ <input type="radio" name="template" value="/plugins/kimchi/templates/{name}" class="iso-radio-hidden">
+ <span class="box-iso-border">
+ <span class="box-iso-inner">
+ <h3 class="iso-title {os_distro}" title="{name}">{name}</h3>
+ <dl class="iso-info">
+ <dt>{os_distro}</dt>
+ <dd>$_("OS: ")</dd>
+ <dt>{os_version}</dt>
+ <dd>$_("Version: ")</dd>
+ <dt>{cpus}</dt>
+ <dd>$_("CPUS")</dd>
+ <dt>{memory}M</dt>
+ <dd>$_("Memory")</dd>
+ </dl>
+ </span>
+ </span>
+ </label>
+ </li>
+ </script>
</div>
- </label>
- </li>
- </script>
+ </div>
+ </div>
+ </form>
</div>
- </section>
- </form>
+ <div class="modal-footer">
+ <button id="vm-doAdd" class="btn btn-default" disabled="disabled" href="javascript:void(0);">$_("Create")</button>
+ <button id="vm-doAdding" class="btn btn-default" disabled="disabled" style="display:none" href="javascript:void(0);"><span class="wok-loading-icon"></span> $_("Creating...")</button>
+ <button id="vm-add=cancel" class="btn btn-default" data-dismiss="modal" type="button">$_("Cancel")</button>
</div>
- <footer>
- <div class="btn-group">
- <button id="vm-doAdd" class="btn-normal" disabled="disabled" href="javascript:void(0);"><span class="text">$_("Create")</span></button>
- <button id="vm-doAdding" class="btn-normal" disabled="disabled" style="display:none" href="javascript:void(0);"><span class="text">$_("Creating...")</span></button>
- <button id="vm-add=cancel" class="btn-normal close" type="button">
- <span class="text">$_("Cancel")</span>
- </button>
- </div>
- </footer>
</div>
<script>
kimchi.guest_add_main();
diff --git a/src/wok/plugins/kimchi/ui/pages/guest-edit.html.tmpl b/src/wok/plugins/kimchi/ui/pages/guest-edit.html.tmpl
index 0c47ac8..098f409 100644
--- a/src/wok/plugins/kimchi/ui/pages/guest-edit.html.tmpl
+++ b/src/wok/plugins/kimchi/ui/pages/guest-edit.html.tmpl
@@ -20,12 +20,11 @@
#silent t = gettext.translation($lang.domain, $lang.localedir, languages=$lang.lang, fallback=True)
#silent _ = t.gettext
#silent _t = t.gettext
-
-<div id="guest-edit-window" class="window">
- <header>
- <h1 class="title h1 grey">$_("Edit Guest")</h1>
- </header>
- <div class="content">
+<div id="guest-edit-window" class="window modal-content">
+ <div class="modal-header">
+ <h4 class="modal-title">$_("Edit Guest")</h4>
+ </div>
+ <div class="modal-body">
<div id="guest-edit-tabs">
<ul>
<li>
@@ -48,54 +47,22 @@
</li>
</ul>
<form id="form-guest-edit-general">
- <fieldset class="guest-edit-fieldset">
- <div class="edit-general-inline">
- <div class="guest-edit-wrapper-label">
- <label for="guest-edit-id-textbox">
- $_("Name")
- </label>
- </div>
- <div class="guest-edit-wrapper-label">
- <label for="guest-edit-cores-textbox">
- $_("CPUs")
- </label>
- </div>
- <div class="guest-edit-wrapper-label">
- <label for="guest-edit-memory-textbox">
- $_("Memory (MB)")
- </label>
- </div>
- <div class="guest-edit-wrapper-label">
- <label for="guest-edit-icon-textbox">
- $_("Icon")
- </label>
- </div>
- </div>
- <div class="edit-general-inline">
- <div class="guest-edit-wrapper-controls">
- <input id="guest-edit-id-textbox"
- name="name" type="text" />
- </div>
- <div class="guest-edit-wrapper-controls">
- <input
- id="guest-edit-cores-textbox"
- name="cpus"
- type="text" />
- </div>
- <div class="guest-edit-wrapper-controls">
- <input id="guest-edit-memory-textbox"
- name="memory"
- type="text" />
- </div>
- <div class="guest-edit-wrapper-controls">
- <input
- id="guest-edit-icon-textbox"
- name="icon"
- type="text"
- disabled="disabled" />
- </div>
- </div>
- </fieldset>
+ <div class="form-group">
+ <label for="guest-edit-id-textbox">$_("Name")</label>
+ <input id="guest-edit-id-textbox" class="form-control" name="name" type="text" />
+ </div>
+ <div class="form-group">
+ <label for="guest-edit-cores-textbox">$_("CPUs")</label>
+ <input id="guest-edit-cores-textbox" class="form-control" name="cpus" type="text" />
+ </div>
+ <div class="form-group">
+ <label for="guest-edit-memory-textbox">$_("Memory (MB)")</label>
+ <input id="guest-edit-memory-textbox" class="form-control" name="memory" type="text" />
+ </div>
+ <div class="form-group">
+ <label for="guest-edit-icon-textbox">$_("Icon")</label>
+ <input id="guest-edit-icon-textbox" class="form-control" name="icon" type="text" disabled="disabled" />
+ </div>
</form>
<form id="form-guest-edit-storage">
<div class="header">
@@ -106,11 +73,11 @@
<div class="body"></div>
</form>
<form id="form-guest-edit-interface" class="guest-edit-interface">
+ <button class="add btn btn-primary"><i class="fa fa-plus-circle"></i> Add</button>
<div class="header">
<span class="cell">$_("Network")</span>
<span class="cell">$_("Type")</span>
<span class="cell">$_("MAC Address")</span>
- <button class="add action-area"></button>
</div>
<div class="body"></div>
</form>
@@ -129,8 +96,8 @@
</div>
</div>
<div class="column control">
- <button id="permissionGo"> > </button>
- <button id="permissionBack"> < </button>
+ <button id="permissionGo"> < </button>
+ <button id="permissionBack"> > </button>
</div>
<div class="column selected">
<div class="title">$_("Selected system users and groups")</div>
@@ -157,7 +124,7 @@
<div class="guest-scroll-indent">
<div class="filter">
<span class="group">
- <select class="control">
+ <select class="control selectpicker">
<option value="all">$_("All")</option>
<option value="toAdd">$_("To Add")</option>
<option value="added">$_("Added")</option>
@@ -184,16 +151,12 @@
</form>
</div>
</div>
- <footer>
- <div id="action-button-container" class="btn-group hidden">
- <button id="guest-edit-button-save" class="btn-normal">
- <span class="text">$_("Save")</span>
- </button>
+ <div class="modal-footer">
+ <div id="action-button-container" class="hidden">
+ <button id="guest-edit-button-save" class="btn btn-default">$_("Save")</button>
</div>
- <button id="guest-edit-button-cancel" class="btn-normal close">
- <span class="text">$_("Cancel")</span>
- </button>
- </footer>
+ <button id="guest-edit-button-cancel" class="btn btn-default">$_("Cancel")</button>
+ </div>
</div>
<script id="cdrom-row-tmpl" type="text/html">
<div class="item view" id="cdrom-{dev}">
diff --git a/src/wok/plugins/kimchi/ui/pages/guest-storage-add.html.tmpl b/src/wok/plugins/kimchi/ui/pages/guest-storage-add.html.tmpl
index a26e0f9..c8ab96c 100644
--- a/src/wok/plugins/kimchi/ui/pages/guest-storage-add.html.tmpl
+++ b/src/wok/plugins/kimchi/ui/pages/guest-storage-add.html.tmpl
@@ -22,11 +22,11 @@
#silent _ = t.gettext
#silent _t = t.gettext
<div id="guest-storage-add-window" class="window">
- <header>
- <h1 class="title">$_("Add a Storage Device to VM")</h1>
- <div class="close">X</div>
- </header>
- <div class="content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title">$_("Add a Storage Device to VM")</hh>
+ </div>
+ <div class="modal-body">
<form id="form-guest-storage-add">
<section class="form-section">
<h2>1. $_("Device Type")</h2>
@@ -90,13 +90,10 @@
</fieldset>
</form>
</div>
- <footer>
- <div class="btn-group">
- <button id="guest-storage-button-add" class="btn-normal" disabled="disabled">
- <span class="text">$_("Attach")</span>
- </button>
- </div>
- </footer>
+ <div class="modal-footer">
+ <button id="guest-storage-button-add" class="btn btn-default" disabled="disabled">$_("Attach")</button>
+ <button class="btn btn-default" data-dismiss="modal">$_("Cancel")</button>
+ </div>
</div>
<script type="text/javascript">
kimchi.guest_storage_add_main();
diff --git a/src/wok/plugins/kimchi/ui/pages/guests.html.tmpl b/src/wok/plugins/kimchi/ui/pages/guests.html.tmpl
index 3c3aa32..a5c6846 100644
--- a/src/wok/plugins/kimchi/ui/pages/guests.html.tmpl
+++ b/src/wok/plugins/kimchi/ui/pages/guests.html.tmpl
@@ -34,27 +34,52 @@
</head>
<body>
<div id="guests-root-container">
- <div class="toolbar">
- <div class="tools" style="display:none">
- <a id="vm-add" class="btn-tool" href="javascript:void(0);"><span class="icon add">+</span></a>
+ <nav class="navbar navbar-default toolbar">
+ <div class="container">
+ <!-- Brand and toggle get grouped for better mobile display -->
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#toolbar" aria-expanded="false">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ </div>
+ <!-- Collect the nav links, forms, and other content for toggling -->
+ <div class="collapse navbar-collapse" id="toolbar">
+ <ul class="nav navbar-nav navbar-right tools" display="none">
+ <li><a id="vm-add" class="btn-tool" href="javascript:void(0);"><i class="fa fa-plus-circle"></i><span>Add a Guest</span></a></li>
+ </ul>
+ </div>
</div>
- </div>
- <div id="guestListField" style="display: none">
- <ul class="list-title">
- <li class="guest-type">$_("Name")</li>
- <li class="guest-cpu">$_("CPU")</li>
+ </nav>
+ <div id="guest-content-container">
+ <div class="container">
+ <div id="alert-container"></div>
+ <div id="guestListField" style="display: none">
+ <ul class="list-title">
+ <li class="guest-type">$_("Name")</li>
+ <li class="guest-cpu">$_("CPU")</li>
<li class="guest-memory">$_("Memory")</li>
- <li class="guest-storage">$_("Disk I/O")</li>
- <li class="guest-network">$_("Network I/O")</li>
- <li class="guest-tile">$_("Livetile")</li>
- <li class="guest-actions">$_("Actions")</li>
- </ul>
- <ul id="guestList" class="list-vm empty-when-logged-off">
- </ul>
- </div>
- <div id="noGuests" class="list-no-result" style="display: none;">
- $_("No guests found.")
+ <li class="guest-storage">$_("Disk I/O")</li>
+ <li class="guest-network">$_("Network I/O")</li>
+ <li class="guest-tile">$_("Livetile")</li>
+ <li class="guest-actions">$_("Actions")</li>
+ </ul>
+ <ul id="guestList" class="list-vm empty-when-logged-off">
+ </ul>
+ </div>
+ <div id="noGuests" class="list-no-result" style="display: none;">
+ $_("No guests found.")
+ </div>
+ </div>
</div>
+<div id="modalWindow" class="modal fade host-modal guests-modal" tabindex="-1" role="dialog" aria-labelledby="guestsModalLabel" aria-hidden="true">
+</div>
+<div id="extendCreateTemplate" class="modal fade host-modal templates-modal" tabindex="-1" role="dialog" aria-labelledby="templateModalLabel" aria-hidden="true">
+</div>
+<div id="extendCreateStorage" class="modal fade host-modal storage-modal" tabindex="-1" role="dialog" aria-labelledby="storageModalLabel" aria-hidden="true">
+</div>
<script id="guest-tmpl" type="kimchi/template">
$ht(file=$data.ui_dir + "/pages/guest.html.tmpl", searchList=[self, {'lang':$lang}])
</script>
diff --git a/ui/css/src/modules/_guests.scss b/ui/css/src/modules/_guests.scss
new file mode 100644
index 0000000..23c361a
--- /dev/null
+++ b/ui/css/src/modules/_guests.scss
@@ -0,0 +1,92 @@
+//
+// Project Wok
+//
+// Copyright IBM, Corp. 2015
+//
+// Code derived from Project Kimchi
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+/* Create Guest Modal */
+
+.guests-modal {
+ .modal-dialog {
+ width: 1100px;
+ }
+ .page-list {
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ overflow: hidden;
+ }
+ .page {
+ position: absolute;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ overflow: auto;
+ padding: 10px 30px;
+ }
+}
+
+#guest-add-window {
+ .modal-body {
+ margin: 0;
+ padding: 0;
+ }
+ .modal-footer {
+ margin-top: 0;
+ }
+ .modal-footer .btn + .btn {
+ margin-left: 0;
+ }
+ .modal-footer .btn {
+ margin-right: 5px;
+ }
+ .modal-dialog {
+ width: 900px;
+ }
+ .guest-modal-container {
+ padding: 10px 30px;
+ position: relative;
+ }
+ .guest-pager {
+ background: $table-border-color;
+ overflow: hidden;
+ position: relative;
+ height: 530px;
+ }
+ &.modal-content p {
+ margin: 0 0 10px 0;
+ }
+ &.modal-content h5 {
+ font-size: 13pt;
+ font-weight: 400;
+ margin-top: 0;
+ }
+ &.modal-content label {
+ font-size: 16px;
+ font-weight: 400;
+ font-family: $font-family-sans-serif;
+ }
+ form#form-vm-add {
+ margin: 0;
+ }
+ input#guest-vm-name,
+ p.help-block {
+ width: 592px;
+ }
+}
--
1.9.3
More information about the Kimchi-devel
mailing list