All checks were successful
frontend-action / build-image (push) Successful in 57s
101 lines
4.3 KiB
Vue
101 lines
4.3 KiB
Vue
<template>
|
|
<div style="position: relative" class="bg-green-full text-normal py-2">
|
|
<div id="scroll-container">
|
|
<div id="scroll-text" class="text-sub d-none">
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มบริหารราชการแผ่นดินและความมั่นคง
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มกฎหมายกระบวนการยุติธรรม
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มการศึกษา
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มการสาธารณสุข
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มอาชีพทำนา ปลูกพืชล้มลุก
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มอาชีพทำสวน ป่าไม้ ปศุสัตว์ ประมง
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มพนักงานหรือลูกจ้างของบุคคล(ไม่ใช่หน่วยงานรัฐ)
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มผู้ประกอบอาชีพด้านสิ่งแวดล้อม ผังเมือง อสังหาริมทรัพย์และสาธารณูปโภค ทรัพยากรธรรมชาติ พลังงาน
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มผู้ประกอบกิจการ หรือ SME
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มผู้ประกอบธุรกิจหรืออาชีพด้านการท่องเที่ยว
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มผู้ประกอบอุตสาหกรรม
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มสตรี
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มผู้สูงอายุ คนพิการหรือทุพพลภาพ กลุ่มชาติพันธุ์ กลุ่มอัตลักษณ์อื่น
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มศิลปะ วัฒนธรรม ดนตรี การแสดงและบันเทิง
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มประชาสังคม องค์กรสาธารณประโยชน์
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มนักกีฬา สื่อสารมวลชน ผู้สร้างสรรค์วรรณกรรม
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มผู้ประกอบวิชาชีพ ผู้ประกอบอาชีพอิสระ
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
กลุ่มอื่นๆ
|
|
<v-icon icon="mdi-circle" size="20"></v-icon>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
export default {};
|
|
</script>
|
|
<style lang="scss">
|
|
#scroll-container {
|
|
overflow: hidden;
|
|
display: inline-block;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
#scroll-text {
|
|
/* animation properties */
|
|
-moz-transform: translateX(100%);
|
|
-webkit-transform: translateX(100%);
|
|
transform: translateX(100%);
|
|
|
|
-moz-animation: my-animation 50s linear infinite;
|
|
-webkit-animation: my-animation 60s linear infinite;
|
|
animation: my-animation 60s linear infinite;
|
|
}
|
|
|
|
/* for Firefox */
|
|
@-moz-keyframes my-animation {
|
|
from {
|
|
-moz-transform: translateX(100%);
|
|
}
|
|
to {
|
|
-moz-transform: translateX(-100%);
|
|
}
|
|
}
|
|
|
|
/* for Chrome */
|
|
@-webkit-keyframes my-animation {
|
|
from {
|
|
-webkit-transform: translateX(100%);
|
|
}
|
|
to {
|
|
-webkit-transform: translateX(-100%);
|
|
}
|
|
}
|
|
|
|
@keyframes my-animation {
|
|
from {
|
|
-moz-transform: translateX(100%);
|
|
-webkit-transform: translateX(100%);
|
|
transform: translateX(100%);
|
|
}
|
|
to {
|
|
-moz-transform: translateX(-100%);
|
|
-webkit-transform: translateX(-100%);
|
|
transform: translateX(-100%);
|
|
}
|
|
}
|
|
</style>
|