frontend: secondary-hover -> hover-bg-secondary

twenty-frontend/src/css/_global.scss

@@ -1,4 +1,5 @@
 ul {
+  list-style-type: none;
   margin: 0;
   padding: 0;
 }

twenty-frontend/src/css/main.scss

@@ -17,12 +17,7 @@ body {
   font-weight: normal;
 }
 
-ul {
-  list-style-type: none;
-  padding: 0;
-  margin: 0;
-}
-.secondary-hover {
+.hover-bg-secondary {
   &:hover {
     @extend .no-underline;
     @extend .p-3;

twenty-frontend/src/js/components/Group.tsx

@@ -32,7 +32,7 @@ export function Group({ groupName, getItems }: Props) {
               return (
                 <li
                   className={classnames(
-                    "flex flex-row p-3 secondary-hover w-full",
+                    "flex flex-row p-3 hover-bg-secondary w-full",
                     classes,
                   )}
                   key={key}

twenty-frontend/src/js/components/NavBar.tsx

@@ -12,7 +12,7 @@ const ACTIVE_CLASSNAMES = [
 const INACTIVE_CLASSNAMES = [
   ...BASE_CLASSNAMES,
   "text-accent",
-  "secondary-hover",
+  "hover-bg-secondary",
 ].join(" ");
 
 type Item = { text: string; href: string };