Base Login

pages/policy.vue

@@ -0,0 +1,146 @@
+<template>
+  <div class="column user-policy is-4 p-0" style="margin: auto">
+    <div class="user-part_head">
+      <div class="user-part_head-btn" @click="getback()">
+        <i class="mdi mdi-chevron-left"></i>
+      </div>
+      <div class="user-part_head-text">
+        <p>Điều khoản và dịch vụ</p>
+      </div>
+    </div>
+    <div class="policy_body px-3">
+      <div class="policy_body-title1">
+        <p>CÁC ĐIỀU KHOẢN DỊCH VỤ BÊN DƯỚI ĐÂY CÓ HIỆU LỰC CHO CẢ KHÁCH HÀNG CHÍNH THỨC VÀ KHÁCH HÀNG DÙNG THỬ</p>
+      </div>
+
+      <p>
+        Nội dung Điều khoản và Chính sách đang được cập nhật để đảm bảo tính đầy đủ và chính xác. Chúng tôi sẽ sớm hoàn
+        thiện trong thời gian tới.
+      </p>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  methods: {
+    getback() {
+      this.$router.push('/signup');
+    },
+  },
+};
+</script>
+
+<style>
+.user-policy_body {
+  padding: 0 20px;
+}
+.user-policy_body-title {
+  margin-top: 40px;
+  padding-bottom: 10px;
+  font-size: 1.5rem;
+  font-weight: 700;
+  color: #09b412;
+  position: relative;
+}
+.user-policy_body-title::after {
+  position: absolute;
+  content: '';
+  width: 100%;
+  height: 1px;
+  background-color: #eee;
+  bottom: 0px;
+}
+.user-pocily_body-content {
+  padding-top: 40px;
+}
+.user-pocily_body-content-1 {
+  font-weight: 600;
+  text-decoration: underline;
+}
+.user-pocily_body-content-2 {
+  font-weight: 600;
+}
+.user-pocily_body-content-3 {
+  text-decoration: underline;
+}
+.user-pocily_body-content-4 {
+  font-size: 14px;
+  line-height: 24px;
+}
+.policy {
+  margin: auto;
+}
+.policy_header {
+  font-weight: 700;
+  font-size: 40px;
+  color: #09b412;
+  margin-top: 50px;
+}
+.policy_body {
+  margin-top: 20px;
+}
+.policy_body-title1 {
+  text-align: center;
+  margin: 10px 10px 0;
+  font-weight: 600;
+  font-size: 22px;
+}
+.policy_body-title2 {
+  font-weight: 600;
+  margin: 50px 0 20px;
+}
+.policy_body-sub span {
+  font-weight: 600;
+}
+.policy_body-sub p {
+  margin-bottom: 14px;
+}
+
+/* ____________________________user_______________________________ */
+.user-part_head {
+  height: 70px;
+  position: relative;
+  background-color: rgba(9, 180, 18, 1);
+  margin-bottom: 16px;
+  border-bottom-right-radius: 20px;
+  border-bottom-left-radius: 20px;
+}
+.user-part_head-btn {
+  position: absolute;
+  z-index: 1;
+  bottom: 12px;
+  left: 30px;
+  color: #fdfdfd;
+  font-size: 24px;
+  line-height: 24px;
+}
+.user-part_head-btn:hover::after {
+  transform: scale(1.2);
+  transition-duration: 0.4s;
+}
+.user-part_head-btn::after {
+  position: absolute;
+  content: '';
+  width: 100%;
+  height: 100%;
+  left: 0px;
+  top: 0;
+  border: 1px solid #fff;
+  border-radius: 50%;
+  transform: scale(0);
+  transition-duration: 0.4s;
+}
+.user-part_head-btn:hover {
+  cursor: pointer;
+}
+.user-part_head-text {
+  display: flex;
+  justify-content: center;
+  width: 100%;
+  position: absolute;
+  bottom: 12px;
+  font-size: 20px;
+  line-height: 24px;
+  color: #fdfdfd;
+}
+</style>