[web] [refactor] move unread button css to its own component

Summary:
Moving some of the chat-thread-list.css css to chat-thread-list-item-menu.css as a way to separate some of the CSS we're using in multiple places.

The goal is to isolate the CSS so we don't break functionality in other parts of the app.

At some point down the road, we should break up all of the css files and remove replicated CSS. https://linear.app/comm/issue/ENG-868/break-out-thread-list-css-into-their-own-files

Test Plan:
make sure mark as unread css is working as expected.

  const menuIconSize = renderStyle === 'chat' ? 24 : 16;
  const btnCls = classNames(css.menuContent, {
    [css.menuContentVisible]: menuVisible,
  });
  return (
    <div className={css.menu} onMouseLeave={hideMenu}>
      <button onClick={toggleMenu}>
        <SWMansionIcon icon="menu-vertical" size={menuIconSize} />
      </button>
      <div>
        <button className={btnCls} onClick={toggleUnreadStatus}>
          <SWMansionIcon className={css.mailIcon} icon="mail" size={18} />
          {toggleUnreadStatusButtonText}
        </button>
      </div>
    </div>
  );
}

looking at the mark as unread component, all CSS classes moved here are used in the component.

Reviewers: atul, ashoat

Reviewed By: ashoat

Subscribers: ashoat, palys-swm, Adrian, karol-bisztyga

Differential Revision: https://phabricator.ashoat.com/D3409