Fix selector style

packages/artplayer/src/style/selector.scss

@@ -5,7 +5,8 @@
             display: none;
             position: absolute;
             bottom: 35px;
-            width: 100px;
+            min-width: 100px;
+            max-width: 200px;
             padding: 5px 0;
             text-align: center;
             color: #fff;
@@ -17,6 +18,7 @@
                 overflow: hidden;
                 text-overflow: ellipsis;
                 white-space: nowrap;
+                padding: 0 5px;
                 text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
                 &:hover {
                     background-color: rgba(255, 255, 255, 0.1);

packages/artplayer/types/artplayer.d.ts

@@ -11,7 +11,7 @@ interface ComponentOption {
     disable?: boolean;
     name?: string;
     index?: number;
-    style?: object;
+    style?: ElementCSSInlineStyle['style'];
     click?(component: Component, event: Event): void;
     mounted?(element: HTMLElement): void;
     tooltip?: string;
@@ -91,7 +91,7 @@ interface Option {
     };
     subtitle?: {
         url: string;
-        style: object;
+        style: ElementCSSInlineStyle['style'];
         encoding: string;
         bilingual: boolean;
     };
@@ -291,7 +291,7 @@ declare class Artplayer extends Player {
         set show(state: boolean);
         set toggle(state: boolean);
         get url(): string;
-        style(name: string | object, value?: string): HTMLElement;
+        style(name: string | ElementCSSInlineStyle['style'], value?: string): HTMLElement;
         switch(url: string, option?: object): Promise<string>;
     };