hrms-bangkok/hrms-exam
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

ปรับ FullCalendar และหัวข้อปแต่ละหน้า

Browse source
This commit is contained in:
Tanyalak 2023-04-05 16:56:04 +07:00
parent 08bd7b0b6a
commit 9fc92cfbcd
11 changed files with 352 additions and 97 deletions
Download patch file Download diff file Expand all files Collapse all files

2
cms/src/app.html
View file

@ -6,9 +6,11 @@
<meta name="viewport" content="width=device-width" /> <meta name="viewport" content="width=device-width" />
<link rel="manifest" href="manifest.json" /> <link rel="manifest" href="manifest.json" />
<link rel="shortcut icon" href="/favicon.ico" /> <link rel="shortcut icon" href="/favicon.ico" />
<link rel="stylesheet" href="/styles/fullcalendar.css" />
<link rel="stylesheet" href="/styles/tailwind.css" /> <link rel="stylesheet" href="/styles/tailwind.css" />
<link rel="stylesheet" href="/vendor/fontawesome-free/css/all.min.css"/> <link rel="stylesheet" href="/vendor/fontawesome-free/css/all.min.css"/>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@100;200;300;400;500;600;700;800;900&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@100;200;300;400;500;600;700;800;900&display=swap">
<title>กองสรรหาบุคคล</title> <title>กองสรรหาบุคคล</title>
%sveltekit.head% %sveltekit.head%
</head> </head>

51
cms/src/app.postcss
View file

@ -28,4 +28,55 @@
} }
} }
.p-one{
background-image: linear-gradient(to top,rgba(71, 85, 105, 0.647),rgba(67, 84, 107, 0.807)),url('/images/p1.jpg');
}
.parallax-inner{
position:relative;
min-height: 130px;
background-position: top center;
background-attachment: fixed;
background-size: cover;
}
.parallax-inner > h2{
color: #fff;
text-transform: uppercase;
letter-spacing: 5px;
position: absolute;
top: 50%;
left: 0;
margin-top: -20.5px;
width: 100%;
text-align: center;
font-weight: 500;
}
.breadTaxt{
font-weight: 300;
letter-spacing: 2px;
}
body {
overflow: overlay;
}
/* custom scrollbar */
::-webkit-scrollbar {
width: 20px;
height: 20px;
}
::-webkit-scrollbar-track {
background-color: transparent !important;
-webkit-box-shadow: none;
}
::-webkit-scrollbar-thumb {
background-color: #d6dee1;
border-radius: 20px;
border: 6px solid transparent;
background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover {
background-color: #a8bbbf;
}
} }

9
cms/src/lib/components/ActivityCalendar.svelte
View file

@ -6,13 +6,16 @@
let calendarRef; let calendarRef;
export let events:CalendarEvent[] export let events:CalendarEvent[]
let options = { let options = {
themeSystem: 'bootstrap5',
initialView: 'dayGridMonth', initialView: 'dayGridMonth',
plugins: [daygridPlugin], plugins: [daygridPlugin],
locale: 'th', locale: 'th',
headerToolbar: { headerToolbar: {
start: 'prev,next', left: 'title',
center: 'title' center: '',
right: 'prev,next today'
}, },
contentHeight:"auto", contentHeight:"auto",
selectable: true, selectable: true,
buttonText: { buttonText: {

8
cms/src/lib/components/Footer.svelte
View file

@ -59,6 +59,7 @@
<a <a
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm" class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
href="https://webportal.bangkok.go.th/KSB" href="https://webportal.bangkok.go.th/KSB"
target="_blank"
> >
กองสรรหาบุคคล กองสรรหาบุคคล
</a> </a>
@ -67,6 +68,7 @@
<a <a
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm" class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
href="https://webportal.bangkok.go.th/pdbma" href="https://webportal.bangkok.go.th/pdbma"
target="_blank"
> >
กองพัฒนาระบบราชการ กองพัฒนาระบบราชการ
</a> </a>
@ -75,6 +77,7 @@
<a <a
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm" class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
href="https://webportal.bangkok.go.th/csc_personal" href="https://webportal.bangkok.go.th/csc_personal"
target="_blank"
> >
กองอัตรากำลัง กองอัตรากำลัง
</a> </a>
@ -83,6 +86,7 @@
<a <a
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm" class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
href="http://203.155.220.238/csc/index.php/en/discipline-morality" href="http://203.155.220.238/csc/index.php/en/discipline-morality"
target="_blank"
> >
กองทะเบียนประวัติข้าราชการ กองทะเบียนประวัติข้าราชการ
</a> </a>
@ -100,6 +104,7 @@
<a <a
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm" class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
href="https://main.bangkok.go.th/" href="https://main.bangkok.go.th/"
target="_blank"
> >
กรุงเทพมหานคร กรุงเทพมหานคร
</a> </a>
@ -108,6 +113,7 @@
<a <a
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm" class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
href="https://webportal.bangkok.go.th/pdd" href="https://webportal.bangkok.go.th/pdd"
target="_blank"
> >
สนป.กทม./กองการเจ้าหน้าที่ สนป.กทม./กองการเจ้าหน้าที่
</a> </a>
@ -116,6 +122,7 @@
<a <a
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm" class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
href="https://webportal.bangkok.go.th/bangkokeducation" href="https://webportal.bangkok.go.th/bangkokeducation"
target="_blank"
> >
สำนักการศึกษา กทม. สำนักการศึกษา กทม.
</a> </a>
@ -124,6 +131,7 @@
<a <a
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm" class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
href="https://www.ocsc.go.th/" href="https://www.ocsc.go.th/"
target="_blank"
> >
สำนักงาน ก.พ. สำนักงาน ก.พ.
</a> </a>

3
cms/src/lib/components/FullCalendar.svelte
View file

@ -53,3 +53,6 @@
</script> </script>
<div bind:this={calendarEl} class={classes} {style} /> <div bind:this={calendarEl} class={classes} {style} />
<style>
</style>

14
cms/src/lib/components/Header.svelte
View file

@ -1,4 +1,4 @@
<div class="navbar bg-white w-full top-0 z-50 fixed flex-wrap items-center justify-between px-4"> <div class="navbar bg-white w-full top-0 z-50 fixed flex-wrap items-center justify-between px-4 ">
<div <div
class="container px-4 mx-auto flex flex-no-wrap items-center justify-between" class="container px-4 mx-auto flex flex-no-wrap items-center justify-between"
> >
@ -13,6 +13,7 @@
</div> </div>
<div class="content-center grid pl-4"> <div class="content-center grid pl-4">
<a class="textline1" <a class="textline1"
target="_blank"
href="https://webportal.bangkok.go.th/KSB/page/top/1119/%E0%B8%81%E0%B8%AD%E0%B8%87%E0%B8%AA%E0%B8%A3%E0%B8%A3%E0%B8%AB%E0%B8%B2%E0%B8%9A%E0%B8%B8%E0%B8%84%E0%B8%84%E0%B8%A5"> href="https://webportal.bangkok.go.th/KSB/page/top/1119/%E0%B8%81%E0%B8%AD%E0%B8%87%E0%B8%AA%E0%B8%A3%E0%B8%A3%E0%B8%AB%E0%B8%B2%E0%B8%9A%E0%B8%B8%E0%B8%84%E0%B8%84%E0%B8%A5">
กองสรรหาบุคคล กองสรรหาบุคคล
</a> </a>
@ -28,11 +29,11 @@
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h8m-8 6h16" /></svg> <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h8m-8 6h16" /></svg>
</label> </label>
<!-- svelte-ignore a11y-no-noninteractive-tabindex --> <!-- svelte-ignore a11y-no-noninteractive-tabindex -->
<ul tabindex="0" class="menu menu-compact dropdown-content mt-3 p-2 shadow bg-base-100 rounded-box w-52"> <ul tabindex="0" style="width: 150px;" class="menu menu-compact dropdown-content mt-3 right-0 p-2 shadow bg-base-100 rounded-box w-52">
<li><a href="/">หน้าหลัก</a></li> <li ><a class="hover:text-gray-500 active:bg-white" href="/">หน้าหลัก</a></li>
<li><a href="/qualifying">การสอบคัดเลือก</a></li> <li><a class="hover:text-gray-500 active:bg-white" href="/qualifying">การสอบคัดเลือก</a></li>
<li><a href="/competitive">การสอบแข่งขัน</a></li> <li><a class="hover:text-gray-500 active:bg-white" href="/competitive">การสอบแข่งขัน</a></li>
<li><a href="/about">เกี่ยวกับเรา</a></li> <li><a class="hover:text-gray-500 active:bg-white" href="/about">เกี่ยวกับเรา</a></li>
</ul> </ul>
</div> </div>
<div class="tabs hidden lg:flex w-full"><!-- tab-active --> <div class="tabs hidden lg:flex w-full"><!-- tab-active -->
@ -61,5 +62,4 @@ letter-spacing: 0.05rem;
font-weight: 400; font-weight: 400;
color: #96a9ad; color: #96a9ad;
} }
</style> </style>

213
cms/src/routes/+page.svelte
View file

@ -13,7 +13,7 @@
const c3 = "/images/c3.jpg"; const c3 = "/images/c3.jpg";
</script> </script>
<section class="header relative items-start mt-12 flex max-h-860-px"> <section class="reative flex bg-gradient pt-10 pb-48 md:pb-38">
<div class="container mx-auto items-start flex flex-wrap"> <div class="container mx-auto items-start flex flex-wrap">
<div class="w-full md:w-6/12 lg:w-6/12 xl:w-6/12 px-6"> <div class="w-full md:w-6/12 lg:w-6/12 xl:w-6/12 px-6">
<div class="pt-16 sm:pt-18"> <div class="pt-16 sm:pt-18">
@ -30,7 +30,6 @@
<div class="mt-12"> <div class="mt-12">
<a <a
href="/qualifying" href="/qualifying"
target="_blank"
class=" text-white font-bold px-6 py-4 rounded outline-none focus:outline-none mr-1 mb-1 bg-red-400 active:bg-red-500 uppercase text-sm shadow hover:shadow-lg ease-linear transition-all duration-150" class=" text-white font-bold px-6 py-4 rounded outline-none focus:outline-none mr-1 mb-1 bg-red-400 active:bg-red-500 uppercase text-sm shadow hover:shadow-lg ease-linear transition-all duration-150"
> >
การสอบคัดเลือก การสอบคัดเลือก
@ -38,7 +37,6 @@
<a <a
href="/competitive" href="/competitive"
class=" ml-1 text-white font-bold px-6 py-4 rounded outline-none focus:outline-none mr-1 mb-1 bg-blueGray-700 active:bg-blueGray-600 uppercase text-sm shadow hover:shadow-lg ease-linear transition-all duration-150" class=" ml-1 text-white font-bold px-6 py-4 rounded outline-none focus:outline-none mr-1 mb-1 bg-blueGray-700 active:bg-blueGray-600 uppercase text-sm shadow hover:shadow-lg ease-linear transition-all duration-150"
target="_blank"
> >
การสอบแข่งขัน การสอบแข่งขัน
</a> </a>
@ -47,12 +45,12 @@
</div> </div>
</div> </div>
<img <img
class="absolute top-0 b-auto right-0 sm:w-5/12 -mt-48 sm:mt-0 w-9/12 hidden md:flex" class="absolute top-0 b-auto right-0 sm:w-5/12 sm:mt-32 pr-10 hidden md:flex"
src="{patternVue}" src="{patternVue}"
alt="..." alt="..."
/> />
</section> </section>
<section class="mt-48 md:mt-40 pb-40 relative bg-blueGray-100"> <section class="pb-40 relative bg-blueGray-100"><!-- mt-48 md:mt-40 -->
<div <div
class="-mt-20 top-0 bottom-auto left-0 right-0 w-full absolute h-20" class="-mt-20 top-0 bottom-auto left-0 right-0 w-full absolute h-20"
style="transform: translateZ(0);" style="transform: translateZ(0);"
@ -77,13 +75,12 @@
<div class="container mx-auto"> <div class="container mx-auto">
<div class="flex flex-wrap px-6"> <div class="flex flex-wrap px-6">
<div <div
class="w-full pt-20 mb-10 flex flex-wrap justify-between"> class="w-full pt-20 mb-8 flex flex-wrap justify-between">
<h6 class="text-2xl font-semibold "> <h6 class="text-2xl font-semibold pb-2">
ประกาศเกี่ยวกับ<span class="text-red-400">การคัดเลือกบุคลากรกทม.</span> ประกาศเกี่ยวกับ<span class="text-red-400">การคัดเลือกบุคลากรกทม.</span>
</h6> </h6>
<a <a
href="/" href="/qualifying"
target="_blank"
class="font-semibold text-gray-500 hover:text-gray-400 ease-linear transition-all duration-150" class="font-semibold text-gray-500 hover:text-gray-400 ease-linear transition-all duration-150"
> >
ประกาศทั้งหมด ประกาศทั้งหมด
@ -95,26 +92,36 @@
class="w-full lg:w-6/12 cardxl" class="w-full lg:w-6/12 cardxl"
> >
<div class="card bg-white shadow-xl w-full "> <div class="card bg-white shadow-xl w-full ">
<figure style="height: 250px;" class="img-hover-zoom--brightness"> <figure style="height: 250px;" class="img-drop">
<img src="{sel1}" alt="1" /> <img src="{sel1}" alt="1" />
</figure> </figure>
<div class="card-body"> <div class="card-body">
<div class="text-sm font-medium text-gray-500"> <div class="text-sm font-medium text-gray-500">
ข่าววันที่ : 24 มี.ค. 2566 ข่าววันที่ : 24 มี.ค. 2566
<div class="badge badge-secondary text-white ml-4">NEW</div> <div class="badge bg-blue-100 text-blue-500 ml-4 border-0">NEW</div>
</div> </div>
<div class="card-title font-medium"> <div class="card-title font-medium">
ด่วน !! ประกาศวัน เวลา สถานที่ และระเบียบการคัดเลือกลูกจ้างกทม. ด่วน !! ประกาศวัน เวลา สถานที่ และระเบียบการคัดเลือกลูกจ้างกทม.
</div> </div>
<div class="mt-4 text-sm row-auto no-wrap"> <div class="mt-4 text-sm flex flex-wrap justify-between">
<i class="fab fa-twitter text-blue-500"></i> <div>
<span class="pl-2 pr-4 text-gray-400">0</span> <i class="fab fa-twitter text-blue-500"></i>
<span class="pl-1 pr-3 text-gray-400">0</span>
<i class="fab fa-facebook-f text-blue-700"></i> <i class="fab fa-facebook-f text-blue-700"></i>
<span class="pl-2 pr-4 text-gray-400">0</span> <span class="pl-1 pr-3 text-gray-400">0</span>
<i class="fab fa-line text-green-500"></i> <i class="fab fa-line text-green-500"></i>
<span class="pl-2 pr-4 text-gray-400">0</span> <span class="pl-1 pr-3 text-gray-400">0</span>
</div>
<a
href="/"
class=" text-blue-500 hover:text-blue-300 ease-linear transition-all duration-150"
>
อ่านต่อ
<i class="fa fa-angle-double-right ml-1 text-xs"></i>
</a>
</div> </div>
</div> </div>
</div> </div>
@ -123,7 +130,7 @@
<div class="flex flex-wrap space-y-8"> <div class="flex flex-wrap space-y-8">
<div class="flex flex-col w-full"> <div class="flex flex-col w-full">
<div class="card card-side bg-white shadow-xl w-full"> <div class="card card-side bg-white shadow-xl w-full">
<figure class="w-full lg:w-5/12 imgCard"> <figure class="w-full lg:w-5/12 img-drop">
<img src="{sel2}" alt="1" class="h-full" /> <img src="{sel2}" alt="1" class="h-full" />
</figure> </figure>
<div class="card-body w-full lg:w-7/12"> <div class="card-body w-full lg:w-7/12">
@ -133,22 +140,32 @@
<div class="card-title font-medium"> <div class="card-title font-medium">
ประกาศรายชื่อผู้มีสิทธิเข้ารับการคัดเลือกบุคลากรกทม.เป็นข้าราชการฯ ครั้งที่ 1/2565 ประกาศรายชื่อผู้มีสิทธิเข้ารับการคัดเลือกบุคลากรกทม.เป็นข้าราชการฯ ครั้งที่ 1/2565
</div> </div>
<div class="mt-4 text-sm row-auto no-wrap"> <div class="mt-4 text-sm flex flex-wrap justify-between">
<i class="fab fa-twitter text-blue-500"></i> <div>
<span class="pl-2 pr-4 text-gray-400">0</span> <i class="fab fa-twitter text-blue-500"></i>
<span class="pl-1 pr-3 text-gray-400">0</span>
<i class="fab fa-facebook-f text-blue-700"></i> <i class="fab fa-facebook-f text-blue-700"></i>
<span class="pl-2 pr-4 text-gray-400">0</span> <span class="pl-1 pr-3 text-gray-400">0</span>
<i class="fab fa-line text-green-500"></i> <i class="fab fa-line text-green-500"></i>
<span class="pl-2 pr-4 text-gray-400">0</span> <span class="pl-1 pr-3 text-gray-400">0</span>
</div> </div>
<a
href="/"
class=" text-blue-500 hover:text-blue-300 ease-linear transition-all duration-150"
>
อ่านต่อ
<i class="fa fa-angle-double-right ml-1 text-xs"></i>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>
<div class=" flex flex-col w-full"> <div class=" flex flex-col w-full">
<div class="card card-side bg-white shadow-xl w-full"> <div class="card card-side bg-white shadow-xl w-full">
<figure class="w-full lg:w-5/12 imgCard"> <figure class="w-full lg:w-5/12 img-drop">
<img src="{sel3}" alt="1" class="h-full"/> <img src="{sel3}" alt="1" class="h-full"/>
</figure> </figure>
<div class="card-body w-full lg:w-7/12"> <div class="card-body w-full lg:w-7/12">
@ -158,16 +175,26 @@
<div class="card-title font-medium"> <div class="card-title font-medium">
ประกาศรับสมัครคัดเลือกบุคลากรกทม. !! ประกาศรับสมัครคัดเลือกบุคลากรกทม. !!
</div> </div>
<div class="mt-4 text-sm row-auto no-wrap"> <div class="mt-4 text-sm flex flex-wrap justify-between">
<i class="fab fa-twitter text-blue-500"></i> <div>
<span class="pl-2 pr-4 text-gray-400">0</span> <i class="fab fa-twitter text-blue-500"></i>
<span class="pl-1 pr-3 text-gray-400">0</span>
<i class="fab fa-facebook-f text-blue-700"></i> <i class="fab fa-facebook-f text-blue-700"></i>
<span class="pl-2 pr-4 text-gray-400">0</span> <span class="pl-1 pr-3 text-gray-400">0</span>
<i class="fab fa-line text-green-500"></i> <i class="fab fa-line text-green-500"></i>
<span class="pl-2 pr-4 text-gray-400">0</span> <span class="pl-1 pr-3 text-gray-400">0</span>
</div> </div>
<a
href="/"
class=" text-blue-500 hover:text-blue-300 ease-linear transition-all duration-150"
>
อ่านต่อ
<i class="fa fa-angle-double-right ml-1 text-xs"></i>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -180,13 +207,12 @@
<div class="container mx-auto mt-4"> <div class="container mx-auto mt-4">
<div class="flex flex-wrap px-6"> <div class="flex flex-wrap px-6">
<div <div
class="w-full pt-20 mb-10 flex flex-wrap justify-between"> class="w-full pt-20 mb-8 flex flex-wrap justify-between">
<h6 class="text-2xl font-semibold "> <h6 class="text-2xl font-semibold pb-2">
ประกาศเกี่ยวกับ<span class="text-red-400">การสอบแข่งขัน</span> ประกาศเกี่ยวกับ<span class="text-red-400">การสอบแข่งขัน</span>
</h6> </h6>
<a <a
href="/" href="/competitive"
target="_blank"
class="font-semibold text-gray-500 hover:text-gray-400 ease-linear transition-all duration-150" class="font-semibold text-gray-500 hover:text-gray-400 ease-linear transition-all duration-150"
> >
ประกาศทั้งหมด ประกาศทั้งหมด
@ -198,27 +224,37 @@
class="w-full lg:w-6/12 cardxl" class="w-full lg:w-6/12 cardxl"
> >
<div class="card bg-white shadow-xl w-full "> <div class="card bg-white shadow-xl w-full ">
<figure style="height: 250px;" class="img-hover-zoom--brightness"> <figure style="height: 250px;" class="img-drop">
<img src="{c1}" alt="1" /> <img src="{c1}" alt="1" />
</figure> </figure>
<div class="card-body"> <div class="card-body">
<div class="text-sm font-medium text-gray-500"> <div class="text-sm font-medium text-gray-500">
ข่าววันที่ : 24 มี.ค. 2566 ข่าววันที่ : 24 มี.ค. 2566
<div class="badge badge-secondary text-white ml-4">NEW</div> <div class="badge bg-blue-100 text-blue-500 ml-4 border-0">NEW</div>
</div> </div>
<div class="card-title font-medium"> <div class="card-title font-medium">
ประกาศรายชื่อผู้ผ่านภาค ข. และมีสิทธิสอบภาค ค. ในการคัดเลือกคนพิการ ครั้งที่ 1/2565 ประกาศรายชื่อผู้ผ่านภาค ข. และมีสิทธิสอบภาค ค. ในการคัดเลือกคนพิการ ครั้งที่ 1/2565
</div> </div>
<div class="mt-4 text-sm row-auto no-wrap"> <div class="mt-4 text-sm flex flex-wrap justify-between">
<i class="fab fa-twitter text-blue-500"></i> <div>
<span class="pl-2 pr-4 text-gray-400">0</span> <i class="fab fa-twitter text-blue-500"></i>
<span class="pl-1 pr-3 text-gray-400">0</span>
<i class="fab fa-facebook-f text-blue-700"></i> <i class="fab fa-facebook-f text-blue-700"></i>
<span class="pl-2 pr-4 text-gray-400">0</span> <span class="pl-1 pr-3 text-gray-400">0</span>
<i class="fab fa-line text-green-500"></i> <i class="fab fa-line text-green-500"></i>
<span class="pl-2 pr-4 text-gray-400">0</span> <span class="pl-1 pr-3 text-gray-400">0</span>
</div> </div>
<a
href="/"
class=" text-blue-500 hover:text-blue-300 ease-linear transition-all duration-150"
>
อ่านต่อ
<i class="fa fa-angle-double-right ml-1 text-xs"></i>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -226,7 +262,7 @@
<div class="flex flex-wrap space-y-8"> <div class="flex flex-wrap space-y-8">
<div class="flex flex-col w-full"> <div class="flex flex-col w-full">
<div class="card card-side bg-white shadow-xl w-full"> <div class="card card-side bg-white shadow-xl w-full">
<figure class="w-full lg:w-5/12 imgCard"> <figure class="w-full lg:w-5/12 imgCard img-drop">
<img src="{c2}" alt="1" class="h-full" /> <img src="{c2}" alt="1" class="h-full" />
</figure> </figure>
<div class="card-body w-full lg:w-7/12"> <div class="card-body w-full lg:w-7/12">
@ -236,22 +272,32 @@
<div class="card-title font-medium"> <div class="card-title font-medium">
ใครลืมส่งเอกสาร !! สำหรับการคัดเลือกคนพิการฯ ครั้งที่ 1/2565 ส่งเอกสารเพิ่มได้ ใครลืมส่งเอกสาร !! สำหรับการคัดเลือกคนพิการฯ ครั้งที่ 1/2565 ส่งเอกสารเพิ่มได้
</div> </div>
<div class="mt-4 text-sm row-auto no-wrap"> <div class="mt-4 text-sm flex flex-wrap justify-between">
<i class="fab fa-twitter text-blue-500"></i> <div>
<span class="pl-2 pr-4 text-gray-400">0</span> <i class="fab fa-twitter text-blue-500"></i>
<span class="pl-1 pr-3 text-gray-400">0</span>
<i class="fab fa-facebook-f text-blue-700"></i> <i class="fab fa-facebook-f text-blue-700"></i>
<span class="pl-2 pr-4 text-gray-400">0</span> <span class="pl-1 pr-3 text-gray-400">0</span>
<i class="fab fa-line text-green-500"></i> <i class="fab fa-line text-green-500"></i>
<span class="pl-2 pr-4 text-gray-400">0</span> <span class="pl-1 pr-3 text-gray-400">0</span>
</div> </div>
<a
href="/"
class=" text-blue-500 hover:text-blue-300 ease-linear transition-all duration-150"
>
อ่านต่อ
<i class="fa fa-angle-double-right ml-1 text-xs"></i>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>
<div class=" flex flex-col w-full"> <div class=" flex flex-col w-full">
<div class="card card-side bg-white shadow-xl w-full"> <div class="card card-side bg-white shadow-xl w-full">
<figure class="w-full lg:w-5/12 imgCard"> <figure class="w-full lg:w-5/12 imgCard img-drop">
<img src="{c3}" alt="1" class="h-full"/> <img src="{c3}" alt="1" class="h-full"/>
</figure> </figure>
<div class="card-body w-full lg:w-7/12"> <div class="card-body w-full lg:w-7/12">
@ -261,16 +307,26 @@
<div class="card-title font-medium"> <div class="card-title font-medium">
แผนที่การเดินทางมาสนามสอบคนพิการฯ ครั้งที่ 1/2565 แผนที่การเดินทางมาสนามสอบคนพิการฯ ครั้งที่ 1/2565
</div> </div>
<div class="mt-4 text-sm row-auto no-wrap"> <div class="mt-4 text-sm flex flex-wrap justify-between">
<i class="fab fa-twitter text-blue-500"></i> <div>
<span class="pl-2 pr-4 text-gray-400">0</span> <i class="fab fa-twitter text-blue-500"></i>
<span class="pl-1 pr-3 text-gray-400">0</span>
<i class="fab fa-facebook-f text-blue-700"></i> <i class="fab fa-facebook-f text-blue-700"></i>
<span class="pl-2 pr-4 text-gray-400">0</span> <span class="pl-1 pr-3 text-gray-400">0</span>
<i class="fab fa-line text-green-500"></i> <i class="fab fa-line text-green-500"></i>
<span class="pl-2 pr-4 text-gray-400">0</span> <span class="pl-1 pr-3 text-gray-400">0</span>
</div> </div>
<a
href="/"
class=" text-blue-500 hover:text-blue-300 ease-linear transition-all duration-150"
>
อ่านต่อ
<i class="fa fa-angle-double-right ml-1 text-xs"></i>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -292,6 +348,12 @@
.imgCard{ .imgCard{
height: 250px; height: 250px;
} }
}
@media only screen and (max-width: 640px) {
.bg-gradient{
background-image: linear-gradient(300deg, rgba(255,0,0,0), #faecf0b4);
}
} }
.card-side{ .card-side{
flex-direction: row; flex-direction: row;
@ -309,4 +371,7 @@
.imgCard{ .imgCard{
max-height: 220px; max-height: 220px;
} }
.img-drop {
filter: brightness(0.98);
}
</style> </style>

29
cms/src/routes/competitive/+page.svelte
View file

@ -3,12 +3,29 @@
export let data: PageData; export let data: PageData;
const exams = data.exams const exams = data.exams
</script> </script>
<section>
<section class="items-start h-screen flex max-h-860-px pt-12 bg-blueGray-100"> <div class="p-one parallax-inner">
<div class="container mx-auto items-start flex flex-wrap px-4"> <h2>การสอบแข่งขัน</h2>
<h2 class="font-semibold text-2xl text-blueGray-600 mb-4"> </div>
การสอบแข่งขัน </section>
</h2> <section class="pb-40 relative bg-blueGray-100">
<div class="container mx-auto justify-center flex flex-wrap">
<div class=" bg-blueGray-100 -mt-6 px-5 top-0 bottom-auto absolute z-40 rounded-md" >
<div class="text-sm breadcrumbs">
<ul>
<li class="text-pink-500 hover:text-pink-700 ">
<a href="/" >
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" /></svg>
</a>
</li>
<li>
<span class="breadTaxt">การสอบแข่งขัน</span>
</li>
</ul>
</div>
</div>
</div>
<div class="container mx-auto items-start flex flex-wrap px-4 pt-11">
<div <div
class=" relative flex flex-col min-w-0 break-words w-full mb-6 shadow-lg rounded bg-white" class=" relative flex flex-col min-w-0 break-words w-full mb-6 shadow-lg rounded bg-white"
> >

33
cms/src/routes/qualifying/+page.svelte
View file

@ -6,14 +6,31 @@
const events = data.events const events = data.events
</script> </script>
<section class="items-start flex pt-12 pb-20 bg-blueGray-100"> <section>
<div class="p-one parallax-inner">
<div class="container mx-auto items-start flex flex-wrap px-4"> <h2>การสอบคัดเลือก</h2>
<h2 class="font-semibold text-2xl text-blueGray-600 mb-4 w-full"> </div>
การสอบคัดเลือก </section>
</h2> <section class="pb-40 relative bg-blueGray-100">
<div class="container mx-auto justify-center flex flex-wrap">
<div class=" bg-blueGray-100 -mt-6 px-5 top-0 bottom-auto absolute z-40 rounded-md" >
<div class="text-sm breadcrumbs">
<ul>
<li class="text-pink-500 hover:text-pink-700 ">
<a href="/" >
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" /></svg>
</a>
</li>
<li>
<span class="breadTaxt">การสอบคัดเลือก</span>
</li>
</ul>
</div>
</div>
</div>
<div class="container mx-auto items-start flex flex-wrap px-4 pt-11">
<div class="w-full lg:w-6/12 cardxl"> <div class="w-full lg:w-6/12 cardxl">
<div class="card bg-white shadow-xl w-full p-4"> <div class="card bg-white shadow-xl w-full">
<ActivityCalendar {events} /> <ActivityCalendar {events} />
</div> </div>
</div> </div>
@ -55,4 +72,6 @@
</div> </div>
</div> </div>
</section> </section>
<style>
</style>

BIN
cms/static/images/p1.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 116 KiB

87
cms/static/styles/fullcalendar.css Normal file
View file

@ -0,0 +1,87 @@
/* ----------- toolbar ----------- */
.fc .fc-toolbar.fc-header-toolbar{
margin: 1em 1em 0.8em 1em;
}
.fc .fc-button{
height:35px;
font-size: 0.8em;
padding: 0 1em;
}
.fc .fc-button-group>.fc-button{
background: transparent;
border-color: #334155;
color: #334155;
margin: 0 6px 0 0;
}
.fc .fc-button-group>.fc-button:hover{
background: #334155;
border-color: #334155;
color: #fff;
}
button:focus { outline: none !important; box-shadow: none !important; }
button:active {outline:none;}
.fc .fc-button-primary{
border-color: #334155 ;
background: transparent ;
color : #334155;
border-width: 2px;
border-radius: 20px !important;
}
.fc .fc-button:hover {
border-color: transparent;
background: #334155 ;
color : white;
}
.fc .fc-button-primary:disabled{
border-color: transparent ;
background: #e3e3e3 ;
color : #66615b;
}
/* ----------- table ----------- */
.fc .fc-toolbar-title{
font-size: 1.4rem;
}
thead tr.fc-first{
border-color: #cdcdcd;
}
.fc th{
border-bottom-width: 1px;
font-size: 16px;
background-color: #f7f7f7;
}
th{
font-weight: 300;
}
.fc td{
border-width: 1px 0 0 1px;
}
.fc tr th {
text-align: right;
border-width: 0 0 1px 0px;
}
.fc-theme-standard th{
border: 1px solid #e5e5e5;
}
.fc-theme-standard .fc-scrollgrid{
border: none;
}
table.fc-border-separate{
border-collapse: separate;
}
.fc .fc-daygrid-day-number{
font-size: 0.8em;
}
/* ----------- table today ----------- */
.fc .fc-daygrid-day.fc-day-today{
background-color: rgba(100, 116, 139, 0.06);
}