Skip to content

Commit

Permalink
new UI: step 1
Browse files Browse the repository at this point in the history
  • Loading branch information
Gabriele Panico committed Oct 9, 2023
1 parent f6d13ac commit 8c0f47d
Show file tree
Hide file tree
Showing 17 changed files with 236 additions and 325 deletions.
12 changes: 6 additions & 6 deletions angular.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,20 +34,20 @@
"src/assets"
],
"styles": [
"src/styles.scss",
"node_modules/bootstrap/dist/css/bootstrap.css",
"src/assets/sass/material-dashboard.scss",
"src/assets/sass/cds/styles.scss",
"node_modules/@ng-select/ng-select/themes/default.theme.css",
"node_modules/material-icons/iconfont/material-icons.css",
"node_modules/roboto-fontface/css/roboto/roboto-fontface.css",
"node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css",
"node_modules/@ctrl/ngx-emoji-mart/picker.css"
"node_modules/@ctrl/ngx-emoji-mart/picker.css",
"src/styles.scss",
"src/assets/sass/material-dashboard.scss",
"src/assets/sass/cds/styles.scss"
],
"scripts": [
"node_modules/bootstrap/dist/js/bootstrap.js",
"src/assets/js/mqtt/4.1.0/mqtt.min.js",
"node_modules/moment/moment.js",
"node_modules/bootstrap/dist/js/bootstrap.js"
"node_modules/moment/moment.js"
]
},
"configurations": {
Expand Down
2 changes: 1 addition & 1 deletion src/app/chatbot-design-studio/cds-chatbot-details/detail/detail.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -110,7 +110,7 @@ <h3 class="card_title__underlined" style="color: #e8eaed;">
Language
</label>
<div class="col-xs-12 col-sm-8 col-md-8 col-lg-8">
<div class="input-group" style="max-width: 503px;">
<div class="input-group">
<input id="bot-default-selected-lang" name="bot-default-selected-lang" [(ngModel)]="botDefaultSelectedLang"
class="input csd-chatbot-dtls-input" type="text" style="color:#808080" disabled>

Expand Down
4 changes: 2 additions & 2 deletions src/app/chatbot-design-studio/cds-chatbot-details/detail/detail.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ input[type="text"] {
height: 36px;
font-size: 14px;
width: 100%;
margin-bottom: 10px;
// margin-bottom: 10px;
appearance: none;
-webkit-appearance: none;
background: #fff;
Expand All @@ -25,7 +25,7 @@ textarea[type="text"] {
// height: 36px;
font-size: 14px;
width: 100%;
margin-bottom: 10px;
// margin-bottom: 10px;
appearance: none;
-webkit-appearance: none;
background: #fff;
Expand Down
12 changes: 9 additions & 3 deletions ...tbot-design-studio/cds-dashboard/cds-canvas/actions/list/question/question.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -226,9 +226,11 @@ mat-form-field.box-textarea ::ng-deep {
border-radius: 0;
padding-left: 6px;
padding-right: 6px;
padding-top: 4px;
padding-top: 0px;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
display: flex;
align-items: center;
}

.cds-group-addon-question-right {
Expand All @@ -237,11 +239,13 @@ mat-form-field.box-textarea ::ng-deep {
border-radius: 0;
// padding-left: 6px;
// padding-right: 6px;
padding-top: 4px;
padding-top: 0px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
cursor: pointer;
max-width: 47px;
display: flex;
align-items: center;
}

.cds-group-addon-question-right:hover {
Expand All @@ -267,10 +271,12 @@ mat-form-field.box-textarea ::ng-deep {
border-radius: 0;
padding-left: 6px;
padding-right: 6px;
padding-top: 4px;
padding-top: 0px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
cursor: pointer;
display: flex;
align-items: center;
}

// .cds-group-addon-right-icon:hover {
Expand Down
86 changes: 20 additions & 66 deletions src/app/chatbot-design-studio/cds-dashboard/cds-canvas/cds-canvas.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,6 @@
$width-card-tools: 160px;
$margin-left-card: 30px;
$margin-top-card: 30px;
$mdb-font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif !default;
$mdb-font-family-poppins: 'Poppins', 'Roboto', Arial, sans-serif !default;
$box-left-width: 250px;
$box-left-width-closed: 0px;

Expand Down Expand Up @@ -88,58 +86,10 @@ $box-left-width-closed: 0px;





.cds-header {
height: 60px;
font-family: $mdb-font-family-poppins;
line-height: 60px;
font-size: 21px;
color: #fff;
background: #1e293b;
display: flex;
}

.chatboat-dashboard {
background-color: rgb($bg-color-dark-rgb);
position: relative;
display: flex;
margin-top: 0px;
padding: 0px;
width: 100%;
height: calc(100vh - 60px);
overflow-x: hidden;
overflow-y: hidden;
font-family: $mdb-font-family-poppins;
color: #394f5a;
font-size: 16px;
}

.cds-sidebar {
border-right: 2px solid #394f5a;
width: 60px;
transition: 0.3s;
display: flex;
}

.cds-content {
display: flex;
width: calc(100% - 60px);
// overflow-y: auto;
overflow: hidden;
cds-rules,
cds-chatbot-details,
cds-fulfillment {
width: 100%;
}
}

.chatboat-dashboard {
&.is_opened_sidebar {
.cds-sidebar {
width: 175px;
}
}
cds-rules,
cds-chatbot-details,
cds-fulfillment {
width: 100%;
}

.cds-toggle-setting-sidebar-icon-right-wpr {
Expand Down Expand Up @@ -167,7 +117,7 @@ $box-left-width-closed: 0px;
width: $box-left-width;
max-width: $box-left-width;
min-width: $box-left-width;
background-color: #394f5a;
background-color: $blu-light-01;
z-index: 10;
position: relative;
.panel-intent-list {
Expand All @@ -176,23 +126,27 @@ $box-left-width-closed: 0px;
width: 100%;
height: 100vh;
max-height: 100%;
background-color: rgb($bg-color-bck-rgb);
border-radius: 0em;
overflow: hidden;
margin: 0px;
padding: 0px 2px 10px 2px;
align-items: flex-start;
overflow-y: scroll;
}
.panel-intent-list::-webkit-scrollbar {
width: 3px;
}
.panel-intent-list::-webkit-scrollbar-track {
background-color: #1c2b45;
}
.panel-intent-list::-webkit-scrollbar-thumb {
background-color: #3c485b;
border-radius: 3px;

&::-webkit-scrollbar {
width: 3px;
}

&:hover{
&::-webkit-scrollbar-track {
background-color: $blu-light-01;
}
&::-webkit-scrollbar-thumb {
background-color: $blu;
border-radius: 3px;
}
}

}

&.is_closed{
Expand Down
36 changes: 20 additions & 16 deletions ...tudio/cds-dashboard/cds-canvas/cds-panel-intent-list/cds-panel-intent-list.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,31 +1,18 @@
<div class="content">

<div class="search-box">
<div class="input-box">
<div class="input-box-search-icon-wpr">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16px" height="16px">
<path fill="currentColor" fill-rule="evenodd"
d="M7 0a7 7 0 0 1 5.474 11.364l3.224 3.224c.347.348.418.84.07 1.187-.346.347-.838.276-1.185-.071l-3.226-3.225A7 7 0 1 1 7 0zm0 1.5a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11z">
</path>
</svg>
</div>
<div class="input-box-search-input-wpr">
<input class="custom-input truncate" placeholder="search a block..."
(input)="onLiveSearch($event.target.value);">
</div>
</div>
<div class="cds-title list-title">
Blocks
</div>

<div class="intents-list">

<div class="topic-internal">

<div class="intents">
<div *ngFor="let intent of internalIntents; let id = index" id="intent_{{id}}" class="intent"
[ngClass]="{'active': idSelectedIntent === intent.intent_id}" [value]="intent.intent_id"
(click)="onSelectIntent(intent)">

<div class="icon-container" [ngClass]="onGetIconForName(intent.intent_display_name)">
<div class="icon-container">
<span class="material-icons">{{onGetIconForName(intent.intent_display_name)}}</span>
</div>

Expand Down Expand Up @@ -54,9 +41,26 @@
</div>

</div>
</div>


<div class="search-box">
<div class="input-box">
<div class="input-box-search-icon-wpr">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16px" height="16px">
<path fill="currentColor" fill-rule="evenodd"
d="M7 0a7 7 0 0 1 5.474 11.364l3.224 3.224c.347.348.418.84.07 1.187-.346.347-.838.276-1.185-.071l-3.226-3.225A7 7 0 1 1 7 0zm0 1.5a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11z">
</path>
</svg>
</div>
<div class="input-box-search-input-wpr">
<input class="custom-input truncate" placeholder="search a block..."
(input)="onLiveSearch($event.target.value);">
</div>
</div>
</div>

<div class="intents-list">

<div style="width: 100%; display: flex; justify-content: center;">
<div class="custom-divider"></div>
Expand Down
Loading

0 comments on commit 8c0f47d

Please sign in to comment.