Skip to main content

CourierInboxTheme

export type CourierInboxTheme = {
  popup?: {
    button?: {
      icon?: {
        color?: string;
        svg?: string;
      };
      backgroundColor?: string;
      hoverBackgroundColor?: string;
      activeBackgroundColor?: string;
      unreadDotIndicator?: {
        backgroundColor?: string;
        borderRadius?: string;
        height?: string;
        width?: string;
      };
    };
    window?: {
      backgroundColor?: string;
      borderRadius?: string;
      border?: string;
      shadow?: string;
      animation?: {
        transition?: string;
        initialTransform?: string;
        visibleTransform?: string;
      };
    };
  };
  inbox?: {
    header?: {
      backgroundColor?: string;
      shadow?: string;
      border?: string;
      feeds?: {
        button?: {
          selectedFeedIconColor?: string;
          font?: {
            family?: string;
            weight?: string;
            size?: string;
            color?: string;
          };
          changeFeedIcon?: {
            color?: string;
            svg?: string;
          };
          unreadCountIndicator?: {
            font?: {
              family?: string;
              weight?: string;
              size?: string;
              color?: string;
            };
            backgroundColor?: string;
            borderRadius?: string;
            padding?: string;
          };
          hoverBackgroundColor?: string;
          activeBackgroundColor?: string;
          transition?: string;
        };
        menu?: {
          backgroundColor?: string;
          border?: string;
          borderRadius?: string;
          shadow?: string;
          animation?: {
            transition?: string;
            initialTransform?: string;
            visibleTransform?: string;
          };
          list?: {
            font?: {
              family?: string;
              weight?: string;
              size?: string;
              color?: string;
            };
            selectedIcon?: {
              color?: string;
              svg?: string;
            };
            hoverBackgroundColor?: string;
            activeBackgroundColor?: string;
            divider?: string;
          };
        };
        tabs?: {
          borderRadius?: string | {
            topLeft?: string;
            topRight?: string;
            bottomLeft?: string;
            bottomRight?: string;
          };
          transition?: string;
          default?: {
            backgroundColor?: string;
            hoverBackgroundColor?: string;
            activeBackgroundColor?: string;
            font?: {
              family?: string;
              weight?: string;
              size?: string;
              color?: string;
            };
            indicatorColor?: string;
            indicatorHeight?: string;
            unreadIndicator?: {
              font?: {
                family?: string;
                weight?: string;
                size?: string;
                color?: string;
              };
              backgroundColor?: string;
              borderRadius?: string;
              padding?: string;
            };
          };
          selected?: {
            backgroundColor?: string;
            hoverBackgroundColor?: string;
            activeBackgroundColor?: string;
            font?: {
              family?: string;
              weight?: string;
              size?: string;
              color?: string;
            };
            indicatorColor?: string;
            indicatorHeight?: string;
            unreadIndicator?: {
              font?: {
                family?: string;
                weight?: string;
                size?: string;
                color?: string;
              };
              backgroundColor?: string;
              borderRadius?: string;
              padding?: string;
            };
          };
        };
      };
      tabs?: {
        borderRadius?: string | {
          topLeft?: string;
          topRight?: string;
          bottomLeft?: string;
          bottomRight?: string;
        };
        transition?: string;
        default?: {
          backgroundColor?: string;
          hoverBackgroundColor?: string;
          activeBackgroundColor?: string;
          font?: {
            family?: string;
            weight?: string;
            size?: string;
            color?: string;
          };
          indicatorColor?: string;
          indicatorHeight?: string;
          unreadIndicator?: {
            font?: {
              family?: string;
              weight?: string;
              size?: string;
              color?: string;
            };
            backgroundColor?: string;
            borderRadius?: string;
            padding?: string;
          };
        };
        selected?: {
          backgroundColor?: string;
          hoverBackgroundColor?: string;
          activeBackgroundColor?: string;
          font?: {
            family?: string;
            weight?: string;
            size?: string;
            color?: string;
          };
          indicatorColor?: string;
          indicatorHeight?: string;
          unreadIndicator?: {
            font?: {
              family?: string;
              weight?: string;
              size?: string;
              color?: string;
            };
            backgroundColor?: string;
            borderRadius?: string;
            padding?: string;
          };
        };
      };
      actions?: {
        button?: {
          icon?: {
            color?: string;
            svg?: string;
          };
          backgroundColor?: string;
          hoverBackgroundColor?: string;
          activeBackgroundColor?: string;
        };
        markAllRead?: {
          icon?: {
            color?: string;
            svg?: string;
          };
          text?: string;
        };
        archiveAll?: {
          icon?: {
            color?: string;
            svg?: string;
          };
          text?: string;
        };
        archiveRead?: {
          icon?: {
            color?: string;
            svg?: string;
          };
          text?: string;
        };
        animation?: {
          transition?: string;
          initialTransform?: string;
          visibleTransform?: string;
        };
        menu?: {
          backgroundColor?: string;
          border?: string;
          borderRadius?: string;
          shadow?: string;
          animation?: {
            transition?: string;
            initialTransform?: string;
            visibleTransform?: string;
          };
          list?: {
            font?: {
              family?: string;
              weight?: string;
              size?: string;
              color?: string;
            };
            selectedIcon?: {
              color?: string;
              svg?: string;
            };
            hoverBackgroundColor?: string;
            activeBackgroundColor?: string;
            divider?: string;
          };
        };
      };
    };
    list?: {
      backgroundColor?: string;
      scrollbar?: {
        trackBackgroundColor?: string;
        thumbColor?: string;
        thumbHoverColor?: string;
        width?: string;
        height?: string;
        borderRadius?: string;
      };
      item?: {
        unreadIndicatorColor?: string;
        backgroundColor?: string;
        hoverBackgroundColor?: string;
        activeBackgroundColor?: string;
        transition?: string;
        title?: {
          family?: string;
          weight?: string;
          size?: string;
          color?: string;
        };
        subtitle?: {
          family?: string;
          weight?: string;
          size?: string;
          color?: string;
        };
        time?: {
          family?: string;
          weight?: string;
          size?: string;
          color?: string;
        };
        archiveIcon?: {
          color?: string;
          svg?: string;
        };
        divider?: string;
        actions?: {
          backgroundColor?: string;
          hoverBackgroundColor?: string;
          activeBackgroundColor?: string;
          border?: string;
          borderRadius?: string;
          shadow?: string;
          font?: {
            family?: string;
            weight?: string;
            size?: string;
            color?: string;
          };
        };
        menu?: {
          enabled?: boolean;
          backgroundColor?: string;
          border?: string;
          borderRadius?: string;
          shadow?: string;
          animation?: {
            transition?: string;
            initialTransform?: string;
            visibleTransform?: string;
          };
          longPress?: {
            displayDuration?: number;
            vibrationDuration?: number;
          };
          item?: {
            hoverBackgroundColor?: string;
            activeBackgroundColor?: string;
            borderRadius?: string;
            read?: {
              color?: string;
              svg?: string;
            };
            unread?: {
              color?: string;
              svg?: string;
            };
            archive?: {
              color?: string;
              svg?: string;
            };
            unarchive?: {
              color?: string;
              svg?: string;
            };
          };
        };
      };
    };
    loading?: {
      animation?: {
        barColor?: string;
        barHeight?: string;
        barBorderRadius?: string;
        duration?: string;
      };
      divider?: string;
    };
    empty?: {
      title?: {
        font?: {
          family?: string;
          weight?: string;
          size?: string;
          color?: string;
        };
        text?: string;
      };
      button?: {
        font?: {
          family?: string;
          weight?: string;
          size?: string;
          color?: string;
        };
        text?: string;
        shadow?: string;
        border?: string;
        borderRadius?: string;
        backgroundColor?: string;
        hoverBackgroundColor?: string;
        activeBackgroundColor?: string;
      };
    };
    error?: {
      title?: {
        font?: {
          family?: string;
          weight?: string;
          size?: string;
          color?: string;
        };
        text?: string;
      };
      button?: {
        font?: {
          family?: string;
          weight?: string;
          size?: string;
          color?: string;
        };
        text?: string;
        shadow?: string;
        border?: string;
        borderRadius?: string;
        backgroundColor?: string;
        hoverBackgroundColor?: string;
        activeBackgroundColor?: string;
      };
    };
  };
};