Dashboard页面更新
This commit is contained in:
parent
1cd8f46fc7
commit
6ff5773ca3
@ -24,6 +24,7 @@ public function __construct()
|
||||
'userName' => Auth::user()->username,
|
||||
'userEmail' => Auth::user()->email,
|
||||
'userLinkId' => Auth::user()->linkId,
|
||||
'userIcon' => Auth::user()->icon,
|
||||
];
|
||||
}
|
||||
|
||||
|
||||
@ -1016,6 +1016,9 @@ .right-0{
|
||||
.top-0{
|
||||
top: 0px;
|
||||
}
|
||||
.-left-1{
|
||||
left: -0.25rem;
|
||||
}
|
||||
.z-10{
|
||||
z-index: 10;
|
||||
}
|
||||
@ -1031,12 +1034,6 @@ .z-40{
|
||||
.z-50{
|
||||
z-index: 50;
|
||||
}
|
||||
.m-4{
|
||||
margin: 1rem;
|
||||
}
|
||||
.m-10{
|
||||
margin: 2.5rem;
|
||||
}
|
||||
.m-5{
|
||||
margin: 1.25rem;
|
||||
}
|
||||
@ -1158,6 +1155,9 @@ .h-full{
|
||||
.h-screen{
|
||||
height: 100vh;
|
||||
}
|
||||
.h-12{
|
||||
height: 3rem;
|
||||
}
|
||||
.min-h-full{
|
||||
min-height: 100%;
|
||||
}
|
||||
@ -1167,6 +1167,9 @@ .min-h-screen{
|
||||
.w-1\/2{
|
||||
width: 50%;
|
||||
}
|
||||
.w-10{
|
||||
width: 2.5rem;
|
||||
}
|
||||
.w-3{
|
||||
width: 0.75rem;
|
||||
}
|
||||
@ -1191,6 +1194,12 @@ .w-auto{
|
||||
.w-full{
|
||||
width: 100%;
|
||||
}
|
||||
.w-44{
|
||||
width: 11rem;
|
||||
}
|
||||
.w-12{
|
||||
width: 3rem;
|
||||
}
|
||||
.max-w-6xl{
|
||||
max-width: 72rem;
|
||||
}
|
||||
@ -1260,6 +1269,9 @@ .grid-cols-4{
|
||||
.grid-cols-7{
|
||||
grid-template-columns: repeat(7, minmax(0, 1fr));
|
||||
}
|
||||
.grid-cols-12{
|
||||
grid-template-columns: repeat(12, minmax(0, 1fr));
|
||||
}
|
||||
.flex-col{
|
||||
flex-direction: column;
|
||||
}
|
||||
@ -1292,6 +1304,11 @@ .space-x-2 > :not([hidden]) ~ :not([hidden]){
|
||||
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
||||
margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
|
||||
}
|
||||
.space-x-4 > :not([hidden]) ~ :not([hidden]){
|
||||
--tw-space-x-reverse: 0;
|
||||
margin-right: calc(1rem * var(--tw-space-x-reverse));
|
||||
margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
|
||||
}
|
||||
.space-y-2 > :not([hidden]) ~ :not([hidden]){
|
||||
--tw-space-y-reverse: 0;
|
||||
margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
|
||||
@ -1302,6 +1319,15 @@ .space-y-6 > :not([hidden]) ~ :not([hidden]){
|
||||
margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
|
||||
margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
|
||||
}
|
||||
.divide-y > :not([hidden]) ~ :not([hidden]){
|
||||
--tw-divide-y-reverse: 0;
|
||||
border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
|
||||
border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
|
||||
}
|
||||
.divide-gray-100 > :not([hidden]) ~ :not([hidden]){
|
||||
--tw-divide-opacity: 1;
|
||||
border-color: rgb(243 244 246 / var(--tw-divide-opacity));
|
||||
}
|
||||
.overflow-hidden{
|
||||
overflow: hidden;
|
||||
}
|
||||
@ -1328,9 +1354,6 @@ .rounded-lg{
|
||||
.rounded-md{
|
||||
border-radius: 0.375rem;
|
||||
}
|
||||
.rounded-3xl{
|
||||
border-radius: 1.5rem;
|
||||
}
|
||||
.rounded-l-lg{
|
||||
border-top-left-radius: 0.5rem;
|
||||
border-bottom-left-radius: 0.5rem;
|
||||
@ -1345,9 +1368,6 @@ .border{
|
||||
.border-0{
|
||||
border-width: 0px;
|
||||
}
|
||||
.border-2{
|
||||
border-width: 2px;
|
||||
}
|
||||
.border-t{
|
||||
border-top-width: 1px;
|
||||
}
|
||||
@ -1374,10 +1394,6 @@ .border-gray-300{
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(209 213 219 / var(--tw-border-opacity));
|
||||
}
|
||||
.border-black{
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(0 0 0 / var(--tw-border-opacity));
|
||||
}
|
||||
.bg-blue-100{
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(225 239 254 / var(--tw-bg-opacity));
|
||||
@ -1438,6 +1454,9 @@ .p-4{
|
||||
.p-6{
|
||||
padding: 1.5rem;
|
||||
}
|
||||
.p-5{
|
||||
padding: 1.25rem;
|
||||
}
|
||||
.px-2{
|
||||
padding-left: 0.5rem;
|
||||
padding-right: 0.5rem;
|
||||
@ -1482,6 +1501,10 @@ .py-4{
|
||||
padding-top: 1rem;
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
.px-4{
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
}
|
||||
.pl-11{
|
||||
padding-left: 2.75rem;
|
||||
}
|
||||
@ -1491,12 +1514,23 @@ .pt-2{
|
||||
.pt-8{
|
||||
padding-top: 2rem;
|
||||
}
|
||||
.ps-5{
|
||||
-webkit-padding-start: 1.25rem;
|
||||
padding-inline-start: 1.25rem;
|
||||
}
|
||||
.ps-3{
|
||||
-webkit-padding-start: 0.75rem;
|
||||
padding-inline-start: 0.75rem;
|
||||
}
|
||||
.text-left{
|
||||
text-align: left;
|
||||
}
|
||||
.text-center{
|
||||
text-align: center;
|
||||
}
|
||||
.text-right{
|
||||
text-align: right;
|
||||
}
|
||||
.text-2xl{
|
||||
font-size: 1.5rem;
|
||||
line-height: 2rem;
|
||||
@ -1624,6 +1658,11 @@ .ring-1{
|
||||
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
||||
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
||||
}
|
||||
.ring-2{
|
||||
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
||||
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
||||
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
||||
}
|
||||
.ring-inset{
|
||||
--tw-ring-inset: inset;
|
||||
}
|
||||
@ -1761,6 +1800,10 @@ .group:hover .group-hover\:text-gray-900{
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(17 24 39 / var(--tw-text-opacity));
|
||||
}
|
||||
:is(.dark .dark\:divide-gray-600) > :not([hidden]) ~ :not([hidden]){
|
||||
--tw-divide-opacity: 1;
|
||||
border-color: rgb(75 85 99 / var(--tw-divide-opacity));
|
||||
}
|
||||
:is(.dark .dark\:border-blue-500){
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(63 131 248 / var(--tw-border-opacity));
|
||||
@ -1830,6 +1873,14 @@ :is(.dark .dark\:text-white){
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(255 255 255 / var(--tw-text-opacity));
|
||||
}
|
||||
:is(.dark .dark\:text-gray-200){
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(229 231 235 / var(--tw-text-opacity));
|
||||
}
|
||||
:is(.dark .dark\:ring-gray-500){
|
||||
--tw-ring-opacity: 1;
|
||||
--tw-ring-color: rgb(107 114 128 / var(--tw-ring-opacity));
|
||||
}
|
||||
:is(.dark .dark\:hover\:bg-blue-700:hover){
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(26 86 219 / var(--tw-bg-opacity));
|
||||
|
||||
@ -24,11 +24,47 @@ class="inline-flex items-center p-2 mt-2 ml-3 text-sm text-gray-500 rounded-lg s
|
||||
|
||||
<div class="p-4 sm:ml-64">
|
||||
<div class="p-4 border-gray-200 border-dashed rounded-lg dark:border-gray-700">
|
||||
<div class="grid grid-cols-1 gap-4 mb-4">
|
||||
<div class="text-2xl text-gray-400 dark:text-gray-500"><i class="bi bi-person"></i> 个人信息</div>
|
||||
<div class="grid grid-cols-2 gap-4 mb-4 rounded bg-gray-50 dark:bg-gray-800 shadow">
|
||||
<div class="flex items-center justify-start h-16">
|
||||
<div class="grid grid-cols-12">
|
||||
<a class="flex ps-5" href="">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" class="bi bi-bell" viewBox="0 0 16 16">
|
||||
<path d="M8 16a2 2 0 0 0 2-2H6a2 2 0 0 0 2 2zM8 1.918l-.797.161A4.002 4.002 0 0 0 4 6c0 .628-.134 2.197-.459 3.742-.16.767-.376 1.566-.663 2.258h10.244c-.287-.692-.502-1.49-.663-2.258C12.134 8.197 12 6.628 12 6a4.002 4.002 0 0 0-3.203-3.92L8 1.917zM14.22 12c.223.447.481.801.78 1H1c.299-.199.557-.553.78-1C2.68 10.2 3 6.88 3 6c0-2.42 1.72-4.44 4.005-4.901a1 1 0 1 1 1.99 0A5.002 5.002 0 0 1 13 6c0 .88.32 4.2 1.22 6z"/>
|
||||
</svg>
|
||||
</a>
|
||||
<a class="flex ps-3" href="">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" class="bi bi-bell" viewBox="0 0 16 16">
|
||||
<path d="M8 16a2 2 0 0 0 2-2H6a2 2 0 0 0 2 2zM8 1.918l-.797.161A4.002 4.002 0 0 0 4 6c0 .628-.134 2.197-.459 3.742-.16.767-.376 1.566-.663 2.258h10.244c-.287-.692-.502-1.49-.663-2.258C12.134 8.197 12 6.628 12 6a4.002 4.002 0 0 0-3.203-3.92L8 1.917zM14.22 12c.223.447.481.801.78 1H1c.299-.199.557-.553.78-1C2.68 10.2 3 6.88 3 6c0-2.42 1.72-4.44 4.005-4.901a1 1 0 1 1 1.99 0A5.002 5.002 0 0 1 13 6c0 .88.32 4.2 1.22 6z"/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-end h-16">
|
||||
<div class="flex items-center space-x-4 m-5">
|
||||
<div class="font-medium dark:text-white">
|
||||
<div class="text-right">{{ $userName }}</div>
|
||||
<div class="text-sm text-gray-500 dark:text-gray-400">{{ $userEmail }}</div>
|
||||
</div>
|
||||
<img id="avatarButton" type="button" data-dropdown-toggle="userDropdown" data-dropdown-placement="bottom-start" class="w-10 h-10 rounded-full cursor-pointer" src="{{ $userIcon }}" alt="">
|
||||
<!-- Dropdown menu -->
|
||||
<div id="userDropdown" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow w-44 dark:bg-gray-700 dark:divide-gray-600">
|
||||
<ul class="py-2 text-sm text-gray-700 dark:text-gray-200" aria-labelledby="avatarButton">
|
||||
<li>
|
||||
<a href="#" class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
|
||||
<i class="bi bi-person-rolodex"></i>
|
||||
<span class="flex-1 ml-3 whitespace-nowrap">个人设置</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="py-1">
|
||||
<a href="{{ route('logout') }}" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:hover:bg-gray-600 dark:text-gray-200 dark:hover:text-white">
|
||||
<i class="bi bi-box-arrow-left"></i>
|
||||
<span class="flex-1 ml-3 whitespace-nowrap">登出</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex h-48 mb-4 rounded bg-gray-50 dark:bg-gray-800 shadow">
|
||||
<p class="text-2xl text-gray-400 dark:text-gray-500 m-5"><i class="bi bi-emoji-smile"></i> 你好：<b class="text-black dark:text-white">{{ $userName ?? '' }}</b></p>
|
||||
</div>
|
||||
<div class="grid grid-cols-1 gap-4 mb-4">
|
||||
<div class="text-2xl text-gray-400 dark:text-gray-500"><i class="bi bi-link-45deg"></i> 友链概况</div>
|
||||
|
||||
@ -72,13 +72,6 @@ class="flex items-center p-2 text-gray-900 rounded-lg dark:text-white hover:bg-g
|
||||
<span class="flex-1 ml-3 whitespace-nowrap">主页设置</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#"
|
||||
class="flex items-center p-2 text-gray-900 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700">
|
||||
<i class="bi bi-person-vcard"></i>
|
||||
<span class="flex-1 ml-3 whitespace-nowrap">账户管理</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#"
|
||||
class="flex items-center p-2 text-gray-900 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700">
|
||||
@ -86,13 +79,6 @@ class="flex items-center p-2 text-gray-900 rounded-lg dark:text-white hover:bg-g
|
||||
<span class="flex-1 ml-3 whitespace-nowrap">系统设置</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="{{ route('logout') }}"
|
||||
class="flex items-center p-2 text-gray-900 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700">
|
||||
<i class="bi bi-box-arrow-left"></i>
|
||||
<span class="flex-1 ml-3 whitespace-nowrap">登出</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user