diff --git a/packages/ui/core/src/assets/scss/flow-builder.scss b/packages/ui/core/src/assets/scss/flow-builder.scss index bd7f6cdc8d..bc983f595d 100644 --- a/packages/ui/core/src/assets/scss/flow-builder.scss +++ b/packages/ui/core/src/assets/scss/flow-builder.scss @@ -6,7 +6,7 @@ height: 18px; width: 18px; z-index: 40; - background: $add-piece; + background: $bleached-gray; background-image: url("../img/custom/add-button.svg"); border-radius: 3px; transition: box-shadow 0.3s ease-in-out, background 0.3s ease-in-out, background-image 0.3s ease-in-out; diff --git a/packages/ui/core/src/assets/scss/variables.scss b/packages/ui/core/src/assets/scss/variables.scss index 3157c33294..c9ba9ba127 100644 --- a/packages/ui/core/src/assets/scss/variables.scss +++ b/packages/ui/core/src/assets/scss/variables.scss @@ -8,15 +8,12 @@ $border: #c2c9d1; $white: #ffffff; $gray-card: #fafafa; $placeholder: #c8c8c8; -$form-label: #7b7b7b; $black: #1d1d1d; $disable: #8c8c8c; -$sidebar: #fafbfc; $hover: #fafafa; $avatar: #515151; $blue-link: #1890ff; $gray-select: #f5f5f5; -$add-piece: #a6b1bf; $outline: rgba(0, 0, 0, 0.12); $description: #8c8c8c; $bleached-gray: #a6b1bf; diff --git a/packages/ui/core/src/styles.scss b/packages/ui/core/src/styles.scss index 6876f1912a..5c7e4365be 100644 --- a/packages/ui/core/src/styles.scss +++ b/packages/ui/core/src/styles.scss @@ -21,15 +21,12 @@ --white: #{$white}; --gray-card: #{$gray-card}; --placeholder: #{$placeholder}; - --form-label: #{$form-label}; --black: #{$black}; --disable: #{$disable}; - --sidebar: #{$sidebar}; --hover: #{$hover}; --avatar: #{$avatar}; --blue-link: #{$blue-link}; --gray-select: #{$gray-select}; - --add-piece: #{$add-piece}; --outline: #{$outline}; --description: #{$description}; --bleached-gray: #{$bleached-gray}; diff --git a/packages/ui/feature-builder-form-controls/src/lib/components/code-artifact-form-control/code-artifact-control-fullscreen/code-artifact-control-fullscreen.component.scss b/packages/ui/feature-builder-form-controls/src/lib/components/code-artifact-form-control/code-artifact-control-fullscreen/code-artifact-control-fullscreen.component.scss index 779360c806..a918c28f5b 100755 --- a/packages/ui/feature-builder-form-controls/src/lib/components/code-artifact-form-control/code-artifact-control-fullscreen/code-artifact-control-fullscreen.component.scss +++ b/packages/ui/feature-builder-form-controls/src/lib/components/code-artifact-form-control/code-artifact-control-fullscreen/code-artifact-control-fullscreen.component.scss @@ -1,13 +1,10 @@ @import "../../../../../../core//src/assets/scss/variables.scss"; @import "../../../../../../core/src/assets/scss/derived-variables.scss"; + .code-container { height: 100%; } -.modal-body { - background: $sidebar; -} - .file-active { background: $white; border: 2px solid $line !important; @@ -32,9 +29,9 @@ line-height: 100%; vertical-align: "middle"; } + .test-code-loading-container { position: absolute; left: 50%; top: 50%; -} - +} \ No newline at end of file diff --git a/packages/ui/feature-builder-header/src/lib/components/publish-or-edit-flow-button/publish-or-edit-flow-button.component.scss b/packages/ui/feature-builder-header/src/lib/components/publish-or-edit-flow-button/publish-or-edit-flow-button.component.scss index 5f363d55ae..cf5c037402 100755 --- a/packages/ui/feature-builder-header/src/lib/components/publish-or-edit-flow-button/publish-or-edit-flow-button.component.scss +++ b/packages/ui/feature-builder-header/src/lib/components/publish-or-edit-flow-button/publish-or-edit-flow-button.component.scss @@ -1,115 +1,5 @@ @import "../../../../../core/src/assets/scss/variables.scss"; -.btn-light-green { - color: #fff; - background-color: #14ae5c; - border-color: #14ae5c; - font-weight: 500; - font-size: 0.875rem; - line-height: 1.375rem; - - &[disabled] { - background-color: #d4d4d4; - border-color: #d4d4d4; - color: $form-label; - } -} - -.btn-section { - padding: 0px 0.75rem; - margin-bottom: 0.9375rem; - gap: 0.5rem; -} - -.publish-popover-container { - padding: 0.3125rem; - border-radius: 3px; - background-color: $white; - min-width: 19.3125rem; - max-width: 19.3125rem; - - .btn { - padding: 0.3125rem 0.6875rem; - } -} - -.environments-list-section { - padding: 0px 0.75rem; - - ul { - padding: 0px; - max-height: 7.875rem; - margin-bottom: 0px; - padding-bottom: 10px; - overflow-y: auto; - overflow-x: hidden; - list-style-type: none; - scrollbar-width: thin; - - &::-webkit-scrollbar { - width: 4px; - } - } - - li { - padding-bottom: 0.3125rem; - - .version-tag { - background: rgba(0, 0, 0, 0.05); - border-radius: 130px; - padding: 0.0938rem 0.375rem; - font-weight: 400; - font-size: 12px; - line-height: 16px; - color: $body; - } - } -} - -.publish-to-text { - font-weight: 500; - font-size: 0.875rem; - line-height: 1.5rem; - padding: 0.3125rem 0px; - color: $form-label; -} - -.publish-popover-separator { - border-top: 1px solid $dividers; -} - -.older-versions-text { - color: $blue-link; - margin: 0.625rem 0.75rem 0.625rem 0.75rem; - font-size: 0.875rem; -} - -.publish-popover-chevron { - fill: $white; - height: 5px; - width: 10px; - - &.flip { - svg { - transform: rotate((180deg)); - } - } -} - -.publish-popover-text { - gap: 10px; -} - -@keyframes loading-spin { - from { - transform: rotate(0deg); - } - - to { - transform: rotate(360deg); - } -} - .loading-spin-animation { svg { transform-origin: 7.5px 7.5px 0; @@ -130,24 +20,3 @@ .loading-template { gap: 4px; } - -.environment-published-text { - color: #14ae5c; -} - -.environment-name { - white-space: nowrap; - max-width: 9.5rem; - overflow: hidden; - text-overflow: ellipsis; -} - -.environment-name-container { - gap: 0.5ch; -} - -.invalid-publish { - svg { - fill: rgba(0, 0, 0, 0.26); - } -} diff --git a/packages/ui/feature-builder-left-sidebar/src/lib/components/run-details/steps-results-list/step-result.component.scss b/packages/ui/feature-builder-left-sidebar/src/lib/components/run-details/steps-results-list/step-result.component.scss index 200be80d6c..ac44581700 100644 --- a/packages/ui/feature-builder-left-sidebar/src/lib/components/run-details/steps-results-list/step-result.component.scss +++ b/packages/ui/feature-builder-left-sidebar/src/lib/components/run-details/steps-results-list/step-result.component.scss @@ -86,7 +86,7 @@ .loop-caret { width: 10px; height: 10px; - fill: $add-piece; + fill: $bleached-gray; transform: rotate(-45deg); } .step-icon { diff --git a/packages/ui/feature-builder-right-sidebar/src/lib/edit-step-sidebar/edit-step-form-container/edit-step-form-container.component.scss b/packages/ui/feature-builder-right-sidebar/src/lib/edit-step-sidebar/edit-step-form-container/edit-step-form-container.component.scss index 74233fe165..7cdfb8ea9f 100755 --- a/packages/ui/feature-builder-right-sidebar/src/lib/edit-step-sidebar/edit-step-form-container/edit-step-form-container.component.scss +++ b/packages/ui/feature-builder-right-sidebar/src/lib/edit-step-sidebar/edit-step-form-container/edit-step-form-container.component.scss @@ -5,79 +5,7 @@ margin-right: 0.3125rem; border-radius: 4px; - .inside-panel-item-title { - padding-top: 1.5625rem; - font-weight: 400; - font-size: 0.875rem; - line-height: 1.375rem; - color: $form-label; - -webkit-touch-callout: none; - /* iOS Safari */ - -webkit-user-select: none; - /* Safari */ - -khtml-user-select: none; - /* Konqueror HTML */ - -moz-user-select: none; - /* Old versions of Firefox */ - -ms-user-select: none; - /* Internet Explorer/Edge */ - user-select: none; - /* Non-prefixed version, currently - supported by Chrome, Edge, Opera and Firefox */ - } - - .learn-variable-text { - color: $body; - } - - .flip-chevorn-up { - transform: rotate(180deg); - } - - // Learn how to variable - - .doc-text:hover { - color: black; - } - - .doc-text { - color: $body; - font-size: 14px; - line-height: 22px; - } - - .doc-container { - display: flex; - padding: 0.5rem; - background-color: $sidebar; - align-items: center; - } - .flip-transition { - transition: transform 0.5s ease; - display: inline-block; - } - - .expansion-panel-transition { - transition: background-color 1s ease; - } - - .expansion-panel-opened { - background-color: #fafafa; - } - - .chevorn-margin-left { - margin-left: auto; - margin-right: -6px; - } - - .expansion-panel-body { - margin-top: -5px; - } - - .mat-expansion-panel-spacing { - margin: 0px; - } } .take-remaining-height-in-flex-column { diff --git a/packages/ui/feature-builder-right-sidebar/src/lib/edit-step-sidebar/edit-step-sidebar.component.css b/packages/ui/feature-builder-right-sidebar/src/lib/edit-step-sidebar/edit-step-sidebar.component.css deleted file mode 100755 index 3c40359aab..0000000000 --- a/packages/ui/feature-builder-right-sidebar/src/lib/edit-step-sidebar/edit-step-sidebar.component.css +++ /dev/null @@ -1,46 +0,0 @@ -.inside-panel-item-title { - padding-top: 25px; - font-weight: 400; - font-size: 14px; - line-height: 22px; - color: #7B7B7B; - border-bottom: 0.5px dashed #7B7B7B; -} - -.expansion-panel-label { - margin-bottom: 0px !important; -} - -.flip-chevorn-up { - transform: rotate(180deg); -} - -.flip-chevorn-down { - transform: rotate(0deg); -} - -.flip-transition { - transition: transform 0.5s ease; -} - -.expansion-panel-transition { - transition: background-color 1s ease; -} - -.expansion-panel-opened { - background-color: #FAFAFA; -} - -.chevorn-margin-left { - margin-left: auto; - margin-right: 20px; -} - -mat-expansion-panel-header { - padding-top: 20px; -} - -.expansion-panel-body-bottom-padding { - padding-bottom: 25px; -} - diff --git a/packages/ui/feature-builder-right-sidebar/src/lib/edit-step-sidebar/edit-step-sidebar.component.ts b/packages/ui/feature-builder-right-sidebar/src/lib/edit-step-sidebar/edit-step-sidebar.component.ts index 727e13a0c2..d731b71e01 100755 --- a/packages/ui/feature-builder-right-sidebar/src/lib/edit-step-sidebar/edit-step-sidebar.component.ts +++ b/packages/ui/feature-builder-right-sidebar/src/lib/edit-step-sidebar/edit-step-sidebar.component.ts @@ -22,7 +22,7 @@ import { PieceMetadataService } from '@activepieces/ui/feature-pieces'; @Component({ selector: 'app-edit-step-sidebar', templateUrl: './edit-step-sidebar.component.html', - styleUrls: ['./edit-step-sidebar.component.css'], + styleUrls: [], }) export class EditStepSidebarComponent implements OnInit { constructor(