@cloudron/pankow 3.6.1 → 3.6.3

package/components/Button.vue

@@ -71,7 +71,6 @@ function onClick(event) {
   user-select: none;
   white-space: nowrap;
   text-align: center;
-  border: none;
   padding: var(--pankow-input-vertial-padding) max(12px, var(--pankow-input-horizontal-padding));
   border-radius: var(--pankow-border-radius);
   text-decoration: none;

package/components/DirectoryView.vue

@@ -47,12 +47,12 @@
           :fallbackIcon="fallbackIcon"
           :item="item"
           :show-owner="showOwner"
-          :show-share="showShare"
           :show-extract="showExtract"
           :show-size="showSize"
           :show-star="showStar"
           :show-modified="showModified"
           :rename-handler="renameHandler"
+          :share-indicator-property="shareIndicatorProperty"
           :select-handler="onSelectAndFocus"
           :drop-handler="onDrop"
           :can-drop-handler="onCanDropHandler"
@@ -145,14 +145,18 @@ export default {
       default: true
     },
     showShare: {
-      // if String its the name of the property for existing share indicator
-      type: [ Boolean, String ],
+      type: Boolean,
       default: false
     },
     showModified: {
       type: Boolean,
       default: false
     },
+    shareIndicatorProperty: {
+      // the name of the property for existing share indicator
+      type: String,
+      default: '',
+    },
     editable: {
       type: Boolean,
       default: true

package/components/DirectoryViewListItem.vue

@@ -13,7 +13,7 @@
 
       <div v-if="visible" class="col icon">
         <img :src="item.previewUrl || item.icon" ref="iconImage" @error="iconError($event)"/>
-        <i v-show="typeof showShare === 'string' && item[showShare]" class="fa-solid fa-share-nodes is-shared"></i>
+        <i v-show="shareIndicatorProperty !== '' && !!item[shareIndicatorProperty]" class="fa-solid fa-share-nodes is-shared"></i>
       </div>
 
       <div v-if="visible && !rename" class="col label">
@@ -68,11 +68,6 @@ export default {
       type: Boolean,
       default: false
     },
-    showShare: {
-      // if String its the name of the property for existing share indicator
-      type: [ Boolean, String ],
-      default: false
-    },
     showSize: {
       type: Boolean,
       default: false
@@ -85,6 +80,10 @@ export default {
       type: Boolean,
       default: false
     },
+    shareIndicatorProperty: {
+      type: String,
+      default: '',
+    },
     fallbackIcon: String,
     renameHandler: {
       type: Function,
@@ -297,7 +296,6 @@ export default {
 
 .star-icon {
   color: #ffcb00;
-  padding: 10px;
   visibility: hidden;
   cursor: pointer;
 }

package/components/ProgressBar.vue

@@ -15,6 +15,10 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
+  showTrack: {
+    type: Boolean,
+    default: true,
+  },
   busy: {
     type: Boolean,
     default: false,
@@ -33,10 +37,12 @@ const normalizedValue = computed(() => {
 <template>
   <div class="pankow-progress-bar">
     <div class="pankow-progress-bar-label" v-show="showLabel"><slot>{{ value + ' %' }}</slot></div>
-    <div v-if="mode !== 'indeterminate'" class="pankow-progress-bar-filled" :style="{ width: normalizedValue+'%', height: slim ? '2px' : '6px' }">
-      <div v-if="busy" class="pankow-progress-bar-glow" :style="{ height: slim ? '2px' : '6px' }"></div>
+    <div :class="{ 'pankow-progress-bar-background': showTrack }">
+      <div v-if="mode !== 'indeterminate'" class="pankow-progress-bar-filled" :style="{ width: normalizedValue+'%', height: slim ? '2px' : '6px' }">
+        <div v-if="busy" class="pankow-progress-bar-glow" :style="{ height: slim ? '2px' : '6px' }"></div>
+      </div>
+      <div v-else class="pankow-progress-bar-indeterminate" :style="{ height: slim ? '2px' : '6px' }"></div>
     </div>
-    <div v-else class="pankow-progress-bar-indeterminate" :style="{ height: slim ? '2px' : '6px' }"></div>
   </div>
 </template>
 
@@ -54,6 +60,17 @@ const normalizedValue = computed(() => {
   padding-bottom: 3px;
 }
 
+.pankow-progress-bar-background {
+  border-radius: var(--pankow-border-radius);
+  background-color: var(--pankow-color-light-dark);
+}
+
+@media (prefers-color-scheme: dark) {
+  .pankow-progress-bar-background {
+    background-color: var(--pankow-input-background-color);
+  }
+}
+
 .pankow-progress-bar-filled {
   position: relative;
   background-color: var(--pankow-color-primary);
@@ -89,7 +106,6 @@ const normalizedValue = computed(() => {
   height: 6px;
   display: block;
   position: relative;
-  background: rgba(255, 255, 255, 0.15);
   overflow: hidden;
   border-radius: calc(var(--pankow-border-radius) / 1.5);
 }

package/components/TableView.vue

@@ -114,7 +114,7 @@ onMounted(() => {
         <tbody>
           <tr v-if="busy">
             <td :colspan="Object.keys(columns).length" style="text-align: center; padding: 20px;">
-              <ProgressBar mode="indeterminate" :show-label="false" :slim="true" v-show="finalBusy"/>
+              <ProgressBar mode="indeterminate" :show-track="false" :show-label="false" :slim="true" v-show="finalBusy"/>
             </td>
           </tr>
           <tr v-else-if="!busy && sortedItems.length === 0">

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloudron/pankow",
   "private": false,
-  "version": "3.6.1",
+  "version": "3.6.3",
   "description": "",
   "main": "index.js",
   "types": "types/index.d.ts",