EXEMPLOS!!!

Tamanho de fontes diferentes:

Titulo 1

Titulo 2

Titulo 3


Titulo 4

Titulo 5
Titulo 6

Outro paragrafo com formatação diferente


trecho de texto com fonte diferente


Exemplo de linha para dividir conteúdo


Imagem com link

fachada da loja x

Video do youtube

Video do Youtube


Link para download pdf

Link para download o pdf


Texto esquerda


Texto centro


Texto direita



Tabela default

Item Description Price
item1 item1 description 1.00
item2 item2 description 100.00

Tabela com borda

First Header Second Header
Content Cell Content Cell
Content Cell Content Cell

Tabela sem borda e zebrada

First Header Second Header
Content Cell Content Cell
Content Cell Content Cell

Tabela com borda e zebrada

First Header Second Header
Content Cell Content Cell
Content Cell Content Cell

Tabela com cor de fundo igual a cor primária

First Header Second Header
Content Cell Content Cell
Content Cell Content Cell

SHADOW BOX

10 ações que mostram como cuidamos da sociedade e do planeta

A nossa empresa tem uma preocupação especial com a comunidade onde está inserida. As ações de Responsabilidade Corporativa...


MAIOR_MENOR IMAGEM TEXTO

InPACTO

O Walmart Brasil é associado ao Inpacto e não mantem relações comerciais com empresas que tenham submetido trabalhadores a condições de trabalho escravo, verificados através da Lista da Transparência. Saiba mais.


MAIOR_MENOR TEXTO IMAGEM

O Walmart Brasil é associado ao Inpacto e não mantem relações comerciais com empresas que tenham submetido trabalhadores

a condições de trabalho escravo, verificados através da Lista da Transparência. Saiba mais.

InPACTO


MENOR_MAIOR IMAGEM TEXTO

InPACTO

O Walmart Brasil é associado ao Inpacto e não mantem relações comerciais com empresas que tenham submetido trabalhadores a condições de trabalho escravo, verificados através da Lista da Transparência. Saiba mais.


MENOR_MAIOR TEXTO IMAGEM

O Walmart Brasil é associado ao Inpacto e não mantem relações comerciais com empresas que tenham submetido trabalhadores a condições de trabalho escravo, verificados através da Lista da Transparência. Saiba mais.

InPACTO


Sou Fornecedor

"Minha empresa já faz negócios com o Grupo." Fornecedores cadastrados que iniciam com 'NR, por ex: NR61000000

Se sua empresa já negocia com a gente e é fornecedora não-revenda, clique no botão abaixo para acessar o Portal de Fornecedor Não-Revenda. Leia com atenção as manuais de 1 a 6

Futuros Fornecedores

"Fui convidado para uma Cotação." Fornecedores já pré-cadastrados que iniciam com ‘006‘.

Se sua empresa recebeu uma Solicitação de Cotação e ainda não é uma fornecedora não-revenda do nosso grupo, clique no botão abaixo para acessar o seu Portal. Leia com atenção os manuais 1 a 4

"Desejo ser um fornecedor do Grupo" Fornecedores ainda não cadastrados.

Efetue seu pré-cadastro para futuras negociações com a nossa empresa. Leia com atenção o manual de 1


text

1

Introdução ao Portal e Requisitos Técnicos

seta

passo 2

2

Usuário Administrador e Gestão de Usuários

seta

passo 3

3

Gestão de Dados Cadastrais

seta

Passo 4

4

Responder a uma Solicitação de Cotação

seta

Passo 5

5

Consulta e Acompanhamento de Pedidos de Compras

seta

Passo 6

6

Validação de Nota Fiscal e Criação de Espelho


DOCUMENTAÇÃO

.tabela default é sem borda

Necessário espaço após definir uma classe no markdown

-{: .classe}: define uma classe ao elemento

-:::classe(+:*n): renderiza um container com a classe especificada, âncoras necessitam de container no lugar de definir classes normalmente(como explicado acima). Se existir contêineres internos, o mais interno deve conter 3':' e cada um mais externo adiciona um ':'

-.texto-esquerda: alinhar texto na esquerda  
-.texto-centro: alinhar texto no centro  
-.texto-direita: alinhar texto na direita

-.botao: botão com width = 100px  
-.botao-grande: botão com width = 200px

-.tabela-zebrada: defini a tabela como zebrada  
-.tabela-com-borda: coloca borda na tabela

-.grid-card: define grid de cards com botões  
--.cards: card dentro do grid  
---.titulo: titulo do card  
---.subtitulo: subtitulo do card  
----.texto: texto do card

-.grid-passos: grid contendo passos  
--.elemento: elemento que contém definições do passo e seta  
---.passo: contém numero, descrição e botão  
----.numero  
----.descrição  
---.seta: seta para o próximo passo

-.menor-maior: grid com dois elementos, sendo o primeiro menor que o segundo   --.texto: defini propriedades do texto

-.maior-menor: grid com dois elementos, sendo o primeiro maior que o segundo  
--.texto: defini propriedades do texto

Facebook
Twitter
Instagram
Youtube
Linkedin