zeus
/
swarmlab-hybrid
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

changes on theme 1

master
zeus 3 years ago
parent
89f15214ca
commit
eebffdbf07
11 changed files with 855 additions and 4 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      .gitignore
  2. 21
      src/App.vue
  3. 360
      src/assets/css/_bootswatch.scss
  4. 168
      src/assets/css/_darkvariables.scss
  5. 6
      src/assets/css/_lightvariables.scss
  6. 254
      src/assets/css/_variables-backup.scss
  7. 6
      src/assets/css/my.scss
  8. 11
      src/components/manageservices/view-dashboard.vue
  9. 1
      src/components/mynetwork/AdhocView.vue
  10. 11
      src/config/dark.scss
  11. 13
      src/store/modules/create_pipelineLLO.js

4
.gitignore
View File

@ -18,6 +18,10 @@ viwsession/
testfilemanager/
README-update
!./src-local/community/config/
!./src-local/community/custom/
!./src-local/community/README
./src-local/community/
src-local/community/rootapostolos@swarmlab.io_mytest1_microservice-ipterm/
src-local/community/rootapostolos@swarmlab.io_ansibletest_microservice-alpine313/
src-local/community/cse242017102@uniwa.gr_test_microservice-nodejs/

21
src/App.vue
View File

@ -143,6 +143,7 @@
<ul class="nav navbar-nav flex-row justify-content-md-center justify-content-start flex-nowrap">
<!-- --------------- socket connection -->
<b-nav-item
@click="onAction('check')"
>Check Connection Status:</b-nav-item>
@ -712,6 +713,7 @@ export default {
this.$root.$off('hybrid_server_status')
},
created() {
},
methods: {
setWarning(){
@ -864,8 +866,24 @@ let info = '<div class="text-left" style="height: 550px; overflow-y: scroll;"><b
focusCancel: true,
confirmButtonText: 'Ok!'
})
},
/*
async setswarmlabtheme(v){
console.log('1- '+v)
if(v == 'slate'){
var swarmlabtheme = await store.getters['pipelineLLO/getmytheme']
//document.documentElement.style.setProperty('--swarmlab-body-background', swarmlabtheme.body_background)
document.querySelector('body').setAttribute('style', `background:${swarmlabtheme.body_background}`)
} else if(v == 'light'){
var swarmlabtheme = await store.getters['pipelineLLO/getmytheme']
var swarmlabthemetmp1 = "#EEF1F4!important"
document.querySelector('body').setAttribute('style', `background:${swarmlabthemetmp1}`)
//var swarmlabthemetmp = '"--swarmlab-body-background: '+ swarmlabtheme.body_background +'"'
//document.documentElement.setAttribute("style", "--swarmlab-body-background: #EEF1F4!important");
//console.log(document.documentElement.style)
}
},
*/
},
computed: {
@ -883,6 +901,7 @@ let info = '<div class="text-left" style="height: 550px; overflow-y: scroll;"><b
</script>
<style>
.active {
background-color: #e7e7e7 !important;
color: #0c5460 !important;

360
src/assets/css/_bootswatch.scss
View File

@ -0,0 +1,360 @@
// Slate 5.1.3
// Bootswatch
// Mixins
@mixin btn-shadow($color){
@include gradient-y-three-colors(tint-color($color, 12%), $color, 60%, shade-color($color, 8%));
filter: none;
}
@mixin btn-shadow-inverse($color){
@include gradient-y-three-colors(shade-color($color, 36%), shade-color($color, 30%), 40%, shade-color($color, 26%));
filter: none;
}
// Navbar
.navbar {
border: 1px solid rgba(0, 0, 0, .6);
text-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
.container {
padding: 0;
}
.navbar-toggler {
border-color: rgba(0, 0, 0, .6);
}
&-fixed-top {
border-width: 0 0 1px;
}
&-fixed-bottom {
border-width: 1px 0 0;
}
.nav-link {
padding: 1rem;
border-left: 1px solid rgba(255, 255, 255, .1);
border-right: 1px solid rgba(0, 0, 0, .2);
&:hover,
&:focus {
@include btn-shadow-inverse($gray-800);
border-left: 1px solid rgba(0, 0, 0, .2);
}
}
&-brand {
padding: .75rem 1rem subtract(24px, .75rem);
margin-right: 0;
border-right: 1px solid rgba(0, 0, 0, .2);
}
.nav-item.active .nav-link {
background-color: rgba(0, 0, 0, .3);
border-left: 1px solid rgba(0, 0, 0, .2);
}
&-nav .nav-item + .nav-item {
margin-left: 0;
}
&.bg-light {
text-shadow: 1px 1px 1px rgba(0, 0, 0, .1);
.nav-link {
&:hover,
&:focus {
@include btn-shadow-inverse($gray-600);
border-left: 1px solid rgba(0, 0, 0, .2);
}
}
}
}
@media (max-width: 576px) {
.navbar-expand-sm {
.navbar-brand,
.nav-link {
border: none !important;
}
}
}
@media (max-width: 768px) {
.navbar-expand-md {
.navbar-brand,
.nav-link {
border: none !important;
}
}
}
@media (max-width: 992px) {
.navbar-expand-lg {
.navbar-brand,
.nav-link {
border: none !important;
}
}
}
// Buttons
.btn {
border-color: rgba(0, 0, 0, .6);
text-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
&:not([disabled]):not(.disabled).active,
&.disabled {
border-color: rgba(0, 0, 0, .6);
box-shadow: none;
}
&:hover,
&:focus,
&:not([disabled]):not(.disabled):active,
&:not([disabled]):not(.disabled):active:hover,
&:not([disabled]):not(.disabled).active:hover {
border-color: rgba(0, 0, 0, .6);
}
}
.btn-primary {
@include btn-shadow($primary);
&:not([disabled]):not(.disabled):hover,
&:not([disabled]):not(.disabled):focus,
&:not([disabled]):not(.disabled):active:hover,
&:not([disabled]):not(.disabled).active:hover {
@include btn-shadow-inverse($primary);
}
}
.btn-secondary {
@include btn-shadow($secondary);
&:not([disabled]):not(.disabled):hover,
&:not([disabled]):not(.disabled):focus,
&:not([disabled]):not(.disabled):active,
&:not([disabled]):not(.disabled).active {
@include btn-shadow-inverse($secondary);
}
}
.btn-success {
@include btn-shadow($success);
color: $white;
&:not([disabled]):not(.disabled):hover,
&:not([disabled]):not(.disabled):focus,
&:not([disabled]):not(.disabled):active,
&:not([disabled]):not(.disabled).active {
@include btn-shadow-inverse($success);
}
}
.btn-info {
@include btn-shadow($info);
color: $white;
&:not([disabled]):not(.disabled):hover,
&:not([disabled]):not(.disabled):focus,
&:not([disabled]):not(.disabled):active,
&:not([disabled]):not(.disabled).active {
@include btn-shadow-inverse($info);
}
}
.btn-warning {
@include btn-shadow($warning);
color: $white;
&:not([disabled]):not(.disabled):hover,
&:not([disabled]):not(.disabled):focus,
&:not([disabled]):not(.disabled):active,
&:not([disabled]):not(.disabled).active {
@include btn-shadow-inverse($warning);
}
}
.btn-danger {
@include btn-shadow($danger);
&:not([disabled]):not(.disabled):hover,
&:not([disabled]):not(.disabled):focus,
&:not([disabled]):not(.disabled):active,
&:not([disabled]):not(.disabled).active {
@include btn-shadow-inverse($danger);
}
}
.btn-outline {
&-primary {
color: $white;
}
}
.btn-link,
.btn-link:hover {
border-color: transparent;
}
.btn-group,
.btn-group-vertical {
.btn.active {
border-color: rgba(0, 0, 0, .6);
}
}
// Typography
h1,
h2,
h3,
h4,
h5,
h6 {
text-shadow: -1px -1px 0 rgba(0, 0, 0, .3);
}
// Forms
legend {
color: $white;
}
.input-group-addon {
@include btn-shadow($secondary);
text-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
color: $white;
}
// Navs
.nav-tabs {
.nav-link {
@include btn-shadow-inverse($gray-800);
border: 1px solid rgba(0, 0, 0, .6);
&:not([disabled]):not(.disabled):hover,
&:not([disabled]):not(.disabled):focus,
&:not([disabled]):not(.disabled):active,
&:not([disabled]):not(.disabled).active {
@include btn-shadow($gray-800);
}
&.disabled {
border: 1px solid rgba(0, 0, 0, .6);
}
}
.nav-link,
.nav-link:hover {
color: $white;
}
}
.nav-pills {
.nav-link {
@include btn-shadow($gray-800);
border: 1px solid rgba(0, 0, 0, .6);
text-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
color: $white;
&:hover {
@include btn-shadow-inverse($gray-800);
border: 1px solid rgba(0, 0, 0, .6);
}
}
.nav-link.active,
.nav-link:hover {
background-color: transparent;
@include btn-shadow-inverse($gray-800);
border: 1px solid rgba(0, 0, 0, .6);
}
.nav-link.disabled,
.nav-link.disabled:hover {
@include btn-shadow($gray-800);
color: $nav-link-disabled-color;
}
}
.pagination {
.page-link {
text-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
@include btn-shadow($gray-800);
&:hover {
@include btn-shadow-inverse($gray-800);
text-decoration: none;
}
}
.page-item.active .page-link {
@include btn-shadow-inverse($gray-800);
}
.page-item.disabled .page-link {
@include btn-shadow($gray-800);
}
}
.breadcrumb {
border: 1px solid rgba(0, 0, 0, .6);
text-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
background-color: transparent;
@include btn-shadow($gray-800);
a,
a:hover {
color: $white;
}
}
// Indicators
.alert {
border: none;
color: $white;
a,
.alert-link {
color: $white;
text-decoration: underline;
}
@each $color, $value in $theme-colors {
&-#{$color} {
background-color: $value;
}
}
&-light {
&,
a:not(.btn),
.alert-link {
color: $body-bg;
}
}
}
.badge {
&.bg-light {
color: $dark;
}
}
// Containers
.list-group {
&-item-action:hover {
background-color: shade-color($gray-900, 10%);
}
}

168
src/assets/css/_darkvariables.scss
View File

@ -0,0 +1,168 @@
// Slate 5.1.3
// Bootswatch
$theme: "slate" !default;
//
// Color system
//
$white: #fff !default;
$gray-100: #f8f9fa !default;
$gray-200: #e9ecef !default;
$gray-300: #dee2e6 !default;
$gray-400: #ced4da !default;
$gray-500: #999 !default;
$gray-600: #7a8288 !default;
$gray-700: #52575c !default;
$gray-800: #3a3f44 !default;
$gray-900: #272b30 !default;
$black: #000 !default;
$blue: #007bff !default;
$indigo: #6610f2 !default;
$purple: #6f42c1 !default;
$pink: #e83e8c !default;
$red: #ee5f5b !default;
$orange: #fd7e14 !default;
$yellow: #f89406 !default;
$green: #62c462 !default;
$teal: #20c997 !default;
$cyan: #5bc0de !default;
$primary: $gray-800 !default;
$secondary: $gray-600 !default;
$success: $green !default;
$info: $cyan !default;
$warning: $yellow !default;
$danger: $red !default;
$light: $gray-200 !default;
$dark: $gray-900 !default;
$min-contrast-ratio: 1.95 !default;
// Body
$body-bg: $gray-900 !default;
$body-color: #aaa !default;
// Links
$link-color: $white !default;
// Fonts
// Tables
$table-color: $white !default;
$table-accent-bg: rgba($white, .05) !default;
$table-hover-bg: rgba($white, .075) !default;
$table-border-color: rgba($black, .6) !default;
$table-dark-border-color: $table-border-color !default;
$table-dark-color: $white !default;
$table-bg-scale: 0 !default;
// Buttons
$input-btn-padding-y: .75rem !default;
$input-btn-padding-x: 1rem !default;
// Forms
$input-bg: $white !default;
$input-disabled-bg: #ccc !default;
$input-color: $gray-900 !default;
$form-check-input-bg: $white !default;
// Dropdowns
$dropdown-bg: $gray-800 !default;
$dropdown-border-color: rgba($black, .6) !default;
$dropdown-divider-bg: rgba($black, .15) !default;
$dropdown-link-color: $body-color !default;
$dropdown-link-hover-color: $white !default;
$dropdown-link-hover-bg: $body-bg !default;
$dropdown-link-active-color: $dropdown-link-hover-color !default;
$dropdown-link-active-bg: $dropdown-link-hover-bg !default;
// Navs
$nav-tabs-border-color: rgba($black, .6) !default;
$nav-tabs-link-hover-border-color: $nav-tabs-border-color !default;
$nav-tabs-link-active-color: $white !default;
$nav-tabs-link-active-border-color: $nav-tabs-border-color !default;
// Navbar
$navbar-padding-y: 0 !default;
$navbar-dark-hover-color: $white !default;
$navbar-light-hover-color: $gray-800 !default;
$navbar-light-active-color: $gray-800 !default;
// Pagination
$pagination-color: $white !default;
$pagination-bg: transparent !default;
$pagination-border-color: rgba($black, .6) !default;
$pagination-hover-color: $white !default;
$pagination-hover-bg: transparent !default;
$pagination-hover-border-color: rgba($black, .6) !default;
$pagination-active-bg: transparent !default;
$pagination-active-border-color: rgba($black, .6) !default;
$pagination-disabled-bg: transparent !default;
$pagination-disabled-border-color: rgba($black, .6) !default;
// Cards
$card-border-color: rgba($black, .6) !default;
$card-cap-bg: lighten($gray-800, 10%) !default;
$card-bg: lighten($body-bg, 5%) !default;
// Popovers
$popover-bg: lighten($body-bg, 5%) !default;
// Toasts
$toast-background-color: lighten($body-bg, 5%) !default;
$toast-border-color: rgba(0, 0, 0, .2) !default;
$toast-header-color: $body-color !default;
$toast-header-background-color: $toast-background-color !default;
$toast-header-border-color: $toast-border-color !default;
// Modals
$modal-content-bg: lighten($body-bg, 5%) !default;
$modal-header-border-color: rgba(0, 0, 0, .2) !default;
// Progress bars
$progress-bg: darken($gray-900, 5%) !default;
$progress-bar-color: $gray-600 !default;
// List group
$list-group-color: $white !default;
$list-group-bg: lighten($body-bg, 5%) !default;
$list-group-border-color: rgba($black, .6) !default;
$list-group-hover-bg: lighten($body-bg, 10%) !default;
$list-group-active-color: $white !default;
$list-group-active-bg: $list-group-hover-bg !default;
$list-group-active-border-color: $list-group-border-color !default;
$list-group-disabled-color: $gray-700 !default;
$list-group-action-color: $white !default;
// Breadcrumbs
$breadcrumb-padding-y: .375rem !default;
$breadcrumb-padding-x: .75rem !default;
$breadcrumb-active-color: $gray-500 !default;
$breadcrumb-border-radius: .25rem !default;
// Code
$pre-color: inherit !default;

6
src/assets/css/_lightvariables.scss
View File

@ -0,0 +1,6 @@
body {
background: #EEF1F4!important;
}

254
src/assets/css/_variables-backup.scss
View File

@ -0,0 +1,254 @@
$font-color: #66615b !default;
$fill-font-color: rgba(255, 255, 255, 0.7);
$none: 0 !default;
$border-thin: 1px !default;
$border-thick: 2px !default;
$white-color: #FFFFFF !default;
$white-bg: #FFFFFF !default;
$smoke-bg: #F5F5F5 !default;
$pale-bg: #FFFCF5 !default;
$medium-pale-bg: #F1EAE0 !default;
$table-line-color: #CCC5B9 !default;
$muted-color: #a49e93 !default;
$black-bg: rgba(30, 30, 30, .97) !default;
$black-color: #333333 !default;
$black-hr: #444444 !default;
$white-background-color: #FFFFFF !default;
$black-background-color: #212120 !default;
$darkblue-background-color: #35495E !default; // this is the dark blue color from Vue.js branding
$light-gray: #E3E3E3 !default;
$medium-gray: #DDDDDD !default;
$dark-gray: #9A9A9A !default;
$gray-input-bg: #fffcf5 !default;
$danger-input-bg: #FFC0A4 !default;
$success-input-bg: #ABF3CB !default;
$other-medium-gray: #A49E93 !default;
$transparent-bg: transparent !default;
$default-color: #66615B !default;
$default-bg: #66615B !default;
$default-states-color: #403D39 !default;
$primary-color: #7A9E9F !default;
$primary-bg: #7A9E9F !default;
$primary-states-color: #427C89 !default;
$success-color: #41B883 !default; // this is the green color from Vue.js branding
$success-bg: #41B883 !default;
$success-states-color: #229863 !default;
$info-color: #68B3C8 !default;
$info-bg: #68B3C8 !default;
$info-states-color: #3091B2 !default;
$warning-color: #F3BB45 !default;
$warning-bg: #F3BB45 !default;
$warning-states-color: #BB992F !default;
$danger-color: #EB5E28 !default;
$danger-bg: #EB5E28 !default;
$danger-states-color: #B33C12 !default;
$link-disabled-color: #666666 !default;
/* light colors - used for select dropdown */
$light-blue: rgba($primary-color, .2);
$light-azure: rgba($info-color, .2);
$light-green: rgba($success-color, .2);
$light-orange: rgba($warning-color, .2);
$light-red: rgba($danger-color, .2);
//== Components
//
$padding-base-vertical: 7px !default;
$padding-base-horizontal: 18px !default;
$padding-round-vertical: 9px !default;
$padding-round-horizontal: 18px !default;
$padding-simple-vertical: 10px !default;
$padding-simple-horizontal: 18px !default;
$padding-large-vertical: 11px !default;
$padding-large-horizontal: 30px !default;
$padding-small-vertical: 4px !default;
$padding-small-horizontal: 10px !default;
$padding-xs-vertical: 2px !default;
$padding-xs-horizontal: 5px !default;
$padding-label-vertical: 2px !default;
$padding-label-horizontal: 12px !default;
// padding for links inside dropdown menu
$padding-dropdown-vertical: 10px !default;
$padding-dropdown-horizontal: 15px !default;
$margin-large-vertical: 30px !default;
$margin-base-vertical: 15px !default;
// border radius for buttons
$border-radius-btn-small: 26px !default;
$border-radius-btn-base: 20px !default;
$border-radius-btn-large: 50px !default;
// Cristina: am schimbat aici si s-au modificat inputurile
$margin-bottom: 0 0 10px 0 !default;
$border-radius-small: 3px !default;
$border-radius-base: 4px !default;
$border-radius-large: 6px !default;
$border-radius-extreme: 6px !default;
$border-radius-large-top: $border-radius-large $border-radius-large 0 0 !default;
$border-radius-large-bottom: 0 0 $border-radius-large $border-radius-large !default;
$btn-round-radius: 30px !default;
$height-base: 40px !default;
$font-size-base: 14px !default;
$font-size-xs: 12px !default;
$font-size-small: 12px !default;
$font-size-medium: 16px !default;
$font-size-large: 18px !default;
$font-size-large-navbar: 20px !default;
$font-size-h1: 3.2em !default;
$font-size-h2: 2.6em !default;
$font-size-h3: 1.825em !default;
$font-size-h4: 1.5em !default;
$font-size-h5: 1.25em !default;
$font-size-h6: 0.9em !default;
$font-paragraph: 16px !default;
$font-size-navbar: 16px !default;
$font-size-small: 12px !default;
$font-weight-light: 300 !default;
$font-weight-normal: 400 !default;
$font-weight-semi: 500 !default;
$font-weight-bold: 600 !default;
$line-height-small: 20px !default;
$line-height-general: 1.4em !default;
$line-height: 36px !default;
$line-height-lg: 54px !default;
$border-radius-top: 10px 10px 0 0 !default;
$border-radius-bottom: 0 0 10px 10px !default;
$dropdown-shadow: 0 2px rgba(17, 16, 15, 0.1), 0 2px 10px rgba(17, 16, 15, 0.1);
$general-transition-time: 300ms !default;
$slow-transition-time: 300ms !default;
$dropdown-coordinates: 29px -50px !default;
$fast-transition-time: 150ms !default;
$select-coordinates: 50% -40px !default;
$transition-linear: linear !default;
$transition-bezier: cubic-bezier(0.34, 1.61, 0.7, 1) !default;
$transition-ease: ease 0s;
$navbar-padding-a: 10px 15px;
$navbar-margin-a: 15px 0px;
$padding-social-a: 10px 5px;
$navbar-margin-a-btn: 15px 3px;
$navbar-margin-a-btn-round: 16px 3px;
$navbar-padding-brand: 20px 15px;
$navbar-margin-brand: 5px 0px;
$navbar-margin-brand-icons: 12px auto;
$navbar-margin-btn: 15px 3px;
$height-icon: 64px !default;
$width-icon: 64px !default;
$padding-icon: 12px !default;
$border-radius-icon: 15px !default;
$white-navbar: rgba(#FFFFFF, .96);
$blue-navbar: rgba(#34ACDC, .98);
$azure-navbar: rgba(#5BCAFF, .98);
$green-navbar: rgba(#4CD964, .98);
$orange-navbar: rgba(#FF9500, .98);
$red-navbar: rgba(#FF4C40, .98);
$bg-nude: #f4f3ef !default;
$bg-primary: #8ECFD5 !default;
$bg-info: #7CE4FE !default;
$bg-success: #8EF3C5 !default;
$bg-warning: #FFE28C !default;
$bg-danger: #FF8F5E !default;
$topbar-x: topbar-x !default;
$topbar-back: topbar-back !default;
$bottombar-x: bottombar-x !default;
$bottombar-back: bottombar-back !default;
$transition-linear: linear !default;
$transition-bezier: cubic-bezier(0.34, 1.61, 0.7, 1) !default;
$transition-ease: ease 0s;
$transition-ease-in: ease-in !default;
$transition-ease-out: ease-out !default;
$general-transition-time: 300ms !default;
$slow-transition-time: 370ms !default;
$dropdown-coordinates: 29px -50px !default;
$fast-transition-time: 150ms !default;
$ultra-fast-transition-time: 100ms !default;
$select-coordinates: 50% -40px !default;
$padding-zero: 0px !default;
$sidebar-width: calc(100% - 260px) !default;
$medium-dark-gray: #AAAAAA !default;
//variables used in cards
$card-black-color: #252422 !default;
$card-muted-color: #ccc5b9 !default;
//variables used for sidebar
$sidebar-background-dark-blue: #506367;
$sidebar-background-blue: #b8d8d8 !default;
$sidebar-font-blue: #506568 !default;
$sidebar-subtitle-blue: #7a9e9f !default;
$sidebar-background-green: #d5e5a3 !default;
$sidebar-font-green: #60773d !default;
$sidebar-subtitle-green: #92ac56 !default;
$sidebar-background-yellow: #ffe28c !default;
$sidebar-font-yellow: #b25825 !default;
$sidebar-subtitle-yellow: #d88715 !default;
$sidebar-background-brown: #d6c1ab !default;
$sidebar-font-brown: #75442e !default;
$sidebar-subtitle-brown: #a47e65 !default;
$sidebar-background-purple: #baa9ba !default;
$sidebar-font-purple: #3a283d !default;
$sidebar-subtitle-purple: #5a283d !default;
$sidebar-background-orange: #ff8f5e !default;
$sidebar-font-orange: #772510 !default;
$sidebar-subtitle-orange: #e95e37 !default;

6
src/assets/css/my.scss
View File

@ -0,0 +1,6 @@
@import "@/assets/css/_darkvariables.scss";
body {
background: lighten($body-bg, 5%) !default;
}

11
src/components/manageservices/view-dashboard.vue
View File

@ -83,7 +83,16 @@ export default {
},
data() {
return {
// width/height get this for refresh charts
// width/height get this for refresh charts #232C3A --background-primary: #36393f;
/*
--background-secondary: #2f3136;
--background-secondary-alt: #292b2f;
#adbac7
#363D3F
*/
stats_stats_imagescontainers:0,
stats_stats_container:0,
stats_stats_volume:0,

1
src/components/mynetwork/AdhocView.vue
View File

@ -273,6 +273,7 @@ export default {
this.fontsize = store.getters['pipelineLLO/getmyCmfontSize']
document.documentElement.style.setProperty('--myCmfontSize', this.fontsize+'px')
this.$refs.myCm.codemirror.refresh()
//console.log(document.documentElement.style)
},
viewplus(){
this.fontsize = store.getters['pipelineLLO/getmyCmfontSize']

11
src/config/dark.scss
View File

@ -0,0 +1,11 @@
// Define variable defaults
$body-bg: #000;
$body-color: #111;
@import 'bootstrap/dist/css/bootstrap.css';
@import 'bootstrap-vue/dist/bootstrap-vue.css';
// Then import Bootstrap an BootstrapVue SCSS files (order is important)
//@import 'node_modules/bootstrap/scss/bootstrap.scss';
//@import 'node_modules/bootstrap-vue/src/index.scss'

13
src/store/modules/create_pipelineLLO.js
View File

@ -10,10 +10,14 @@ export default {
socketStatus:'close',
status: {},
statusswarmlab: {},
theme: {},
myCmfontSize: 11,
config: {}
},
getters: {
getmytheme (state, container) {
return state.theme
},
getmyCmfontSize (state, container) {
return state.myCmfontSize
},
@ -37,6 +41,11 @@ export default {
}
},
mutations: {
set_mytheme (state, data) {
console.log(data)
console.log('data')
state.theme=data;
},
set_myCmfontSize (state, data) {
state.myCmfontSize=data;
},
@ -63,6 +72,10 @@ export default {
}
},
actions: {
setmytheme({commit}, value) {
console.log("container "+value)
commit('set_mytheme', value.instance)
},
setmyCmfontSize({commit}, value) {
//console.log("container "+value)
commit('set_myCmfontSize', value.size)

Write Preview
Loading…
Cancel
Save