MERMS/MermsPanelReactJS
1
0
Fork 0
Code Issues Pull Requests 1 Releases Activity

mobile user image toggle fixed

Browse Source
This commit is contained in:
victorAnumudu
2024-12-07 13:00:14 +01:00
parent 0a316ac997
commit 7bad07b692
2 changed files with 15 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/component/layout/layoutcom/UserHeader.jsx
+12 -3
View File
@@ -3,18 +3,27 @@ import getImage from "../../../utils/getImage";
export default function UserHeader(){ export default function UserHeader(){
const toggleSidebar = (e) => {
e.preventDefault()
}
// const toggleSidebarMini = (e) => {
// e.preventDefault()
// }
return ( return (
<header className="app-header top-bar"> <header className="app-header top-bar">
<nav className="navbar navbar-expand-md"> <nav className="navbar navbar-expand-md">
<div className="navbar-header d-flex align-items-center"> <div className="navbar-header d-flex align-items-center">
<a href="#" className="mobile-toggle"><i className="ti ti-align-right"></i></a> <a href="#" onClick={toggleSidebar} className="mobile-toggle"><i className="ti ti-align-right"></i></a>
<a className="navbar-brand" href="/dash"> <a className="navbar-brand" href="/dash">
<img src={getImage('logo-light.png')} className="img-fluid logo-desktop" alt="logo"/> <img src={getImage('logo-light.png')} className="img-fluid logo-desktop" alt="logo"/>
<img src={getImage('logo-icon.png')} className="img-fluid logo-mobile" alt="logo"/> <img src={getImage('logo-icon.png')} className="img-fluid logo-mobile" alt="logo"/>
</a> </a>
</div> </div>
<button className="navbar-toggler" type="button" data-toggle="collapse" <button className="navbar-toggler" type="button" data-bs-toggle="collapse"
data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
aria-label="Toggle navigation"> aria-label="Toggle navigation">
<i className="ti ti-align-left"></i> <i className="ti ti-align-left"></i>
</button> </button>
src/css/partials/_header.scss
+3 -3
View File
@@ -324,19 +324,19 @@
@include mobile-landscape { @include mobile-landscape {
margin:0 !important; margin:0 !important;
justify-content: space-between; justify-content: end;
padding:0 30px; padding:0 30px;
width: 100%;; width: 100%;;
} }
@include mobile-portrait-sm { @include mobile-portrait-sm {
margin:0 !important; margin:0 !important;
justify-content: space-between; justify-content: end;
padding:0 30px; padding:0 30px;
width: 100%;; width: 100%;;
} }
@include mobile-portrait-xs { @include mobile-portrait-xs {
margin:0 !important; margin:0 !important;
justify-content: space-between; justify-content: end;
padding:0 30px; padding:0 30px;
width: 100%;; width: 100%;;
} }