chore(templates): hide admin bar for website template on small screens (#8601)
Hides the admin bar component for website template on mobile.
This commit is contained in:
committed by
GitHub
parent
1bf580fac3
commit
f6e5244204
7
templates/website/src/components/AdminBar/index.scss
Normal file
7
templates/website/src/components/AdminBar/index.scss
Normal file
@@ -0,0 +1,7 @@
|
||||
@import '~@payloadcms/ui/scss';
|
||||
|
||||
.admin-bar {
|
||||
@include small-break {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@@ -8,6 +8,10 @@ import { PayloadAdminBar } from 'payload-admin-bar'
|
||||
import React, { useState } from 'react'
|
||||
import { useRouter } from 'next/navigation'
|
||||
|
||||
import './index.scss'
|
||||
|
||||
const baseClass = 'admin-bar'
|
||||
|
||||
const collectionLabels = {
|
||||
pages: {
|
||||
plural: 'Pages',
|
||||
@@ -40,7 +44,7 @@ export const AdminBar: React.FC<{
|
||||
|
||||
return (
|
||||
<div
|
||||
className={cn('py-2 bg-black text-white', {
|
||||
className={cn(baseClass, 'py-2 bg-black text-white', {
|
||||
block: show,
|
||||
hidden: !show,
|
||||
})}
|
||||
|
||||
Reference in New Issue
Block a user