aboutsummaryrefslogtreecommitdiffstats
path: root/vid-app-common/src/main/webapp/app/vid/styles
diff options
context:
space:
mode:
Diffstat (limited to 'vid-app-common/src/main/webapp/app/vid/styles')
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/buttons.css58
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/change-management-icons.css67
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/change-management.css28
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/common.css115
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/Apache License.txt201
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Bold.ttfbin0 -> 224592 bytes
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-BoldItalic.ttfbin0 -> 213292 bytes
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-ExtraBold.ttfbin0 -> 222584 bytes
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-ExtraBoldItalic.ttfbin0 -> 213420 bytes
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Italic.ttfbin0 -> 212896 bytes
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Light.ttfbin0 -> 222412 bytes
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-LightItalic.ttfbin0 -> 213128 bytes
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Regular.ttfbin0 -> 217360 bytes
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Semibold.ttfbin0 -> 221328 bytes
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-SemiboldItalic.ttfbin0 -> 212820 bytes
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.eotbin5200 -> 6448 bytes
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.svg3
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.ttfbin5036 -> 6284 bytes
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.woffbin5112 -> 6360 bytes
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/styles/instantiate.css8
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/messageViewer.css17
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/modal-buttons.css29
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/modal-create-new.css196
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/modals.css52
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/networkNode.css271
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/pnfSearchAssociation.css82
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/search.css37
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/serviceMetadata.css18
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/styles/serviceModels.css4
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/serviceProxyConfig.css154
-rw-r--r--vid-app-common/src/main/webapp/app/vid/styles/testEnvironments.css215
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/styles/vidTree.css4
32 files changed, 1553 insertions, 6 deletions
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/buttons.css b/vid-app-common/src/main/webapp/app/vid/styles/buttons.css
new file mode 100644
index 00000000..7a2a9015
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/buttons.css
@@ -0,0 +1,58 @@
+button {
+ border-radius: 2px;
+ font-size: 14px;
+ line-height: 28px;
+ height: 30px;
+}
+
+button.blue {
+ border: #0091c8 1px solid;
+ background-color: #009fdb;
+ color: white;
+}
+button.blue:hover {
+ background-color: #1ec2ff;
+ border-color: #0091c8;
+}
+button.blue:active {
+ background-color: #0091c7;
+ border-color: #006186;
+}
+button.blue[disabled] {
+ background-color: rgba(5, 104, 174, 0.3);
+ border-color: rgba(4, 113, 168, 0.3);
+}
+
+
+button.transparent {
+ border: 0;
+ background-color: transparent;
+ outline: none;
+}
+button.transparent:hover {
+ background-color: transparent;
+}
+button.transparent:active {
+ background-color: transparent;
+}
+button.transparent[disabled] {
+ background-color: transparent;
+}
+
+.clickable-text {
+ font-size: 12px !important;
+ color: #337ab7; !important;
+ text-decoration: none;
+ text-decoration-line: none !important;
+}
+.clickable-text:hover {
+ color: #23527c !important;
+ text-decoration: none;
+ text-decoration-line: none !important;
+}
+.clickable-text:active {
+ color: #0091c7 !important;
+}
+.clickable-text[disabled] {
+ color: rgba(5, 104, 174, 0.3) !important;
+}
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/change-management-icons.css b/vid-app-common/src/main/webapp/app/vid/styles/change-management-icons.css
index 8c4dbd8c..7e9620a3 100644
--- a/vid-app-common/src/main/webapp/app/vid/styles/change-management-icons.css
+++ b/vid-app-common/src/main/webapp/app/vid/styles/change-management-icons.css
@@ -51,8 +51,13 @@
color: #5a5a5a;
}
.icon-pending:before {
+ content: "\e905";
+ color: #00aeef;
+ cursor: pointer;
+ }
+.icon-deleted:before {
content: "\e905";
- color: #00aeef;
+ color: #cf2a2a;
cursor: pointer;
}
.icon-plus:before {
@@ -80,3 +85,63 @@
font-size: 12px;
cursor: pointer;
}
+.icon-search-in:before {
+ content: "\e90d";
+ color: #009FDB;
+ font-size: 17px;
+ cursor: pointer;
+}
+.expand-icon{
+ margin-right: 10px;
+ position: relative;
+ width: 11px;
+ height: 11px;
+ display: inline-block;
+ cursor: pointer;
+}
+
+/* Vertical line */
+.expand-icon:before{
+ content: "";
+ position: absolute;
+ background-color: #5a5a5a;
+ transition: transform 0.25s ease-out;
+ right: 40%;
+ width: 2px;
+ height: 100%;
+ margin-left: 5px;
+}
+
+/* horizontal line */
+.expand-icon:after{
+ content: "";
+ position: absolute;
+ background-color: #5a5a5a;
+ transition: transform 0.25s ease-out;
+ top: 40%;
+ left: 0;
+ width: 100%;
+ height: 2px;
+}
+.collapse-icon{
+ margin-right: 10px;
+ cursor: pointer;
+ display: inline-block;
+ width: 10px;
+ border-top: 1.6px solid #5a5a5a;
+ padding: 2.6px;
+}
+.icon-search2:before {
+ content: "\e90d";
+ color: #009FDB;
+ font-size: 40px;
+ cursor: pointer;
+}
+.icon-sync:before {
+ content: "\e90f";
+ font-size: 20px;
+ cursor: pointer;
+}
+.icon-sync:hover:before {
+ color: #009FDB;
+}
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/change-management.css b/vid-app-common/src/main/webapp/app/vid/styles/change-management.css
index 68a06ee1..7edbea03 100644
--- a/vid-app-common/src/main/webapp/app/vid/styles/change-management.css
+++ b/vid-app-common/src/main/webapp/app/vid/styles/change-management.css
@@ -90,7 +90,7 @@
}
.jobs-table {
- background-color: #f8f8f8;
+ background-color: #ffffff;
padding: 40px;
}
@@ -119,7 +119,7 @@
border: 1px solid #eaeaea;
box-sizing: border-box;
background-color: #ffffff;
- box-shadow: 0px 2px 7px 0px rgba(34, 31, 31, 0.17);
+ /* box-shadow: 0px 2px 7px 0px rgba(34, 31, 31, 0.17);*/
font-family: "Open Sans";
color: #5a5a5a;
font-size: 14px;
@@ -127,7 +127,7 @@
}
.table>thead {
- background-color: #d2d2d2;
+ background-color: #F2F2F2;
font-family: "Open Sans";
color: #191919;
font-size: 13px;
@@ -140,7 +140,7 @@
color: #00aeef;
font-size: 14px;
font-weight: 600;
- background-color: #eaeaea;
+ background-color: #EAEAEA;
box-shadow: 0px 1px 1px 0px rgba(34, 31, 31, 0.19);
}
@@ -154,4 +154,24 @@
.centered {
text-align: center;
+}
+.table-wrapper{
+}
+
+.refresh-cm {
+ float: right;
+ position: relative;
+ right: 45px;
+ top: 50px;
+ z-index: 900;
+ color: #191919;
+ font-size: 14px;
+}
+.refresh-cm .last-time-updated {
+ color: #5A5A5A;
+}
+.refresh-cm i.icon-sync {
+ padding-left: 10px;
+ top: 3px;
+ position: relative;
} \ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/common.css b/vid-app-common/src/main/webapp/app/vid/styles/common.css
index 8d6fb615..35f2e33f 100644
--- a/vid-app-common/src/main/webapp/app/vid/styles/common.css
+++ b/vid-app-common/src/main/webapp/app/vid/styles/common.css
@@ -1,3 +1,116 @@
+@font-face {
+ font-family: OpenSans-Bold;
+ src: url("fonts/OpenSans/OpenSans-Bold.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-BoldItlaic;
+ src: url("fonts/OpenSans/OpenSans-BoldItalic.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-ExtraBold;
+ src: url("fonts/OpenSans/OpenSans-ExtraBold.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-ExtraBoldItalic;
+ src: url("fonts/OpenSans/OpenSans-ExtraBoldItalic.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-Italic;
+ src: url("fonts/OpenSans/OpenSans-Italic.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-Light;
+ src: url("fonts/OpenSans/OpenSans-Light.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-LightItalic;
+ src: url("fonts/OpenSans/OpenSans-LightItalic.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-Regular;
+ src: url("fonts/OpenSans/OpenSans-Regular.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-Semibold;
+ src: url("fonts/OpenSans/OpenSans-Semibold.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-SemiboldItalic;
+ src: url("fonts/OpenSans/OpenSans-SemiboldItalic.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: 'icomoon';
+ src: url('fonts/icomoon.eot?4cilop');
+ src: url('fonts/icomoon.eot?4cilop#iefix') format('embedded-opentype'),
+ url('fonts/icomoon.ttf?4cilop') format('truetype'),
+ url('fonts/icomoon.woff?4cilop') format('woff'),
+ url('fonts/icomoon.svg?4cilop#icomoon') format('svg');
+ font-weight: normal;
+ font-style: normal;
+}
+
html, body {
font-size:14px;
-} \ No newline at end of file
+}
+
+.button--inactive {
+ border: none !important;
+}
+
+.modal-body [class^="icon-"],.modal-body [class*=" icon-"] {
+ /* use !important to prevent issues with browser extensions that change fonts */
+ font-family: 'icomoon' !important;
+ speak: none;
+ font-style: normal;
+ font-weight: normal;
+ font-variant: normal;
+ text-transform: none;
+ line-height: 1;
+
+ /* Better Font Rendering =========== */
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-browse:before {
+ content: "\e90e";
+ color: #5A5A5A;
+ font-size: 4px;
+ cursor: pointer;
+ width: 37px;
+ height: 37px;
+ line-height: 37px;
+ text-align: center;
+ background: #F2F2F2;
+ border: 1px solid #D2D2D2;
+ display: inline-block;
+ vertical-align: top;
+ border-radius: 2px;
+ border-bottom-left-radius: 0;
+ border-top-left-radius: 0;
+}
+
+.icon-browse:hover::before {
+ background-color: #E6F6FB;
+ color: #009FDB;
+}
+
+.icon-browse:active::before {
+ background-color: #E6F6FB;
+ color: #009FDB;
+}
+
+input:focus:invalid {
+ border-color: Tomato;
+ box-shadow: none;
+}
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/Apache License.txt b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/Apache License.txt
new file mode 100644
index 00000000..989e2c59
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/Apache License.txt
@@ -0,0 +1,201 @@
+Apache License
+ Version 2.0, January 2004
+ http://www.apache.org/licenses/
+
+ TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+ 1. Definitions.
+
+ "License" shall mean the terms and conditions for use, reproduction,
+ and distribution as defined by Sections 1 through 9 of this document.
+
+ "Licensor" shall mean the copyright owner or entity authorized by
+ the copyright owner that is granting the License.
+
+ "Legal Entity" shall mean the union of the acting entity and all
+ other entities that control, are controlled by, or are under common
+ control with that entity. For the purposes of this definition,
+ "control" means (i) the power, direct or indirect, to cause the
+ direction or management of such entity, whether by contract or
+ otherwise, or (ii) ownership of fifty percent (50%) or more of the
+ outstanding shares, or (iii) beneficial ownership of such entity.
+
+ "You" (or "Your") shall mean an individual or Legal Entity
+ exercising permissions granted by this License.
+
+ "Source" form shall mean the preferred form for making modifications,
+ including but not limited to software source code, documentation
+ source, and configuration files.
+
+ "Object" form shall mean any form resulting from mechanical
+ transformation or translation of a Source form, including but
+ not limited to compiled object code, generated documentation,
+ and conversions to other media types.
+
+ "Work" shall mean the work of authorship, whether in Source or
+ Object form, made available under the License, as indicated by a
+ copyright notice that is included in or attached to the work
+ (an example is provided in the Appendix below).
+
+ "Derivative Works" shall mean any work, whether in Source or Object
+ form, that is based on (or derived from) the Work and for which the
+ editorial revisions, annotations, elaborations, or other modifications
+ represent, as a whole, an original work of authorship. For the purposes
+ of this License, Derivative Works shall not include works that remain
+ separable from, or merely link (or bind by name) to the interfaces of,
+ the Work and Derivative Works thereof.
+
+ "Contribution" shall mean any work of authorship, including
+ the original version of the Work and any modifications or additions
+ to that Work or Derivative Works thereof, that is intentionally
+ submitted to Licensor for inclusion in the Work by the copyright owner
+ or by an individual or Legal Entity authorized to submit on behalf of
+ the copyright owner. For the purposes of this definition, "submitted"
+ means any form of electronic, verbal, or written communication sent
+ to the Licensor or its representatives, including but not limited to
+ communication on electronic mailing lists, source code control systems,
+ and issue tracking systems that are managed by, or on behalf of, the
+ Licensor for the purpose of discussing and improving the Work, but
+ excluding communication that is conspicuously marked or otherwise
+ designated in writing by the copyright owner as "Not a Contribution."
+
+ "Contributor" shall mean Licensor and any individual or Legal Entity
+ on behalf of whom a Contribution has been received by Licensor and
+ subsequently incorporated within the Work.
+
+ 2. Grant of Copyright License. Subject to the terms and conditions of
+ this License, each Contributor hereby grants to You a perpetual,
+ worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+ copyright license to reproduce, prepare Derivative Works of,
+ publicly display, publicly perform, sublicense, and distribute the
+ Work and such Derivative Works in Source or Object form.
+
+ 3. Grant of Patent License. Subject to the terms and conditions of
+ this License, each Contributor hereby grants to You a perpetual,
+ worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+ (except as stated in this section) patent license to make, have made,
+ use, offer to sell, sell, import, and otherwise transfer the Work,
+ where such license applies only to those patent claims licensable
+ by such Contributor that are necessarily infringed by their
+ Contribution(s) alone or by combination of their Contribution(s)
+ with the Work to which such Contribution(s) was submitted. If You
+ institute patent litigation against any entity (including a
+ cross-claim or counterclaim in a lawsuit) alleging that the Work
+ or a Contribution incorporated within the Work constitutes direct
+ or contributory patent infringement, then any patent licenses
+ granted to You under this License for that Work shall terminate
+ as of the date such litigation is filed.
+
+ 4. Redistribution. You may reproduce and distribute copies of the
+ Work or Derivative Works thereof in any medium, with or without
+ modifications, and in Source or Object form, provided that You
+ meet the following conditions:
+
+ (a) You must give any other recipients of the Work or
+ Derivative Works a copy of this License; and
+
+ (b) You must cause any modified files to carry prominent notices
+ stating that You changed the files; and
+
+ (c) You must retain, in the Source form of any Derivative Works
+ that You distribute, all copyright, patent, trademark, and
+ attribution notices from the Source form of the Work,
+ excluding those notices that do not pertain to any part of
+ the Derivative Works; and
+
+ (d) If the Work includes a "NOTICE" text file as part of its
+ distribution, then any Derivative Works that You distribute must
+ include a readable copy of the attribution notices contained
+ within such NOTICE file, excluding those notices that do not
+ pertain to any part of the Derivative Works, in at least one
+ of the following places: within a NOTICE text file distributed
+ as part of the Derivative Works; within the Source form or
+ documentation, if provided along with the Derivative Works; or,
+ within a display generated by the Derivative Works, if and
+ wherever such third-party notices normally appear. The contents
+ of the NOTICE file are for informational purposes only and
+ do not modify the License. You may add Your own attribution
+ notices within Derivative Works that You distribute, alongside
+ or as an addendum to the NOTICE text from the Work, provided
+ that such additional attribution notices cannot be construed
+ as modifying the License.
+
+ You may add Your own copyright statement to Your modifications and
+ may provide additional or different license terms and conditions
+ for use, reproduction, or distribution of Your modifications, or
+ for any such Derivative Works as a whole, provided Your use,
+ reproduction, and distribution of the Work otherwise complies with
+ the conditions stated in this License.
+
+ 5. Submission of Contributions. Unless You explicitly state otherwise,
+ any Contribution intentionally submitted for inclusion in the Work
+ by You to the Licensor shall be under the terms and conditions of
+ this License, without any additional terms or conditions.
+ Notwithstanding the above, nothing herein shall supersede or modify
+ the terms of any separate license agreement you may have executed
+ with Licensor regarding such Contributions.
+
+ 6. Trademarks. This License does not grant permission to use the trade
+ names, trademarks, service marks, or product names of the Licensor,
+ except as required for reasonable and customary use in describing the
+ origin of the Work and reproducing the content of the NOTICE file.
+
+ 7. Disclaimer of Warranty. Unless required by applicable law or
+ agreed to in writing, Licensor provides the Work (and each
+ Contributor provides its Contributions) on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+ implied, including, without limitation, any warranties or conditions
+ of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+ PARTICULAR PURPOSE. You are solely responsible for determining the
+ appropriateness of using or redistributing the Work and assume any
+ risks associated with Your exercise of permissions under this License.
+
+ 8. Limitation of Liability. In no event and under no legal theory,
+ whether in tort (including negligence), contract, or otherwise,
+ unless required by applicable law (such as deliberate and grossly
+ negligent acts) or agreed to in writing, shall any Contributor be
+ liable to You for damages, including any direct, indirect, special,
+ incidental, or consequential damages of any character arising as a
+ result of this License or out of the use or inability to use the
+ Work (including but not limited to damages for loss of goodwill,
+ work stoppage, computer failure or malfunction, or any and all
+ other commercial damages or losses), even if such Contributor
+ has been advised of the possibility of such damages.
+
+ 9. Accepting Warranty or Additional Liability. While redistributing
+ the Work or Derivative Works thereof, You may choose to offer,
+ and charge a fee for, acceptance of support, warranty, indemnity,
+ or other liability obligations and/or rights consistent with this
+ License. However, in accepting such obligations, You may act only
+ on Your own behalf and on Your sole responsibility, not on behalf
+ of any other Contributor, and only if You agree to indemnify,
+ defend, and hold each Contributor harmless for any liability
+ incurred by, or claims asserted against, such Contributor by reason
+ of your accepting any such warranty or additional liability.
+
+ END OF TERMS AND CONDITIONS
+
+ APPENDIX: How to apply the Apache License to your work.
+
+ To apply the Apache License to your work, attach the following
+ boilerplate notice, with the fields enclosed by brackets "[]"
+ replaced with your own identifying information. (Don't include
+ the brackets!) The text should be enclosed in the appropriate
+ comment syntax for the file format. We also recommend that a
+ file or class name and description of purpose be included on the
+ same "printed page" as the copyright notice for easier
+ identification within third-party archives.
+
+ Copyright [yyyy] [name of copyright owner]
+
+ 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. \ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Bold.ttf b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Bold.ttf
new file mode 100644
index 00000000..fd79d43b
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Bold.ttf
Binary files differ
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-BoldItalic.ttf b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-BoldItalic.ttf
new file mode 100644
index 00000000..9bc80095
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-BoldItalic.ttf
Binary files differ
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-ExtraBold.ttf b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-ExtraBold.ttf
new file mode 100644
index 00000000..21f6f84a
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-ExtraBold.ttf
Binary files differ
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-ExtraBoldItalic.ttf b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-ExtraBoldItalic.ttf
new file mode 100644
index 00000000..31cb6883
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-ExtraBoldItalic.ttf
Binary files differ
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Italic.ttf b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Italic.ttf
new file mode 100644
index 00000000..c90da48f
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Italic.ttf
Binary files differ
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Light.ttf b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Light.ttf
new file mode 100644
index 00000000..0d381897
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Light.ttf
Binary files differ
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-LightItalic.ttf b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-LightItalic.ttf
new file mode 100644
index 00000000..68299c4b
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-LightItalic.ttf
Binary files differ
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Regular.ttf b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Regular.ttf
new file mode 100644
index 00000000..db433349
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Regular.ttf
Binary files differ
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Semibold.ttf b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Semibold.ttf
new file mode 100644
index 00000000..1a7679e3
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-Semibold.ttf
Binary files differ
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-SemiboldItalic.ttf b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-SemiboldItalic.ttf
new file mode 100644
index 00000000..59b6d16b
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/OpenSans/OpenSans-SemiboldItalic.ttf
Binary files differ
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.eot b/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.eot
index e57ccc5e..9a031a85 100644
--- a/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.eot
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.eot
Binary files differ
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.svg b/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.svg
index 5d514c47..3b288d8c 100644
--- a/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.svg
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.svg
@@ -20,4 +20,7 @@
<glyph unicode="&#xe90a;" glyph-name="noun_573805_cc-03" d="M512.211 960c-282.886 0-512.211-229.325-512.211-512.211s229.325-512.211 512.211-512.211c282.887 0 512.211 229.325 512.211 512.211v0c-0.017 282.88-229.332 512.195-512.21 512.211h-0.001zM261.202 377.71c-38.703 0-70.079 31.375-70.079 70.079s31.375 70.079 70.079 70.079c38.703 0 70.079-31.375 70.079-70.079v0c0.005-0.298 0.007-0.649 0.007-1.001 0-38.155-30.93-69.085-69.085-69.085-0.352 0-0.703 0.003-1.054 0.008l0.053-0.001zM512.211 377.71c-38.703 0-70.079 31.375-70.079 70.079s31.375 70.079 70.079 70.079c38.703 0 70.079-31.375 70.079-70.079v0c0-0.061 0-0.133 0-0.205 0-38.59-31.284-69.874-69.874-69.874-0.072 0-0.144 0-0.216 0h0.011zM763.221 377.71c-38.703 0-70.079 31.375-70.079 70.079s31.375 70.079 70.079 70.079c38.703 0 70.079-31.375 70.079-70.079v0c0-0.061 0-0.133 0-0.205 0-38.59-31.284-69.874-69.874-69.874-0.072 0-0.144 0-0.217 0h0.011z" />
<glyph unicode="&#xe90b;" glyph-name="scedular" horiz-adv-x="981" d="M981.333 662.699c0.312 4.17 0.49 9.033 0.49 13.938 0 109.691-88.922 198.613-198.613 198.613-5.353 0-10.656-0.212-15.902-0.627l0.693 0.044h-554.667c-4.553 0.371-9.857 0.583-15.21 0.583-109.691 0-198.613-88.922-198.613-198.613 0-4.905 0.178-9.768 0.527-14.583l-0.038 0.645v-470.699c0-128.811 82.475-256 213.333-256h554.667c130.859 0 213.333 127.189 213.333 256v470.699zM36.352 662.699c0 109.141 66.048 169.301 176.981 169.301h554.667c110.933 0 176.981-60.16 176.981-169.301l-6.315-44.032h-896zM938.667 192c0-109.141-59.733-213.333-170.667-213.333h-554.667c-110.933 0-170.667 104.192-170.667 213.333v384h896v-384zM362.667 405.333h256c11.782 0 21.333-9.551 21.333-21.333s-9.551-21.333-21.333-21.333v0h-256c-11.782 0-21.333 9.551-21.333 21.333s9.551 21.333 21.333 21.333v0zM362.667 234.667h256c11.782 0 21.333-9.551 21.333-21.333s-9.551-21.333-21.333-21.333v0h-256c-11.782 0-21.333 9.551-21.333 21.333s9.551 21.333 21.333 21.333v0zM704 960c11.782 0 21.333-9.551 21.333-21.333v0-170.667c0-11.782-9.551-21.333-21.333-21.333s-21.333 9.551-21.333 21.333v0 170.667c0 11.782 9.551 21.333 21.333 21.333v0zM277.333 960c11.782 0 21.333-9.551 21.333-21.333v0-170.667c0-11.782-9.551-21.333-21.333-21.333s-21.333 9.551-21.333 21.333v0 170.667c0 11.782 9.551 21.333 21.333 21.333v0z" />
<glyph unicode="&#xe90c;" glyph-name="finished_d" d="M512 960v0c-282.77 0-512-229.23-512-512v0c0-282.77 229.23-512 512-512s512 229.23 512 512c0 282.77-229.23 512-512 512zM473.454 273.993c8.558 13.239 15.067 22.894 21.138 32.768 91.648 149.211 118.126 170.569 209.701 319.781 5.105 9.183 10.457 17.077 16.416 24.459l-0.252-0.322c8.798 10.219 21.751 16.651 36.206 16.651 9.048 0 17.507-2.52 24.715-6.896l-0.212 0.119c13.74-7.345 22.93-21.594 22.93-37.989 0-6.179-1.305-12.053-3.655-17.361l0.108 0.274c-3.479-7.646-7.067-14.1-11.098-20.236l0.346 0.561c-108.251-176.859-151.479-225.646-259.803-402.286-7.527-16.71-24.034-28.132-43.21-28.132-13.809 0-26.235 5.924-34.874 15.369l-0.032 0.036q-107.52 91.502-213.138 184.978c-11.444 7.654-18.878 20.525-18.878 35.132 0 11.575 4.668 22.060 12.224 29.675l-0.003-0.003c9.080 9.371 21.781 15.187 35.84 15.187s26.76-5.816 35.827-15.174l0.013-0.013c46.738-39.643 92.672-80.457 138.971-120.32z" />
+<glyph unicode="&#xe90d;" glyph-name="search2" d="M421.647 182.965c-96.376 0-180.706 36.141-252.988 102.4-66.259 66.259-102.4 156.612-102.4 252.988s36.141 180.706 102.4 252.988c66.259 66.259 156.612 102.4 252.988 102.4s180.706-36.141 252.988-102.4c66.259-66.259 102.4-156.612 102.4-252.988s-36.141-180.706-102.4-252.988c-72.282-66.259-156.612-102.4-252.988-102.4zM1011.953-9.788l-271.059 271.059c66.259 78.306 102.4 174.682 102.4 271.059 0 114.447-42.165 216.847-120.471 295.153s-186.729 120.471-295.153 120.471c-114.447 0-216.847-42.165-295.153-120.471s-120.471-186.729-120.471-295.153c0-114.447 42.165-216.847 120.471-295.153s186.729-120.471 295.153-120.471c102.4 0 198.776 36.141 271.059 102.4l271.059-271.059c6.024-6.024 18.071-12.047 24.094-12.047s18.071 6.024 24.094 12.047c12.047 12.047 12.047 30.118-6.024 42.165z" />
+<glyph unicode="&#xe90e;" glyph-name="browse" horiz-adv-x="3584" d="M796.444 561.778c0-219.932-178.29-398.222-398.222-398.222s-398.222 178.29-398.222 398.222c0 219.932 178.29 398.222 398.222 398.222s398.222-178.29 398.222-398.222zM3584 561.778c0-219.932-178.29-398.222-398.222-398.222s-398.222 178.29-398.222 398.222c0 219.932 178.29 398.222 398.222 398.222s398.222-178.29 398.222-398.222zM2190.222 561.778c0-219.932-178.29-398.222-398.222-398.222s-398.222 178.29-398.222 398.222c0 219.932 178.29 398.222 398.222 398.222s398.222-178.29 398.222-398.222z" />
+<glyph unicode="&#xe90f;" glyph-name="sync" d="M878.933 358.4c21.333-4.267 34.176-29.867 29.867-55.467-21.333-59.733-59.691-115.2-102.357-157.867-81.109-81.067-187.776-123.733-302.976-123.733s-221.867 42.667-294.357 123.733l-123.776 119.467v-157.867c0-25.6-17.067-42.667-42.667-42.667-25.557 0-42.667 17.067-42.667 42.667v268.8c0 4.267 4.267 4.267 4.267 8.533 4.309 0 4.309 4.267 4.309 4.267 0 4.267 4.224 8.533 8.533 8.533 0 4.267 4.224 4.267 4.224 4.267h4.267c0 4.267 4.309 4.267 8.533 4.267h256c25.643 0 42.667-17.067 42.667-42.667s-17.024-42.667-42.667-42.667h-149.333l119.467-110.933c68.309-68.267 153.643-102.4 243.2-102.4 89.643 0 179.2 34.133 238.976 98.133 38.357 34.133 64 81.067 81.024 128 8.533 21.333 34.133 34.133 55.467 25.6zM958.406 831.276c25.6 0 42.667-17.067 42.667-42.667v-260.267c0-4.267 0-8.533-4.267-12.8 0-4.267-4.267-4.267-4.267-8.533-4.267 0-4.267-4.267-4.267-4.267-4.267-4.267-8.533-4.267-12.8-8.533s-12.8-4.267-17.067-4.267h-256c-25.6 0-42.667 17.067-42.667 42.667s17.067 42.667 42.667 42.667h149.333l-119.467 115.2c-34.133 38.4-81.067 64-128 81.067-85.333 29.867-179.2 25.6-260.267-12.8-81.067-42.667-145.067-110.933-174.933-196.267-8.533-21.333-34.133-34.133-55.467-25.6-21.333 4.267-34.133 29.867-25.6 51.2 38.4 110.933 115.2 196.267 217.6 243.2 102.4 51.2 217.6 55.467 328.533 21.333 59.733-21.333 115.2-59.733 157.867-102.4l123.733-119.467v157.867c0 25.6 17.067 42.667 42.667 42.667z" />
</font></defs></svg> \ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.ttf b/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.ttf
index 7d0e36d1..acbb2aa5 100644
--- a/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.ttf
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.ttf
Binary files differ
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.woff b/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.woff
index b2d2e64a..8a7b316c 100644
--- a/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.woff
+++ b/vid-app-common/src/main/webapp/app/vid/styles/fonts/icomoon.woff
Binary files differ
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/instantiate.css b/vid-app-common/src/main/webapp/app/vid/styles/instantiate.css
index 13e2cf0a..e46a8b97 100755
--- a/vid-app-common/src/main/webapp/app/vid/styles/instantiate.css
+++ b/vid-app-common/src/main/webapp/app/vid/styles/instantiate.css
@@ -59,4 +59,12 @@ div[ng-controller=InstantiationController] .aaiHidden {
div[ng-controller=InstantiationController] .aaiVisible {
visibility: visible;
+}
+
+div.resume {
+ display: inline;
+}
+
+a.button-margin {
+ margin-right: 8px;
} \ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/messageViewer.css b/vid-app-common/src/main/webapp/app/vid/styles/messageViewer.css
new file mode 100644
index 00000000..9514d11b
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/messageViewer.css
@@ -0,0 +1,17 @@
+.message-viewer {
+ text-align: center;
+}
+
+.message-viewer .primaryMessage {
+ font-size: 18px;
+ padding-top: 20px;
+}
+
+.message-viewer .btn-primary {
+ background-color: #009FDB;
+ color: #FFFFFF;
+ border: 1px solid #009FDB;
+ padding: 0px 25px;
+ height: 35px;
+ margin-top: 45px;
+} \ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/modal-buttons.css b/vid-app-common/src/main/webapp/app/vid/styles/modal-buttons.css
new file mode 100644
index 00000000..b5d3d314
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/modal-buttons.css
@@ -0,0 +1,29 @@
+.modal-footer .btn-white,
+.modal-footer .btn-white:hover {
+ font-family: "OpenSans-Semibold";
+ border-radius: 5px;
+ border: 1px solid #009FDB;
+ background-color: #FFFFFF;
+ width: 120px;
+ height: 36px;
+ color: #009FDB;
+ font-size: 13px;
+ line-height: 30px;
+ text-align: center;
+ padding: 4px 12px !important;
+}
+
+.modal-footer .btn-primary,
+.modal-footer .btn-primary:hover{
+ font-family: "OpenSans-Semibold";
+ border-radius: 5px;
+ border: 1px solid #009FDB;
+ background-color: #009FDB;
+ width: 120px;
+ height: 36px;
+ color: #FFFFFF;
+ font-size: 13px;
+ line-height: 30px;
+ text-align: center;
+ padding: 4px 12px !important;
+}
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/modal-create-new.css b/vid-app-common/src/main/webapp/app/vid/styles/modal-create-new.css
new file mode 100644
index 00000000..1a293c04
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/modal-create-new.css
@@ -0,0 +1,196 @@
+.modal-dialog {
+ width: 587px;
+ border-radius: 8px;
+}
+
+.modal-content {
+ width: 587px;
+ border-radius: 8px;
+ background-color: #ffffff;
+ font-family: "OpenSans-Regular";
+}
+
+.modal-content .modal-body {
+ padding: 15px 35px 5px 35px;
+}
+
+.modal-body .connect-error,
+.modal-body .icon-alert.error {
+ font-family: OpenSans-Regular !important;
+ color: #CF2A2A;
+ font-size: 14px;
+}
+
+.modal-body .icon-alert:before {
+ color: #CF2A2A;
+ cursor: default;
+ font-family: 'icomoon' !important;
+ padding-right: 5px;
+}
+
+.modal-header {
+ border: none!important;
+ padding: 15px 35px 0px 35px!important;
+}
+
+.modal-header h3 {
+ font-family: "OpenSans-Regular";
+ color: #191919;
+ font-size: 22px;
+ font-weight: 300;
+ line-height: 16px;
+ padding-bottom: 20px;
+ border-bottom: 3px solid #009fdb;
+
+}
+
+.modal-close {
+ margin: -40px 5px 0 0;
+ color: #5a5a5a;
+ font-size: 20px;
+ cursor: pointer;
+}
+
+.form-group .control-label {
+ font-family: OpenSans-Semibold;
+ font-size: 12px;
+ color: #191919;
+}
+
+select {
+ background: url(../images/chevron.png) no-repeat 98% 10px !important;
+}
+
+input::placeholder {
+ text-align: left;
+ font-family: OpenSans-Regular;
+ font-size: 14px;
+ color: #a9a9a9;
+}
+
+.form-group .connect-error {
+ border: 1.5px solid #CF2A2A;
+}
+
+.form-group .grayedOut {
+ font-family: OpenSans-Regular;
+ font-size: 14px;
+ color: #a9a9a9;
+ opacity: 0.54;
+}
+
+.form-group .grayedOut option {
+ font-family: OpenSans-Regular;
+ font-size: 14px;
+ color: #555;
+ opacity: 1;
+}
+
+button.dropdown-toggle {
+ text-align: left;
+}
+
+button[disabled].dropdown-toggle {
+ opacity: 1;
+ cursor: not-allowed;
+ background-color: #eee;
+ border: 1px solid #aaa;
+ color: #a0a0a0;
+}
+
+multiselect[disabled] {
+ cursor: not-allowed;
+}
+
+a.item-unselected:before {
+ font-family: "icomoon"!important;
+ content: "\e90c";
+ color: #4ca90c;
+}
+
+.form-create .modal-footer {
+ margin-top: 0;
+}
+
+.form-create .modal-footer .btn,
+.form-create .modal-footer .btn:hover {
+ font-family: "OpenSans-Semibold";
+ border-radius: 5px;
+ border: 1px solid #009FDB;
+ font-size: 13px;
+ line-height: 30px;
+ text-align: center;
+ padding: 4px 12px !important;
+ width: 120px;
+ height: 36px;
+}
+
+.form-create .modal-footer .btn-white,
+.form-create .modal-footer .btn-white:hover {
+ background-color: #FFFFFF;
+ color: #009FDB;
+}
+
+.form-create .modal-footer .btn-primary,
+.form-create .modal-footer .btn-primary:hover{
+ background-color: #009FDB;
+ color: #FFFFFF;
+}
+
+.vnf-versions-container .table {
+ position: relative;
+ background-color: #f8f8f8;
+ background-clip: padding-box;
+ border-radius: 6px;
+ outline: 0;
+}
+
+.file-wrapper {
+ display: flex;
+}
+
+.file-input {
+ display: inline-block !important;
+ width: 0.1px;
+}
+
+.file-input-label {
+ width: 389px;
+ height: 37px;
+ background: #FFFFFF;
+ border: 1px solid #D2D2D2;
+ border-radius: 2px;
+ display: inline-block;
+ line-height: 37px;
+ font-weight: normal !important;
+ padding-left: 12px;
+ border-bottom-right-radius: 0;
+ border-top-right-radius: 0;
+ flex: 1;
+}
+
+.vnf-versions-name {
+ padding-top: 6px;
+ font-family: "OpenSans-Regular";
+ position: absolute;
+}
+
+.vnf-versions-select-as-text {
+ font-family: "OpenSans-Regular";
+ appearance: none;
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ border: none;
+ overflow:hidden;
+ background-color: #f8f8f8;
+ height: 31px;
+}
+
+.vnf-files-select {
+ z-index: 999;
+ opacity: 0.0;
+ position: absolute;
+ width: 23%;
+ cursor: pointer;
+ height:100%;
+} \ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/modals.css b/vid-app-common/src/main/webapp/app/vid/styles/modals.css
new file mode 100644
index 00000000..edc89b96
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/modals.css
@@ -0,0 +1,52 @@
+@font-face {
+ font-family: OpenSans-Light;
+ src: url("fonts/OpenSans/OpenSans-Light.ttf") format('truetype');
+}
+@font-face {
+ font-family: OpenSans-Regular;
+ src: url("fonts/OpenSans/OpenSans-Regular.ttf") format('truetype');
+}
+@font-face {
+ font-family: OpenSans-Semibold;
+ src: url("fonts/OpenSans/OpenSans-Semibold.ttf") format('truetype');
+}
+
+.modal-header * {
+ font-family: OpenSans-Light;
+}
+.modal-body * {
+ font-family: OpenSans-Regular;
+}
+.modal-footer * {
+ font-family: OpenSans-Semibold;
+}
+
+.modal-header {
+ border-bottom: 3px solid;
+ margin: auto;
+ width: 95%;
+ padding: 10px 0;
+ font-size: 22px;
+}
+.modal-header #cancel {
+ cursor: pointer;
+}
+.modal-title {
+ float: left;
+}
+.modal-content {
+ font-size: 15px;
+ border-radius: 0;
+ color: #191919;
+}
+.modal-footer {
+ background-color: #F8F8F8;
+ height: 60px;
+}
+.modal-footer .btn {
+ color: #FFF;
+ background-color: #009FDB;
+ border-color: #009FDB;
+ margin-right: 0;
+ font-size: 13px;
+} \ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/networkNode.css b/vid-app-common/src/main/webapp/app/vid/styles/networkNode.css
new file mode 100644
index 00000000..74fa9fcb
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/networkNode.css
@@ -0,0 +1,271 @@
+@font-face {
+ font-family: OpenSans-Bold;
+ src: url("fonts/OpenSans/OpenSans-Bold.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-BoldItlaic;
+ src: url("fonts/OpenSans/OpenSans-BoldItalic.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-ExtraBold;
+ src: url("fonts/OpenSans/OpenSans-ExtraBold.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-ExtraBoldItalic;
+ src: url("fonts/OpenSans/OpenSans-ExtraBoldItalic.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-Italic;
+ src: url("fonts/OpenSans/OpenSans-Italic.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-Light;
+ src: url("fonts/OpenSans/OpenSans-Light.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-LightItalic;
+ src: url("fonts/OpenSans/OpenSans-LightItalic.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-Regular;
+ src: url("fonts/OpenSans/OpenSans-Regular.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-Semibold;
+ src: url("fonts/OpenSans/OpenSans-Semibold.ttf") format('truetype');
+}
+
+@font-face {
+ font-family: OpenSans-SemiboldItalic;
+ src: url("fonts/OpenSans/OpenSans-SemiboldItalic.ttf") format('truetype');
+}
+
+.templatebody{
+ background-color: white !important;
+}
+.network-wrapper-config * {
+ font-family: OpenSans-Regular, sans-serif;
+}
+.body-content-jsp {
+ margin-top: 35px;
+ margin-left: 201px;
+ margin-right: 0px;
+ background-color: white;
+}
+.temporary-solution {
+ height: 0px;
+}
+.sprite {
+ background: url('../images/sprite.png') no-repeat;
+ display: inline-block;
+}
+.modal-x {
+ background-position: -198px -315px;
+ width: 10px;
+ height: 10px;
+}
+.modal-x:hover{
+ background-position: -198px -338px;
+}
+.sprite.checkbox {
+ background-position: -218px -335px;
+ width: 14px;
+ height: 14px;
+}
+.sprite.checkbox-checked {
+ background-position: -218px -311px;
+}
+.sprite.checkbox-disabled {
+ background-position: -218px -359px;
+}
+button {
+ border-radius: 2px;
+ font-size: 14px;
+ line-height: 28px;
+ height: 30px;
+}
+button.blue {
+ border: #0091c8 1px solid;
+ background-color: #009fdb;
+ color: white;
+}
+button.blue:hover {
+ background-color: #1ec2ff;
+ border-color: #0091c8;
+}
+button.blue:active {
+ background-color: #0091c7;
+ border-color: #006186;
+}
+button.blue[disabled] {
+ background-color: rgba(5, 104, 174, 0.3);
+ border-color: rgba(4, 113, 168, 0.3);
+}
+button.grey {
+ color: #009FDB;
+ background-color: #ffffff;
+ border: 1px solid #009FDB;
+}
+button.grey:hover {
+ background-color: #f8f8f8;
+ border-color: #009fdb;
+}
+button.grey:active {
+ background-color: #d8d8d8;
+ border-color: #5a5a5a;
+}
+button.grey[disabled] {
+ background-color: #f8f8f8;
+ border-color: #d8d8d8;
+ color: #cdcdcd;
+}
+button.white {
+ border: #009fdb 1px solid;
+ background-color: white;
+ color: #009fdb;
+}
+input[type=checkbox] {
+ display: none;
+}
+input[type=checkbox] + label {
+ position: relative;
+ padding-left: 2px;
+ text-indent: 19px;
+ line-height: 15px;
+}
+input[type=checkbox] + label::after {
+ background: url('../images/sprite.png') no-repeat;
+ display: inline-block;
+ background-position: -218px -335px;
+ width: 14px;
+ height: 14px;
+ padding-left: 21px;
+ margin-right: 25px;
+ line-height: 15px;
+ color: #5a5a5a;
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+}
+input[type=checkbox] + label::after.checkbox {
+ background-position: -218px -335px;
+ width: 14px;
+ height: 14px;
+}
+input[type=checkbox] + label::after.checkbox-checked {
+ background-position: -218px -311px;
+}
+input[type=checkbox] + label::after.checkbox-disabled {
+ background-position: -218px -359px;
+}
+input[type=checkbox]:checked + label::after {
+ background: url('../images/sprite.png') no-repeat;
+ display: inline-block;
+ background-position: -218px -311px;
+}
+input[type=checkbox]:checked + label::after.checkbox {
+ background-position: -218px -335px;
+ width: 14px;
+ height: 14px;
+}
+input[type=checkbox]:checked + label::after.checkbox-checked {
+ background-position: -218px -311px;
+}
+input[type=checkbox]:checked + label::after.checkbox-disabled {
+ background-position: -218px -359px;
+}
+input[type=checkbox]:disabled + label::after {
+ background: url('../images/sprite.png') no-repeat;
+ display: inline-block;
+ background-position: -218px -359px;
+}
+input[type=checkbox]:disabled + label::after.checkbox {
+ background-position: -218px -335px;
+ width: 14px;
+ height: 14px;
+}
+input[type=checkbox]:disabled + label::after.checkbox-checked {
+ background-position: -218px -311px;
+}
+input[type=checkbox]:disabled + label::after.checkbox-disabled {
+ background-position: -218px -359px;
+}
+.network-wrapper-config {
+ width: 100%;
+}
+.network-wrapper-config .head {
+ line-height: 59px;
+ height: 59px;
+ display: flex;
+ background-color: #F8F8F8;
+ border-bottom: 1px solid #D8D8D8;
+}
+.network-wrapper-config .head .title {
+ font-size: 18px;
+ margin-left: 56px;
+ color: #5A5A5A;
+}
+.network-wrapper-config .head .btn-wrapper {
+ flex: 1;
+ text-align: right;
+ margin-right: 15px;
+}
+.network-wrapper-config .head .btn-wrapper button {
+ width: 120px;
+}
+.network-wrapper-config .head .btn-wrapper button.delete-btn{
+ margin-left: 13px;
+}
+.network-wrapper-config .content-wrapper {
+ display: flex;
+}
+.network-wrapper-config .content-wrapper .sidebar-right {
+ width: 25%;
+ min-width: 400px;
+ background-color: #F8F8F8;
+}
+.network-wrapper-config .content-wrapper .content {
+ width: 75%;
+ margin-top: 48px;
+}
+.network-wrapper-config .content-wrapper .content .form-wrapper {
+ width: 640px;
+ margin: 0 auto;
+}
+.network-wrapper-config span.error {
+ color: #cf2a2a;
+}
+.network-wrapper-config .content-wrapper .content .form-wrapper .instance-field .ng-invalid-pattern{
+ border-color: #cf2a2a;
+ color: #cf2a2a;
+}
+.network-wrapper-config .content-wrapper .content .form-wrapper .instance-field {
+ margin-bottom: 25px;
+}
+.network-wrapper-config .content-wrapper .content .form-wrapper .instance-field label{
+ color: #191919;
+ font-size: 13px;
+}
+
+.network-wrapper-config .content-wrapper .content .form-wrapper .instance-field input,
+.network-wrapper-config .content-wrapper .content .form-wrapper .instance-field select{
+ border-color: #D2D2D2;
+}
+
+.network-wrapper-config .content-wrapper .content .form-wrapper .instance-field.lcpRegionText,
+.network-wrapper-config .content-wrapper .content .form-wrapper .instance-field.productFamily{
+ display: none;
+}
+
+.sidebar-right service-metadata .metadata-content{
+ padding-bottom: 20px;
+} \ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/pnfSearchAssociation.css b/vid-app-common/src/main/webapp/app/vid/styles/pnfSearchAssociation.css
new file mode 100644
index 00000000..5cf16d83
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/pnfSearchAssociation.css
@@ -0,0 +1,82 @@
+@font-face {
+ font-family: 'icomoon';
+ src: url('fonts/icomoon.eot?4cilop');
+ src: url('fonts/icomoon.eot?4cilop#iefix') format('embedded-opentype'),
+ url('fonts/icomoon.ttf?4cilop') format('truetype'),
+ url('fonts/icomoon.woff?4cilop') format('woff'),
+ url('fonts/icomoon.svg?4cilop#icomoon') format('svg');
+ font-weight: normal;
+ font-style: normal;
+}
+
+.pnf-search-association [class^="icon-"],.pnf-search-association [class*=" icon-"] {
+ /* use !important to prevent issues with browser extensions that change fonts */
+ font-family: 'icomoon' !important;
+ speak: none;
+ font-style: normal;
+ font-weight: normal;
+ font-variant: normal;
+ text-transform: none;
+ line-height: 1;
+
+ /* Better Font Rendering =========== */
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+
+.search-input{
+ width:40px;
+ margin-left: -30px;
+ z-index: 2;
+ cursor: pointer;
+ display: inline-block;
+ position: absolute;
+ line-height: 40px;
+}
+.content-wrapper{
+ margin-left: 70px;
+ font-family: OpenSans-Semibold;
+ }
+.content-wrapper .content{
+ margin-top: 47px;
+}
+.input-wrapper{
+ margin-top: 6px;
+}
+input[type=search]{
+ /*border: none;*/
+ width: 415px;
+ height: 40px;
+ border: 1px solid #D2D2D2;
+ border-radius: 2px;
+}
+input[type=search]:before {
+/* content: "\e90d";
+ color: #00aeef;
+ font-size: 50px;
+ cursor: pointer;
+ margin-left: 350px*/
+}
+.error-msg{
+ color: red;
+}
+.bold{
+ font-family: OpenSans-Semibold;
+}
+.margin-search{
+ margin-top: 37px;
+}
+.result-content span{
+ font-family: OpenSans-Semibold;
+}
+.result-content div{
+ margin-bottom: 24px;
+ margin-top: 3px;
+}
+.search2-icon:before {
+ font-family: 'icomoon';
+ content: "\e90d";
+ color: #009FDB;
+ font-size: 17px;
+ cursor: pointer;
+} \ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/search.css b/vid-app-common/src/main/webapp/app/vid/styles/search.css
new file mode 100644
index 00000000..8ab5ea8c
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/search.css
@@ -0,0 +1,37 @@
+.search-container {
+ display: flex;
+ background: #FFFFFF;
+ border: 1px solid #D2D2D2;
+ border-radius: 2px;
+ width: 500px;
+}
+.search-container .search-input,
+.search-container .search-input:focus,
+.search-container .search-input:hover{
+ border: none;
+ padding: 10px;
+ display: inline-block;
+ width: 458px;
+ font-style: italic;
+}
+
+.search-container .search-input::placeholder {
+ text-align: left;
+}
+
+.search-container .search-icon {
+ display: inline-block;
+ margin: auto;
+ width: 16px;
+ height: 16px;
+}
+
+.search-container .search-icon svg path {
+ fill: #5A5A5A;
+}
+
+.search-container .search-icon:hover path {
+ fill: #009FDB;
+}
+
+
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/serviceMetadata.css b/vid-app-common/src/main/webapp/app/vid/styles/serviceMetadata.css
new file mode 100644
index 00000000..c54b6d4c
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/serviceMetadata.css
@@ -0,0 +1,18 @@
+service-metadata {
+ display: block;
+}
+service-metadata .header-title {
+ text-transform: uppercase;
+ font-size: 16px;
+ color: #191919;
+ background: #EAEAEA;
+ line-height: 40px;
+ padding-left: 20px;
+}
+service-metadata .metadata-content {
+ padding-left: 20px;
+}
+service-metadata .field {
+ margin-top: 15px;
+ font-size: 13px;
+} \ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/serviceModels.css b/vid-app-common/src/main/webapp/app/vid/styles/serviceModels.css
index 0a642993..a8dddb6a 100755
--- a/vid-app-common/src/main/webapp/app/vid/styles/serviceModels.css
+++ b/vid-app-common/src/main/webapp/app/vid/styles/serviceModels.css
@@ -67,4 +67,8 @@ div[ng-controller=ServiceModelController] .progHidden {
div[ng-controller=ServiceModelController] .progVisible {
visibility: visible;
+}
+
+.previous-versions-button {
+ width: 113px;
} \ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/serviceProxyConfig.css b/vid-app-common/src/main/webapp/app/vid/styles/serviceProxyConfig.css
new file mode 100644
index 00000000..d1ca37ba
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/serviceProxyConfig.css
@@ -0,0 +1,154 @@
+.diagram {
+ background: #F8F8F8;
+ padding: 48px 20px;
+ margin: 0px 48px;
+ display: flex;
+ flex-direction: column;
+}
+.diagram .diagram-img {
+ margin: 0 auto;
+ display: flex;
+ width: 90%;
+}
+.circle {
+ float: left;
+ border: 3px solid;
+ width: 140px;
+ height: 140px;
+ border-radius: 50%;
+ flex: 0 0 140px;
+}
+.circle .text {
+ float: left;
+ width: 100%;
+ padding-top: 37%;
+ text-align: center;
+ font-size: 14px;
+ color: #191919;
+ line-height: 17px;
+}
+.config-circle {
+ border-color: #9063CD;
+ background-color: rgba(144,99,205,0.50);
+}
+.config-circle .line {
+ width: 3px;
+ background-color: #8f61cc;
+ margin: auto;
+ height: 100%;
+ display: block;
+}
+.service-circle {
+ border-color: #71C5E8;
+}
+.service-circle:hover {
+ background: rgba(113, 197, 232, 0.50);
+}
+.dotted-line {
+ border-bottom: 2px dashed #5a5a5a;
+ width: 200px;
+ float: left;
+ height: 70px;
+ flex: 1;
+}
+.dotted-line.unchecked .conn-circle {
+ width: 13px;
+ height: 13px;
+ margin: 54px auto;
+ display: block;
+ border: 15px solid #F8F8F8;
+}
+.dotted-line.unchecked .conn-circle:before {
+ content: "";
+ float: left;
+ background: #767676;
+ width: 13px;
+ height: 13px;
+ border-radius: 50%;
+ position: relative;
+ top: -6px;
+ right: 6px;
+}
+
+.valid-large {
+ background-position: -240px -154px;
+ width: 35px;
+ height: 35px;
+}
+.dotted-line.checked .conn-circle {
+ margin: 52px auto;
+ display: block;
+}
+.element-name {
+ color: #191919;
+ font-size: 14px;
+ width: 100%;
+ text-align: center;
+}
+.element-name.service {
+ flex: 50%;
+}
+.element-name-wrapper{
+ display: flex;
+ margin-top: 30px;
+}
+.element-name-wrapper .element-name .label-txt {
+ color: #191919;
+ font-size: 14px;
+}
+.element-name-wrapper .element-name.service .label-txt:hover {
+ color: #009FDB;
+ cursor: pointer;
+ text-align: center;
+}
+.element-name-wrapper .element-name .info{
+ background: #009FDB;
+ border-radius: 50%;
+ height: 16px;
+ width: 16px;
+ color: white;
+ line-height: 15px;
+ padding-top: 1px;
+ margin-left: 10px;
+ margin-top: 2px;
+ cursor: pointer;
+ display: inline-block;
+}
+.service-wrapper-config .bottom {
+ display: flex;
+ height: 450px;
+ margin: 40px 48px;
+}
+.service-wrapper-config .wrapper-list {
+ flex: 50%;
+ height: 100%;
+}
+.service-wrapper-config .wrapper-list:first-child {
+ border-right: 1px dashed #D8D8D8;
+ margin-right: 50px;
+ padding-right: 50px;
+}
+.service-wrapper-config .title-txt {
+ color: #191919;
+ font-size: 13px;
+ margin-bottom: 10px;
+}
+
+.service-wrapper-config .select-vnf-title {
+ margin-top: 20px;
+}
+
+.ng-hide-keep-block.ng-hide:not(.ng-hide-animate) {
+ display: block!important;
+ visibility: hidden;
+}
+
+.service-wrapper-config select {
+ border-color: #D2D2D2;
+ background-position: 100% 4px;
+}
+.no-results {
+ margin-top: 10px;
+ text-align: center;
+ display: block;
+} \ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/testEnvironments.css b/vid-app-common/src/main/webapp/app/vid/styles/testEnvironments.css
new file mode 100644
index 00000000..4532111b
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/styles/testEnvironments.css
@@ -0,0 +1,215 @@
+.body-content-jsp {
+ margin-top: 35px;
+ min-height: 500px;
+ margin-left: 201px;
+ margin-right: 0px;
+ background-color: #f8f8f8;
+ display: flex;
+ flex-direction: column;
+}
+
+.temporary-solution {
+ display: none;
+}
+
+.body-content-jsp > div.ng-scope {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+.body-content-jsp > div.ng-scope > div {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+.test-environments {
+ background: white;
+ font-family: "OpenSans-Regular";
+ color: #797979;
+ flex:1;
+ display: flex;
+ flex-direction: column;
+}
+
+.test-environments .header {
+ height: 70px;
+ padding: 15px;
+ background: #F8F8F8;
+}
+.test-environments .header .header-left {
+ display: inline-flex;
+ align-items: center;
+}
+
+.test-environments .headline {
+ color: #5A5A5A;
+ font-size: 22px;
+ text-align: left;
+}
+
+.test-environments .separator {
+ height: 40px;
+ border-left: 1px solid #D2D2D2;
+ margin: 0px 20px;
+}
+
+.test-environments .header .button-container {
+ display: flex;
+ align-items: center;
+ cursor: pointer;
+}
+
+.test-environments .error-messages {
+ margin: auto;
+}
+
+.test-environments .error-messages .no-data svg path {
+ fill: #D2D2D2;
+}
+
+.test-environments .error-messages .no-data .secondaryMessage,
+.test-environments .error-messages .connect-error .secondaryMessage {
+ color: #D2D2D2;
+}
+
+.test-environments .error-messages .connect-error svg path {
+ fill: red;
+}
+
+.test-environments .error-messages .connect-error .primaryMessage {
+ color: red;
+}
+
+.test-environments .button-container svg {
+ fill: #009FDB;
+}
+
+.test-environments .button-container .button-text{
+ color: #5A5A5A;
+ padding-left: 10px;
+}
+
+.test-environments .search-container {
+ float: right;
+ margin-right: 40px;
+}
+
+.test-environments .refresh:focus {
+ outline: none;
+}
+
+.test-environments .refresh {
+ float: right;
+ width: 20px;
+ height: 20px;
+ border: none;
+ background: none;
+ padding: 0;
+ margin-bottom: 15px;
+}
+
+.test-environments .refresh svg{
+ height: 20px;
+ width: 20px;
+}
+
+.test-environments .refresh svg path {
+ fill: #5A5A5A;
+}
+
+.test-environments .refresh:hover path {
+ fill: #009FDB;
+}
+
+.test-environments .error {
+ text-align: center;
+ color: red;
+}
+
+.test-environments .environments-table {
+ margin: 40px;
+}
+
+.test-environments .environments-table .tablesorter-default {
+ cursor: default;
+}
+
+.test-environments .environments-table .tablesorter-default thead .tablesorter-header .tablesorter-header-inner {
+ background-image: none;
+ background-size: 8px;
+}
+
+.test-environments .environments-table .tablesorter-default thead .tablesorter-headerAsc .tablesorter-header-inner {
+ background-image: url('../images/sort_down.svg');
+}
+
+.test-environments .environments-table .tablesorter-default thead .tablesorter-headerDesc .tablesorter-header-inner {
+ background-image: url('../images/sort_up.svg');
+}
+
+.test-environments .environments-table .thead-default tr th {
+ background: #EAEAEA;
+ color: #191919;
+ font-size: 13px;
+ font-weight: 600;
+ vertical-align: middle;
+}
+
+.test-environments .environments-table .thead-default tr th .tablesorter-header-inner {
+ padding-right: 10px;
+}
+
+.test-environments .environments-table .thead-default tr th span {
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
+.test-environments .environments-table .thead-default tr th:first-child {
+ min-width: 150px;
+}
+
+/*.test-environments .environments-table .thead-default tr th:*/
+
+.test-environments .environments-table .tablesorter-header-inner {
+ padding: 0;
+ width: 100%;
+}
+
+.test-environments .environments-table .tablesorter-default tbody td {
+ background: white;
+ font-size: 14px;
+ padding: 12px 8px;
+}
+
+.test-environments .environments-table .tablesorter-default tbody tr:focus td {
+ background: #E6F6FB;
+}
+
+.test-environments .environments-table .tablesorter-default tbody tr:focus {
+ border: none;
+ outline: none;
+}
+
+.attach-button {
+ margin-left: 35px;
+}
+
+.envActionBtn {
+ width: 94px;
+ height: 30px;
+}
+
+#environments-table {
+ margin-top: 0;
+}
+
+.test-environments-table-container {
+ overflow: auto;
+ max-height: 50vh;
+ width: 98%;
+ margin-left: 15px;
+ padding-left: 0;
+}
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/vidTree.css b/vid-app-common/src/main/webapp/app/vid/styles/vidTree.css
index 1aec73d8..7904b369 100755
--- a/vid-app-common/src/main/webapp/app/vid/styles/vidTree.css
+++ b/vid-app-common/src/main/webapp/app/vid/styles/vidTree.css
@@ -64,4 +64,8 @@ tr.angular-ui-tree-empty {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
+}
+
+.pull-right .dropdown-menu {
+ background-color: transparent;
} \ No newline at end of file