@saooti/octopus-sdk 1.0.0 → 29.0.2

package/src/api/comments.ts

@@ -1,6 +1,8 @@
+import { StoreState } from "@/store/typeAppStore";
+
 const octopusApi = require('@saooti/octopus-api');
 export default {
-  postComment(store: any, parameters: any) {
+  postComment(store: StoreState, parameters: Comment): void {
     console.log(store);
     octopusApi.postComment(parameters);
   },

package/src/api/emissions.ts

@@ -1,6 +1,9 @@
+import { FetchParam } from "@/store/class/fetchParam";
+import { StoreState } from "@/store/typeAppStore";
+
 const octopusApi = require('@saooti/octopus-api');
-export default {
-  fetchEmissionsAdmin(store: any, parameters: any) {
+export default{
+  fetchEmissionsAdmin(store: StoreState, parameters: FetchParam): void {
     console.log(store);
     octopusApi.fetchEmissions(parameters);
   },

package/src/api/initialize.ts

@@ -1,5 +1,6 @@
-export default {
-  checkToken(token: any) {
+export default{
+  checkToken(token: string): boolean {
     console.log(token);
+    return true;
   },
 };

package/src/api/podcasts.ts

@@ -1,7 +1,10 @@
+import { FetchParam } from "@/store/class/fetchParam";
+import { StoreState } from "@/store/typeAppStore";
+
 const octopusApi = require('@saooti/octopus-api');
 export default {
-  fetchPodcastsAdmin(store: any, parameters: any) {
+  async fetchPodcastsAdmin(store: StoreState, parameters: FetchParam): Promise<any> {
     console.log(store);
-    octopusApi.fetchPodcasts(parameters);
+    return await octopusApi.fetchPodcasts(parameters);
   },
 };

package/src/api/profile.ts

@@ -1,5 +1,7 @@
-export default {
-  fetchOrganisationAttibutes(store: any, organisationId: any) {
+import { StoreState } from "@/store/typeAppStore";
+
+export default{
+  fetchOrganisationAttibutes(store: StoreState, organisationId: string): any {
     return new Promise(resolve => {
       console.log(store, organisationId);
       resolve({});

package/src/api/studio.ts

@@ -1 +1,12 @@
-export default {} as any;
+import { StoreState } from "@/store/typeAppStore";
+
+export default{
+    deleteConference(store?: StoreState,fetchConference?: string): any{
+        console.log(store, fetchConference);
+        return;
+    },
+    getConference(store?: StoreState,fetchConference?: string): any{
+        console.log(store, fetchConference);
+        return {};
+    },
+};

package/src/assets/bootstrap-diff.scss

@@ -0,0 +1,265 @@
+// Bootstrap styles overload
+.octopus-app{
+    .btn-group {
+        > .btn:not(:first-child),
+        > .btn-group:not(:first-child) {
+          margin-left: 5px;
+          display: flex;
+        }
+    }
+    .btn{
+        font-size:.7rem;
+        border-radius: 50px;
+        background: $octopus-light-secondary-color; 
+        transition: background .2s, border .2s, box-shadow .2s, color .2s;
+        text-decoration: none !important;
+        &:hover,
+        &:focus,
+        &:active,
+        &.active {
+          outline: none !important;
+          box-shadow: none;
+        }
+        &:hover{
+          background: rgba($octopus-primary-color, 0.3) ;
+        }
+        // Button Primary
+        &.btn-primary {
+            background: $octopus-third-color;
+            background: -moz-linear-gradient(-45deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            background: -webkit-gradient(left top, right bottom, color-stop(0%, $octopus-third-color), color-stop(100%, $octopus-primary-color));
+            background: -webkit-linear-gradient(-45deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            background: -o-linear-gradient(-45deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            background: -ms-linear-gradient(-45deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            background: linear-gradient(135deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6d91f', endColorstr='#50b685', GradientType=1 );
+            border-radius: 50px;
+            height: auto;
+            border: 0;
+            color: white !important;
+            &:focus,
+            &:hover {
+            background:$octopus-third-color;
+            background: -moz-linear-gradient(-45deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            background: -webkit-gradient(left top, right bottom, color-stop(0%, $octopus-third-color), color-stop(100%, $octopus-primary-color));
+            background: -webkit-linear-gradient(-45deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            background: -o-linear-gradient(-45deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            background: -ms-linear-gradient(-45deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            background: linear-gradient(135deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6d91f', endColorstr='#4fcf91', GradientType=1 );
+            border: 0;
+            }
+            &:active,
+            &.active {
+            background: darken($octopus-primary-color, 4%);
+            border-color: darken($octopus-primary-color, 7%);
+            }
+        }
+        &.btn-secondary{
+            border-width: 0;
+        }
+        &.btn-light{
+            color: $octopus-primary-color;
+            background: transparent;
+        }
+        &.btn-auth{
+            &:focus,
+            &:hover {
+            background:$octopus-third-color;
+            background: -moz-linear-gradient(-45deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            background: -webkit-gradient(left top, right bottom, color-stop(0%, $octopus-third-color), color-stop(100%, $octopus-primary-color));
+            background: -webkit-linear-gradient(-45deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            background: -o-linear-gradient(-45deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            background: -ms-linear-gradient(-45deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            background: linear-gradient(135deg, $octopus-third-color 0%, $octopus-primary-color 100%);
+            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6d91f', endColorstr='#4fcf91', GradientType=1 );
+            border: 0;
+            }
+            &:active,
+            &.active {
+            background: darken($octopus-primary-color, 4%);
+            border-color: darken($octopus-primary-color, 7%);
+            }
+        }
+        //Button disable halo after click
+        &.btn-underline{
+            background: none;
+            padding: 0;
+            margin: 0 2rem 1rem 0;
+            border-radius: 0;
+            @media (max-width: 600px) {
+            margin: 0 1rem 1rem 0;
+            font-size: 0.8em;
+            }
+        }
+    
+        &.btn-arrow {
+            border-radius: 50px;
+            margin: 0.2rem;
+            width: 1.8rem;
+            height: 1.8rem;
+            background: $octopus-secondary-color;
+            padding: 0;
+            &:hover {
+            border: 0;
+            background: $octopus-secondary-color;
+            }
+        }
+    
+        &.btn-link {
+            background: $octopus-secondary-color;
+            color: $octopus-primary-color;
+            font-weight: bold;
+            margin: 2rem;
+            width: fit-content;
+            align-self: center;
+            &:focus,
+            &:hover,
+            &:active,
+            &.active {
+            background: darken($octopus-secondary-color, 5%);
+            color: $octopus-primary-color;
+            }
+            @media (max-width: 500px){
+            margin: 0.3rem;
+            }
+        }
+    
+        &.btn-linkPlus {
+            padding: 8px 16px;
+            font-size: 0.8rem;
+            border-radius: 50px;
+            background-color: #ddd;
+            color: #000;
+            box-shadow: none;
+            display: flex;
+            .saooti-plus{
+            line-height: 1.5 !important;
+            margin-left: 5px; 
+            }
+            &:focus,
+            &:hover,
+            &:active,
+            &.active {
+            background: $octopus-primary-color;
+            color: white;
+            border: 1px solid $octopus-primary-color;
+            }
+        }
+    
+        &.btn-more{
+            background: $octopus-primary-color;
+            color: $octopus-background;
+            width: 2rem;
+            height: 2rem;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            border-radius: 50px;
+            margin: 1rem;
+        }
+    
+        &.btn-bigRound{
+            border: 1px #aaa solid;
+            background: none;
+            font-size: 3rem !important;
+            color: #666;
+            border-radius: 50%;
+            padding: 1rem;
+            margin-right: 1rem;
+            width: 5rem;
+            height: 5rem;
+        }
+    
+        &.admin-button {
+            padding: 0.3rem;
+            height: 1.8rem;
+            width: 1.8rem;
+            font-size: 1rem;
+            display: inline-flex;
+            align-items: center;
+        }
+    }
+
+    .share-btn {
+        font-size: 1.3rem;
+        width: 2.5rem;
+        height: 2.5rem !important;
+        padding: 0.5rem;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+    .btn-rss {
+        background: #ddd !important;
+        &:hover {
+            border: 0;
+            background: #ccc !important;
+        }
+    }
+    .btn-facebook {
+        background: #d8dfea !important;
+        color: #3b5998 !important;
+        &:hover {
+            background: #afbdd4 !important;
+        }
+    }
+    .btn-twitter {
+        background: #d2ecfc !important;
+        color: #1da1f2 !important;
+        &:hover {
+            background: #bbe3fb !important;
+        }
+    }
+    .btn-linkedin {
+        background: #0077b550 !important;
+        color: #0077b5 !important;
+        &:hover {
+            background: #00a0dc !important;
+        }
+    }
+    .btn-whatsapp {
+        background: #25d36645 !important;
+        color: #25D366 !important;
+        &:hover {
+            background: #25d36563 !important;
+        }
+    }
+
+    .custom-control-label {
+        //border: 1px solid #ddd;
+        border-radius: 5px;
+    }
+    .dropdown-toggle-no-caret::after{
+        display: none;
+      }    
+    .dropdown-menu {
+        padding: $dropdown-padding-y 0.5rem;
+        @media (max-width: 450px) {
+            min-width: 15rem;
+        } 
+    }
+    .dropdown-item {
+        font-size: 0.8rem;
+        @media (max-width: 450px) {
+            padding: 0.25rem 0;
+        } 
+    }
+    .dropdown-header {
+        @media (max-width: 450px) {
+            margin: 1rem 0 0;
+        } 
+    }   
+
+    .modal-header { 
+        @media (max-width: 450px) {
+            padding: 1rem 0;
+        } 
+    }
+    .accordion-button {
+        padding: 0.5rem;
+    }
+}
+
+	

package/src/assets/form.scss

@@ -29,6 +29,10 @@
 	width: 100%;
 }
 
+.form-check-input{
+  margin-right: 5px;
+}
+
 .basic-select{
   background: white;
   min-height: 40px;
@@ -77,4 +81,23 @@ background: $octopus-primary-color;
 .theme-saooti .vdatetime-time-picker__item--selected,
 .theme-saooti .vdatetime-popup__actions__button {
 color: $octopus-primary-color;
+}
+
+//Navigation Bar
+.nav{
+	border-bottom: 0.05rem solid #ddd;
+	.nav-item{
+		flex-grow: 1;
+		text-align: center;
+		a {
+			color: black;
+		}
+		.nav-link{
+			border-bottom: 0.1rem solid transparent;
+		}
+		.active{
+		  border-bottom-color: $octopus-primary-color;
+    	color: $octopus-primary-color;
+		}
+	}
 }

package/src/assets/general.scss

@@ -73,12 +73,12 @@ h1 {
   border-width: 1px;;
 }
 
-.pr-5 {
+.pe-5 {
 	@media (max-width: 960px) {
 		padding-right: 5px !important;
 	}
 }
-.pl-5 {
+.ps-5 {
 	@media (max-width: 960px) {
 		padding-left: 5px !important;
 	}
@@ -127,8 +127,9 @@ h1 {
   color: $octopus-primary-color;
 }
 
-a:hover{
+a, a:hover{
   text-decoration: none;
+  outline-width: 0;
 }
 
 a.linkHover.router-link-exact-active.router-link-active {
@@ -230,10 +231,14 @@ a.linkHover:hover{
 
 
 .comma {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
   > a {
     text-transform: capitalize;
     &:after {
       content: ", ";
+      margin-right: 0.2rem;
     }
     &:last-child {
       &:after {
@@ -267,23 +272,6 @@ a.linkHover:hover{
 .p-01{
   padding: 0.1rem !important;
 }
-.comment-item-container{
-  .status-Pending {
-    background: #eb7d22;
-  }
-  .status-Invalid {
-    background: #d40303;
-  }
-  .status-Valid {
-    background: $octopus-primary-color;
-  }
-
-  .status-Valid, .status-Invalid, .status-Pending {
-    width: 14px;
-    height: 14px;
-    border-radius: 50%;
-  }
-}
 .html-wysiwyg-content{
   h3,h4{
     margin: 0 0 0.5em 0 !important;
@@ -300,6 +288,45 @@ a.linkHover:hover{
     margin-bottom: 0.2rem;
   }
 }
+.planned-bg {
+  background: #f09653;
+}
+.pending-bg {
+  background: #f1643e;
+}
+.recording-bg {
+  background: #f34a4a;
+}
+.error-bg {
+  background: #ff0000;
+}
+.debriefing-bg {
+  background: #6ec66e;
+}
+.done-bg {
+  background: #679fe9;
+}
+.publishing-bg {
+  background: #7d7d7d;
+}
+.planned-shadow {
+  box-shadow: 0px 12px 48px 6px rgba(240, 151, 83, 0.2);
+}
+.pending-shadow {
+  box-shadow: 0px 12px 48px 6px rgba(241, 101, 62, 0.2);
+}
+.recording-shadow {
+  box-shadow: 0px 12px 48px 6px rgba(243, 74, 74, 0.2);
+}
+.debriefing-shadow {
+  box-shadow: 0px 12px 48px 6px rgba(110, 198, 110, 0.2);
+}
+.publishing-shadow {
+  box-shadow: 0px 12px 48px 6px rgba(125, 125, 125, 0.2);
+}
+.error-shadow {
+  box-shadow: 0px 12px 48px 6px rgba(255, 0, 0, 0.2);
+}
 @media (max-width: 450px) {
   .module-box .img-box {
     margin: 0.5rem auto 2rem !important;

package/src/assets/modal.scss

@@ -1,14 +1,13 @@
 //Modal
-.modal-mask {
-	position: fixed;
-	z-index: 9998;
-	top: 0;
-	left: 0;
-	width: 100%;
-	height: 100%;
-	background-color: rgba(0, 0, 0, .5);
-	display: table;
-	transition: opacity .3s ease;
+.modal{
+	display: block;
+}
+.modal-backdrop{
+
+}
+.modal-backdrop {
+	opacity: 0.5;
+	z-index: 0;
 }
   
 .modal-wrapper {

package/src/assets/multiselect.scss

@@ -1,6 +1,24 @@
 /* Added styles */
 @import '../sass/_variables.scss';
 
+.saooti-arrow_down-margin {
+    margin: 3px 0 0;
+}
+.default-multiselect-width {
+    width: 100%;
+}
+.default-multiselect-width .basic-select {
+    width: auto;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    text-indent: 1px;
+    text-overflow: '';
+    font-size: 1rem;
+    @media (max-width: 450px) {
+        background: #eee !important;
+        width: 98%;
+    }
+}
 .multiselect-hide-arrow {
 	.multiselect__tags {
 		background: none;
@@ -116,7 +134,6 @@ fieldset[disabled] .multiselect {
     top: 1px;
     width: 48px;
     height: 35px;
-    background: #fff;
     display: block;
 }
 
@@ -131,7 +148,7 @@ fieldset[disabled] .multiselect {
     height: 16px;
     border-radius: 100%;
     border: 2px solid transparent;
-    border-top-color: #f8f9fa;
+    border-top-color: #000000;
     box-shadow: 0 0 0 1px transparent;
 }
 

package/src/assets/octopus-library.scss

@@ -1,9 +1,21 @@
-//@import 'node_modules/bootstrap/scss/bootstrap';
 @import '../sass/_variables.scss';
-@import './bootstrap_scss/bootstrap.scss';
-@import 'node_modules/bootstrap-vue/src/index.scss';
+// Bottstrap variable overload
+$gray-800: #282828 !default;
+$border-width:                0.1rem !default;
+$h1-font-size:                $font-size-base * 2.5 !default;
+$h2-font-size:                $font-size-base * 1.3 !default;
+$h3-font-size:                $font-size-base * 1.25 !default;
+$h4-font-size:                $font-size-base * 1.1 !default;
+$h5-font-size:                $font-size-base * 0.9 !default;
+$h6-font-size:                $font-size-base * 0.7 !default;
+$breadcrumb-bg:                     #f3f3f3 !default;
+$breadcrumb-border-radius:          2rem !default;
+@import 'node_modules/bootstrap/scss/bootstrap.scss';
+@import './bootstrap-diff.scss';
+/* @import 'node_modules/bootstrap-vue-3/dist/bootstrap-vue-3.css'; */
 @import './general.scss';
 @import './form.scss';
 @import './multiselect.scss';
 @import './transition.scss';
-@import './modal.scss';
+@import './modal.scss';
+@import './share.scss';