Predefinição:Botão: mudanças entre as edições

← Edição anterior Edição posterior →

VisualWikitexto

@@ Linha 1: / Linha 1: @@
-[[{{{link}}}|<span class="btn {{#switch: {{{color|red}}} | red = btn-primary  | green = btn-secondary | white = btn-warning | blue = btn-info}}" role="button" aria-disabled="false">{{{name|Texto do botão}}}</span>]]<noinclude>
+<includeonly>
+{{#vardefine:color|{{{color|primary}}}}}
+{{#vardefine:style|btn{{#if:{{{outline|}}}|-outline}}-{{#var:color}}}}
+{{#vardefine:size|{{#if:{{{size|}}}|btn-{{{size}}}}}}}
+{{#vardefine:block|{{#if:{{{block|}}}|btn-block}}}}
+{{#vardefine:disabled|{{#if:{{{disabled|}}}|disabled}}}}
+{{#vardefine:tooltip|
+{{#if:{{{tooltip|}}}|
+data-toggle="tooltip" title="{{{tooltip}}}"
+}}
+}}
+{{#vardefine:titleAttr|
+{{#if:{{{title|}}}|title="{{{title}}}"}}
+}}
+{{#vardefine:iconLeft|
+{{#if:{{{icon|}}}|
+  {{#if:{{{iconpos|left}}}|<i class="{{{icon}}}"></i> }}
+}}
+}}
+{{#vardefine:iconRight|
+{{#if:{{{icon|}}}|
+  {{#ifeq:{{{iconpos|left}}}|right| <i class="{{{icon}}}"></i>}}
+}}
+}}
+{{#vardefine:content|
+{{#var:iconLeft}}{{{name|Texto}}}{{#var:iconRight}}
+}}
+{{#vardefine:classes|
+btn
+{{#var:style}}
+{{#var:size}}
+{{#var:block}}
+{{#var:disabled}}
+{{{class|}}}
+}}
+{{#if:{{{link|}}}|
+  {{#if:{{#pos:{{{link}}}|://}}
+    | [{{{link}}} <span class="{{#var:classes}}" role="button" {{#var:tooltip}} {{#var:titleAttr}} aria-disabled="{{#if:{{{disabled|}}}|true|false}}">{{#var:content}}</span>]
+    | [[{{{link}}}|<span class="{{#var:classes}}" role="button" {{#var:tooltip}} {{#var:titleAttr}} aria-disabled="{{#if:{{{disabled|}}}|true|false}}">{{#var:content}}</span>]]
+  }}
+ |
+  <span class="{{#var:classes}}" role="button" {{#var:tooltip}} {{#var:titleAttr}} aria-disabled="{{#if:{{{disabled|}}}|true|false}}">
+    {{#var:content}}
+  </span>
+}}
+</includeonly>
+<noinclude>
+Botão Bootstrap 4 compatível com MediaWiki (sem HTML bloqueado).
+Parâmetros:
+- name = texto
+- link = página interna ou URL externa
+- color = primary, secondary, success, danger, warning, info, light, dark
+- outline = 1
+- size = sm, lg
+- block = 1 (btn-block)
+- icon = classes (ex: fa fa-user)
+- iconpos = left/right (default: left)
+- disabled = 1
+- tooltip = texto do tooltip
+- title = título (fallback acessível)
+- class = classes extras
+Exemplos:
+{{Botão|name=Salvar|color=success|icon=fa fa-check}}
+{{Botão|name=Excluir|color=danger|outline=1}}
+{{Botão|name=Ajuda|tooltip=Mais info}}
+<templatedata>
+{
+	"description": "Botão estilizado com Bootstrap 4 compatível com MediaWiki. Detecta automaticamente links internos e externos. Suporta cores, outline, tamanho, largura total, ícones e tooltip.",
+	"format": "inline",
+	"paramOrder": [
+		"name",
+		"link",
+		"color",
+		"outline",
+		"size",
+		"block",
+		"icon",
+		"iconpos",
+		"tooltip",
+		"title",
+		"disabled",
+		"class"
+	],
+	"params": {
+		"name": {
+			"label": "Texto do botão",
+			"description": "Texto exibido dentro do botão",
+			"type": "string",
+			"required": false,
+			"default": "Texto",
+			"example": "Clique aqui"
+		},
+		"link": {
+			"label": "Link",
+			"description": "Página interna (ex: Brasil) ou URL externa (ex: https://google.com). Se vazio, o botão não será clicável.",
+			"type": "string",
+			"required": false,
+			"example": "Brasil"
+		},
+		"color": {
+			"label": "Cor",
+			"description": "Cor do botão (Bootstrap 4)",
+			"type": "string",
+			"default": "primary",
+			"suggestedvalues": [
+				"primary",
+				"secondary",
+				"success",
+				"danger",
+				"warning",
+				"info",
+				"light",
+				"dark"
+			]
+		},
+		"outline": {
+			"label": "Outline",
+			"description": "Usa estilo com borda (btn-outline-*)",
+			"type": "boolean"
+		},
+		"size": {
+			"label": "Tamanho",
+			"description": "Define o tamanho do botão",
+			"type": "string",
+			"suggestedvalues": [
+				"sm",
+				"lg"
+			],
+			"example": "lg"
+		},
+		"block": {
+			"label": "Largura total",
+			"description": "Ocupa toda a largura disponível (btn-block)",
+			"type": "boolean"
+		},
+		"icon": {
+			"label": "Ícone",
+			"description": "Classes do ícone (ex: fa fa-user)",
+			"type": "string",
+			"example": "fa fa-check"
+		},
+		"iconpos": {
+			"label": "Posição do ícone",
+			"description": "Define a posição do ícone em relação ao texto",
+			"type": "string",
+			"default": "left",
+			"suggestedvalues": [
+				"left",
+				"right"
+			]
+		},
+		"tooltip": {
+			"label": "Tooltip",
+			"description": "Texto exibido ao passar o mouse (requer Bootstrap JS ativo)",
+			"type": "string",
+			"example": "Mais informações"
+		},
+		"title": {
+			"label": "Título",
+			"description": "Texto alternativo (acessibilidade)",
+			"type": "string",
+			"example": "Clique para abrir"
+		},
+		"disabled": {
+			"label": "Desabilitado",
+			"description": "Aplica estilo de botão desabilitado (visual)",
+			"type": "boolean"
+		},
+		"class": {
+			"label": "Classes extras",
+			"description": "Classes CSS adicionais",
+			"type": "string",
+			"example": "mt-2 mb-2"
+		}
+	}
+}
+</templatedata>
+==anterior==
+[[{{{link}}}|<span class="btn {{#switch: {{{color|red}}} | red = btn-primary  | green = btn-secondary | white = btn-warning | blue = btn-info}}" role="button" aria-disabled="false">{{{name|Texto do botão}}}</span>]]
 == Como Usar ==