commit cd4f1487a2a469b1a86eb35e49b6ab3fa9071d92 · notnite.com/moonlight

+12

packages/core-extensions/src/moonbase/style.css

···

       101
       101
        
         margin: 32px 0;

     

       102
       102
        
       }

     

       103
       103
        
       

     

       104
       104
       +
       .moonlight-card-info-header {

     

       105
       105
       +
         margin-bottom: 0.25rem;

     

       106
       106
       +
       }

     

       107
       107
       +
       

     

       108
       108
       +
       .moonlight-card-badge {

     

       109
       109
       +
         border-radius: 0.1875rem;

     

       110
       110
       +
         padding: 0 0.275rem;

     

       111
       111
       +
         margin-right: 0.4em;

     

       112
       112
       +
         background-color: var(--badge-color, var(--bg-mod-strong));

     

       113
       113
       +
         color: #ffffff;

     

       114
       114
       +
       }

     

       115
       115
       +
       

     

       104
       116
        
       /* Crash screen */

     

       105
       117
        
       .moonbase-crash-wrapper > [class^="buttons_"] {

     

       106
       118
        
         gap: 1rem;

+15 -14

packages/core-extensions/src/moonbase/webpackModules/ui/extensions/info.tsx

···

       42
       42
        
               marginRight: "1em"

     

       43
       43
        
             }}

     

       44
       44
        
           >

     

       45
       45
       -
             <Text variant="eyebrow">{title}</Text>

     

       45
       45
       +
             <Text variant="eyebrow" className="moonlight-card-info-header">

     

       46
       46
       +
               {title}

     

       47
       47
       +
             </Text>

     

       46
       48
        
       

     

       47
       49
        
             <Text variant="text-sm/normal">{children}</Text>

     

       48
       50
        
           </div>

     
···

       52
       54
        
       function Badge({ color, children }: { color: string; children: React.ReactNode }) {

     

       53
       55
        
         return (

     

       54
       56
        
           <span

     

       55
       55
       -
             style={{

     

       56
       56
       -
               borderRadius: ".1875rem",

     

       57
       57
       -
               padding: "0 0.275rem",

     

       58
       58
       -
               marginRight: "0.4em",

     

       59
       59
       -
               backgroundColor: color,

     

       60
       60
       -
               color: "#fff"

     

       61
       61
       -
             }}

     

       57
       57
       +
             className="moonlight-card-badge"

     

       58
       58
       +
             style={

     

       59
       59
       +
               {

     

       60
       60
       +
                 "--badge-color": color

     

       61
       61
       +
               } as React.CSSProperties

     

       62
       62
       +
             }

     

       62
       63
        
           >

     

       63
       64
        
             {children}

     

       64
       65
        
           </span>

     
···

       130
       131
        
                   const name = tagNames[tag];

     

       131
       132
        
       

     

       132
       133
        
                   return (

     

       133
       133
       -
                     <Badge key={i} color={tag === ExtensionTag.DangerZone ? "var(--red-400)" : "var(--brand-500)"}>

     

       134
       134
       +
                     <Badge key={i} color={tag === ExtensionTag.DangerZone ? "var(--red-400)" : "var(--bg-mod-strong)"}>

     

       134
       135
        
                       {name}

     

       135
       136
        
                     </Badge>

     

       136
       137
        
                   );

     
···

       141
       142
        
             {dependencies.length > 0 && (

     

       142
       143
        
               <InfoSection title="Dependencies">

     

       143
       144
        
                 {dependencies.map((dep) => {

     

       144
       144
       -
                   const colors = {

     

       145
       145
       -
                     [DependencyType.Dependency]: "var(--brand-500)",

     

       146
       146
       -
                     [DependencyType.Optional]: "var(--orange-400)",

     

       145
       145
       +
                   /*const colors = {

     

       146
       146
       +
                     [DependencyType.Dependency]: "var(--bg-mod-strong)",

     

       147
       147
       +
                     [DependencyType.Optional]: "var(--bg-mod-faint)",

     

       147
       148
        
                     [DependencyType.Incompatible]: "var(--red-400)"

     

       148
       149
        
                   };

     

       149
       149
       -
                   const color = colors[dep.type];

     

       150
       150
       +
                   const color = colors[dep.type];*/

     

       150
       151
        
                   const name = MoonbaseSettingsStore.tryGetExtensionName(dep.id);

     

       151
       152
        
       

     

       152
       153
        
                   return (

     

       153
       153
       -
                     <Badge color={color} key={dep.id}>

     

       154
       154
       +
                     <Badge color="var(--bg-mod-strong)" key={dep.id}>

     

       154
       155
        
                       {name}

     

       155
       156
        
                     </Badge>

     

       156
       157
        
                   );