summaryrefslogtreecommitdiffstats
path: root/resources/scss
diff options
context:
space:
mode:
Diffstat (limited to 'resources/scss')
-rw-r--r--resources/scss/_browse.scss45
-rw-r--r--resources/scss/_custom.scss349
-rw-r--r--resources/scss/_customByoq.scss438
-rw-r--r--resources/scss/_spinner.scss35
-rw-r--r--resources/scss/_typography.scss27
-rw-r--r--resources/scss/_variables.scss41
-rw-r--r--resources/scss/bootstrap-cust/_buttons.scss34
-rw-r--r--resources/scss/bootstrap-cust/_card.scss262
-rw-r--r--resources/scss/bootstrap-cust/_panels.scss24
-rw-r--r--resources/scss/bootstrap.scss3
-rw-r--r--resources/scss/common/_layout.scss6
-rw-r--r--resources/scss/common/_variables.scss2
-rw-r--r--resources/scss/customQuery/_customQuery.scss84
-rw-r--r--resources/scss/filter/_filter.scss135
-rw-r--r--resources/scss/header/_layout.scss53
-rw-r--r--resources/scss/model/_model.scss183
-rw-r--r--resources/scss/style.scss12
-rw-r--r--resources/scss/tier-support/_search.scss32
18 files changed, 1757 insertions, 8 deletions
diff --git a/resources/scss/_browse.scss b/resources/scss/_browse.scss
new file mode 100644
index 0000000..b2941aa
--- /dev/null
+++ b/resources/scss/_browse.scss
@@ -0,0 +1,45 @@
+/*
+ * ============LICENSE_START=======================================================
+ * org.onap.aai
+ * ================================================================================
+ * Copyright © 2017-2021 AT&T Intellectual Property. All rights reserved.
+ * ================================================================================
+ * 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.
+ * ============LICENSE_END=========================================================
+ */
+
+ .browse-content {
+ margin: 30px;
+
+ div[class^="col-"] {
+ padding-left: 0;
+ padding-right: 0;
+ }
+ }
+
+ .browse-card-content {
+ text-align: left;
+
+ i {
+ margin: 0 auto;
+ cursor: pointer;
+ }
+ }
+
+ .browse-fa {
+ font-size: 96px;
+ font-style: normal;
+ text-align: center;
+ color: #007bff;
+ margin-bottom: 20px !important;
+ }
diff --git a/resources/scss/_custom.scss b/resources/scss/_custom.scss
new file mode 100644
index 0000000..d6b8ffd
--- /dev/null
+++ b/resources/scss/_custom.scss
@@ -0,0 +1,349 @@
+/*
+ * ============LICENSE_START=======================================================
+ * org.onap.aai
+ * ================================================================================
+ * Copyright © 2017-2021 AT&T Intellectual Property. All rights reserved.
+ * ================================================================================
+ * 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.
+ * ============LICENSE_END=========================================================
+ */
+
+.model-card {
+ .panel {
+ background-color: initial;
+ box-shadow: none;
+ margin-bottom: 0;
+ }
+
+ .panel-default > .panel-heading {
+ padding-left: 0;
+ border: 0;
+ padding: 0;
+ color: #191919;
+ }
+
+ .panel-default > .panel-heading + .panel-collapse > .panel-body {
+ overflow-y: scroll;
+ max-height: 200px;
+ background-color: #fff;
+ margin-top: 10px;
+ }
+ }
+
+ .aggregate-card {
+ height: 700px !important;
+ margin: 15px 0;
+
+ .aggregate-card-content {
+ overflow: hidden;
+ margin-left: 12px;
+ }
+
+ .aggregate-attribute {
+ margin-left: 24px;
+ }
+
+ .aggregate-card-content:hover {
+ overflow-y: scroll;
+ }
+
+ .label-default {
+ background-color: #5a5a5a;
+ }
+ }
+
+ .btn-outline-primary {
+ color: #007bff;
+ background-color: transparent;
+ background-image: none;
+ border-color: #007bff;
+ }
+
+ .btn-outline-primary:hover {
+ color: #fff;
+ background-color: #007bff;
+ border-color: #007bff;
+ }
+
+ .btn-outline-primary:focus, .btn-outline-primary.focus {
+ box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
+ }
+
+ .btn-outline-primary.disabled, .btn-outline-primary:disabled {
+ color: #007bff;
+ background-color: transparent;
+ }
+
+ .btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active,
+ .show > .btn-outline-primary.dropdown-toggle {
+ color: #fff;
+ background-color: #007bff;
+ border-color: #007bff;
+ }
+
+ .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus,
+ .show > .btn-outline-primary.dropdown-toggle:focus {
+ box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
+ }
+ .model-container .card{
+ height: 400px !important;
+ }
+ .table-header-view th{
+ background: #009fdb;
+ color:#ffffff;
+ }
+ .table-header-view{
+ color:#ffffff;
+ width:auto !important;
+ }
+ .filter{
+ margin-left:0px !important;
+ margin-right:0px !important;
+ }
+ .filter:last-child {
+ margin-bottom:20px !important;
+ }
+ .react-bootstrap-table table{
+ width:100%;
+ min-width:100%;
+ }
+ .relationshipTable .label-default {
+ background-color: #5a5a5a !important;
+ }
+ .parent-expand-bar {
+ background-color: #81c784;
+ }
+ .react-bootstrap-table {
+ width: 100%;
+ max-height: 500px;
+ overflow: auto;
+ }
+ .react-bootstrap-table table{
+ font-size:13px;
+ }
+ .react-bootstrap-table table th{
+ word-wrap: break-word;
+ white-space: nowrap;
+ }
+ .filter-label{
+ display:flex;
+ margin-bottom:0px;
+ margin-top:5px;
+ }
+ .nav-tabs > li > a {
+ margin-right: 2px;
+ line-height: 1.42857;
+ border: 1px solid #dfdfdf;
+ border-radius: 10px 10px 0 0px;
+ font-size: 14px;
+ color:#4d6069;
+ }
+ .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
+ color: #FFFFFF;
+ background-color: #009fdb;
+ border: 1px solid transparent;
+ border-bottom-color: transparent;
+ cursor: default;
+ }
+ .multipleNodes .model-container {
+ margin: 0px;
+ //width: max-content;
+ }
+ .multipleNodes .container-fluid{
+ padding-left:2px;
+ }
+ .nav-tabs {
+ padding:0px;
+ border-bottom: 4px solid #009fdb;
+ }
+ .nav-tabs > li {
+ float: left;
+ margin-bottom: -3px;
+ }
+ .table-striped > tbody > tr:nth-child(2n) > td {
+ background-color: #ffffff;
+ }
+ .table-striped > tbody > tr:nth-child(2n+1) > td {
+ background-color: #dddddd;
+ }
+ .table-striped > tbody > tr:hover td {
+ background-color: #009fdb4d;
+ }
+ .table-striped > thead > tr > th {
+ background-color: #009fdb;
+ color: #FFFFFFFF;
+ }
+ .relationshipTable{
+ background:#ffffff;
+ }
+ .relationshipTable th {
+ padding: 5px;
+ }
+ .relationshipTable ul {
+ max-height: 300px;
+ overflow-y: scroll;
+ }
+ .relationshipTable li{
+ padding:10px 0px 10px 3px;
+ border:1px solid #7c8388
+ }
+ .relationshipTable li:nth-child(2n){
+ background-color: #ffffff;
+ }
+ .relationshipTable li:nth-child(2n+1){
+ background-color: #dddddd;
+ }
+ .relationshipTable li:hover{
+ background-color: #009fdb4d;
+ }
+ .react-bootstrap-table .table-hover tr:hover {
+ cursor: auto !important;
+}
+.react-bootstrap-table td.expand-cell {
+ cursor: pointer !important;
+}
+
+.react-bootstrap-table td{
+ white-space:pre-wrap !important;
+}
+.pre-wrap-text{
+ white-space: pre-wrap !important;
+}
+#downloadRangeForm .radio{
+ margin-top:10px;
+
+}
+#downloadRangeForm input[type='radio']{
+ margin-top:5px;
+}
+#downloadRangeForm input{
+ padding:5px 0px 0px 5px
+}
+#downloadRangeForm span{
+ margin-left:5px;
+}
+#downloadRangeForm .warning{
+ color:#ffa500;
+ font-weight:bold;
+ margin:0px !important;
+}
+#downloadRangeForm{
+ margin:10px 0px;
+}
+#downloadPagePane h2{
+ margin-bottom: 10px;
+}
+#downloadRangeForm input[type=radio]:checked:before{
+ font-size: 34px;
+ text-align: center;
+ line-height: 12px;
+}
+.modal-backdrop.in{
+ opacity:0.5 !important;
+}
+.spinner{
+ z-index:9999 !important;
+}
+.savedQueryTemplate th{
+ background:#69a8c7 !important;
+ padding:2px !important;
+}
+.tab-content .form-control{
+ height:37px !important;
+}
+.alignFormTwinElements{
+ width:48% !important;
+ float:left;
+ margin:0px 5px 0px 0px !important;
+}
+.btn-space{
+ margin: 5px !important;
+}
+#template .btn {
+ padding: 6px 16px;
+ margin: 0.2em;
+ white-space: normal;
+ box-shadow: 1px 2px #0c88d7;
+}
+#template .dropdownButton {
+ width:100%;
+}
+#template .btn-secondary {
+ background-color: #fdfdfd;
+ border: 1px solid #d7dbf6;
+}
+@media (min-width: 768px){
+ #customDslBuilderModel .modal-dialog{
+ width: 700px !important;
+ margin: 30px auto;
+ }
+}
+.dsl-panel .caret{
+ right: 0px !important;
+ top: 12px;
+ position: absolute;
+}
+.dsl-panel .inputFilter{
+ padding: 5px 5px 0px 5px !important;
+ width: 89% !important;
+ margin:3px 0px 5px 0px;
+}
+.dsl-panel .btn{
+ font-size:12px !important;
+}
+.inputBoxError{
+ border: 1px solid #ec110b;
+ padding:2px;
+ margin:1px;
+}
+.toggleSwitch .btn-success, .toggleSwitch .btn-success:hover{
+ color: #fff;
+ background-color:#aadc1f;
+ border-color: #888888 !important;
+}
+.toggleSwitch{
+ position: fixed !important;
+ float: right;
+ z-index: 999;
+ right: 10px;
+ margin:5px;
+ top:-2px;
+}
+.switch.btn {
+ min-width: 4.7rem !important;
+}
+.switch-off.btn {
+ padding-left: 1.0rem;
+}
+.toggleSwitch .btn-danger, .toggleSwitch .btn-danger:hover{
+ color: #000;
+ background-color: #e9ecef;
+ border-color: #888888;
+}
+.switch.off .switch-group {
+ left: -100%;
+ transition: left 1s;
+}
+.switch.on .switch-group {
+ transition: left 1s;
+}
+.toggleSwitch .btn{
+ border-radius:5px;
+ width:100px;
+}
+.switch-handle {
+ border-radius:0px;
+}
+.toggleSwitch .btn-light{
+ width:0px;
+}
diff --git a/resources/scss/_customByoq.scss b/resources/scss/_customByoq.scss
new file mode 100644
index 0000000..f885eb9
--- /dev/null
+++ b/resources/scss/_customByoq.scss
@@ -0,0 +1,438 @@
+/*
+ * ============LICENSE_START=======================================================
+ * org.onap.aai
+ * ================================================================================
+ * Copyright © 2017-2021 AT&T Intellectual Property. All rights reserved.
+ * ================================================================================
+ * 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.
+ * ============LICENSE_END=========================================================
+ */
+
+.tinkerpop-book {
+ background-repeat: no-repeat;
+ height: 300px !important;
+ width: 700px;
+}
+.fixed-panel {
+ position: absolute;
+ top: 100px;
+ width: 20%;
+ right: 20px;
+}
+
+.customDsl .card {
+ position: relative;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ min-width: 0;
+ word-wrap: break-word;
+ background-color: #fff;
+ background-clip: border-box;
+ border: 1px solid rgba(0, 0, 0, 0.125);
+ border-radius: 0.25rem;
+}
+
+.addCardFooter {
+ padding-bottom:50px;
+}
+.card-body {
+ -webkit-box-flex: 1;
+ -ms-flex: 1 1 auto;
+ flex: 1 1 auto;
+ padding: 1.25rem;
+}
+.dark-modal .modal-content {
+ background-color: white;
+ color: #292b2c;
+}
+.dark-modal .close {
+ color: #292b2c;
+}
+.dsl-hint {
+ font-size: 2rem !important;
+ cursor: pointer;
+ height: 0.5rem;
+}
+.dsl-hint:hover {
+ color: #292b2c;
+ background-color: white;
+ cursor: pointer;
+ border-color: #0062cc;
+}
+
+.dsl-hint:focus, .dsl-hint.focus {
+ box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
+}
+.card > hr {
+ margin-right: 0;
+ margin-left: 0;
+}
+
+.card > .list-group:first-child .list-group-item:first-child {
+ border-top-left-radius: 0.25rem;
+ border-top-right-radius: 0.25rem;
+}
+
+.card > .list-group:last-child .list-group-item:last-child {
+ border-bottom-right-radius: 0.25rem;
+ border-bottom-left-radius: 0.25rem;
+}
+
+.card-body {
+ -webkit-box-flex: 1;
+ -ms-flex: 1 1 auto;
+ flex: 1 1 auto;
+ padding: 1.25rem;
+}
+
+.card-title {
+ margin-bottom: 0.75rem;
+}
+
+.card-subtitle {
+ margin-top: -0.375rem;
+ margin-bottom: 0;
+}
+
+.card-text:last-child {
+ margin-bottom: 0;
+}
+
+.card-link:hover {
+ text-decoration: none;
+}
+
+.card-link + .card-link {
+ margin-left: 1.25rem;
+}
+
+.card-header-help {
+ padding: 0.75rem 1.25rem;
+ margin-bottom: 0;
+ background-color: rgba(0, 0, 0, 0.03);
+ border-bottom: 1px solid rgba(0, 0, 0, 0.125);
+
+}
+
+.card-header {
+ padding: 0.75rem 1.25rem;
+ margin-bottom: 0;
+ background-color: rgba(0, 0, 0, 0.03);
+ border-bottom: 1px solid rgba(0, 0, 0, 0.125);
+}
+
+.card-header:first-child {
+ border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0;
+}
+
+.card-header + .list-group .list-group-item:first-child {
+ border-top: 0;
+}
+
+.card-footer {
+ padding: 0.75rem 1.25rem;
+ background-color: #f2f2f2;
+ border-top: 1px solid rgba(0, 0, 0, 0.125);
+}
+
+.cfFormat{
+ position:absolute;
+ bottom:0;
+ width:100%;
+}
+
+.card-footer:last-child {
+ border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px);
+}
+
+.card-header-tabs {
+ margin-right: -0.625rem;
+ margin-bottom: -0.75rem;
+ margin-left: -0.625rem;
+ border-bottom: 0;
+}
+
+.card-header-pills {
+ margin-right: -0.625rem;
+ margin-left: -0.625rem;
+}
+
+.card-img-overlay {
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ padding: 1.25rem;
+}
+
+.card-img {
+ width: 100%;
+ border-radius: calc(0.25rem - 1px);
+}
+
+.card-img-top {
+ width: 100%;
+ border-top-left-radius: calc(0.25rem - 1px);
+ border-top-right-radius: calc(0.25rem - 1px);
+}
+
+.card-img-bottom {
+ width: 100%;
+ border-bottom-right-radius: calc(0.25rem - 1px);
+ border-bottom-left-radius: calc(0.25rem - 1px);
+}
+
+.card-deck {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+
+.card-deck .card {
+ margin-bottom: 15px;
+}
+
+@media (min-width: 576px) {
+ .card-deck {
+ -webkit-box-orient: horizontal;
+ -webkit-box-direction: normal;
+ -ms-flex-flow: row wrap;
+ flex-flow: row wrap;
+ margin-right: -15px;
+ margin-left: -15px;
+ }
+ .card-deck .card {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 1;
+ -ms-flex: 1 0 0%;
+ flex: 1 0 0%;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ margin-right: 15px;
+ margin-bottom: 0;
+ margin-left: 15px;
+ }
+}
+
+.card-group {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+
+.card-group > .card {
+ margin-bottom: 15px;
+}
+
+@media (min-width: 576px) {
+ .card-group {
+ -webkit-box-orient: horizontal;
+ -webkit-box-direction: normal;
+ -ms-flex-flow: row wrap;
+ flex-flow: row wrap;
+ }
+ .card-group > .card {
+ -webkit-box-flex: 1;
+ -ms-flex: 1 0 0%;
+ flex: 1 0 0%;
+ margin-bottom: 0;
+ }
+ .card-group > .card + .card {
+ margin-left: 0;
+ border-left: 0;
+ }
+ .card-group > .card:first-child {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+ }
+ .card-group > .card:first-child .card-img-top,
+ .card-group > .card:first-child .card-header {
+ border-top-right-radius: 0;
+ }
+ .card-group > .card:first-child .card-img-bottom,
+ .card-group > .card:first-child .card-footer {
+ border-bottom-right-radius: 0;
+ }
+ .card-group > .card:last-child {
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+ }
+ .card-group > .card:last-child .card-img-top,
+ .card-group > .card:last-child .card-header {
+ border-top-left-radius: 0;
+ }
+ .card-group > .card:last-child .card-img-bottom,
+ .card-group > .card:last-child .card-footer {
+ border-bottom-left-radius: 0;
+ }
+ .card-group > .card:only-child {
+ border-radius: 0.25rem;
+ }
+ .card-group > .card:only-child .card-img-top,
+ .card-group > .card:only-child .card-header {
+ border-top-left-radius: 0.25rem;
+ border-top-right-radius: 0.25rem;
+ }
+ .card-group > .card:only-child .card-img-bottom,
+ .card-group > .card:only-child .card-footer {
+ border-bottom-right-radius: 0.25rem;
+ border-bottom-left-radius: 0.25rem;
+ }
+ .card-group > .card:not(:first-child):not(:last-child):not(:only-child) {
+ border-radius: 0;
+ }
+ .card-group > .card:not(:first-child):not(:last-child):not(:only-child) .card-img-top,
+ .card-group > .card:not(:first-child):not(:last-child):not(:only-child) .card-img-bottom,
+ .card-group > .card:not(:first-child):not(:last-child):not(:only-child) .card-header,
+ .card-group > .card:not(:first-child):not(:last-child):not(:only-child) .card-footer {
+ border-radius: 0;
+ }
+}
+
+.card-columns .card {
+ margin-bottom: 0.75rem;
+}
+
+@media (min-width: 576px) {
+ .card-columns {
+ -webkit-column-count: 3;
+ -moz-column-count: 3;
+ column-count: 3;
+ -webkit-column-gap: 1.25rem;
+ -moz-column-gap: 1.25rem;
+ column-gap: 1.25rem;
+ }
+ .card-columns .card {
+ display: inline-block;
+ width: 100%;
+ }
+}
+
+.text-center {
+ text-align: center !important;
+}
+
+.text-white {
+ color: #fff !important;
+}
+.customDsl a.bg-primary:hover, a.bg-primary:focus,
+button.bg-primary:hover,
+button.bg-primary:focus {
+ background-color: #0062cc !important;
+}
+
+.form-group {
+ margin-bottom: 1rem;
+}
+.dsl-hint-form-group {
+ margin-bottom: 1rem;
+ margin-top: 25px;
+}
+
+.customDsl pre,
+code,
+kbd,
+samp {
+ font-family: monospace, monospace;
+ font-size: 1em;
+}
+
+.customDsl pre {
+ margin-top: 0;
+ margin-bottom: 1rem;
+ overflow: auto;
+ display: block;
+ padding: 0px;
+ font-size: 13px;
+ line-height: 1.42857;
+ word-break: break-all;
+ word-wrap: break-word;
+ color: #191919;
+ background-color: #ffffff;
+ border: none;
+ border-radius: 0;
+}
+.customDsl pre {
+ white-space: pre-wrap !important;
+}
+
+blockquote {
+ border: 1px solid #999;
+ page-break-inside: avoid;
+}
+
+.customDsl [class*="licon-"]::before, .customDsl [class*="icon-"]::after {
+ font-size: 8em;
+ height: 8em;
+}
+.hidden {
+ display:none;
+}
+.show{
+ display:block;
+}
+
+.customDsl .btn i {
+ font-size: 30px;
+ font-style: normal;
+ text-align: center;
+ color: #007bff;
+}
+.node {
+ cursor: pointer;
+}
+
+.node circle {
+ fill: #fff;
+ stroke: steelblue;
+ stroke-width: 1.5px;
+}
+
+.node text {
+ font: 10px sans-serif;
+}
+
+.link {
+ fill: none;
+ stroke: #ccc;
+ stroke-width: 1.5px;
+}
+
+.dsl-panel .panel{
+ margin-bottom: 0px !important;
+}
+.actionsRow {
+ white-space: nowrap;
+}
+
+.toggle-theme.react-toggle--checked .react-toggle-track {
+ background-color: #009fdb;
+}
diff --git a/resources/scss/_spinner.scss b/resources/scss/_spinner.scss
new file mode 100644
index 0000000..3803b65
--- /dev/null
+++ b/resources/scss/_spinner.scss
@@ -0,0 +1,35 @@
+/*
+ * ============LICENSE_START=======================================================
+ * org.onap.aai
+ * ================================================================================
+ * Copyright © 2017-2021 AT&T Intellectual Property. All rights reserved.
+ * ================================================================================
+ * 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.
+ * ============LICENSE_END=========================================================
+ */
+
+.spin-container {
+ overflow: hidden;
+ position: relative;
+}
+
+.spinner {
+ position: absolute;
+ z-index: 999;
+ left: 50%;
+ top: 45%;
+}
+
+.spin-content {
+ opacity: 0.2;
+}
diff --git a/resources/scss/_typography.scss b/resources/scss/_typography.scss
new file mode 100644
index 0000000..982c6bd
--- /dev/null
+++ b/resources/scss/_typography.scss
@@ -0,0 +1,27 @@
+/*
+ * ============LICENSE_START=======================================================
+ * org.onap.aai
+ * ================================================================================
+ * Copyright © 2017-2021 AT&T Intellectual Property. All rights reserved.
+ * ================================================================================
+ * 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.
+ * ============LICENSE_END=========================================================
+ */
+
+
+$heading-font-2: 20px;
+$heading-font-3: 18px;
+$heading-font-4: 16px;
+
+$body-font-1: 16px;
+$body-font-2: 14px;
diff --git a/resources/scss/_variables.scss b/resources/scss/_variables.scss
new file mode 100644
index 0000000..fd15be9
--- /dev/null
+++ b/resources/scss/_variables.scss
@@ -0,0 +1,41 @@
+/*
+ * ============LICENSE_START=======================================================
+ * org.onap.aai
+ * ================================================================================
+ * Copyright © 2017-2021 AT&T Intellectual Property. All rights reserved.
+ * ================================================================================
+ * 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.
+ * ============LICENSE_END=========================================================
+ */
+
+$minimum-application-width: 1000px;
+
+$neutral-gray: #b7bfc3;
+$light-gray: #cfd6d9;
+$very-light-gray: #eff3f3;
+$turquoise-blue: #01afd1;
+$dark-blue: #004b68;
+$darkest: #323b3f;
+$dark-gray: #7c8388;
+$bluish-gray: #72848c;
+$redish-orange: #fe7550;
+$amber: #fab32b;
+$red: #d03d3c;
+
+$border-color7: $amber;
+$border-color10: $red;
+$border-color12: $redish-orange;
+
+
+/* Textures */
+$images-folder-name: "../icons";
diff --git a/resources/scss/bootstrap-cust/_buttons.scss b/resources/scss/bootstrap-cust/_buttons.scss
index 92382aa..c1f2984 100644
--- a/resources/scss/bootstrap-cust/_buttons.scss
+++ b/resources/scss/bootstrap-cust/_buttons.scss
@@ -5,3 +5,37 @@
.btn-info {
@include button-variant($text-color1, $background-color12, $text-color7);
}
+
+.btn-outline-primary {
+ color: #007bff;
+ background-color: transparent;
+ background-image: none;
+ border-color: #007bff;
+}
+
+.btn-outline-primary:hover {
+ color: #fff;
+ background-color: #007bff;
+ border-color: #007bff;
+}
+
+.btn-outline-primary:focus, .btn-outline-primary.focus {
+ box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
+}
+
+.btn-outline-primary.disabled, .btn-outline-primary:disabled {
+ color: #007bff;
+ background-color: transparent;
+}
+
+.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active,
+.show > .btn-outline-primary.dropdown-toggle {
+ color: #fff;
+ background-color: #007bff;
+ border-color: #007bff;
+}
+
+.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus,
+.show > .btn-outline-primary.dropdown-toggle:focus {
+ box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
+}
diff --git a/resources/scss/bootstrap-cust/_card.scss b/resources/scss/bootstrap-cust/_card.scss
new file mode 100644
index 0000000..815b5e9
--- /dev/null
+++ b/resources/scss/bootstrap-cust/_card.scss
@@ -0,0 +1,262 @@
+.card {
+ position: relative;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ min-width: 0;
+ height: 300px;
+ word-wrap: break-word;
+ background-color: #fff;
+ background-clip: border-box;
+ border: 1px solid rgba(0, 0, 0, 0.125);
+ border-radius: 0.25rem;
+}
+
+.addCardFooter {
+ padding-bottom: 50px;
+}
+
+.card-content {
+ margin: 16px;
+ height: 100%;
+}
+
+.card > hr {
+ margin-right: 0;
+ margin-left: 0;
+}
+
+.card > .list-group:first-child .list-group-item:first-child {
+ border-top-left-radius: 0.25rem;
+ border-top-right-radius: 0.25rem;
+}
+
+.card > .list-group:last-child .list-group-item:last-child {
+ border-bottom-right-radius: 0.25rem;
+ border-bottom-left-radius: 0.25rem;
+}
+
+.card-body {
+ -webkit-box-flex: 1;
+ -ms-flex: 1 1 auto;
+ flex: 1 1 auto;
+ padding: 1.25rem;
+}
+
+.card-subtitle {
+ margin-top: -0.375rem;
+ margin-bottom: 0;
+}
+
+.card-text:last-child {
+ margin-bottom: 0;
+}
+
+.card-link:hover {
+ text-decoration: none;
+}
+
+.card-link + .card-link {
+ margin-left: 1.25rem;
+}
+
+.card-header-help {
+ padding: 0.75rem 1.25rem;
+ width:100%;
+ margin-bottom: 0;
+ background-color: rgba(0, 0, 0, 0.03);
+ border-bottom: 1px solid rgba(0, 0, 0, 0.125);
+}
+
+.card-header {
+ padding: 0.75rem 0.75rem;
+ margin-bottom: 0;
+ background-color: rgba(0, 0, 0, 0.03);
+ border-bottom: 1px solid rgba(0, 0, 0, 0.125);
+}
+
+.card-header:first-child {
+ border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0;
+}
+
+.card-header + .list-group .list-group-item:first-child {
+ border-top: 0;
+}
+
+.card-footer {
+ padding: 0.75rem 0.75rem;
+ background-color: #f2f2f2;
+ border-top: 1px solid rgba(0, 0, 0, 0.125);
+}
+
+.card-footer:last-child {
+ border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px);
+}
+
+.card-header-tabs {
+ margin-right: -0.625rem;
+ margin-bottom: -0.75rem;
+ margin-left: -0.625rem;
+ border-bottom: 0;
+}
+
+.card-header-pills {
+ margin-right: -0.625rem;
+ margin-left: -0.625rem;
+}
+
+.card-img-overlay {
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ padding: 1.25rem;
+}
+
+.card-img {
+ width: 100%;
+ border-radius: calc(0.25rem - 1px);
+}
+
+.card-img-top {
+ width: 100%;
+ border-top-left-radius: calc(0.25rem - 1px);
+ border-top-right-radius: calc(0.25rem - 1px);
+}
+
+.card-img-bottom {
+ width: 100%;
+ border-bottom-right-radius: calc(0.25rem - 1px);
+ border-bottom-left-radius: calc(0.25rem - 1px);
+}
+
+.card-deck {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+
+.card-deck .card {
+ margin-bottom: 15px;
+}
+
+@media (min-width: 576px) {
+ .card-deck {
+ -webkit-box-orient: horizontal;
+ -webkit-box-direction: normal;
+ -ms-flex-flow: row wrap;
+ flex-flow: row wrap;
+ margin-right: -15px;
+ margin-left: -15px;
+ }
+ .card-deck .card {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 1;
+ -ms-flex: 1 0 0%;
+ flex: 1 0 0%;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ margin-right: 15px;
+ margin-bottom: 0;
+ margin-left: 15px;
+ }
+}
+
+.card-group {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+
+.card-group > .card {
+ margin-bottom: 15px;
+}
+
+@media (min-width: 576px) {
+ .card-group {
+ -webkit-box-orient: horizontal;
+ -webkit-box-direction: normal;
+ -ms-flex-flow: row wrap;
+ flex-flow: row wrap;
+ }
+ .card-group > .card {
+ -webkit-box-flex: 1;
+ -ms-flex: 1 0 0%;
+ flex: 1 0 0%;
+ margin-bottom: 0;
+ }
+ .card-group > .card + .card {
+ margin-left: 0;
+ border-left: 0;
+ }
+ .card-group > .card:first-child {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+ }
+ .card-group > .card:first-child .card-img-top, .card-group > .card:first-child .card-header {
+ border-top-right-radius: 0;
+ }
+ .card-group > .card:first-child .card-img-bottom, .card-group > .card:first-child .card-footer {
+ border-bottom-right-radius: 0;
+ }
+ .card-group > .card:last-child {
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+ }
+ .card-group > .card:last-child .card-img-top, .card-group > .card:last-child .card-header {
+ border-top-left-radius: 0;
+ }
+ .card-group > .card:last-child .card-img-bottom, .card-group > .card:last-child .card-footer {
+ border-bottom-left-radius: 0;
+ }
+ .card-group > .card:only-child {
+ border-radius: 0.25rem;
+ }
+ .card-group > .card:only-child .card-img-top, .card-group > .card:only-child .card-header {
+ border-top-left-radius: 0.25rem;
+ border-top-right-radius: 0.25rem;
+ }
+ .card-group > .card:only-child .card-img-bottom, .card-group > .card:only-child .card-footer {
+ border-bottom-right-radius: 0.25rem;
+ border-bottom-left-radius: 0.25rem;
+ }
+ .card-group > .card:not(:first-child):not(:last-child):not(:only-child) {
+ border-radius: 0;
+ }
+}
+
+.card-columns .card {
+ margin-bottom: 0.75rem;
+}
+
+@media (min-width: 576px) {
+ .card-columns {
+ -webkit-column-count: 3;
+ -moz-column-count: 3;
+ column-count: 3;
+ -webkit-column-gap: 1.25rem;
+ -moz-column-gap: 1.25rem;
+ column-gap: 1.25rem;
+ }
+ .card-columns .card {
+ display: inline-block;
+ width: 100%;
+ }
+}
diff --git a/resources/scss/bootstrap-cust/_panels.scss b/resources/scss/bootstrap-cust/_panels.scss
index 9ee5622..74f7424 100644
--- a/resources/scss/bootstrap-cust/_panels.scss
+++ b/resources/scss/bootstrap-cust/_panels.scss
@@ -1,3 +1,25 @@
.panel {
border: none;
-} \ No newline at end of file
+}
+
+.model-card {
+ .panel {
+ background-color: initial;
+ box-shadow: none;
+ margin-bottom: 0;
+ }
+
+ .panel-default > .panel-heading {
+ padding-left: 0;
+ border: 0;
+ padding: 0;
+ color: #191919 !important;
+ }
+
+ .panel-default > .panel-heading + .panel-collapse > .panel-body {
+ overflow-y: scroll;
+ max-height: 250px;
+ background-color: #fff;
+ margin-top: 15px;
+ }
+}
diff --git a/resources/scss/bootstrap.scss b/resources/scss/bootstrap.scss
index a42e5e7..e3cb012 100644
--- a/resources/scss/bootstrap.scss
+++ b/resources/scss/bootstrap.scss
@@ -21,7 +21,7 @@
// ONAP CORE
@import "common/variables";
-// Import Typography Section
+// Import Typography Section
@import "common/typography";
@@ -71,6 +71,7 @@
@import "bootstrap-cust/list-group";
@import "bootstrap/panels";
@import "bootstrap-cust/panels";
+@import "bootstrap-cust/card";
// @import "bootstrap/responsive-embed";
//@import "bootstrap/wells";
@import "bootstrap/close";
diff --git a/resources/scss/common/_layout.scss b/resources/scss/common/_layout.scss
index 11265c5..0d826f3 100644
--- a/resources/scss/common/_layout.scss
+++ b/resources/scss/common/_layout.scss
@@ -26,6 +26,7 @@
display: flex;
flex-direction: column;
height: 100vh;
+ overflow:auto;
}
.view-container {
@@ -38,8 +39,7 @@
.showContainer {
}
-.spin-container {
- overflow: hidden;
+.spinner-container {
position: relative;
}
@@ -50,6 +50,6 @@
top: 49%;
}
-.spin-content {
+.spinner-content {
opacity: 0.2;
}
diff --git a/resources/scss/common/_variables.scss b/resources/scss/common/_variables.scss
index 9c4bddb..87de010 100644
--- a/resources/scss/common/_variables.scss
+++ b/resources/scss/common/_variables.scss
@@ -37,7 +37,7 @@ $acadia-brown: #5a5a5a;
$light-gray: #cfd6d9;
$light-gray-2: #d2d2d2;
$neutral-gray: #b7bfc3;
-$dark-gray: #7c8388;
+$dark-gray: #191919;
$t-blue: #0396b4;
$light-green: #d1de42;
$amber: #fab32b;
diff --git a/resources/scss/customQuery/_customQuery.scss b/resources/scss/customQuery/_customQuery.scss
new file mode 100644
index 0000000..06e8cbd
--- /dev/null
+++ b/resources/scss/customQuery/_customQuery.scss
@@ -0,0 +1,84 @@
+/*
+ * ============LICENSE_START=======================================================
+ * org.onap.aai
+ * ================================================================================
+ * Copyright © 2017-2021 AT&T Intellectual Property. All rights reserved.
+ * ================================================================================
+ * 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.
+ * ============LICENSE_END=========================================================
+ */
+
+.addPadding {
+ margin-right: 50px;
+ margin-left: 50px;
+ margin-top: 20px;
+}
+.addPaddingTop {
+ margin-top: 20px;
+}
+.addPaddingSide {
+ margin-left: 20px;
+}
+.addPaddingLeft {
+ margin-left: 5px;
+}
+.my-4 {
+ margin-top: 1.5rem !important;
+}
+.display-2 {
+ font-size: 5.5rem;
+ font-weight: 300;
+ line-height: 1.2;
+}
+.lead {
+ color: #191919;
+ font-family: 'Omnes-Regular';
+ font-size: 2.4rem;
+ line-height: 2.8rem;
+ margin-top: 10px;
+ letter-spacing: -0.024rem;
+}
+.jumbotron {
+ padding: 2rem 1rem;
+ margin-bottom: 2rem;
+ background-color: #e9ecef;
+ border-radius: 0.3rem;
+}
+.cardwrap {
+ //word-wrap: break-word;
+ //overflow-wrap: break-word;
+ //word-break: break-all;
+ -ms-word-wrap: break-word;
+ word-wrap: break-word;
+}
+.dropdown-menu {
+ display: flow;
+ min-width: 360px;
+}
+.hidden {
+ display:none;
+}
+.show{
+ display:block;
+}
+.invalid {
+ border: 1px solid red;
+ background-color: #FDA49A;
+ color: white;
+}
+.cardWrapHeaderTxt {
+ font-weight: bold;
+ font-style: italic;
+ text-align: center;
+ color: blue;
+}
diff --git a/resources/scss/filter/_filter.scss b/resources/scss/filter/_filter.scss
new file mode 100644
index 0000000..cdfc983
--- /dev/null
+++ b/resources/scss/filter/_filter.scss
@@ -0,0 +1,135 @@
+/*
+ * ============LICENSE_START=======================================================
+ * org.onap.aai
+ * ================================================================================
+ * Copyright © 2017-2021 AT&T Intellectual Property. All rights reserved.
+ * ================================================================================
+ * 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.
+ * ============LICENSE_END=========================================================
+ */
+
+.badgeFilter {
+ color: #31708f;
+ background-color: #fff;
+ display: inline-block;
+ white-space: nowrap;
+ vertical-align: baseline;
+ box-sizing: border-box;
+ border-radius: 1em;
+ border-color: #009fdb;
+ margin: 0.4em 0.4em 0.4em 0em;
+ padding: 1px;
+ box-shadow: 1px 2px #abe0f5;
+ border: 1px solid #7fd6f8;
+ font-size: 0.9em;
+}
+
+.badgeFilter span{
+ float: left;
+ padding: 0.1em 0.2em;
+}
+
+.badgeFilter .close{
+ float:left;
+ color:#363434 !important
+}
+
+.leftNavSelection {
+ color:#ffffff;
+ background-color: #009fdb;
+ box-sizing : border-box;
+ border-radius: 0.2em;
+ border-color: #009fdb;
+}
+
+.leftNavSelection div:hover {
+ color:#000;
+ background-color: #ffffff;
+}
+.leftNavSelected {
+ color:#ffffff;
+ background-color: #e99b0a;
+ box-sizing : border-box;
+ border-radius: 0.2em;
+ border-color: #f59505;
+}
+#filters {
+ margin:20px 0px 20px 20px;
+}
+.leftNavSelection header {
+ margin:20px 0px 0px 0px;
+ border-bottom:1px solid #fff;
+ font-size: 16px;
+ padding: 0.25em;
+}
+.mainSectionSelection .panel-primary {
+ border: 1px solid transparent;
+ border-color: #009fdb;
+ border-radius: 1;
+}
+#filterPane .btn {
+ padding: 6px 16px;
+ margin: 0.2em;
+ white-space: normal;
+ box-shadow: 1px 2px #0c88d7;
+}
+#filterPane .dropdownButton {
+ width:100%;
+}
+#filterPane .btn-secondary {
+ background-color: #fdfdfd;
+ border: 1px solid #d7dbf6;
+}
+
+#filterPane .dropdown{
+ width:100%;
+}
+
+#filterPane .caret, #template .caret {
+ right: 0px;
+ top: 12px;
+ position: absolute;
+ margin: 0.2em;
+}
+#filterPane input {
+ padding:5px 5px 7px 5px;
+}
+.topBottomMargin {
+ margin:0.5em 0em;
+}
+#filterPane .label {
+ display: inline-block;
+ padding: 0.9em;
+ margin: 1em 0em;
+}
+.custom-container{
+ margin-right: auto;
+ margin-left: auto;
+ padding-left: 0px;
+ padding-right: 0px;
+ width: inherit;
+}
+.removeLeftPadding{
+ padding-left:0px !important;
+}
+.resultMessage{
+ font-size: 20px;
+ font-family: inherit;
+ font-weight: 500;
+ line-height: 5;
+ color: inherit;
+}
+.badgeFilter i{
+ font-style: italic;
+ font-size: 0.9em !important;
+}
diff --git a/resources/scss/header/_layout.scss b/resources/scss/header/_layout.scss
index 14d90ac..2d63f00 100644
--- a/resources/scss/header/_layout.scss
+++ b/resources/scss/header/_layout.scss
@@ -137,6 +137,11 @@
margin-bottom: 5px;
}
+ .font-awesome-icon{
+ font-size: 32px;
+ margin-top: 5px;
+ }
+
.main-menu-button {
background-color: transparent;
border: none;
@@ -159,6 +164,22 @@
background-image: url($icons-folder-path + '/vnfSearchicon.png');
}
+ .browse-button-icon {
+ background-image: url($icons-folder-path + '/vnfSearchicon.png');
+ }
+
+ .byoq-ext-button-icon {
+ background-image: url($icons-folder-path + '/vnfSearchicon.png');
+ }
+
+ .custom-query-button-icon {
+ background-image: url($icons-folder-path + '/vnfSearchicon.png');
+ }
+
+ .specialized-search-button-icon {
+ background-image: url($icons-folder-path + '/vnfSearchicon.png');
+ }
+
.configurable-view-button-icon {
background-image: url($icons-folder-path + '/reports.svg');
-webkit-filter: brightness(500);
@@ -181,6 +202,22 @@
background-image: url($icons-folder-path + '/vnfSearchicon_hover.png');
}
+ .browse-button-icon {
+ background-image: url($icons-folder-path + '/vnfSearchicon_hover.png');
+ }
+
+ .byoq-ext-button-icon {
+ background-image: url($icons-folder-path + '/vnfSearchicon_hover.png');
+ }
+
+ .custom-query-button-icon {
+ background-image: url($icons-folder-path + '/vnfSearchicon_hover.png');
+ }
+
+ .specialized-search-button-icon {
+ background-image: url($icons-folder-path + '/vnfSearchicon_hover.png');
+ }
+
.configurable-view-button-icon {
background-image: url($icons-folder-path + '/reports.svg');
-webkit-filter: brightness(1);
@@ -211,6 +248,22 @@
background-image: url($icons-folder-path + '/vnfSearchicon_active.png');
}
+ .browse-button-icon {
+ background-image: url($icons-folder-path + '/vnfSearchicon_active.png');
+ }
+
+ .byoq-ext-button-icon {
+ background-image: url($icons-folder-path + '/vnfSearchicon_active.png');
+ }
+
+ .custom-query-button-icon {
+ background-image: url($icons-folder-path + '/vnfSearchicon_active.png');
+ }
+
+ .specialized-search-button-icon {
+ background-image: url($icons-folder-path + '/vnfSearchicon_active.png');
+ }
+
.configurable-view-button-icon {
background-image: url($icons-folder-path + '/reports.svg');
-webkit-filter: brightness(0.55);
diff --git a/resources/scss/model/_model.scss b/resources/scss/model/_model.scss
new file mode 100644
index 0000000..a6d8dc8
--- /dev/null
+++ b/resources/scss/model/_model.scss
@@ -0,0 +1,183 @@
+/*
+ * ============LICENSE_START=======================================================
+ * org.onap.aai
+ * ================================================================================
+ * Copyright © 2017-2021 AT&T Intellectual Property. All rights reserved.
+ * ================================================================================
+ * 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.
+ * ============LICENSE_END=========================================================
+ */
+
+.model-container {
+ margin: 30px;
+
+ i {
+ font-size: 30px;
+ }
+}
+
+.model-gallery {
+ padding-left: 15px;
+ padding-right: 15px;
+
+ div[class^="col-"] {
+ padding-left: 0;
+ padding-right: 0;
+ }
+}
+
+.model-card {
+ height: 500px !important;
+ margin: 15px 0;
+
+ .model-card-content {
+ overflow: hidden;
+ margin-left: 24px;
+ }
+
+ .model-card-content:hover {
+ overflow-y: scroll;
+ }
+
+ .label-default {
+ background-color: #5a5a5a;
+ }
+}
+
+.d3-model-card {
+ height: 700px !important;
+ margin: 15px 0;
+
+ .model-card-header{
+ color: #FFFFFF;
+ background-color: #48a9fb;
+ }
+
+ .model-card-content {
+ overflow: hidden;
+ overflow-x: auto;
+ height: 700px !important;
+ margin-left: 24px;
+ }
+
+ .model-card-content:hover {
+ overflow-y: scroll;
+ }
+
+ .label-default {
+ background-color: #5a5a5a;
+ }
+ }
+ .template-textarea {
+ height: 300px !important
+ }
+ .model-template-card {
+ height: 500px !important;
+ margin: 15px 0;
+
+ .model-card-header{
+ color: #FFFFFF;
+ background-color: #48a9fb;
+ }
+
+ .model-card-content {
+ overflow: hidden;
+ height: 500px !important;
+ margin-left: 24px;
+ }
+
+ .model-card-content:hover {
+ overflow-y: scroll;
+ }
+
+ .label-default {
+ background-color: #5a5a5a;
+ }
+ }
+.d3-history-query-card {
+ height: 750px !important;
+ margin: 15px 0;
+
+ .history-query-card-header{
+ color: #FFFFFF;
+ background-color: #48a9fb;
+ }
+
+ .history-query-card-content {
+ overflow: hidden;
+ height: 750px !important;
+ margin-left: 24px;
+ }
+
+ .history-query-card-content:hover {
+ overflow-y: scroll;
+ }
+
+ .label-default {
+ background-color: #5a5a5a;
+ }
+ }
+
+
+.custom-accordion{
+ background-color: white !important;
+ border-radius: 8px;
+}
+
+.modal-override{
+ max-width: 1350 !important;
+ width: 1350px !important;
+}
+.tabIconChosen{
+ color:#FFFFFF !important;
+}
+.tabIconNotChosen{
+ color:#000000 !important;
+}
+.animationControlIcon{
+ font-size: 35px !important;
+}
+i.animationControlIcon:hover {
+ color: #97b0bf !important;
+}
+i.animationControlIcon:active {
+ color: #4f5b67 !important;
+}
+.animationPlayingIcon{
+ font-size: 35px !important;
+ color: #1bd645 !important;
+}
+.animationStoppedIcon{
+ font-size: 35px !important;
+ color: #ff0016 !important;
+}
+.animationPausedIcon{
+ font-size: 35px !important;
+ color: #4f5b67 !important;
+}
+
+.nodeIcon-deleted{
+ background-color: orangered !important;
+ color: white !important;
+ border-radius: 10px;
+}
+.nodeIcon-created{
+ background-color: #8ed422 !important;
+ color: white !important;
+ border-radius: 10px;
+}
+.nodeIcon-modified{
+ background-color: orange !important;
+ color: white !important;
+ border-radius: 10px;
+}
diff --git a/resources/scss/style.scss b/resources/scss/style.scss
index ca81d2f..af239e8 100644
--- a/resources/scss/style.scss
+++ b/resources/scss/style.scss
@@ -18,6 +18,18 @@
* limitations under the License.
* ============LICENSE_END=========================================================
*/
+
@import "common";
@import "components";
@import "modules";
+@import "_variables";
+@import "_typography";
+@import "_spinner";
+@import "filter/filter.scss";
+@import "bootstrap-cust/card";
+@import "_custom";
+
+@import "browse";
+@import "model/model.scss";
+@import "_customByoq.scss";
+@import "customQuery/customQuery.scss";
diff --git a/resources/scss/tier-support/_search.scss b/resources/scss/tier-support/_search.scss
index 892d303..fc15371 100644
--- a/resources/scss/tier-support/_search.scss
+++ b/resources/scss/tier-support/_search.scss
@@ -28,8 +28,9 @@
}
.auto-complete-search-button-group {
- position: absolute !important;
- padding-top: 3px;
+ position: inherit !important;
+ display: inline-block !important;
+ vertical-align: bottom !important;
}
.auto-complete-search input.form-control {
@@ -43,6 +44,13 @@
border: solid 1px $search-border-color1;
}
+.auto-complete-help-button, .auto-complete-help-button:focus {
+ background-color: $white;
+ width: 45px;
+ height: 30px;
+ border: solid 1px $search-border-color1;
+}
+
.auto-complete-search button:hover {
background-color: $search-background-color1;
}
@@ -53,11 +61,22 @@
background-color: $search-button-background-color;
}
+.auto-complete-search .fa-question-circle {
+ font-size: 1em;
+ line-height: 1em;
+ background-color: $white;
+}
+
.auto-complete-search button:hover .fa-search {
color: $primary-background-color;
background-color: $search-background-color1;
}
+.auto-complete-search button:hover .fa-question-circle {
+ color: $primary-background-color;
+ background-color: $search-background-color1;
+}
+
.auto-complete-search .btn-group .auto-complete-clear-button {
border: none;
margin-left: -35px !important;
@@ -189,3 +208,12 @@
background-color:inherit;
padding: 0px;
}
+
+.modal-searchable {
+ height: 500px !important;
+ margin: 15px 0;
+ overflow-y: scroll;
+}
+.modal-searchable:hover {
+ overflow-y: scroll;
+}