Mudanças entre as edições de "Widget:Gb"

De Wiki Gla
Ir para navegação Ir para pesquisar
Linha 1: Linha 1:
local p = {}
<div class="gb-mob-card">
  <div class="gb-mob-card-name">{{{nome}}}</div>
  <a href="{{{link}}}">
    <img src="{{{imagem}}}" alt="{{{nome}}}">
  </a>
  <a class="gb-mob-card-button" href="{{{link}}}">Ver Página</a>
</div>


function p.render(frame)
<style>
    -- pega parâmetros
.gb-mob-card {
    local args = frame:getParent().args
  width: 150px;
    local imagem   = args.imagem   or ""
   border-radius: 12px;
    local selo    = args.selo    or ""
   overflow: hidden;
    local tag      = args.tag      or "NOVO"
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    local titulo   = args.titulo   or "Título"
  text-align: center;
    local subtitulo= args.subtitulo or "Capítulo"
   transition: transform 0.2s, box-shadow 0.2s;
    local data    = args.data    or "Hoje"
   font-family: Arial, sans-serif;
    local botao    = args.botao    or "Ler agora"
  background: #1e1e1e;
    local link    = args.link    or "#"
  color: #fff;
  margin: 10px;
}


    -- constrói HTML
.gb-mob-card:hover {
    local html = mw.html.create("div")
  transform: translateY(-5px);
        :addClass("widget-capitulo")
  box-shadow: 0 8px 16px rgba(0,0,0,0.4);
        :css("background-image", "url(" .. mw.uri.encode(mw.title.makeTitle("File", imagem).fullUrl) .. ")")
}


    -- barra superior
.gb-mob-card img {
    local top = html:tag("div"):addClass("top-bar")
  width: 100%;
    if selo ~= "" then
  height: 120px;
        top:tag("div"):addClass("chip"):wikitext(selo)
  object-fit: cover;
    end
  display: block;
    if tag ~= "" then
}
        top:tag("div"):addClass("chip novo"):wikitext(tag)
    end


    -- gradiente
.gb-mob-card-name {
    html:tag("div"):addClass("gradient")
  font-weight: bold;
  padding: 8px 0;
  background: #333;
}


    -- textos
.gb-mob-card-button {
    local text = html:tag("div"):addClass("text")
  display: block;
    text:tag("div"):addClass("title"):wikitext(titulo)
  background-color: #f
    text:tag("div"):addClass("subtitle"):wikitext(subtitulo)
    text:tag("div"):addClass("date"):wikitext(data)
 
    -- botão
    html:tag("a")
        :addClass("button")
        :attr("href", link)
        :wikitext(botao)
 
    return tostring(html)
end
 
return p

Edição das 04h52min de 27 de agosto de 2025

{{{nome}}}
 <a href="{{{link}}}">
   <img src="{{{imagem}}}" alt="{{{nome}}}">
 </a>
 <a class="gb-mob-card-button" href="{{{link}}}">Ver Página</a>

<style> .gb-mob-card { 

 width: 150px;
 border-radius: 12px;
 overflow: hidden;
 box-shadow: 0 4px 8px rgba(0,0,0,0.2);
 text-align: center;
 transition: transform 0.2s, box-shadow 0.2s;
 font-family: Arial, sans-serif;
 background: #1e1e1e;
 color: #fff;
 margin: 10px;

}

.gb-mob-card:hover { 

 transform: translateY(-5px);
 box-shadow: 0 8px 16px rgba(0,0,0,0.4);

}

.gb-mob-card img { 

 width: 100%;
 height: 120px;
 object-fit: cover;
 display: block;

}

.gb-mob-card-name { 

 font-weight: bold;
 padding: 8px 0;
 background: #333;

}

.gb-mob-card-button { 

 display: block;
 background-color: #f
Disponível em “https://wiki.gla.com.br/index.php?title=Widget:Gb&oldid=38168”