dashboard-shell-shell 3.0.5-test.3 → 3.0.5-test.30

package/assets/icons/iconfont.css

@@ -213,4 +213,7 @@ src: url('iconfont.woff2?t=1753758703852') format('woff2'),
 }
 .icon-mingming:before {
   content: "\e62c";
-}
+}
+.icon-default:before {
+  content: "\e61c";
+}

package/assets/styles/all.scss

@@ -1,3 +1,21 @@
+/* Chrome, Edge, Safari */
+input[type="password"]::-webkit-textfield-decoration-container,
+input[type="password"]::-webkit-inner-spin-button,
+input[type="password"]::-webkit-clear-button {
+    display: none !important;
+}
+
+/* Edge / IE */
+input[type="password"]::-ms-reveal {
+    display: none !important;
+}
+
+/* Firefox */
+input[type="password"]::-moz-reveal {
+    display: none !important;
+}
+
+
 .info-tab-title{
   font-size: 14px;
   line-height: 19px;
@@ -56,7 +74,9 @@ ul{
   }
 
   :deep() .vs__actions:after {
-    padding-top: 10px;
+    // padding-top: 10px;
+    display: flex;
+    align-items: center;
   }
   .TEXTAREA{
     border: solid var(--border-width) var(--input-border);

package/assets/styles/base/_variables.scss

@@ -12,8 +12,8 @@ $unlabeled-input-height: 40px;
 $unlabaled-select-padding: 3px 0;
 $footer-height: 60px;
 
-$input-height: 32px;
-$unlabeled-input-height: 32px;
+$input-height: 30px;
+$unlabeled-input-height: 30px;
 $input-width: 400px;
 
 
@@ -39,13 +39,13 @@ $z-indexes: (
   // ---- Boundary for central content (in `<main>`)
 
   // This covers both relative and content modes of the loading indicator
-  loading: 12,
+  loading: 16,
 
   // Users can click on shell in header and show shell even with most loading indicators showing,
   // so add it above them
-  windowsManager: 13,
+  windowsManager: 17,
 
-  mainHeader: 14,
+  mainHeader: 18,
 
   cruFooter: 19,
 

package/assets/styles/fonts/_icons.scss

@@ -38,8 +38,9 @@ $icon-inverse:          #fff !default;
 
 // Sizes
 .icon-fw {
-  width: math.div(18em, 14);
-  text-align: center;
+  width: 32px;
+  // width: math.div(18em, 14);
+  // text-align: center;
 }
 
 .icon-sm {

package/assets/styles/global/_button.scss

@@ -120,7 +120,7 @@ button,
     line-height: $btn-sm-height - 2px;
 
     &:focus, &.focused {
-      border: 0;
+      // border: 0;
     }
   }
 }
@@ -169,13 +169,13 @@ button,
 }
 
 .role-multi-action {
-  //  background: var(--accent-btn);
-  //  border: solid thin var(--primary);
-   color: var(--primary) !important;
-   border-radius: 2px;
-   min-width: 32px;
-   height: 32px;
-   width: 32px;
+  background-color: rgba(0,0,0,0);
+  border: solid thin var(--primary);
+  color: var(--primary) !important;
+  border-radius: 2px;
+  min-width: 32px;
+  height: 32px;
+  width: 32px;
 }
 
 .icon-group i {

package/assets/styles/global/_select.scss

@@ -56,7 +56,7 @@
 
       .vs__dropdown-toggle{
         border: solid var(--border-width) var(--input-border);
-        height: 32px;
+        // height: 30px;
       }
       // .vs__dropdown-toggle,
       .vs__dropdown-toggle > * {

package/assets/styles/global/_tooltip.scss

@@ -11,7 +11,7 @@
     background: var(--tooltip-bg);
     box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
     color: var(--tooltip-text);
-    border-radius: 4px;
+    border-radius: 2px;
     padding: 8px;
   }
 
@@ -123,14 +123,14 @@
 .v-popper__popper {
   $color: var(--popover-bg);
   border: 1px solid var(--border);
-  border-radius: var(--border-radius-lg);
+  border-radius: 2px;
 
   .v-popper__inner {
-    border-radius: 4px;
+    border-radius: 2px;
     background: $color;
     color: var(--popover-text);
     padding: 10px;
-    border-radius: var(--border-radius-lg);
+    border-radius: 0px;
     border: none;
 
     a {
@@ -147,7 +147,7 @@
 }
 
 .v-popper__popper.v-popper--theme-dropdown {
-  border-radius: 4px;
+  border-radius: 0px;
   z-index: z-index('tooltip');
   border: 1px solid #d9d9d9 !important;
 
@@ -157,6 +157,10 @@
     }
   }
 }
+.v-popper__popper .v-popper__arrow-container {
+  display: none;
+}
+
 
 .v-popper {
   display: inline;

package/assets/styles/themes/_light.scss

@@ -8,6 +8,8 @@ $darker    : #333;
 //light disabled
 $dark      : #ffffff;
 
+$scroll_dark: #8b8b8b;
+
 //light border and buttons
 $medium    : #d7d7d7;
 
@@ -364,7 +366,7 @@ BODY, .theme-light {
 
   --body-bg                    : #{$lightest};
   --body-text                  : #{$darkest};
-  --scrollbar-thumb            : #{$dark};
+  --scrollbar-thumb            : #{$scroll_dark};
   --scrollbar-thumb-dropdown   : #{$lighter};
   --scrollbar-track            : transparent;
 

package/assets/styles/vendor/vue-select.scss

@@ -159,9 +159,10 @@
     content: $icon-chevron-down;
     font-family: 'icons';
     height: 32px;
-    padding-top: 8px;
     color: var(--secondary);
     margin-right: 9px;
+    display: flex;
+    align-items: center;
   }
 }
 

package/assets/translations/zh-hans.yaml

@@ -111,6 +111,8 @@ generic:
           =1 {匹配 {total, number} 个中的 1 个："{sample}"}
           other {匹配 {total, number} 中的 {matched, number} 个，包括 "{sample}"}
         }
+  ariaLabel:
+    genericAddRow: 添加
 
 graph:
   loading: 正在加载 Chart 数据...
@@ -216,7 +218,7 @@ product:
   backup: Rancher 备份
   cis: CIS Benchmark
   ecm: Cluster Manager
-  explorer: 集群浏览器
+  explorer: 控制台
   fleet: 持续交付
   longhorn: Longhorn
   manager: 集群管理
@@ -593,6 +595,10 @@ assignTo:
   workspace: 工作空间
 
 stateLabel:
+  Pending migration: 待迁移
+  Imagepullbackoff: 镜像拉取失败
+  VM error: 错误
+  Locked: 锁定
   Bound: 已绑定
   Running: 运行中
   Off: 关闭
@@ -671,7 +677,7 @@ buttonLabel:
 Errors:
   changePassword:
     Password must be at least 12 characters: 密码至少为12个字符
-    invalid current password: 当前的密码输入错误
+    "invalid current password": 当前的密码输入错误
 
 
 asyncButton:
@@ -2573,7 +2579,7 @@ ingress:
       required: 目标服务是必填的
     warning: "警告：默认后端将全局用于整个集群"
   ingressClass:
-    label: IngressClass
+    label: Ingress类
   rules:
     addPath: 添加路径
     addRule: 添加规则
@@ -2914,7 +2920,7 @@ logging:
     default: /run/log/journal
   elasticsearch:
     host: 主机
-    scheme: Scheme
+    scheme: 协议
     port: 端口
     indexName: 索引名称
     user: 用户名
@@ -3170,7 +3176,7 @@ login:
     label: 记住用户名
 
 logout:
-  message: 正在退出登陆...
+  message: 正在退出登录...
 
 managementNode:
   customName: 自定义名称
@@ -5527,7 +5533,12 @@ tableHeaders:
   missingPL: 缺少 PL
   memory: 内存
   monitored: 已监控
+  request: 资源请求量
+  limit: 资源限制
   name: 名称
+  maxunavailable: 最大不可用数
+  minAvailable: 最小可用数
+  alloweddisruptions: 允许中断数
   nameDisplay: 显示名称
   nameUnlinked: 名称
   namespace: 资源组
@@ -5642,6 +5653,7 @@ tableHeaders:
   volume: 卷
   volumeMode: 卷模式
   weight: 权重
+  action: 操作
 target:
   router:
     label: 路由
@@ -5935,7 +5947,9 @@ workload:
         exec:  容器内运行的命令以 0 状态退出
     image: 容器镜像
     imagePullPolicy: 镜像拉取策略
-    imagePullSecrets: 拉取密文
+    imagePullSecrets:
+      label: 镜像拉取密钥
+      tooltip: 必须为 kubernetes.io/dockercfg 或 kubernetes.io/dockerconfigjson 类型
     init: 初始化容器
     lifecycleHook:
       postStart:
@@ -5963,7 +5977,7 @@ workload:
           label: 端口
           placeholder: 例如：3000
         scheme:
-          label: Scheme
+          label: 协议
           placeholder: 例如：HTTP
       httpHeaders:
         title: HTTP 头部
@@ -6014,7 +6028,7 @@ workload:
       hostPID: 使用主机 PID 资源组
       podFsGroup: Pod 文件系统组
       privileged:
-        label: Privileged
+        label: 特权模式
         'false': 否
         'true': "是：容器可以完全访问主机"
       readOnlyRootFilesystem:
@@ -6161,7 +6175,7 @@ workload:
   replicas: 副本数量
   showTabs: '显示高级选项'
   scheduling:
-    activeDeadlineSeconds: 判定 Pod 是否活跃的截止时间
+    activeDeadlineSeconds: 判定Pod是否活跃的截止时间
     activeDeadlineSecondsTip: 系统将 Pod 判定为失败，并终止其关联容器前的等待时长
     affinity:
       addNodeSelector: 添加节点选择器
@@ -6331,7 +6345,7 @@ workload:
     pod: Pod 是你可以在 Kubernetes 中创建和管理的最小可部署计算单元。Pod 是一个或多个容器，具有共享的存储和网络资源以及运行容器的规范。
   upgrading:
     activeDeadlineSeconds:
-      label: 判定 Pod 是否活跃的截止时间
+      label: 判定Pod是否活跃的截止时间
       tip: 系统将 Pod 判定为失败，并终止其关联容器前的等待时长
     concurrencyPolicy:
       label: 并发
@@ -6482,7 +6496,7 @@ typeDescription:
   kubevirt.io.virtualmachine: 云虚拟机是一种安全可靠、弹性可伸缩的云计算服务器，助您降低 IT 成本，提升运维效率，使您更专注于核心业务创新。
   harvesterhci.io.volume: 虚拟磁盘具有高性能和低时延的特点，支持随机读写，可以像使用物理硬盘一样，在虚拟机上进行格式化并建立文件系统来使用块存储。
   harvesterhci.io.volumesnapshot: 虚拟磁盘快照功能通过捕获虚拟磁盘在特定时间点的状态，生成增量副本，支持快速回滚磁盘状态，为测试验证、容灾恢复提供高效解决方案
-  harvesterhci.io.virtualmachinebackup: 虚拟机备份功能通过创建包含磁盘数据、配置信息的完整副本，支持跨环境恢复及长期数据保护，为系统故障或灾难提供可靠容灾方案。
+  harvesterhci.io.virtualmachinebackup: 虚拟机备份恢复功能通过创建包含磁盘数据、配置信息的完整副本，支持跨环境恢复及长期数据保护，为系统故障或灾难提供可靠容灾方案。
   harvesterhci.io.schedulevmbackup: 虚拟机备份策略功能通过创建定时任务，对虚拟机进行完整备份或增量快照，为用户提供自动化的数据备份和容灾方案。
   harvesterhci.io.vmsnapshot: 虚拟机快照功能通过捕获特定时间点的系统状态，支持快速恢复虚拟机状态，为数据备份与系统调试提供灵活解决方案。
   harvesterhci.io.keypair: SSH密钥对是一种安全便捷的登录认证方式，您可以实现免密码远程登录，并在无需人工干预的情况下进行安全的自动化操作，实现服务器配置和应用程序部署的自动化。
@@ -6509,7 +6523,34 @@ typeDescription:
   management.cattle.io.setting: 统一配置平台基础选项与全局设置，支持CA证书、密码规则、域名、Token时效等核心配置。
   management.cattle.io.user: 用于管理用户账号，支持创建、维护用户信息，可设置用户权限、管理密码等，保障系统资源仅由授权用户访问，提升系统安全性。
   harvesterhci.io.management.cluster: 提供虚拟化集群的实时健康状态监控、版本号管理及资源负载管理，支持批量导入/删除集群、配置调优与权限分级功能，实现高效运维管控。
+  projectsnamespaces: 项目/资源组是用于在集群内实现资源隔离和多租户管理的基本单元。通过项目可以对一组命名空间及相关资源进行统一的权限、配额和策略管理。
+  members: 集群和项目成员管理页面用于配置用户和用户组对资源的访问权限。通过角色绑定（RBAC）来控制成员在集群或项目范围内的操作权限，实现安全的协同管理。
+  event: 事件记录了 Kubernetes 资源（如 Pod、节点等）的状态变化、错误信息和生命周期事件。通过查看事件可以快速诊断应用部署和运行中的问题。
+  autoscaling.horizontalpodautoscaler: HorizontalPodAutoscaler (HPA) 用于根据观察到的 CPU 利用率或其他自定义指标自动调整工作负载的 Pod 副本数量，实现应用的水平自动扩缩容。
+  networking.k8s.io.ingress: Ingress 用于管理对集群内服务的外部访问，提供 HTTP 和 HTTPS 路由规则。通过 Ingress 可以配置负载均衡、SSL 终止和基于名称的虚拟主机等能力。
+  service: Service 用于将一组 Pod 暴露为网络服务，提供稳定的 IP 地址和 DNS 名称，并实现负载均衡。Service 确保您的应用程序在网络中可被发现和可靠访问。
+  storage.k8s.io.storageclass: 存储池页面用于集中管理和配置集群中的持久化存储资源。您可以在此查看存储提供商、创建存储类（StorageClass）并为有状态应用动态提供持久卷（Persistent Volume）。
+  persistentvolume: PersistentVolume (PV) 是集群中的一块持久化存储资源，由管理员预先配置或通过存储类动态供应。PV 为需要持久化数据的应用提供独立于 Pod 生命周期的存储空间。
+  persistentvolumeclaim: 虚拟磁盘是提供给虚拟机使用的持久化存储设备，为虚拟机操作系统和应用数据提供独立的、可扩展的存储空间。虚拟磁盘的生命周期可以与虚拟机解耦，实现数据的持久化保存。
+  configmap: ConfigMap 用于将非机密的配置数据以键值对形式保存，并注入到 Pod 中作为环境变量、命令行参数或配置文件使用。实现应用配置与容器镜像的分离，便于配置管理。
+  secret: Secret 用于存储和管理敏感信息，如密码、OAuth 令牌和 SSH 密钥等。Secret 以加密方式保存数据，并可以安全地挂载到 Pod 中供容器使用，避免敏感信息硬编码。
+  projectsecret: Secret 用于存储和管理敏感信息，如密码、OAuth 令牌和 SSH 密钥等。Secret 以加密方式保存数据，并可以安全地挂载到 Pod 中供容器使用，避免敏感信息硬编码。
+  networking.k8s.io.networkpolicy: 网络策略用于控制 Pod 组之间的网络通信规则，实现 Kubernetes 集群内的网络隔离。通过定义入站和出站规则，可以精确控制 Pod 之间的网络访问权限。
+  limitrange: 限制范围用于在命名空间内限制资源的使用量，包括 Pod 的计算资源（CPU、内存）请求和限制、存储卷大小以及可创建的资源对象数量，防止资源过度消耗。
+  resourcequota: 资源配额用于限制命名空间可以使用的总体资源总量，包括计算资源、存储资源以及可创建的对象数量。它确保命名空间内的资源使用不会超过分配的配额限制。
+  policy.poddisruptionbudget: Pod 中断预算用于限制自愿中断期间同时终止的 Pod 副本数量，确保应用的高可用性。它可以防止在节点维护或集群缩容时导致的应用服务中断。
+  apps.daemonset: DaemonSet 在每个符合条件的节点上仅运行一个 Pod。当新节点添加到集群时，DaemonSet 会自动部署新节点。推荐用于全系统或可垂直扩展，且每个节点永远不需要超过一个 pod 的工作负载。
+  apps.deployment: Deployment 运行分布在符合条件的节点中的可扩展数量的 Pod 副本。变更会逐步推出，并可回滚到之前的版本。推荐用于无状态和水平可扩展的工作负载。
+  apps.statefulset: StatefulSet 管理有状态的应用，并保证创建的 Pod 的顺序和唯一性。推荐用于具有持久化存储或严格身份、法定人数或升级顺序要求的工作负载。
+  batch.cronjob: CronJob 创建 Job，然后按照重复调度来运行 Pod。该调度以标准的 Unix cron 格式表示，并使用 Kubernetes Control Plane 的时区（通常是 UTC）。
+  batch.job: Job 创建一个或多个 Pod。 Job 通过运行 Pod 直到其成功退出，以可靠执行一次性任务。失败的 Pod 会自动被替换，直到达到指定的完成运行次数。Job 还可以并行运行多个 Pod，或作为批处理工作队列。
+  pod: Pod 是你可以在 Kubernetes 中创建和管理的最小可部署计算单元。Pod 是一个或多个容器，具有共享的存储和网络资源以及运行容器的规范。
 typeLabel:
+  management.cattle.io.project: |-
+    {count, plural,
+      one { 项目 }
+      other { 项目 }
+    }
   management.cattle.io.token: |-
     {count, plural,
       one { API 密钥 }
@@ -6753,8 +6794,8 @@ typeLabel:
     }
   autoscaling.horizontalpodautoscaler: |-
     {count, plural,
-      one { HorizontalPodAutoscaler }
-      other { HorizontalPodAutoscaler }
+      one { HPA }
+      other { HPA }
     }
   networking.k8s.io.ingress: |-
     {count, plural,
@@ -6861,6 +6902,26 @@ typeLabel:
       one { 工作负载 }
       other { 工作负载 }
     }
+  cluster : |-
+    {count, plural,
+      one { 集群 }
+      other { 集群 }
+    }
+  servicediscovery : |-
+    {count, plural,
+      one { 服务发现 }
+      other { 服务发现 }
+    }
+  storage : |-
+    {count, plural,
+      one { 存储 }
+      other { 存储 }
+    }
+  policy  : |-
+    {count, plural,
+      one { 策略 }
+      other { 策略 }
+    }
   harvesterhci.io.management.cluster: |-
     {count, plural,
       one { Cloud 集群 }
@@ -7856,3 +7917,79 @@ gitPicker:
 networkAttachmentDefinition:
   tabs:
     config: 配置
+
+
+component:
+  drawer:
+    chrome:
+      ariaLabel:
+        close: 关闭抽屉
+      close: 关闭
+    resourceDetailDrawer:
+      title: "{resourceName} ({resourceType}) - 配置"
+      editConfig: 编辑配置
+      editYaml: 编辑YAML
+      ariaLabel:
+        editConfig: 编辑配置
+        editYaml: 编辑YAML
+      yamlTab:
+        title: YAML
+      configTab:
+        title: 配置
+  resource:
+    detail:
+      card:
+        resourceUsage:
+          used: Used
+          amount: '{used} of {available}'
+          cpu: CPU
+          memory: Memory
+          pods: Pods
+        resourcesCard:
+          title: 资源
+          rows:
+            services: 服务
+            ingresses: Ingresses
+            referredToBy: 参考
+            refersTo: 引用
+        podsCard:
+          title: Pods
+          ariaResourceName: pods
+        insightsCard:
+          title: Insights
+          rows:
+            conditions: Conditions
+            events: Events
+        scaler:
+          ariaLabel:
+            increase: Increase {resourceName}
+            decrease: Decrease {resourceName}
+      titleBar:
+        showConfiguration: 显示配置
+        ariaLabel:
+          actionMenu: 更多操作
+          showConfiguration: 显示｛resource｝的整个配置
+      metadata:
+        labelsAndAnnotations: 标签和注释
+        identifyingInformation:
+          createdBy: 创建
+          namespace: 命名空间
+          project: 项目
+          age: 使用时长
+          image: 图片
+          ready: 准备
+          up-to-date: Up-to-date
+          available: 可用
+          serviceAccount: 服务帐户
+          type: 类型
+          certificate: 证书
+          issuer: Issuer
+          expires: 到期
+          workspace: 工作区
+        annotations:
+          title: 注释
+        labels:
+          title: 标签
+        keyValue:
+          noRows: 此资源上没有配置｛propertyName}.
+          showConfiguration: 显示配置

package/components/ActionDropdown.vue

@@ -212,7 +212,7 @@ export default {
       border: 1px solid var(--dropdown-border);
       padding: 0px;
       text-align: left;
-      border-radius: 4px;
+      border-radius: 2px;
 
       LI {
         padding: 10px;

package/components/ButtonDropdown.vue

@@ -266,7 +266,9 @@ export default {
     :deep() .vs__dropdown-toggle .vs__actions {
       &:after {
         color: var(--accent-btn-hover-text);
-        padding-top: 10px;
+        // padding-top: 10px;
+        display: flex;
+        align-items: center;
       }
     }
   }

package/components/CodeMirror.vue

@@ -323,12 +323,12 @@ export default {
     }
 
     &.as-text-area .codemirror-container{
-      min-height: 40px;
+      min-height: 32px !important;
       position: relative;
       display: block;
       box-sizing: border-box;
       width: 100%;
-      padding: 10px;
+      padding: 8px 10px 0 10px !important;
       background-color: var(--input-bg);
       border-radius: var(--border-radius);
       border: solid var(--border-width) var(--input-border);
@@ -418,7 +418,7 @@ export default {
 
   .code-mirror {
     position: relative;
-    margin-bottom: 20px;
+    margin-bottom: 0 !important;
 
     .escape-text {
       font-size: 12px;
@@ -498,5 +498,7 @@ export default {
       }
     }
   }
-
+  .CodeMirror-scroll {
+    min-height: 350px;
+  }
 </style>

package/components/ContainerResourceLimit.vue

@@ -177,7 +177,7 @@ export default {
       </div>
     </div>
 
-    <div class="row mb-20">
+    <div class="row">
       <span class="col span-6">
         <UnitInput
           v-model:value="requestsCpu"
@@ -206,7 +206,7 @@ export default {
       </span>
     </div>
 
-    <div class="row mb-20">
+    <div class="row">
       <span class="col span-6">
         <UnitInput
           v-model:value="limitsCpu"

package/components/CopyToClipboard.vue

@@ -42,3 +42,18 @@ export default {
     @click="clicked"
   />
 </template>
+
+<style lang="scss"scoped>
+button {
+  min-width: auto;
+}
+
+.bg-success{
+  background-color: var(--success-hover-text) !important;
+  color: #333 !important;
+}
+.bg-success:hover{
+  background-color: var(--success-hover-text) !important;
+  color: var(--primary) !important;
+}
+</style>

package/components/Drawer/Chrome.vue

@@ -35,7 +35,7 @@ const ariaLabel = computed(() => i18n.t('component.drawer.chrome.ariaLabel.close
         </div>
       </slot>
     </div>
-    <div class="body pp-4">
+    <div class="body">
       <slot name="body" />
     </div>
     <div class="footer pp-4">
@@ -93,7 +93,7 @@ const ariaLabel = computed(() => i18n.t('component.drawer.chrome.ariaLabel.close
     }
 
     .body {
-      background-color: var(--drawer-body-bg);
+      background-color: var(--body-bg);
       flex: 1;
       overflow-y: scroll;
     }

package/components/Drawer/ResourceDetailDrawer/ConfigTab.vue

@@ -16,38 +16,41 @@ const store = useStore();
 const i18n = useI18n(store);
 </script>
 <template>
-  <Tab
-    class="config-tab"
-    name="config-tab"
-    :label="i18n.t('component.drawer.resourceDetailDrawer.configTab.title')"
-  >
-    <div class="container">
-      <component
-        :is="props.component"
-        :value="props.resource"
-        :liveValue="props.resource"
-        :resourceType="props.resourceType"
-        :mode="_VIEW"
-        :real-mode="_VIEW"
-        :initial-value="props.resource"
-        :use-tabbed-hash="false /* Have to disable hashing on child components or it modifies the url and closes the drawer */"
-        as="config"
-      />
-    </div>
-  </Tab>
+<div class="container">
+  <component
+    :is="props.component"
+    :value="props.resource"
+    :liveValue="props.resource"
+    :resourceType="props.resourceType"
+    :mode="_VIEW"
+    :real-mode="_VIEW"
+    :initial-value="props.resource"
+    :use-tabbed-hash="false /* Have to disable hashing on child components or it modifies the url and closes the drawer */"
+    as="config"
+  />
+</div>
 </template>
 
 <style lang="scss" scoped>
-.config-tab {
-  .container {
-    background-color: var(--body-bg);
-    border-radius: var(--border-radius-md);
-    padding: 16px;
-    max-width: 100%;
-    width: 100%;
-    position: relative;
+.container {
+  background-color: var(--body-bg);
+  border-radius: var(--border-radius-md);
+  padding: 20px;
+  max-width: 100%;
+  width: 100%;
+  position: relative;
+  // Handle the loading indicator
+  :deep() .overlay-content-mode {
+    left: 0;
+    top: 0;
   }
 
+  :deep() .cru-resource-footer {
+    display: none;
+  }
+}
+.config-tab {
+
   // Handle the loading indicator
   :deep() .overlay-content-mode {
     left: 0;