step 4 : slicing survey mcu dan wording nya
This commit is contained in:
sindhu
@@ -71,6 +71,7 @@ SEARCH GROUP CSS KEYWORD "###"
|
||||
--active-state: #637381;
|
||||
--textcolorlabelkartukontrolSudah: #50cd89;
|
||||
--textcolorlabelkartukontrolBelum: #f1bc00;
|
||||
--textjawabansurveymcu: #212b36;
|
||||
/* END TEXT COLOR */
|
||||
--light: #f3f6f9;
|
||||
--dark: #181c32;
|
||||
|
||||
844
assets/mcu/kartukontrolsurveymcu.html
Normal file
844
assets/mcu/kartukontrolsurveymcu.html
Normal file
@@ -0,0 +1,844 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Template Name: Metronic - Bootstrap 4 HTML, React, Angular 9 & VueJS Admin Dashboard Theme
|
||||
Author: KeenThemes
|
||||
Website: http://www.keenthemes.com/
|
||||
Contact: support@keenthemes.com
|
||||
Follow: www.twitter.com/keenthemes
|
||||
Dribbble: www.dribbble.com/keenthemes
|
||||
Like: www.facebook.com/keenthemes
|
||||
Purchase: https://1.envato.market/EA4JP
|
||||
Renew Support: https://1.envato.market/EA4JP
|
||||
License: You must have a valid license purchased only from themeforest(the above link) in order to legally use the theme for your project.
|
||||
-->
|
||||
<html lang="en">
|
||||
<!--begin::Head-->
|
||||
<head>
|
||||
<base href="../" />
|
||||
<meta charset="utf-8" />
|
||||
<title>Metronic | Dashboard</title>
|
||||
<meta name="description" content="Updates and statistics" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1, shrink-to-fit=no"
|
||||
/>
|
||||
|
||||
<!--begin::Fonts-->
|
||||
<link rel="stylesheet" href="assets/css/googlefont/poppins.css" />
|
||||
<link rel="stylesheet" href="assets/css/googlefont/publicsans.css" />
|
||||
<link rel="stylesheet" href="assets/css/googlefont/roboto.css" />
|
||||
<!--end::Fonts-->
|
||||
|
||||
<!--begin::Page Vendors Styles(used by this page)-->
|
||||
<link
|
||||
href="assets/plugins/custom/fullcalendar/fullcalendar.bundle.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<!--end::Page Vendors Styles-->
|
||||
|
||||
<!--begin::Global Theme Styles(used by all pages)-->
|
||||
<link
|
||||
href="assets/plugins/global/plugins.bundle.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link
|
||||
href="assets/plugins/custom/prismjs/prismjs.bundle.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link href="assets/css/style.bundle.css" rel="stylesheet" type="text/css" />
|
||||
<!--end::Global Theme Styles-->
|
||||
|
||||
<!--begin::Layout Themes(used by all pages)-->
|
||||
|
||||
<link
|
||||
href="assets/css/themes/layout/header/base/light.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link
|
||||
href="assets/css/themes/layout/header/menu/light.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link
|
||||
href="assets/css/themes/layout/brand/dark.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link
|
||||
href="assets/css/themes/layout/aside/dark.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<!--end::Layout Themes-->
|
||||
|
||||
<link rel="shortcut icon" href="assets/media/logos/favicon.ico" />
|
||||
<link rel="stylesheet" href="asset-corporate-portal/css/sas.bundle.css" />
|
||||
</head>
|
||||
<!--end::Head-->
|
||||
|
||||
<!--begin::Body-->
|
||||
<body
|
||||
id="kt_body"
|
||||
class="header-fixed header-mobile-fixed subheader-enabled subheader-fixed subheader-mobile-fixed aside-enabled aside-fixed aside-minimize-hoverable page-loading"
|
||||
>
|
||||
<style>
|
||||
body {
|
||||
background-color: var(--fieldbg);
|
||||
}
|
||||
.card-control {
|
||||
width: 390px;
|
||||
height: 1212px;
|
||||
/* background-image: url("asset-corporate-portal/media/kartukontrol/bg-kartuKontrol.svg");
|
||||
background-size: 390px 1212px;
|
||||
background-repeat: no-repeat; */
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-family: Poppins;
|
||||
font-size: 24px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.title-pertanyaan {
|
||||
font-family: Poppins;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.no-margin-padding {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.flex-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.flex-number {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.flex-question {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.text-jawaban {
|
||||
color: var(--textjawabansurveymcu);
|
||||
font-family: Poppins;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
}
|
||||
|
||||
.radio-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.radio {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.radio h3 {
|
||||
margin: 0;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.saran-mcu::placeholder {
|
||||
color: var(--text-disabled);
|
||||
font-family: Poppins, sans-serif;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.title-button {
|
||||
font-family: "Public Sans";
|
||||
font-size: 15px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: 26px;
|
||||
}
|
||||
</style>
|
||||
<!--begin::Container-->
|
||||
<div class="content-fluid bg-field">
|
||||
<!-- judul start -->
|
||||
<div class="py-15 px-9">
|
||||
<h1 class="title text-primary text-center">Survey MCU</h1>
|
||||
</div>
|
||||
<!-- judul end -->
|
||||
|
||||
<div class="mb-2"></div>
|
||||
|
||||
<div class="px-10">
|
||||
<!-- pertanyaan 1 start -->
|
||||
<div class="card shadow-sm py-2 mb-8" style="border-radius: 12px">
|
||||
<div class="card-body px-10 py-10">
|
||||
<!-- pertanyaan -->
|
||||
<div class="flex-container">
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-number"
|
||||
>
|
||||
1.
|
||||
</h5>
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-question"
|
||||
>
|
||||
Bagaimana Penilaian Sikap & Keramahan Petugas?
|
||||
</h5>
|
||||
</div>
|
||||
<!-- jawaban start -->
|
||||
<div class="mt-5">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="form-group">
|
||||
<div class="radio-list">
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios1" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Baik</h3>
|
||||
</label>
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios1" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Kurang</h3>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- error pertanyaan kosong start -->
|
||||
<div class="form-group validated">
|
||||
<div class="invalid-feedback">
|
||||
Mohon untuk menjawab pertanyaan ini
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong end -->
|
||||
<!-- jawaban end -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- pertanyaan 1 end -->
|
||||
|
||||
<!-- pertanyaan 2 start -->
|
||||
<div class="card shadow-sm py-2 mb-8" style="border-radius: 12px">
|
||||
<div class="card-body px-10 py-10">
|
||||
<!-- pertanyaan -->
|
||||
<div class="flex-container">
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-number"
|
||||
>
|
||||
2.
|
||||
</h5>
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-question"
|
||||
>
|
||||
Bagaimana Penilaian Penampilan Petugas?
|
||||
</h5>
|
||||
</div>
|
||||
<!-- jawaban start -->
|
||||
<div class="mt-5">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="form-group">
|
||||
<div class="radio-list">
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios2" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Baik</h3>
|
||||
</label>
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios2" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Kurang</h3>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- error pertanyaan kosong start -->
|
||||
<div class="form-group validated">
|
||||
<div class="invalid-feedback">
|
||||
Mohon untuk menjawab pertanyaan ini
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong end -->
|
||||
<!-- jawaban end -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- pertanyaan 2 end -->
|
||||
|
||||
<!-- pertanyaan 3 start -->
|
||||
<div class="card shadow-sm py-2 mb-8" style="border-radius: 12px">
|
||||
<div class="card-body px-10 py-10">
|
||||
<!-- pertanyaan -->
|
||||
<div class="flex-container">
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-number"
|
||||
>
|
||||
3.
|
||||
</h5>
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-question"
|
||||
>
|
||||
Bagaimana Penilaian Ketrampilan Petugas?
|
||||
</h5>
|
||||
</div>
|
||||
<!-- jawaban start -->
|
||||
<div class="mt-5">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="form-group">
|
||||
<div class="radio-list">
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios3" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Baik</h3>
|
||||
</label>
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios3" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Kurang</h3>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong start -->
|
||||
<div class="form-group validated">
|
||||
<div class="invalid-feedback">
|
||||
Mohon untuk menjawab pertanyaan ini
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong end -->
|
||||
<!-- jawaban end -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- pertanyaan 3 end -->
|
||||
|
||||
<!-- pertanyaan 4 start -->
|
||||
<div class="card shadow-sm py-2 mb-8" style="border-radius: 12px">
|
||||
<div class="card-body px-10 py-10">
|
||||
<!-- pertanyaan -->
|
||||
<div class="flex-container">
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-number"
|
||||
>
|
||||
4.
|
||||
</h5>
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-question"
|
||||
>
|
||||
Bagaimana Penilaian Pemberian Informasi Petugas?
|
||||
</h5>
|
||||
</div>
|
||||
<!-- jawaban start -->
|
||||
<div class="mt-5">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="form-group">
|
||||
<div class="radio-list">
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios4" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Baik</h3>
|
||||
</label>
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios4" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Kurang</h3>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong start -->
|
||||
<div class="form-group validated">
|
||||
<div class="invalid-feedback">
|
||||
Mohon untuk menjawab pertanyaan ini
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong end -->
|
||||
<!-- jawaban end -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- pertanyaan 4 end -->
|
||||
|
||||
<!-- pertanyaan 5 start -->
|
||||
<div class="card shadow-sm py-2 mb-8" style="border-radius: 12px">
|
||||
<div class="card-body px-10 py-10">
|
||||
<!-- pertanyaan -->
|
||||
<div class="flex-container">
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-number"
|
||||
>
|
||||
5.
|
||||
</h5>
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-question"
|
||||
>
|
||||
Bagaimana Penilaian Kelengkapan Alat?
|
||||
</h5>
|
||||
</div>
|
||||
<!-- jawaban start -->
|
||||
<div class="mt-5">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="form-group">
|
||||
<div class="radio-list">
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios5" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Baik</h3>
|
||||
</label>
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios5" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Kurang</h3>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong start -->
|
||||
<div class="form-group validated">
|
||||
<div class="invalid-feedback">
|
||||
Mohon untuk menjawab pertanyaan ini
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong end -->
|
||||
<!-- jawaban end -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- pertanyaan 5 end -->
|
||||
|
||||
<!-- pertanyaan 6 start -->
|
||||
<div class="card shadow-sm py-2 mb-8" style="border-radius: 12px">
|
||||
<div class="card-body px-10 py-10">
|
||||
<!-- pertanyaan -->
|
||||
<div class="flex-container">
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-number"
|
||||
>
|
||||
6.
|
||||
</h5>
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-question"
|
||||
>
|
||||
Bagaimana Penilaian Kelayakan Alat?
|
||||
</h5>
|
||||
</div>
|
||||
<!-- jawaban start -->
|
||||
<div class="mt-5">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="form-group">
|
||||
<div class="radio-list">
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios6" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Baik</h3>
|
||||
</label>
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios6" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Kurang</h3>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong start -->
|
||||
<div class="form-group validated">
|
||||
<div class="invalid-feedback">
|
||||
Mohon untuk menjawab pertanyaan ini
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong end -->
|
||||
<!-- jawaban end -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- pertanyaan 6 end -->
|
||||
|
||||
<!-- pertanyaan 7 start -->
|
||||
<div class="card shadow-sm py-2 mb-8" style="border-radius: 12px">
|
||||
<div class="card-body px-10 py-10">
|
||||
<!-- pertanyaan -->
|
||||
<div class="flex-container">
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-number"
|
||||
>
|
||||
7.
|
||||
</h5>
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-question"
|
||||
>
|
||||
Bagaimana Penilaian Kebersihan Ruangan?
|
||||
</h5>
|
||||
</div>
|
||||
<!-- jawaban start -->
|
||||
<div class="mt-5">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="form-group">
|
||||
<div class="radio-list">
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios7" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Baik</h3>
|
||||
</label>
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios7" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Kurang</h3>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong start -->
|
||||
<div class="form-group validated">
|
||||
<div class="invalid-feedback">
|
||||
Mohon untuk menjawab pertanyaan ini
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong end -->
|
||||
<!-- jawaban end -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- pertanyaan 7 end -->
|
||||
|
||||
<!-- pertanyaan 8 start -->
|
||||
<div class="card shadow-sm py-2 mb-8" style="border-radius: 12px">
|
||||
<div class="card-body px-10 py-10">
|
||||
<!-- pertanyaan -->
|
||||
<div class="flex-container">
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-number"
|
||||
>
|
||||
8.
|
||||
</h5>
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-question"
|
||||
>
|
||||
Bagaimana Penilaian Kebersihan Ruangan?
|
||||
</h5>
|
||||
</div>
|
||||
<!-- jawaban start -->
|
||||
<div class="mt-5">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="form-group">
|
||||
<div class="radio-list">
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios8" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Baik</h3>
|
||||
</label>
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios8" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Kurang</h3>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong start -->
|
||||
<div class="form-group validated">
|
||||
<div class="invalid-feedback">
|
||||
Mohon untuk menjawab pertanyaan ini
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong end -->
|
||||
<!-- jawaban end -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- pertanyaan 8 end -->
|
||||
|
||||
<!-- pertanyaan 9 start -->
|
||||
<div class="card shadow-sm py-2 mb-8" style="border-radius: 12px">
|
||||
<div class="card-body px-10 py-10">
|
||||
<!-- pertanyaan -->
|
||||
<div class="flex-container">
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-number"
|
||||
>
|
||||
9.
|
||||
</h5>
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-question"
|
||||
>
|
||||
Bagaimana Penilaian Alur Pelayanan?
|
||||
</h5>
|
||||
</div>
|
||||
<!-- jawaban start -->
|
||||
<div class="mt-5">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="form-group">
|
||||
<div class="radio-list">
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios9" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Baik</h3>
|
||||
</label>
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios9" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Kurang</h3>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong start -->
|
||||
<div class="form-group validated">
|
||||
<div class="invalid-feedback">
|
||||
Mohon untuk menjawab pertanyaan ini
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong end -->
|
||||
<!-- jawaban end -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- pertanyaan 9 end -->
|
||||
|
||||
<!-- pertanyaan 10 start -->
|
||||
<div class="card shadow-sm py-2 mb-8" style="border-radius: 12px">
|
||||
<div class="card-body px-10 py-10">
|
||||
<!-- pertanyaan -->
|
||||
<div class="flex-container">
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-number"
|
||||
>
|
||||
10.
|
||||
</h5>
|
||||
<h5
|
||||
class="title-pertanyaan text-black no-margin-padding flex-question"
|
||||
>
|
||||
Bagaimana Penilaian Ketepatan Waktu?
|
||||
</h5>
|
||||
</div>
|
||||
<!-- jawaban start -->
|
||||
<div class="mt-5">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="form-group">
|
||||
<div class="radio-list">
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios10" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Baik</h3>
|
||||
</label>
|
||||
<label class="radio">
|
||||
<input type="radio" name="radios10" />
|
||||
<span></span>
|
||||
<h3 class="text-jawaban">Kurang</h3>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong start -->
|
||||
<div class="form-group validated">
|
||||
<div class="invalid-feedback">
|
||||
Mohon untuk menjawab pertanyaan ini
|
||||
</div>
|
||||
</div>
|
||||
<!-- error pertanyaan kosong end -->
|
||||
<!-- jawaban end -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- pertanyaan 10 end -->
|
||||
|
||||
<!-- text area saran start -->
|
||||
<textarea
|
||||
class="form-control saran-mcu mb-10"
|
||||
id="saranMcu"
|
||||
rows="9"
|
||||
placeholder="Saran"
|
||||
></textarea>
|
||||
<!-- text area saran end -->
|
||||
|
||||
<!-- button submit start -->
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-lg btn-primary text-white"
|
||||
style="border-radius: 8px; width: 100%"
|
||||
onclick="showWordingModal()"
|
||||
>
|
||||
<span class="title-button text-center">Submit</span>
|
||||
</button>
|
||||
<!-- button submit end -->
|
||||
|
||||
<!-- atur spacing bottom -->
|
||||
<div style="height: 14vh"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Container-->
|
||||
|
||||
<!-- modal wording start -->
|
||||
<div
|
||||
class="modal fade"
|
||||
style="display: none"
|
||||
id="modalWordingSurveyMcu"
|
||||
tabindex="-1"
|
||||
role="dialog"
|
||||
data-backdrop="static"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="modal-dialog modal-dialog-centered" role="document">
|
||||
<div class="modal-content rounded-lg">
|
||||
<div class="modal-header border-bottom-0">
|
||||
<h1 class="text-black font-weight-bolder">Perhatian</h1>
|
||||
</div>
|
||||
<div class="modal-body border-bottom-0">
|
||||
<h6 class="text-black">
|
||||
<!-- Silahkan isi questioner untuk membantu peningkatan layanan kami. -->
|
||||
Mohon untuk mengisi dengan menjawab semua pertanyaan di questioner
|
||||
ini,
|
||||
<br />
|
||||
untuk membantu peningkatan layanan kami <br /><br />Terima kasih.
|
||||
</h6>
|
||||
</div>
|
||||
<div class="modal-footer border-top-0">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
onclick="hideWordingModal()"
|
||||
>
|
||||
OK
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- modal wording end -->
|
||||
|
||||
<script>
|
||||
var HOST_URL =
|
||||
"https://preview.keenthemes.com/metronic/theme/html/tools/preview";
|
||||
</script>
|
||||
<!--begin::Global Config(global config for global JS scripts)-->
|
||||
<script>
|
||||
var KTAppSettings = {
|
||||
breakpoints: {
|
||||
sm: 576,
|
||||
md: 768,
|
||||
lg: 992,
|
||||
xl: 1200,
|
||||
xxl: 1400,
|
||||
},
|
||||
colors: {
|
||||
theme: {
|
||||
base: {
|
||||
white: "#ffffff",
|
||||
primary: "#3699FF",
|
||||
secondary: "#E5EAEE",
|
||||
success: "#1BC5BD",
|
||||
info: "#8950FC",
|
||||
warning: "#FFA800",
|
||||
danger: "#F64E60",
|
||||
light: "#E4E6EF",
|
||||
dark: "#181C32",
|
||||
},
|
||||
light: {
|
||||
white: "#ffffff",
|
||||
primary: "#E1F0FF",
|
||||
secondary: "#EBEDF3",
|
||||
success: "#C9F7F5",
|
||||
info: "#EEE5FF",
|
||||
warning: "#FFF4DE",
|
||||
danger: "#FFE2E5",
|
||||
light: "#F3F6F9",
|
||||
dark: "#D6D6E0",
|
||||
},
|
||||
inverse: {
|
||||
white: "#ffffff",
|
||||
primary: "#ffffff",
|
||||
secondary: "#3F4254",
|
||||
success: "#ffffff",
|
||||
info: "#ffffff",
|
||||
warning: "#ffffff",
|
||||
danger: "#ffffff",
|
||||
light: "#464E5F",
|
||||
dark: "#ffffff",
|
||||
},
|
||||
},
|
||||
gray: {
|
||||
"gray-100": "#F3F6F9",
|
||||
"gray-200": "#EBEDF3",
|
||||
"gray-300": "#E4E6EF",
|
||||
"gray-400": "#D1D3E0",
|
||||
"gray-500": "#B5B5C3",
|
||||
"gray-600": "#7E8299",
|
||||
"gray-700": "#5E6278",
|
||||
"gray-800": "#3F4254",
|
||||
"gray-900": "#181C32",
|
||||
},
|
||||
},
|
||||
"font-family": "Poppins",
|
||||
};
|
||||
</script>
|
||||
<!--end::Global Config-->
|
||||
|
||||
<!--begin::Global Theme Bundle(used by all pages)-->
|
||||
<script src="assets/plugins/global/plugins.bundle.js"></script>
|
||||
<script src="assets/plugins/custom/prismjs/prismjs.bundle.js"></script>
|
||||
<script src="assets/js/scripts.bundle.js"></script>
|
||||
<!--end::Global Theme Bundle-->
|
||||
|
||||
<!--begin::Page Vendors(used by this page)-->
|
||||
<script src="assets/plugins/custom/fullcalendar/fullcalendar.bundle.js"></script>
|
||||
<!--end::Page Vendors-->
|
||||
|
||||
<!--begin::Page Scripts(used by this page)-->
|
||||
<script src="assets/js/pages/widgets.js"></script>
|
||||
<!--end::Page Scripts-->
|
||||
<script src="assets/js/iconify/iconify.min.js"></script>
|
||||
|
||||
<script>
|
||||
var saranMcu = $("#saranMcu");
|
||||
autosize(saranMcu);
|
||||
|
||||
function showWordingModal() {
|
||||
// $("#modalWordingSurveyMcu").on("shown.bs.modal", function () {});
|
||||
$("#modalWordingSurveyMcu").modal("show");
|
||||
}
|
||||
|
||||
function hideWordingModal() {
|
||||
// $("#modalWordingSurveyMcu").on("hidden.bs.modal", function (e) {});
|
||||
$("#modalWordingSurveyMcu").modal("hide");
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
<!--end::Body-->
|
||||
</html>
|
||||
@@ -90,14 +90,14 @@ License: You must have a valid license purchased only from themeforest(the above
|
||||
body {
|
||||
background-color: var(--white);
|
||||
}
|
||||
|
||||
.card-control {
|
||||
width: 390px;
|
||||
height: 1212px;
|
||||
background-image: url("asset-corporate-portal/media/kartukontrol/bg-kartuKontrol.svg");
|
||||
background-size: 390px 1212px;
|
||||
background-repeat: no-repeat;
|
||||
/* margin: auto; */
|
||||
margin-bottom: 14vh;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.foto {
|
||||
@@ -262,8 +262,45 @@ License: You must have a valid license purchased only from themeforest(the above
|
||||
<!-- end::Pemeriksaan/Pengambilan Sample -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- atur spacing bottom -->
|
||||
<div style="height: 14vh"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- modal wording start -->
|
||||
<div
|
||||
class="modal fade"
|
||||
style="display: none"
|
||||
id="modalWordingSurveyMcu"
|
||||
tabindex="-1"
|
||||
role="dialog"
|
||||
data-backdrop="static"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="modal-dialog modal-dialog-centered" role="document">
|
||||
<div class="modal-content rounded-lg">
|
||||
<div class="modal-header border-bottom-0">
|
||||
<h1 class="text-black font-weight-bolder">Perhatian</h1>
|
||||
</div>
|
||||
<div class="modal-body border-bottom-0">
|
||||
<h6 class="text-black">
|
||||
Silahkan isi questioner untuk membantu peningkatan layanan kami.
|
||||
<br /><br />Terima kasih.
|
||||
</h6>
|
||||
</div>
|
||||
<div class="modal-footer border-top-0">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
onclick="hideWordingModal()"
|
||||
>
|
||||
OK
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- modal wording end -->
|
||||
<!--end::Container-->
|
||||
|
||||
<script>
|
||||
@@ -347,6 +384,18 @@ License: You must have a valid license purchased only from themeforest(the above
|
||||
<script src="assets/js/pages/widgets.js"></script>
|
||||
<!--end::Page Scripts-->
|
||||
<script src="assets/js/iconify/iconify.min.js"></script>
|
||||
|
||||
<script>
|
||||
function showWordingModal() {
|
||||
// $("#modalWordingSurveyMcu").on("shown.bs.modal", function () {});
|
||||
$("#modalWordingSurveyMcu").modal("show");
|
||||
}
|
||||
|
||||
function hideWordingModal() {
|
||||
// $("#modalWordingSurveyMcu").on("hidden.bs.modal", function (e) {});
|
||||
$("#modalWordingSurveyMcu").modal("hide");
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
<!--end::Body-->
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user