style: adapt restriction table

ts/Manager/App.scss

@@ -91,7 +91,8 @@ pre {
   }
 }
 
-#bbb-react-root {
+#bbb-react-root,
+#bbb-restrictions {
   #bbb-warning,
   #bbb-success {
     margin: 3em;
@@ -118,11 +119,11 @@ pre {
     line-height: 0;
     display: inline-block;
 
-    .icon {
+    &:not(button:disabled) .icon {
       opacity: 0.5;
     }
 
-    &:hover {
+    &:not(button:disabled):hover {
       background-color: var(--color-background-dark);
 
       .icon {

ts/Restrictions/RestrictionRow.tsx

@@ -72,9 +72,9 @@ const RestrictionRoom: React.FC<Props> = (props) => {
 			</td>
 
 			<td className="remove icon-col">
-				{restriction.groupId && <a className="icon icon-delete icon-visible"
-					onClick={deleteRow as any}
-					title={t('bbb', 'Delete')} />}
+				<button disabled={!restriction.groupId} className="action-item" onClick={deleteRow as any} title={t('bbb', 'Delete')}>
+					<span className="icon icon-delete icon-visible"></span>
+				</button>
 			</td>
 		</tr>
 	);