@ozdao/prometheus-framework 0.1.30 → 0.1.31

package/dist/users.server.js

@@ -2,7 +2,11 @@
 const _commonjsHelpers = require("./_commonjsHelpers-3b53548e.js");
 require("uuid");
 const require$$1 = require("mongoose");
+const addMembersQuantity$1 = require("./addMembersQuantity-f922d82b.js");
+require("mongodb");
 const ObjectId = require$$1.Types.ObjectId;
+const addUserStatusFields = addMembersQuantity$1.addUserStatusFields_1;
+const addMembersQuantity = addMembersQuantity$1.addMembersQuantity_1;
 const controllerFactory$1 = (db) => {
   const User = db.user;
   const read = async (req, res) => {
@@ -40,24 +44,8 @@ const controllerFactory$1 = (db) => {
         as: "memberships"
       }
     });
-    query.push({
-      $addFields: {
-        numberOfMemberships: { $size: "$memberships" }
-      }
-    });
-    query.push({
-      $addFields: {
-        isMember: {
-          $cond: {
-            if: req.query.user,
-            then: {
-              $in: [new ObjectId(req.query.user), "$memberships.user"]
-            },
-            else: "$$REMOVE"
-          }
-        }
-      }
-    });
+    query.push(addMembersQuantity());
+    query.push(addUserStatusFields(req.query.user));
     query.push({
       $skip: skip
     });

package/dist/users.server.mjs

@@ -1,7 +1,11 @@
 import { g as getDefaultExportFromCjs } from "./_commonjsHelpers-83b1d755.mjs";
 import "uuid";
 import require$$1 from "mongoose";
+import { a as addUserStatusFields_1, b as addMembersQuantity_1 } from "./addMembersQuantity-ea216f92.mjs";
+import "mongodb";
 const ObjectId = require$$1.Types.ObjectId;
+const addUserStatusFields = addUserStatusFields_1;
+const addMembersQuantity = addMembersQuantity_1;
 const controllerFactory$1 = (db) => {
   const User = db.user;
   const read = async (req, res) => {
@@ -39,24 +43,8 @@ const controllerFactory$1 = (db) => {
         as: "memberships"
       }
     });
-    query.push({
-      $addFields: {
-        numberOfMemberships: { $size: "$memberships" }
-      }
-    });
-    query.push({
-      $addFields: {
-        isMember: {
-          $cond: {
-            if: req.query.user,
-            then: {
-              $in: [new ObjectId(req.query.user), "$memberships.user"]
-            },
-            else: "$$REMOVE"
-          }
-        }
-      }
-    });
+    query.push(addMembersQuantity());
+    query.push(addUserStatusFields(req.query.user));
     query.push({
       $skip: skip
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ozdao/prometheus-framework",
-  "version": "0.1.30",
+  "version": "0.1.31",
   "description": "Web3 Framework focused on user experience and ease of development.",
   "author": "OZ DAO <hello@ozdao.dev>",
   "license": "GPL-3.0-or-later",
@@ -132,6 +132,14 @@
     "./modules/legal/client": {
       "import": "./dist/legal.client.js",
       "require": "./dist/legal.client.cjs"
+    },
+    "./modules/reports/client": {
+      "import": "./dist/reports.client.js",
+      "require": "./dist/reports.client.cjs"
+    },
+    "./modules/reports/server": {
+      "import": "./dist/reports.server.mjs",
+      "require": "./dist/reports.server.js"
     }
   },
   "browser": {

package/src/components/Button/Button.vue

@@ -1,5 +1,5 @@
 <script setup>
-	import { ref, withDefaults } from 'vue'
+	import { ref } from 'vue'
 	
 	const props = defineProps({
 		submit: {
@@ -14,6 +14,10 @@
 			type: Number,
 			default: 750
 		},
+		showSucces: {
+			type: Boolean,
+			default: true
+		},
 		validation: {
 			type: Boolean,
 			default: false
@@ -26,79 +30,81 @@
 	const finished = ref(false);
 
 	async function Submit() {
-		button.value.style['pointer-events'] = 'none';
-		error.value = null;
-		loading.value = true;
-
-		try {
-			await props.submit();
-			button.value.classList.replace('bg-main', 'bg-light-main');
-
-			loading.value = false;
-			finished.value = true;
-			
-			setTimeout(() => {
-				if (button.value) {
-					button.value.classList.replace('bg-light-main', 'bg-main');
-					button.value.style.pointerEvents = 'auto';
-					loading.value = false;
-					finished.value = false;
-					error.value = null;
-				}
-			}, 500);
-
-			if (props.callback) setTimeout(() => props.callback(), props.callbackDelay);
-
-		} catch (err) {
-
-			button.value.classList.replace('bg-main', 'bg-fourth-nano');
-
-			error.value = '❌';
-			
-			setTimeout(() => {
-				button.value.classList.replace('bg-fourth-nano', 'bg-main');
-				button.value.style.pointerEvents = 'auto';
-				loading.value = false;
-				finished.value = false;
-				error.value = null;
-			}, 1330);
-		}
+	    button.value.style['pointer-events'] = 'none';
+	    error.value = null;
+	    loading.value = true;
+
+	    // Функция для сброса состояния кнопки.
+	    const resetButton = () => {
+	        if (button.value) {
+	            button.value.classList.replace('bg-light-main', 'bg-main');
+	            button.value.style.pointerEvents = 'auto';
+	            loading.value = false;
+	            finished.value = false;
+	            error.value = null;
+	        }
+	    };
+
+	    try {
+	        await props.submit();
+	        button.value.classList.replace('bg-main', 'bg-light-main');
+
+	      
+	        loading.value = false;
+	        // Используем функцию сброса состояния кнопки здесь.
+	        if (props.showSucces) { 
+				finished.value = true;
+	            setTimeout(resetButton, 500);
+	        } else {
+	            resetButton();
+	        }
+
+	        // Если есть callback, мы также установим таймер для его вызова.
+	        if (props.callback) setTimeout(() => props.callback(), props.callbackDelay);
+
+	    } catch (err) {
+	        // Если возникла ошибка, мы изменяем стили и устанавливаем сообщение об ошибке.
+	        button.value.classList.replace('bg-main', 'bg-fourth-nano');
+	        error.value = '❌';
+	        
+	        // После задержки снова сбрасываем состояние кнопки.
+	        setTimeout(() => {
+	            resetButton();
+	            // Так как класс кнопки был изменен, вернем его в исходное состояние.
+	            button.value.classList.replace('bg-fourth-nano', 'bg-main');
+	        }, 1330);
+	    }
 	}
+
 </script>
 
 <template>
 	<button @click.stop="Submit" :disabled="validation" ref="button" class="w-100 bg-main button">
 		<!-- Slot -->
-		<transition mode="out-in" name="fadeIn">
+		<transition  name="TransitionTranslateY-small">
 			<span v-if="!loading && !error && !finished">
 				<slot></slot>
 			</span>
 		</transition>
 		<!-- Loading Circle Animation -->
-		<transition mode="out-in" name="fadeIn">
-			<div v-if="loading && !error" class="loading">
-				<span>
-					<svg class="i-small" width="135"	height="140" viewBox="0 0 135 140" xmlns="http://www.w3.org/2000/svg" fill="#fff">
-						<rect 			  y="10"	width="15" 	height="120" rx="6">	<animate attributeName="height"	begin="0.5s" 	dur="1s"	values="120;110;100;90;80;70;60;50;40;140;120" calcMode="linear"	repeatCount="indefinite" /> <animate attributeName="y"	begin="0.5s" 	dur="1s"	values="10;15;20;25;30;35;40;45;50;0;10" calcMode="linear"	repeatCount="indefinite"/> </rect> 
-						<rect x="30"	y="10" 	width="15" 	height="120" rx="6"> 	<animate attributeName="height"	begin="0.25s" dur="1s"	values="120;110;100;90;80;70;60;50;40;140;120" calcMode="linear"	repeatCount="indefinite" /> <animate attributeName="y"	begin="0.25s" dur="1s"	values="10;15;20;25;30;35;40;45;50;0;10" calcMode="linear"	repeatCount="indefinite"/> </rect>
-						<rect x="60" 				 	width="15" 	height="140" rx="6"> 	<animate attributeName="height"	begin="0s" 		dur="1s"	values="120;110;100;90;80;70;60;50;40;140;120" calcMode="linear"	repeatCount="indefinite" /> <animate attributeName="y"	begin="0s" 		dur="1s"	values="10;15;20;25;30;35;40;45;50;0;10" calcMode="linear"	repeatCount="indefinite"/> </rect>
-						<rect x="90"	y="10"	width="15" 	height="120" rx="6"> 	<animate attributeName="height"	begin="0.25s" dur="1s"	values="120;110;100;90;80;70;60;50;40;140;120" calcMode="linear"	repeatCount="indefinite" /> <animate attributeName="y"	begin="0.25s" dur="1s"	values="10;15;20;25;30;35;40;45;50;0;10" calcMode="linear"	repeatCount="indefinite"/> </rect>
-						<rect x="120" y="10" 	width="15" 	height="120" rx="6"> 	<animate attributeName="height"	begin="0.5s" 	dur="1s"	values="120;110;100;90;80;70;60;50;40;140;120" calcMode="linear"	repeatCount="indefinite" /> <animate attributeName="y"	begin="0.5s" 	dur="1s"	values="10;15;20;25;30;35;40;45;50;0;10" calcMode="linear"	repeatCount="indefinite"/> </rect> 
-					</svg>
-				</span>
-			</div>
+		<transition  name="TransitionTranslateY-small">
+			<span v-if="loading && !error" class="loading">
+				<svg class="i-regular" width="135"	height="140" viewBox="0 0 135 140" xmlns="http://www.w3.org/2000/svg" fill="#fff">
+					<rect 			  y="10"	width="15" 	height="120" rx="6">	<animate attributeName="height"	begin="0.5s" 	dur="1s"	values="120;110;100;90;80;70;60;50;40;140;120" calcMode="linear"	repeatCount="indefinite" /> <animate attributeName="y"	begin="0.5s" 	dur="1s"	values="10;15;20;25;30;35;40;45;50;0;10" calcMode="linear"	repeatCount="indefinite"/> </rect> 
+					<rect x="30"	y="10" 	width="15" 	height="120" rx="6"> 	<animate attributeName="height"	begin="0.25s" dur="1s"	values="120;110;100;90;80;70;60;50;40;140;120" calcMode="linear"	repeatCount="indefinite" /> <animate attributeName="y"	begin="0.25s" dur="1s"	values="10;15;20;25;30;35;40;45;50;0;10" calcMode="linear"	repeatCount="indefinite"/> </rect>
+					<rect x="60" 				 	width="15" 	height="140" rx="6"> 	<animate attributeName="height"	begin="0s" 		dur="1s"	values="120;110;100;90;80;70;60;50;40;140;120" calcMode="linear"	repeatCount="indefinite" /> <animate attributeName="y"	begin="0s" 		dur="1s"	values="10;15;20;25;30;35;40;45;50;0;10" calcMode="linear"	repeatCount="indefinite"/> </rect>
+					<rect x="90"	y="10"	width="15" 	height="120" rx="6"> 	<animate attributeName="height"	begin="0.25s" dur="1s"	values="120;110;100;90;80;70;60;50;40;140;120" calcMode="linear"	repeatCount="indefinite" /> <animate attributeName="y"	begin="0.25s" dur="1s"	values="10;15;20;25;30;35;40;45;50;0;10" calcMode="linear"	repeatCount="indefinite"/> </rect>
+					<rect x="120" y="10" 	width="15" 	height="120" rx="6"> 	<animate attributeName="height"	begin="0.5s" 	dur="1s"	values="120;110;100;90;80;70;60;50;40;140;120" calcMode="linear"	repeatCount="indefinite" /> <animate attributeName="y"	begin="0.5s" 	dur="1s"	values="10;15;20;25;30;35;40;45;50;0;10" calcMode="linear"	repeatCount="indefinite"/> </rect> 
+				</svg>
+			</span>
 		</transition>
 		<!-- Checkmark if finished -->
-		<transition mode="out-in" name="fadeIn">
-			<div v-if="finished" class="h4 loading">
-				<span class="p-small t-white">✔</span>
-			</div>
+		<transition name="TransitionTranslateY-small">
+			<span v-if="finished && showSucces" class="loading t-white">✔</span>
 		</transition>
 		<!-- Error if not finished -->
-		<transition mode="out-in" name="fadeIn">
-			<div v-if="error" class="error">
-				<span>{{ error }}</span>
-			</div>
+		<transition name="TransitionTranslateY-small">
+			<span v-if="error" class="error">{{ error }}</span>
 		</transition>
 		
 	</button> 
@@ -114,7 +120,7 @@
 
 		padding: 1rem 1.75rem;
 		border-radius: 3rem;
-		// background-color: #00ff88;
+
 
 		transform: scale(1);
 		opacity: 1;

package/src/components/CardHeader/CardHeader.vue

@@ -93,44 +93,55 @@
 					        class="br-solid br-2px br-white i-thin bg-grey radius-big"
 					    />
 					</div>
-
-
-
 				</div>
 
-				<div 
-					@click.stop="openReportPopup()"
-					v-if="type !== 'short'"
-					class="t-transp t-white flex-center flex t-semi mn-l-thin i-medium radius-extra bg-black"
+				<!-- Report -->
+				<Dropdown 
+					v-if="type !== 'short' && user != creator.target._id"
+					:label="'...'" 
+					:align="'right'"
+					class="cursor-pointer z-index-2 pd-thin radius-extra "
 				>
-					!
-				</div>
-
-				<Popup 
-				  @close-popup="closeReportPopup" 
-				  :isPopupOpen="isReportPopup"
+					<section 
+						class="bg-black pd-thin radius-small"
+					>
+						<FormReport 
+							v-if="user !== creator.target._id"
+							:user="user"
+							:type="entityType" 
+							:target="entity._id" 
+							:text="'Report'" 
+							class="w-100"
+						>
+							<button 
+								class="w-100 bg-black br-solid br-1px br-white-transp-20 t-white button-small button"
+							>
+								Report
+							</button>
+						</FormReport>
+
+						<!-- <ButtonToggleMembership
+							v-if="user"
+					      	:user="user"
+					      	:type="creator.hidden ? 'organization' : 'user'" 
+				      		:role="'blocked'" 
+					      	:target="creator.hidden ? owner.target._id : creator.target._id" 
+					      	:status="entity.isBlocked" 
+					      	:text="{create: 'Block', remove: 'Unblock'}"
+					      	@updateMembership="event => {entity.isBlocked = !entity.isBlocked}"
+					      	class="t-white mn-t-thin bg-red" 
+			    		/> -->
+					</section>
+		      </Dropdown>	
+				<!-- <FormReport
+					
 				>
-				  <div class="w-m-66r t-left pd-big bg-white radius-big">
-				    <h3 class="mn-small">Report Inappropriate Content</h3>
-				    
-				    <p class="p-medium mn-small">We strive to maintain a safe and comfortable environment for all users. If you encounter content that you believe violates our guidelines, please report it. Here’s what you can report:</p>
-				    <ul class="p-medium mn-small">
-				        <li>1. Abusive or harmful content</li>
-				        <li>2. Spam or misleading information</li>
-				        <li>3. Inappropriate or offensive material</li>
-				        <li>4. Unauthorized sharing of personal information</li>
-				    </ul>
-				    <p class="p-medium mn-small">Our team of moderators will review your report and take appropriate action, which may include removing the content if it is found to be in violation of our policies.</p>
-				    
-				    <Button 
-				    	:submit="onSubmit" 
-				    	:callback="closeReportPopup" 
-				    	class="w-100 bg-black t-white">
-				    	Report
-				    </Button>
-				  </div>
-				</Popup>
-
+					<button 
+						class="mn-l-small br-solid br-black-transp-10 br-2px bg-transp i-semi cursor-pointer radius-extra"
+					>
+						!
+					</button>
+				</FormReport> -->
 			</div>
 		</div>
 	</header>
@@ -143,11 +154,15 @@
 	import { useRouter } from 'vue-router'
 
 	import PlaceholderUserpic from '@pf/src/modules/icons/placeholders/PlaceholderUserpic.vue'
+	import FormReport from '@pf/src/modules/reports/components/sections/FormReport.vue'   
 
-	import Popup from '@pf/src/components/Popup/Popup.vue';
-	import Button from '@pf/src/components/Button/Button.vue';   
+	import Dropdown from "@pf/src/components/Dropdown/Dropdown.vue";
+	import ButtonToggleMembership from '@pf/src/modules/organizations/components/elements/ButtonToggleMembership.vue'
 
 	const props = defineProps([
+		'user',
+		'entity',
+		'entityType',
 		'date',
 		'dateFormatted',
 		'owner',
@@ -159,21 +174,7 @@
 
 	const router = useRouter()
 
-	// Popup logic
-	const isReportPopup = ref(false)
 
-	function openReportPopup() {
-	  isReportPopup.value = true;
-	}
-	function closeReportPopup() {
-	  isReportPopup.value = false;
-	}
-	// Popup Logic
-	async function onSubmit() {
-		setTimeout(function() {
-
-		}, 1);
-	}
 
 	function getTimeElapsed(timestamp) {
 	  const now = new Date();

package/src/components/Dropdown/Dropdown.vue

@@ -1,41 +1,57 @@
 <template>
-  <div class="dropdown z-index-2" @click="isOpen = !isOpen">
+  <div class="dropdown pos-relative" v-click-outside="clickedOutside" @click.stop="isOpen = !isOpen">
     {{label}}
+    <transition name="TransitionTranslateY" mode="out-in">
+      <div 
+        v-show="isOpen" 
+        :style="{ left: align === 'left' ? '0' : 'auto', right: align === 'right' ? '0' : 'auto' }" 
+        class="dropdown-content w-15r radius-big" 
+      >
+        <slot></slot>
+      </div>
+    </transition>
 
-    <div class="dropdown-content bg-black w-15r radius-big" v-show="isOpen">
-      <slot></slot>
-    </div>
   </div>
 </template>
 
 <script setup>
-import { ref } from 'vue';
+import { ref, directive } from 'vue';
 
- const props = defineProps({
+import clickOutside from '../FieldPhone/click-outside';
+
+let vClickOutside = clickOutside
+
+const props = defineProps({
   label: {
     type: String,
     default: 'Open'
+  },
+    align: {
+    type: String,
+    default: 'left'
   }
-  })
+})
 
 const isOpen = ref(false);
+
+function clickedOutside () {
+  isOpen.value = false
+}
 </script>
 
 <style scoped>
 .dropdown {
-  position: relative;
   display: inline-block;
 }
 
 .dropdown-content {
-  display: none;
+   display: block;
   position: absolute;
   box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
-  padding: 12px 16px;
   z-index: 1;
 }
 
-.dropdown:hover .dropdown-content {
+/*.dropdown:hover .dropdown-content {
   display: block;
-}
+}*/
 </style>

package/src/components/FieldPhone/click-outside.js

@@ -1,51 +1,3 @@
-// // Polyfill for Event.path in IE 11: https://stackoverflow.com/a/46093727
-// function getParents(node, memo) {
-//   const parsedMemo = memo || [];
-//   const { parentNode } = node;
-
-//   if (!parentNode) {
-//     return parsedMemo;
-//   }
-
-//   return getParents(parentNode, parsedMemo.concat(parentNode));
-// }
-
-// // Click-outside by BosNaufal: https://github.com/BosNaufal/vue-click-outside
-// export default {
-//   bind(el, binding, vNode) {
-//     // Provided expression must evaluate to a function.
-//     if (typeof binding.value !== "function") {
-//       const compName = vNode.context.name;
-//       let warn = `[Vue-click-outside:] provided expression ${binding.expression}
-//  is not a function, but has to be`;
-//       if (compName) {
-//         warn += `Found in component ${compName}`;
-//       }
-//       console.warn(warn);
-//     }
-//     // Define Handler and cache it on the element
-//     const { bubble } = binding.modifiers;
-//     const handler = (e) => {
-//       // Fall back to composedPath if e.path is undefined
-//       const path = e.path
-//         || (e.composedPath ? e.composedPath() : false)
-//         || getParents(e.target);
-//       if (bubble || (path.length && !el.contains(path[0]) && el !== path[0])) {
-//         binding.value(e);
-//       }
-//     };
-//     el.__vueClickOutside__ = handler;
-//     // add Event Listeners
-//     document.addEventListener('click', handler);
-//   },
-//   unbind(el) {
-//     // Remove Event Listeners
-//     document.removeEventListener('click', el.__vueClickOutside__);
-//     el.__vueClickOutside__ = null;
-//   },
-// };
-
-// https://stackoverflow.com/questions/63869859/detect-click-outside-element-on-vue-3
 export default {
   beforeMount(el, binding, vNode) { // (el, binding, vNode)
     // Provided expression must evaluate to a function.

package/src/components/Popup/Popup.vue

@@ -1,25 +1,23 @@
 <template>
 	
 	<teleport to="body" v-if="isPopupOpen">
-		<transition name="scale">
-			<div v-show="isPopupOpen"  class="pd-small popup-wrapper">
-
-				<section class="t-center z-index-4" v-bind="$attrs">
-					<!-- Close Popup -->
-					<button @click="closePopup()" class="pd-regular hover-scale-1  z-index-5 button-close-popup button">
-						<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
-							<rect width="24" height="24" transform="translate(1 1)" />
-							<path fill-rule="evenodd" clip-rule="evenodd" d="M12.9996 10.8L22.8994 0.900244L25.0993 3.1002L15.1995 13L25.0993 22.8998L22.8994 25.0998L12.9996 15.2L3.09976 25.0998L0.899801 22.8998L10.7996 13L0.899801 3.1002L3.09976 0.900244L12.9996 10.8Z" fill="white"/>
-						</svg>
-					</button>
-					<!-- Popup Header -->
-					<slot></slot>
-				</section>  
+		<transition name="TransitionTranslateY" appear>
+			<div v-if="isPopupOpen" key="popup-content" class="pd-small popup-wrapper">
+
+				<transition name="TransitionTranslateY" mode="out-in">
+					<section v-if="isPopupOpen" class="pos-relative z-index-4" v-bind="$attrs">
+						<!-- Close Popup -->
+						<button @click="closePopup()" class="pd-regular hover-scale-1  z-index-5 button-close-popup button">
+							<IconCross/>
+						</button>
+						<slot></slot>
+					</section>  
+				</transition>
 
 				<div 
 					@click="closePopup()" 
-			    :class="{'active':isPopupOpen === true}" 
-			    class="color-overlay z-index-3">
+			    	:class="{'active':isPopupOpen === true}" 
+			    	class="color-overlay z-index-3">
 				</div>
 			</div>
 		</transition>
@@ -27,11 +25,12 @@
 </template>
 
 <script setup>
-import { watch } from 'vue';
+import { computed, watch, onMounted, ref, nextTick } from 'vue';
 // Import libs
-import { computed, onMounted } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
+// Icons
+import IconCross from '@pf/src/modules/icons/navigation/IconCross.vue';
 // Define props
 const props = defineProps({
   isPopupOpen: {
@@ -53,16 +52,15 @@ watch(() => props.isPopupOpen, (newVal) => {
     document.body.classList.remove('no-scroll');
   }
 });
+
 // Accessing router and store
 const route = useRoute()
 const router = useRouter()
 // Localization
 const text = {
-  messages: {
-    en: {
-    },
-    ru: {
-	  }
+  	messages: {
+	    en: {},
+	    ru: {}
 	}
 }
 const { t } = useI18n(text)
@@ -72,4 +70,57 @@ const { t } = useI18n(text)
 	.no-scroll {
 	  overflow: hidden;
 	}
+
+	.popup-wrapper {
+		display: flex;
+		position: fixed;
+
+		align-items: center;
+		justify-content: center;
+
+		width: 100%;
+		height: 100%;
+
+		left: 0;
+		top: 0;
+
+		z-index: 40;
+
+		.popup {
+			position: absolute;
+			height: auto;
+			padding: 2rem;
+			min-width: 24rem;
+			border-radius: 2rem;
+			overflow: hidden;
+
+			color: white;
+			background: black;
+
+			z-index: 40;
+		}
+	}
+
+	.color-overlay {
+		display: block;
+		position: fixed;
+
+		left: 0;
+		top: 0;
+
+		width: 100%;
+		height: 100%;
+
+		background: rgba(0,0,0,0.0);
+		pointer-events: none;
+
+		transform: scale(1.5);
+
+		transition: all 0.5s cubic-bezier(.31,.79,.24,.92);
+
+		&.active {
+			background: rgba(#000,0.25);
+			pointer-events: all;
+		}
+	}
 </style>