<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8"/>
        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
        <title> <?php echo $appName." / ".$title; ?></title>
        <script src="public/scripts/jQuery.js"></script>
        <link href="public/fonts/setup.css" rel="stylesheet" ></link>
        <link href="public/images/site_logo.png" rel="icon" ></link>
        <link href="public/styles/global.css" rel="stylesheet"></link>
        <link href="public/styles/admin/partials/header.css" rel="stylesheet"></link>
    </head>
    <body>
    <section class='Header'>
        <div class='wrapper region'>
            <div class='logo'>
                <div class='date'><?php echo $title ?></div>
            </div>
            <form class='search'>
                <input type='text' name='q' required />
                <input type='submit' value='បញ្ជូន' />
            </form>
            <div class='logout'>
                <a href='./'>ទំព័រ​ដើម</a> | <a href='/logout'>ចេញ​ក្រៅ</a>
            </div>
        </div>
    </section>
    <div class='site region'>

 

.Header{
    background: var(--background-dark);
    padding: 10px 0;
}

.Header .wrapper{
    display: grid;
    grid-template-columns: 25% auto 25%;
    align-items: center;
}

.Header .wrapper .logo{
    font: 30px/1.5 Anton, Moul;
}

.Header .wrapper .search{
    display: grid;
    grid-template-columns: 80% 20%;
}

.Header .wrapper .search input{
    padding: 2px 10px;
    font: var(--body-font);
}

.Header .wrapper .logout{
    text-align: right;
    font-size: 18px;
}

 

Epizy: http://khmerweb.epizy.com