renusify 2.0.1 → 2.0.2

package/components/form/text-editor/style.scss

@@ -1,10 +1,20 @@
 @import '../../../style/include';
 
 .#{$prefix}text-editor {
+  background-color: var(--color-sheet-container);
+  margin-top: 20px;
 
+  &:not(.input-tile) {
+    border-radius: map-get($borders, 'xl');
 
-  .editor-content {
+    .editor-content {
+      border-radius: map-get($borders, 'lg');
+    }
+  }
+
+  .editor-content, .input-control {
     border: 1px solid var(--color-sheet-low);
+    background-color: var(--color-sheet-container-low);
   }
 
   @include typography($headings, 'body-2');

package/components/form/timepicker/index.vue

@@ -22,7 +22,7 @@
         :closebtn="false"
         :no-overlay="noOverlay"
     >
-      <r-card class="pt-3 pb-1">
+      <div class="pt-3 pb-1">
         <timepicker
             class="mb-2 mx-3"
             :disableTime="disableTime"
@@ -34,7 +34,7 @@
           <r-btn
               class="color-success-text"
               outlined
-              @click="show_modal = false,emit()"
+              @click.prevent="show_modal = false,emit()"
           >
             {{ $t('accept', 'renusify') }}
           </r-btn
@@ -42,13 +42,13 @@
           <r-btn
               class="color-warning-text"
               outlined
-              @click="(show_modal = false), (lazyValue = null),emit()"
+              @click.prevent="(show_modal = false), (lazyValue = null),emit()"
           >
             {{ $t('cancel', 'renusify') }}
           </r-btn
           >
         </div>
-      </r-card>
+      </div>
     </r-modal>
   </div>
 </template>

package/components/form/timepicker/range.vue

@@ -21,7 +21,7 @@
         :closebtn="false"
         :no-overlay="noOverlay"
     >
-      <r-card class="pt-3">
+      <div class="pt-3">
         <div class="px-2 title">
           <span>{{ $t('from', 'renusify') }}: </span>
           <span v-if="lazyValue[0]">{{ lazyValue[0] }} - </span>
@@ -46,7 +46,7 @@
         <r-btn
             class="color-success-text ml-7 mr-9 mb-3 mt-3"
             outlined
-            @click="accept"
+            @click.prevent="accept"
         >
           {{ $t('accept', 'renusify') }}
         </r-btn
@@ -54,12 +54,12 @@
         <r-btn
             class="color-warning-text mr-7 ml-4 mb-3 mt-3"
             outlined
-            @click="(show_modal = false), (lazyValue = []),emit()"
+            @click.prevent="(show_modal = false), (lazyValue = []),emit()"
         >
           {{ $t('cancel', 'renusify') }}
         </r-btn
         >
-      </r-card>
+      </div>
     </r-modal>
   </div>
 </template>

package/components/form/timepicker/timepicker.vue

@@ -10,7 +10,7 @@
             ref="number"
             :class="['number' + i,{'number-disabled':disableTime(parseInt(i),show,hour,min,sec)}]"
             class="number"
-            @click="set(i)"
+            @click.prevent="set(i)"
         >
           {{ num }}
         </div>
@@ -20,14 +20,14 @@
       <div
           :class="{ 'meridiem-active': meridiem === 'AM' }"
           class="time-meridiem overflow-hidden"
-          @click="(meridiem = 'AM'),emit()"
+          @click.prevent="(meridiem = 'AM'),emit()"
       >
         {{ $t('timepicker_am', 'renusify') }}
       </div>
       <div
           :class="{ 'meridiem-active': meridiem === 'PM' }"
           class="time-meridiem overflow-hidden"
-          @click="(meridiem = 'PM'),emit()"
+          @click.prevent="(meridiem = 'PM'),emit()"
       >
         {{ $t('timepicker_pm', 'renusify') }}
       </div>

package/components/formCreator/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <r-card v-if="!autoSend" :class="$r.prefix+'form-creator'" class="overflow-auto">
+  <div v-if="!autoSend" :class="$r.prefix+'form-creator'" class="overflow-auto">
     <r-container>
       <h1 v-if="title" class="title-1">{{ title }}</h1>
       <r-form ref="form" v-model="valid" @submit.prevent="save">
@@ -33,7 +33,7 @@
         </div>
       </r-form>
     </r-container>
-  </r-card>
+  </div>
 </template>
 
 <script>

package/components/infinite/index.vue

@@ -5,11 +5,11 @@
                 <r-col class="col-auto">
                     <h3 class="title-1 px-2">{{ title }}</h3>
                 </r-col>
-                <r-col class="col-auto">
-                    <r-switch-input
-                        label="live"
-                        v-model="live"
-                    ></r-switch-input>
+                <r-col class="col-auto px-1">
+                  <r-switch-input
+                      label="live"
+                      v-model="live"
+                  ></r-switch-input>
                 </r-col>
             </r-row>
         </r-container>

package/components/map/index.vue

@@ -9,7 +9,6 @@
       <r-search-box
           :label="$t('search','renusify')"
           :notFoundMsg="$t('map_not_found','renusify')"
-          inputControlClass="sheet"
           no-overlay
           query="q"
           url="https://nominatim.openstreetmap.org/search.php?polygon_geojson=0&accept-language=fa&countrycodes=IR&format=jsonv2"

package/components/map/route.vue

@@ -1,5 +1,5 @@
 <template>
-  <r-container :class="`${$r.prefix}map-route sheet sheet-tile pa-0`">
+  <r-container :class="`${$r.prefix}map-route pa-0`">
     <r-row class="no-gutters">
       <r-col class="col-12 sm-9">
         <r-map :dark-mode="darkMode" :height="height" :model-value="center" :zoom="15" search-box
@@ -569,6 +569,8 @@ export default {
 
 .#{$prefix}map-route {
   display: flex;
+  background-color: var(--color-sheet-container);
+  color: var(--color-on-sheet);
 
   .route-point {
     border: 1px solid #cdcaca;

package/components/menu/index.vue

@@ -23,7 +23,7 @@
         <r-card>
           <div class="dropdown-menu-item pa-2" v-for="(item,i) in list" :key="i"
                :class="{'menu-selected':selected===item[value]}"
-               @click="emit(item)">
+               @click.prevent="emit(item)">
             <slot :item="item">
               {{ item }}
             </slot>

package/components/modal/style.scss

@@ -26,6 +26,8 @@
 
   .modal-content {
     border: 1px solid var(--color-sheet-container-low);
+    background-color: var(--color-sheet);
+    color: var(--color-on-sheet)
   }
 
 

package/components/notify/index.vue

@@ -8,8 +8,9 @@
         'flex-column-reverse':!top,
         'flex-column':top,
     }" :style="{ 'min-width': width }">
-        <r-btn v-if="list.length>0" @click="handleClose(list[list.length-1].on_close_all)" class="color-error" rounded>
-            {{$t('clear','renusify')}}
+        <r-btn v-if="list.length>0" class="color-error" rounded
+               @click.prevent="handleClose(list[list.length-1].on_close_all)">
+          {{ $t('clear', 'renusify') }}
         </r-btn>
         <notification v-for="item in list" :key="item.id"
                       :pos="left?'left':'right'"

package/components/searchBox/index.vue

@@ -68,7 +68,7 @@
         <div v-if="open" class="search-shadow"></div>
       </transition>
     </template>
-    <r-btn v-else class="mt-5" icon @click="show = !show">
+    <r-btn v-else class="mt-5" icon @click.prevent="show = !show">
       <r-icon v-html="$r.icons.search"></r-icon>
     </r-btn>
   </div>
@@ -194,10 +194,6 @@ export default {
     color: var(--color-on-sheet);
     position: relative;
     border-radius: map-get($borders, "md");
-
-    .sheet {
-      transition: 0.5s all ease;
-    }
   }
 
 

package/components/slider/index.vue

@@ -10,10 +10,10 @@
                 'right':$r.rtl?next:prev
             }">
 
-    <r-btn v-if="arrow" icon @click="prev" class="btn-left-arrow">
+    <r-btn v-if="arrow" class="btn-left-arrow" icon @click.prevent="prev">
       <r-icon v-html="$r.icons.chevron_left"></r-icon>
     </r-btn>
-    <r-btn v-if="arrow" icon @click="next" class="btn-right-arrow">
+    <r-btn v-if="arrow" class="btn-right-arrow" icon @click.prevent="next">
       <r-icon v-html="$r.icons.chevron_right"></r-icon>
     </r-btn>
     <transition :appear="appear" :mode="mode" :name="direction">

package/components/table/crud/header.vue

@@ -1,20 +1,20 @@
 <template>
-    <div class="sheet sheet-tile">
-        <r-container class="container-fluid">
-            <r-row class="h-start h-space-between">
-                <r-col class="col-auto">
-                    <r-btn @click.prevent="newItem"
-                           v-if="!disableAdd"
-                           class="color-success-text"
-                           outlined
-                           rounded>{{$t('new','renusify')}}
-                    </r-btn>
-                </r-col>
+    <div>
+      <r-container class="container-fluid">
+        <r-row class="h-start h-space-between">
+          <r-col class="col-auto">
+            <r-btn @click.prevent="newItem"
+                   v-if="!disableAdd"
+                   class="color-success-text"
+                   outlined
+                   rounded>{{ $t('new', 'renusify') }}
+            </r-btn>
+          </r-col>
                 <r-col class="col-auto">
                     <template v-if="mcud">
-                        <r-btn icon class="color-error mx-1" @click="showConfirm=true">
-                            <r-icon v-html="$r.icons.delete"></r-icon>
-                        </r-btn>
+                      <r-btn class="color-error mx-1" icon @click.prevent="showConfirm=true">
+                        <r-icon v-html="$r.icons.delete"></r-icon>
+                      </r-btn>
                         <r-btn icon class="color-success mx-1" @click.prevent="$emit('copy',true)">
                             <r-icon v-html="$r.icons.copy"></r-icon>
                         </r-btn>
@@ -121,7 +121,7 @@
                             </r-col>
                           <r-col class="col-6 md-8">
                             <r-select-input v-model="item.advance.search" :label="item.text" :items="item.option.items"
-                                            disableSearch multiple tags></r-select-input>
+                                            justValue multiple tags></r-select-input>
                           </r-col>
                           <r-col class="col-1">
                             <r-btn class="color-error" icon @click.prevent="del(i)">

package/components/table/crud/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <r-card :class="`${$r.prefix}table-manage`">
+  <div :class="`${$r.prefix}table-manage`">
     <r-modal bottom full-width v-model="showForm">
       <slot name="form" :autoSend="autoSend"
             :method="method"
@@ -19,7 +19,7 @@
       </slot>
     </r-modal>
     <r-modal v-model="showCopy" bottom full-width>
-      <r-card class="pa-3">
+      <div class="pa-3">
         <div :key="key" class="mb-5"
              v-for="(item,key) in table.option">
           <template v-if="item['formInput']!==false">
@@ -42,9 +42,12 @@
                   <r-number-input v-if="copyItem['t']==='copy'" :label="$t('count_copy','renusify')"
                                   v-model="copyItem['c']"></r-number-input>
                 </span>
-          <r-btn class="color-success" :loading="loading" @click="copyAll()">{{ $t('send', 'renusify') }}</r-btn>
+          <r-btn :loading="loading" class="color-success" @click.prevent="copyAll()">{{
+              $t('send', 'renusify')
+            }}
+          </r-btn>
         </div>
-      </r-card>
+      </div>
     </r-modal>
     <manage-header v-model="search" @update:modelValue="searching()"
                    :header-table="table.headers"
@@ -154,7 +157,7 @@
         v-on:accept="accept"
         v-on:cancel="showConfirm = false"
     />
-  </r-card>
+  </div>
 </template>
 
 <script>

package/components/table/index.vue

@@ -71,7 +71,6 @@
     </div>
   </div>
   <r-modal v-if="editable" v-model="showModal">
-    <r-card>
       <r-container
           v-sortable="{
             items: cols,
@@ -100,7 +99,6 @@
           </r-col>
         </r-row>
       </r-container>
-    </r-card>
   </r-modal>
 </template>
 

package/components/tabs/index.vue

@@ -13,7 +13,7 @@
           :disabled="tab.disabled || false"
           class="tabs__item"
           type="button"
-          @click="handleClick(tab.value)"
+          @click.prevent="handleClick(tab.value)"
       >
         <slot :item="tab">{{ tab.title }}</slot>
       </button>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "renusify",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "Vue3 Framework",
   "keywords": [
     "vuejs",

package/tools/helper.js

@@ -296,7 +296,7 @@ export function randomString(len, an) {
         min = an === "a" ? 10 : 0,
         max = an === "n" ? 10 : 62;
     for (; i++ < len;) {
-        const r = Math.random() * (max - min) + min << 0;
+        let r = Math.random() * (max - min) + min << 0;
         str += String.fromCharCode(r += r > 9 ? r < 36 ? 55 : 61 : 48);
     }
     return str;
@@ -390,11 +390,12 @@ export function changeColor(vars) {
     }
     let style = document.createElement('style');
     style.setAttribute("c", "color");
+    style.setAttribute("type", "text/css");
     head.appendChild(style);
     let css = ':root{';
     for (let k in vars) {
-        css += k + ':' + vars[k] + ';'
+        css += '--color-' + k + ':' + vars[k] + ';'
     }
     css += '}'
     style.appendChild(document.createTextNode(css));
-}
+}