plxdcma_rendericon_center 1.0.1

package/css.css

@@ -0,0 +1,15 @@
+.cardcentericon{
+  background: white; padding: 2rem; border-radius: 15px; text-align: center; box-shadow: 0 5px 15px rgba(0,0,0,0.08); transition: transform 0.3s ease;
+}
+.cardcentericon > i{
+  color: #dc2626; font-size: 3rem; margin-bottom: 1rem;
+}
+.cardcentericon > h4{
+  font-size: 1.25rem; font-weight: 600; color: #1f2937; margin-bottom: 1rem;
+}
+.cardcentericon > h4{
+  font-size: 1.25rem; font-weight: 600; color: #1f2937; margin-bottom: 1rem;
+}
+.cardcentericon >p{
+  color: #6b7280; line-height: 1.6;
+}

package/init.js

@@ -0,0 +1,34 @@
+var plxdcma_standarinit=require(`plxdcma_standarinit`)
+var fs=require(`fs`)
+var path=require(`path`)
+var myux=require(`plxdcma_myux`)
+var plxdcma_iconrendererprotocol=require(`plxdcma_iconrendererprotocol`)
+module.exports.use=function(req){
+  if(req.__myAppInternals.centralizedicon == null){
+    myux.use(req)
+    plxdcma_iconrendererprotocol.use(req)
+    req.__myAppInternals.centralizedicon=true
+    if(req.__myAppInternals.paths == null){
+      req.__myAppInternals.paths=[]
+    }
+    req.__myAppInternals.paths.push(`<script src="/myux/icons/C_Icon.js"></script>`)
+    req.__myAppInternals.paths.push(`<link rel="stylesheet" href="/myux/icons/C_Icon.css">`)
+    if(req.__myAppInternals.modals == null){
+      req.__myAppInternals.modals=[]
+    }
+  }
+}
+plxdcma_standarinit.use(function(app){
+  app.get(`/myux/icons/C_Icon.js`,function(req,res){
+    fs.readFile(path.join(__dirname,"js.js"),"utf8",function(err,html){
+      res.write(html)
+      res.end()
+    })
+  })
+  app.get(`/myux/icons/C_Icon.css`,function(req,res){
+    fs.readFile(path.join(__dirname,"css.css"),"utf8",function(err,html){
+      res.write(html)
+      res.end()
+    })
+  })
+})

package/js.js

@@ -0,0 +1,24 @@
+function icon_imagetitlesubtitle_center(data,isediting,section){
+  if(data == null && isediting){
+      return `<div  class="cardcentericon" onclick='didRequestToAddAnIcon(${section})'>
+          <br/><br/>
+          <i class="fas fa-plus" style=""></i>
+      </div>`
+  }
+  var cstring=``
+  var ock=""
+  if(isediting){
+    cstring=`contenteditable='true'`
+    ock=`onclick='replaceThisIcon(event.target)'`
+  }
+
+
+  var h=`
+  <div class="cardcentericon">
+      <i ${ock} cxtza='icon' class="fas fa-handshake" style=""></i>
+      <h4 cxtza='titulo' ${cstring} >${data.titulo ?? `Titulo`}</h4>
+      <p cxtza='subtitulo'  ${cstring} >${data.subtitulo ?? `Creemos en la fuerza del trabajo colaborativo y el apoyo mutuo`}</p>
+  </div>
+          `
+return h
+}

package/package.json

@@ -0,0 +1,6 @@
+{
+  "name": "plxdcma_rendericon_center",
+  "version": "1.0.1",
+  "main": "init.js",
+  "license": "MIT"
+}