studio: remove sidebar variant (#10952)

* create sidebarbutton component

* add sidebar button

* auto

* update import

packages/editor/src/components/toolbar/Toolbar.tsx

@@ -34,6 +34,7 @@ import { GLTFModifiedState } from '@etherealengine/engine/src/gltf/GLTFDocumentS
 import { getMutableState, getState, useHookstate, useMutableState } from '@etherealengine/hyperflux'
 import { useFind } from '@etherealengine/spatial/src/common/functions/FeathersHooks'
 import { ContextMenu } from '@etherealengine/ui/src/components/tailwind/ContextMenu'
+import { SidebarButton } from '@etherealengine/ui/src/components/tailwind/SidebarButton'
 import Button from '@etherealengine/ui/src/primitives/tailwind/Button'
 import { t } from 'i18next'
 import React from 'react'
@@ -201,10 +202,9 @@ export default function Toolbar() {
         <div className="flex w-fit min-w-44 flex-col gap-1 truncate rounded-lg bg-neutral-900 shadow-lg">
           {toolbarMenu.map(({ name, action, hotkey }, index) => (
             <div key={index}>
-              <Button
+              <SidebarButton
                 className="px-4 py-2.5 text-left font-light text-theme-input"
                 textContainerClassName="text-xs"
-                variant="sidebar"
                 size="small"
                 fullWidth
                 onClick={() => {
@@ -214,7 +214,7 @@ export default function Toolbar() {
                 endIcon={hotkey}
               >
                 {name}
-              </Button>
+              </SidebarButton>
             </div>
           ))}
         </div>

packages/ui/src/components/tailwind/SidebarButton/index.tsx

@@ -0,0 +1,36 @@
+/*
+CPAL-1.0 License
+
+The contents of this file are subject to the Common Public Attribution License
+Version 1.0. (the "License"); you may not use this file except in compliance
+with the License. You may obtain a copy of the License at
+https://github.com/EtherealEngine/etherealengine/blob/dev/LICENSE.
+The License is based on the Mozilla Public License Version 1.1, but Sections 14
+and 15 have been added to cover use of software over a computer network and 
+provide for limited attribution for the Original Developer. In addition, 
+Exhibit A has been modified to be consistent with Exhibit B.
+
+Software distributed under the License is distributed on an "AS IS" basis,
+WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License for the
+specific language governing rights and limitations under the License.
+
+The Original Code is Ethereal Engine.
+
+The Original Developer is the Initial Developer. The Initial Developer of the
+Original Code is the Ethereal Engine team.
+
+All portions of the code written by the Ethereal Engine team are Copyright © 2021-2023 
+Ethereal Engine. All Rights Reserved.
+*/
+
+import Button from '@etherealengine/ui/src/primitives/tailwind/Button'
+import React from 'react'
+import { twMerge } from 'tailwind-merge'
+
+export function SidebarButton({ children, className, ...rest }) {
+  return (
+    <Button className={twMerge('bg-[#141619]', className)} {...rest}>
+      {children}
+    </Button>
+  )
+}

packages/ui/src/primitives/tailwind/Button/index.tsx

@@ -32,7 +32,7 @@ export interface ButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
   endIcon?: ReactNode
   children?: ReactNode
   size?: 'small' | 'medium' | 'large'
-  variant?: 'primary' | 'secondary' | 'outline' | 'danger' | 'success' | 'transparent' | 'sidebar'
+  variant?: 'primary' | 'secondary' | 'outline' | 'danger' | 'success' | 'transparent'
   disabled?: boolean
   fullWidth?: boolean
   rounded?: 'partial' | 'full' | 'none'
@@ -59,8 +59,7 @@ const variants = {
   outline: 'border border-solid border-theme-primary bg-theme-surface-main dark:bg-theme-highlight text-theme-primary',
   danger: 'bg-red-500',
   success: 'bg-teal-700',
-  transparent: 'bg-transparent dark:bg-transparent',
-  sidebar: 'bg-[#141619]'
+  transparent: 'bg-transparent dark:bg-transparent'
 }
 
 const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(