Added new widget Buttons group.

totaljs · Mar 23, 2024 · 1e7752b · 1e7752b
1 parent 6ca01e5
commit 1e7752b
Showing 1 changed file with 46 additions and 0 deletions.
diff --git a/widgets/buttonsgroup.html b/widgets/buttonsgroup.html
@@ -0,0 +1,46 @@
+<script total>
+	exports.id = 'buttonsgroup';
+	exports.name = 'Buttons group';
+	exports.author = 'Total.js';
+	exports.version = '1';
+	exports.preview = 'data:image/gif;base64,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';
+    exports.config = {};
+</script>
+
+<style>
+	.CLASS-button { display: flex; color: #333; align-items: center; cursor: pointer; background-color: #fff; transition: background-color 0.1s; font-size: 15px; border: 1px solid rgba(0,0,0,0.16); border-radius: var(--radius); padding: 20px; }
+	.CLASS-button i { font-size: 34px; margin-right: 20px; }
+	.CLASS-button:hover { background-color: #f0f0f0; text-decoration: none; }
+	.CLASS-name { font-weight: bold; }
+	.CLASS-desc { font-size: 13px; margin-top: 3px; line-height: 16px; }
+	.CLASS { display: grid; overflow: hidden; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 1fr; grid-column-gap: var(--gap); grid-row-gap: var(--gap); }
+
+	@media (max-width: 768px) { 
+		.CLASS { grid-template-columns: repeat(1, 1fr); }
+	}
+
+</style>
+
+<body>
+	<a href="#" class="CMS_repeat CMS_remove CMS_attribute CLASS-button">
+		<div><i class="CMS_edit CMS_attribute ti ti-book" style="color:#AB149E"></i></div>
+		<div>
+			<div class="CMS_edit CMS_attribute CLASS-name">Lorem ipsum</div>
+			<div class="CMS_edit CMS_atrribute CLASS-desc">Lorem ipsum dolor sit amet</div>
+		</div>
+	</a>
+	<a href="#" class="CMS_repeat CMS_remove CMS_attribute CLASS-button">
+		<div><i class="CMS_edit CMS_attribute ti ti-cloud" style="color:#009CE0"></i></div>
+		<div>
+			<div class="CMS_edit CMS_attribute CLASS-name">Lorem ipsum</div>
+			<div class="CMS_edit CMS_atrribute CLASS-desc">Lorem ipsum dolor sit amet</div>
+		</div>
+	</a>
+	<a href="#" class="CMS_repeat CMS_remove CMS_attribute CLASS-button">
+		<div><i class="CMS_edit CMS_attribute ti ti-pin" style="color:#D33115"></i></div>
+		<div>
+			<div class="CMS_edit CMS_attribute CLASS-name">Lorem ipsum</div>
+			<div class="CMS_edit CMS_atrribute CLASS-desc">Lorem ipsum dolor sit amet</div>
+		</div>
+	</a>
+</body>