This commit is contained in:
nguyen van thai
2024-06-28 16:27:39 +07:00
parent cbc0f8b7c0
commit 26e4a289d7
4 changed files with 29 additions and 19 deletions
@@ -13,23 +13,23 @@ onMounted(() => {
<template>
<header id="header" class="main-header">
<div class="main-header-topbar ">
<div class="flex items-center">
<time class="text-capitalize text-white" :datetime="currentDateTime">{{ currentDateTime }} GMT+7</time>
<div class="flex items-center !py-3px">
<time class="text-capitalize text-white text-12px" :datetime="currentDateTime">{{ currentDateTime }} GMT+7</time>
<div class="main-header-topbar-listag">
</div>
<div class="main-header-topbar-infor flex items-center">
<div>
<div class="text-white">
<div class="text-white text-12px">
<span>HOTLINE: </span>
<a href="tel:0865015015"> 0865.015.015</a>
<span> - </span>
<a href="tel:0977456112">0977.456.112</a>
</div>
</div>
<div>
<a href=""><Icon class="" name="ic:baseline-facebook" /></a>
<a href=""><Icon class="" name="ion:logo-youtube" /></a>
<div class="flex items-center">
<a class="flex" href=""><Icon class="text-12px" name="ic:baseline-facebook" /></a>
<a class="flex" href=""><Icon class="" name="ion:logo-youtube" /></a>
</div>
</div>
</div>
@@ -59,10 +59,10 @@ onMounted(() => {
</div>
</div>
<div class="main-header-control">
<div class="header-control-container">
<div class="header-control-container !py-2">
<div>
<div class="header-control_tag">
<h5>Xu hướng</h5>
<label>Xu hướng</label>
</div>
<div class="header-control_article">
<h4>Thư du học sinh: Hoa Học Trò cánh cửa thần kỳ dẫn tớ đến thế giới rộng lớn hơn</h4>
@@ -72,7 +72,7 @@ onMounted(() => {
<Icon name="material-symbols-light:search" />
</div>
<div>
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSwdIVSqaMsmZyDbr9mDPk06Nss404fosHjLg&s" width="40" height="40" class="rounded-circle" alt="">
<img src="http://picsum.photos/1024/600?random=1" width="40" height="40" class="rounded-circle" alt="">
</div>
</div>
</div>
@@ -162,10 +162,13 @@ onMounted(() => {
.header-control {
&_tag {
position: relative;
h5 {
height: 30px;
label {
font-size: 12px;
text-transform: uppercase;
padding: 4px 12px 0 12px;
padding: 0 16px 0 12px;
display: flex;
align-items: center;
height: 100%;
margin: 0;
border: 1px solid #000;
@@ -194,9 +197,16 @@ onMounted(() => {
&_control {
display: flex;
align-items: center;
gap: 10px;
gap: 20px;
svg {
font-size: 30px;
font-size: 36px;
}
img {
width: 32px;
height: 32px;
object-fit: cover;
border-radius: 999px;
}
}
}