提交

liuwh

2024-09-07 d7ca134342a0a2004d9c15fab49fd0a41557e29c

 gz-wxparty/styles/public.wxss

@@ -1,252 +1,253 @@
page {
   /* color */
   /* 主色 */
   --main-color: #d10202;
   /* page背景色 */
   --bg-color: #f0f2f5;
   /* 主色拓展 */
   --red-1: #ffeae6;
   /* Color Palette */
   --black: #000;
   --white: #fff;
   --gray-1: #f7f8fa;
   --gray-2: #f2f3f5;
   --gray-3: #ebedf0;
   --gray-4: #dcdee0;
   --gray-5: #c8c9cc;
   --gray-6: #969799;
   --gray-7: #646566;
   --gray-8: #323233;
   --red: #ee0a24;
   --blue: #1989fa;
   --orange: #ff976a;
   --orange-dark: #ed6a0c;
   --orange-light: #fffbe8;
   --green: #07c160;
   /* font-color */
   --text-color: rgba(0, 0, 0, 0.85);
   --second-text-color: rgba(0, 0, 0, 0.65);
  /* color */
  /* 主色 */
  --main-color: #1A6FB8;
  /* page背景色 */
  --bg-color: #f0f2f5;
  /* 主色拓展 */
  --red-1: #ffeae6;
  /* Color Palette */
  --black: #000;
  --white: #fff;
  --gray-1: rgba(255,255,255,0.60);
  --gray-2: #f2f3f5;
  --gray-3: #ebedf0;
  --gray-4: #dcdee0;
  --gray-5: #c8c9cc;
  --gray-6: #969799;
  --gray-7: #646566;
  --gray-8: #323233;
  --red: #ee0a24;
  --blue: #1989fa;
  --orange: #ff976a;
  --orange-dark: #ed6a0c;
  --orange-light: #fffbe8;
  --green: #07c160;
  /* font-color */
  --text-color: rgba(0, 0, 0, 0.85);
  --second-text-color: rgba(0, 0, 0, 0.65);

   /* font */
   --font-size-main: 28rpx;
   --line-height-main: 44rpx;
   --font-size-xs: 20rpx;
   --font-size-sm: 24rpx;
   --font-size-md: 28rpx;
   --font-size-lg: 32rpx;
   --font-weight-bold: 600;
   --line-height-xs: 28rpx;
   --line-height-sm: 36rpx;
   --line-height-md: 44rpx;
   --line-height-lg: 44rpx;
   --base-font-family: system-ui;
  /* font */
  --font-size-main: 30rpx;
  --line-height-main: 46rpx;
  --font-size-xs: 20rpx;
  --font-size-sm: 24rpx;
  --font-size-md: 30rpx;
  --font-size-lg: 32rpx;
  --font-weight-bold: 600;
  --line-height-xs: 28rpx;
  --line-height-sm: 36rpx;
  --line-height-md: 44rpx;
  --line-height-lg: 44rpx;
  --base-font-family: system-ui;

   /* Component Colors */
   --active-color: var(--gray-2);
   --active-opacity: 0.7;
   --disabled-opacity: 0.5;
   --background-color: var(--gray-1);
   --background-color-light: #fafafa;
   --text-link-color: #576b95;
  /* Component Colors */
  --active-color: var(--gray-2);
  --active-opacity: 0.7;
  --disabled-opacity: 0.5;
  --background-color: var(--gray-1);
  --background-color-light: #fafafa;
  --text-link-color: #576b95;

   /* Animation */
   --animation-duration-base: 0.3s;
   --animation-duration-fast: 0.2s;
  /* Animation */
  --animation-duration-base: 0.3s;
  --animation-duration-fast: 0.2s;

   /* padding */
   --padding-my: 20rpx;
   --padding-base: 8rpx;
   --padding-xs: 16rpx;
   --padding-sm: 24rpx;
   --padding-md: 32rpx;
   --padding-lg: 48rpx;
   --padding-xl: 64rpx;
  /* padding */
  --padding-my: 32rpx;
  --padding-base: 8rpx;
  --padding-xs: 16rpx;
  --padding-sm: 24rpx;
  --padding-md: 32rpx;
  --padding-lg: 48rpx;
  --padding-xl: 64rpx;

   /* Border */
   --border-color: rgba(0, 0, 0, 0.1);
   --border-radius-card: 20rpx;
   --border-radius-card-sm: 10rpx;
   --border-width-base: 2rpx;
   --border-radius-sm: 4rpx;
   --border-radius-md: 8rpx;
   --border-radius-lg: 16rpx;
  /* Border */
  --border-color: rgba(0, 0, 0, 0.1);
  --border-radius-card: 20rpx;
  --border-radius-card-sm: 10rpx;
  --border-width-base: 2rpx;
  --border-radius-sm: 4rpx;
  --border-radius-md: 8rpx;
  --border-radius-lg: 16rpx;

   /* Button */
   --button-mini-height: 44rpx;
   --button-mini-min-width: 100rpx;
   --button-mini-font-size: var(--font-size-xs);
   --button-small-height: 60rpx;
   --button-small-font-size: var(--font-size-sm);
   --button-small-min-width: 120rpx;
   --button-normal-font-size: var(--font-size-md);
   --button-large-height: 100rpx;
   --button-default-color: var(--text-color);
   --button-default-height: 80rpx;
   --button-default-font-size: var(--font-size-lg);
   --button-default-background-color: var(--white);
   --button-default-border-color: var(--border-color);
   --button-primary-color: var(--white);
   --button-primary-background-color: var(--main-color);
   --button-primary-border-color: var(--main-color);
   --button-info-color: var(--white);
   --button-info-background-color: var(--blue);
   --button-info-border-color: var(--blue);
   --button-danger-color: var(--white);
   --button-danger-background-color: var(--red);
   --button-danger-border-color: var(--red);
   --button-warning-color: var(--white);
   --button-warning-background-color: var(--orange);
   --button-warning-border-color: var(--orange);
   --button-line-height: 44rpx;
   --button-border-width: 2rpx;
   --button-border-radius: var(--border-radius-md);
   --button-round-border-radius: var(--border-radius-max);
   --button-plain-background-color: var(--white);
   --button-disabled-opacity: var(--disabled-opacity);
  /* Button */
  --button-mini-height: 44rpx;
  --button-mini-min-width: 100rpx;
  --button-mini-font-size: var(--font-size-xs);
  --button-small-height: 60rpx;
  --button-small-font-size: var(--font-size-sm);
  --button-small-min-width: 120rpx;
  --button-normal-font-size: var(--font-size-md);
  --button-large-height: 100rpx;
  --button-default-color: var(--text-color);
  --button-default-height: 80rpx;
  --button-default-font-size: var(--font-size-lg);
  --button-default-background-color: var(--white);
  --button-default-border-color: var(--border-color);
  --button-primary-color: var(--white);
  --button-primary-background-color: var(--main-color);
  --button-primary-border-color: var(--main-color);
  --button-info-color: var(--white);
  --button-info-background-color: var(--blue);
  --button-info-border-color: var(--blue);
  --button-danger-color: var(--white);
  --button-danger-background-color: var(--red);
  --button-danger-border-color: var(--red);
  --button-warning-color: var(--white);
  --button-warning-background-color: var(--orange);
  --button-warning-border-color: var(--orange);
  --button-line-height: 44rpx;
  --button-border-width: 2rpx;
  --button-border-radius: var(--border-radius-md);
  --button-round-border-radius: var(--border-radius-max);
  --button-plain-background-color: var(--white);
  --button-disabled-opacity: var(--disabled-opacity);

   /* Tabbar */
   --tabbar-height: 92rpx;
   --tabbar-background-color: var(--white);
  /* Tabbar */
  --tabbar-height: 92rpx;
  --tabbar-background-color: var(--white);

   /* TabbarItem */
   --tabbar-item-font-size: var(--font-size-sm);
   --tabbar-item-text-color: var(--text-color);
   --tabbar-item-active-color: var(--main-color);
   --tabbar-item-line-height: 1;
   --tabbar-item-icon-size: 36rpx;
   --tabbar-item-margin-bottom: 8rpx;
  /* TabbarItem */
  --tabbar-item-font-size: var(--font-size-sm);
  --tabbar-item-text-color: var(--text-color);
  --tabbar-item-active-color: var(--main-color);
  --tabbar-item-line-height: 1;
  --tabbar-item-icon-size: 36rpx;
  --tabbar-item-margin-bottom: 8rpx;

   /* Tab */
   --tab-text-color: var(--gray-7);
   --tab-active-text-color: var(--text-color);
   --tab-disabled-text-color: var(--gray-5);
   --tab-font-size: var(--font-size-md);
  /* Tab */
  --tab-text-color: var(--gray-7);
  --tab-active-text-color: var(--text-color);
  --tab-disabled-text-color: var(--gray-5);
  --tab-font-size: var(--font-size-md);

   /* Tabs */
   --tabs-default-color: var(--main-color);
   --tabs-line-height: 48rpx;
   --tabs-card-height: 60rpx;
   --tabs-nav-background-color: var(--white);
   --tabs-bottom-bar-height: 4rpx;
   --tabs-bottom-bar-color: var(--tabs-default-color);
  /* Tabs */
  --tabs-default-color: var(--main-color);
  --tabs-line-height: 48rpx;
  --tabs-card-height: 60rpx;
  --tabs-nav-background-color: var(--white);
  --tabs-bottom-bar-height: 4rpx;
  --tabs-bottom-bar-color: var(--tabs-default-color);

   /* Field */
   --field-label-color: var(--gray-7);
   --field-input-text-color: var(--text-color);
   --field-input-error-text-color: var(--red);
   --field-input-disabled-text-color: var(--gray-5);
   --field-placeholder-text-color: rgba(0, 0, 0, 0.5);
   --field-icon-size: 32rpx;
   --field-clear-icon-size: 32rpx;
   --field-clear-icon-color: var(--gray-5);
   --field-icon-container-color: var(--gray-6);
   --field-error-message-color: var(--red);
   --field-error-message-text-font-size: var(--font-size-sm);
   --field-text-area-min-height: 36rpx;
   --field-word-limit-color: var(--gray-7);
   --field-word-limit-font-size: var(--font-size-sm);
   --field-word-limit-line-height: 32rpx;
   --field-word-num-full-color: var(--red);
   --field-disabled-text-color: var(--gray-5);
  /* Field */
  --field-label-color: var(--gray-7);
  --field-input-text-color: var(--text-color);
  --field-input-error-text-color: var(--red);
  --field-input-disabled-text-color: var(--gray-5);
  --field-placeholder-text-color: rgba(0, 0, 0, 0.5);
  --field-icon-size: 32rpx;
  --field-clear-icon-size: 32rpx;
  --field-clear-icon-color: var(--gray-5);
  --field-icon-container-color: var(--gray-6);
  --field-error-message-color: var(--red);
  --field-error-message-text-font-size: var(--font-size-sm);
  --field-text-area-min-height: 36rpx;
  --field-word-limit-color: var(--gray-7);
  --field-word-limit-font-size: var(--font-size-sm);
  --field-word-limit-line-height: 32rpx;
  --field-word-num-full-color: var(--red);
  --field-disabled-text-color: var(--gray-5);

   /* Cell */
   --cell-font-size: var(--font-size-md);
   --cell-line-height: var(--line-height-md);
   --cell-vertical-padding: var(--padding-sm);
   --cell-horizontal-padding: var(--padding-md);
   --cell-text-color: var(--text-color);
   --cell-background-color: var(--white);
   --cell-border-color: var(--border-color);
   --cell-active-color: var(--active-color);
   --cell-required-color: var(--red);
   --cell-label-color: var(--gray-6);
   --cell-label-font-size: var(--font-size-sm);
   --cell-label-line-height: 36rpx;
   --cell-label-margin-top: 6rpx;
   --cell-value-color: var(--gray-6);
   --cell-icon-size: 32rpx;
   --cell-right-icon-color: var(--gray-6);
   --cell-large-vertical-padding: var(--padding-sm);
   --cell-large-title-font-size: var(--font-size-lg);
   --cell-large-value-font-size: var(--font-size-lg);
   --cell-large-label-font-size: var(--font-size-md);
  /* Cell */
  --cell-font-size: var(--font-size-md);
  --cell-line-height: var(--line-height-md);
  --cell-vertical-padding: var(--padding-sm);
  --cell-horizontal-padding: var(--padding-md);
  --cell-text-color: var(--text-color);
  --cell-background-color: var(--white);
  --cell-border-color: var(--border-color);
  --cell-active-color: var(--active-color);
  --cell-required-color: var(--red);
  --cell-label-color: var(--gray-6);
  --cell-label-font-size: var(--font-size-sm);
  --cell-label-line-height: 36rpx;
  --cell-label-margin-top: 6rpx;
  --cell-value-color: var(--gray-6);
  --cell-icon-size: 32rpx;
  --cell-right-icon-color: var(--gray-6);
  --cell-large-vertical-padding: var(--padding-sm);
  --cell-large-title-font-size: var(--font-size-lg);
  --cell-large-value-font-size: var(--font-size-lg);
  --cell-large-label-font-size: var(--font-size-md);

   /* CellGroup */
   --cell-group-background-color: var(--white);
   --cell-group-title-color: var(--gray-6);
   --cell-group-title-padding: var(--padding-md) var(--padding-md) var(--padding-xs);
   --cell-group-title-font-size: var(--font-size-md);
   --cell-group-title-line-height: 32rpx;
   --cell-group-inset-padding: 0 var(--padding-my);
   --cell-group-inset-border-radius: var(--border-radius-lg);
   --cell-group-inset-title-padding: var(--padding-md) var(--padding-md) var(--padding-xs) var(--padding-xl);
  /* CellGroup */
  --cell-group-background-color: var(--white);
  --cell-group-title-color: var(--gray-6);
  --cell-group-title-padding: var(--padding-md) var(--padding-md) var(--padding-xs);
  --cell-group-title-font-size: var(--font-size-md);
  --cell-group-title-line-height: 32rpx;
  --cell-group-inset-padding: 0 var(--padding-my);
  --cell-group-inset-border-radius: var(--border-radius-lg);
  --cell-group-inset-title-padding: var(--padding-md) var(--padding-md) var(--padding-xs) var(--padding-xl);

   /* Checkbox */
   --checkbox-size: 40rpx;
   --checkbox-border-color: var(--gray-5);
   --checkbox-transition-duration: 0.2s;
   --checkbox-label-margin: 20rpx;
   --checkbox-label-color: --text-color;
   --checkbox-checked-icon-color: var(--main-color);
   --checkbox-disabled-icon-color: var(--gray-5);
   --checkbox-disabled-label-color: var(--gray-5);
   --checkbox-disabled-background-color: var(--border-color);
  /* Checkbox */
  --checkbox-size: 40rpx;
  --checkbox-border-color: var(--gray-5);
  --checkbox-transition-duration: 0.2s;
  --checkbox-label-margin: 20rpx;
  --checkbox-label-color: --text-color;
  --checkbox-checked-icon-color: var(--main-color);
  --checkbox-disabled-icon-color: var(--gray-5);
  --checkbox-disabled-label-color: var(--gray-5);
  --checkbox-disabled-background-color: var(--border-color);

   /* Popup */
   --popup-background-color: var(--white);
   --popup-round-border-radius: 20rpx;
   --popup-close-icon-size: 36rpx;
   --popup-close-icon-color: var(--black);
   --popup-close-icon-margin: 32rpx;
   --popup-close-icon-z-index: 1;
  /* Popup */
  --popup-background-color: var(--white);
  --popup-round-border-radius: 20rpx;
  --popup-close-icon-size: 36rpx;
  --popup-close-icon-color: var(--black);
  --popup-close-icon-margin: 32rpx;
  --popup-close-icon-z-index: 1;

   /* Search */
   --search-background-color: #ffffff;
   --search-padding: 16rpx var(--padding-my);
   --search-input-height: 68rpx;
   --search-label-padding: 0 10rpx;
   --search-label-color: var(--text-color);
   --search-label-font-size: var(--font-size-md);
   --search-left-icon-color: var(--gray-6);
   --search-action-padding: 0 var(--padding-xs);
   --search-action-text-color: var(--text-color);
   --search-action-font-size: var(--font-size-md);
  /* Search */
  --search-background-color: #ffffff;
  --search-padding: 16rpx var(--padding-my);
  --search-input-height: 68rpx;
  --search-label-padding: 0 10rpx;
  --search-label-color: var(--text-color);
  --search-label-font-size: var(--font-size-md);
  --search-left-icon-color: var(--gray-6);
  --search-action-padding: 0 var(--padding-xs);
  --search-action-text-color: var(--text-color);
  --search-action-font-size: var(--font-size-md);

   /* Toast */
   --toast-max-width: 90%;
   --toast-font-size: 28rpx;
   --toast-text-color: var(--white);
   --toast-line-height: 40rpx;
   --toast-border-radius: var(--border-radius-lg);
   --toast-background-color: var(--second-text-color);
   --toast-icon-size: 72rpx;
   --toast-text-min-width: 192rpx;
   --toast-text-padding: var(--padding-xs) var(--padding-sm);
   --toast-default-padding: var(--padding-md);
   --toast-default-width: 176rpx;
   --toast-default-min-height: 176rpx;
  /* Toast */
  --toast-max-width: 90%;
  --toast-font-size: 28rpx;
  --toast-text-color: var(--white);
  --toast-line-height: 40rpx;
  --toast-border-radius: var(--border-radius-lg);
  --toast-background-color: var(--second-text-color);
  --toast-icon-size: 72rpx;
  --toast-text-min-width: 192rpx;
  --toast-text-padding: var(--padding-xs) var(--padding-sm);
  --toast-default-padding: var(--padding-md);
  --toast-default-width: 176rpx;
  --toast-default-min-height: 176rpx;

   /* Radio */
   --radio-size: 40rpx;
   --radio-border-color: var(--gray-5);
   --radio-transition-duration: 0.2s;
   --radio-label-margin: 20rpx;
   --radio-label-color: var(--text-color);
   --radio-checked-icon-color: var(--main-color);
   --radio-disabled-icon-color: var(--gray-5);
   --radio-disabled-label-color: var(--gray-5);
   --radio-disabled-background-color: var(--border-color);
  /* Radio */
  --radio-size: 40rpx;
  --radio-border-color: var(--gray-5);
  --radio-transition-duration: 0.2s;
  --radio-label-margin: 20rpx;
  --radio-label-color: var(--text-color);
  --radio-checked-icon-color: var(--main-color);
  --radio-disabled-icon-color: var(--gray-5);
  --radio-disabled-label-color: var(--gray-5);
  --radio-disabled-background-color: var(--border-color);

   /* Switch */
   --switch-width: 2em;
   --switch-height: 1em;
   --switch-node-size: 1em;
   --switch-node-z-index: 1;
   --switch-node-background-color: var(--white);
   --switch-node-box-shadow: 0 6rpx 2rpx 0 rgba(0, 0, 0, 0.05), 0 4rpx 4rpx 0 rgba(0, 0, 0, 0.1), 0 6rpx 6rpx 0 rgba(0, 0, 0, 0.05);
   --switch-background-color: var(--white);
   --switch-on-background-color: var(--main-color);
   --switch-transition-duration: 0.3s;
   --switch-disabled-opacity: 0.4;
   --switch-border: 2rpx solid rgba(0, 0, 0, 0.1);
  /* Switch */
  --switch-width: 2em;
  --switch-height: 1em;
  --switch-node-size: 1em;
  --switch-node-z-index: 1;
  --switch-node-background-color: var(--white);
  --switch-node-box-shadow: 0 6rpx 2rpx 0 rgba(0, 0, 0, 0.05), 0 4rpx 4rpx 0 rgba(0, 0, 0, 0.1), 0 6rpx 6rpx 0 rgba(0, 0, 0, 0.05);
  --switch-background-color: var(--white);
  --switch-on-background-color: var(--main-color);
  --switch-transition-duration: 0.3s;
  --switch-disabled-opacity: 0.4;
  --switch-border: 2rpx solid rgba(0, 0, 0, 0.1);
}