Pop-up de verificação de idade

 { % atribuir idadeToVerify = seção. configurações . idade_para_verificar % } 
{ % atribuir idadeVerificada = "falso" % }
 { % se seção. configurações . url_específico ! = em branco % }
 { % se seção. configurações . url_específico == solicitação. caminho % } 
{ % atribuir idadeVerified = "true" % }
 { % fim se % }
 { % outro % } 
{ % se seção. configurações . show_on_pages contém modelo . nome ou seção. configurações . show_on_pages == "todos" % }
 { % atribuir idadeVerified = "true" % }
 { % fim se % } 
{ % fim se % }
 { { idade verificada } }
 { % se idadeVerificada == "verdadeiro" % }
 { % se seção. configurações . seção_imagem ! = em branco % } 
{ {
 seção. configurações . seção_imagem
 | URL_da_imagem : largura : 1500
 | imagem_tag :
 largura : seção. configurações . seção_imagem . largura ,
 classe : seção__imagem ,
 tamanhos : '(largura mínima: 750px) 50vw, 100vw' , 
larguras : '375, 550, 750, 1100, 1500, 1780, 2000, 3000, 3840' ,
 alt : seção. configurações . seção_imagem . alternativo
 | escapar
 } }
 { % fim se % }
 < div
 class = "verificação de idade__pop-up" 
style = "--select-box-background: {{ section.settings.section_bg }} ; border-radius: {{ section.settings.border_radius | append: 'px' }} "
 >
 < svg ária - oculto = "true" focusable = "falso" role = "apresentação" viewBox = "0 0 10 6" style = "display: none" > 
< símbolo id = "icon-dropdown" viewbox = "0 0 18 19" fill = "none" >
 < preenchimento de caminho - regra = "evenodd" clipe - regra = "evenodd" d = "M9.354.646a.5.5 0 00-.708 0L5 4.293 1.354.646a.5.5 0 00-.708.708l4 4a.5.5 0 00.708 0l4- 4a.5.5 0 000-.708z" fill = "currentColor" > 
</ símbolo >
 </svg> _
 { % atribuir anoatual = 'agora' | data : '%Y' | vezes : 1 % }
 { % para bloco na seção. blocos % } 
{ % bloco de casos . tipo % }
 { % quando 'imagem' % }
 { % se bloco. configurações . imagem ! = em branco % }
 { {
 bloquear. configurações . imagem 
| URL_da_imagem : largura : 1500
 | imagem_tag :
 largura : bloco. configurações . imagem . largura ,
 tamanhos : '(largura mínima: 750px) 50vw, 100vw' ,
 larguras : '375, 550, 750, 1100, 1500, 1780, 2000, 3000, 3840' ,
 alt : bloquear. configurações . imagem . alternativo
 | escapar 
} }
 { % outro % }
 Nenhuma imagem fornecida < br >
 { % fim se % }
 { % quando 'título' % } 
< { { bloco. configurações . header_size } } style = "color: {{ block.settings.heading_color }} " > { { block. configurações . título } } </ { { bloco. configurações . tamanho_título } } > 
{ % quando 'conteúdo' % }
 < div style = "color: {{ block.settings.content_color }} " >
 { { bloquear. configurações . contente } }
 </div> _ _ 
{ % quando "data_completa" % }
 < idade - dados do verificador - redirecionamento - link = " {{ block.settings.redirect_link }} " dados - verificador = "data completa" dados - idade - para - verificar = " {{ ageToVerify }} " > 
< div
 class = "idade-verificação__input--container"
 style = "--select-background: {{ block.settings.input_bg }} ; --select-color: {{ block.settings.input_color }} ; --select-button: {{ block.settings.dropdown_bg }} "
 >
 < div class = "idade-verificação__select" > 
{ % atribuir mês = 'janeiro, fevereiro, março, abril, maio, junho, julho, agosto, setembro, outubro, novembro, dezembro' | dividir : ',' % }
 <selecione> _
 { % para i no mês % }
 < opção
 valor = " {{ i }} " 
{ % se forloop. primeiro % }
 selecionado
 { % fim se % }
 >
 { { eu } }
 </ opção >
 { % fim para % }
 </ selecione > 
</div> _ _
 < div class = "idade-verificação__select" >
 <selecione> _
 { % para i em ( 1..31 ) % }
 < opção
 valor = " {{ i }} " 
{ % se forloop. primeiro % }
 selecionado
 { % fim se % }
 >
 { { eu } }
 </ opção >
 { % fim para % }
 </ selecione > 
</div> _ _
 < div class = "idade-verificação__select" >
 <selecione> _
 { % para i in ( 1900 .. anoatual ) % }
 < opção 
valor = " {{ i }} "
 { % se forloop. durar % }
 selecionado
 { % fim se % }
 >
 { { eu } }
 </ opção >
 { % fim para % } 
</ selecione >
 </div> _ _
 </div> _ _
 < span class = "popup--error-message popup-hide" > { { bloco. configurações . mensagem_erro } } </ span > 
< botão class = "age-verification__button" style = "--popup-btn-background: {{ block.settings.button_bg_color }} ; --popup-btn-color: {{ block.settings.button_text_color }} " >
 { { bloquear. configurações . rótulo_de_botão } }
 </ botão >
 </ idade - verificador > 
{ % quando "year_only" % } 
< idade - dados do verificador - redirecionamento - link = " {{ block.settings.redirect_link_year_only }} " dados - verificador = dados "somente ano" - atual - ano = " {{ currentYear }} " dados - idade - para - verificar = " {{ ageToVerify }} " > 
< tipo de entrada = "número" estilo = "plano de fundo: {{ block.settings.input_bg }} ;" min = "1900" max = " {{ currentYear }} " value = "2023" placeholder = "YYYY" > 
< span class = "popup--error-message popup-hide" > { { bloco. configurações . error_msg_year_only } } </ span > 
< botão class = "age-verification__button" style = "--popup-btn-background: {{ block.settings.button_bg_color_year_only }} ; --popup-btn-color: {{ block.settings.button_text_color_year_only }} " >
 { { bloquear. configurações . button_label_year_only } }
 </ botão >
 </ idade - verificador > 
{ % quando "sim_não" % }
 < idade - dados do verificador - redirecionamento - link = " {{ block.settings.redirect_link_yes_no }} " dados - verificador = "sim-não" dados - idade - para - verificar = " {{ ageToVerify }} " > 
< span class = "popup--error-message popup-hide" > { { bloco. configurações . error_msg_yes_no } } </ span >
 < div class = "sim-não--container" > 
< valor de entrada = " {{ ageToVerify }} " tipo = "oculto" >
 < botão class = "age-verification__button" style = "--popup-btn-background: {{ block.settings.button_bg_color_yes_no }} ; --popup-btn-color: {{ block.settings.button_text_color_yes_no }} " > 
{ { bloquear. configurações . button_label_yes } }
 </ botão >
 < a href = " {{ block.settings.redirect_link_yes_no }} " class = "age-verification__button"
 style = "--popup-btn-background: {{ block.settings.button_bg_color_yes_no }} ; --popup-btn-color: {{ block.settings.button_text_color_yes_no }} " > 
{ { bloquear. configurações . button_label_no } }
 </a> _
 </div> _ _
 </ idade - verificador >
 { % quando 'termos' % } 
< classe pequena = "popup--terms" style = "--terms-color: {{ block.settings.terms_color }} ; --terms-link-color: {{ block.settings.terms_link_color }} " > { { bloquear. configurações . termos } } </ pequeno >
 { % final % } 
{ % fim para % }
 </div> _ _
 <roteiro> _
 classe AgeVerifier estende HTMLElement {
 construtor ( ) {
 super ( ) ; 
esse . botão = isto . querySelector ( 'botão' ) ;
 if ( este . botão ) { 
esse . botão . addEventListener ( ' clique ' , isto.verificarAge.ligar ( este ) )
 }
 if ( sessãoStorage.getItem ( 'age_verified' ) ) { 
esse . fecharPopup ( ) ;
 } outro {
 esse . iniciar ( ) ;
 }
 }
 iniciar ( ) { 
documento. corpo . lista de classes . add ( 'pop-up-aberto' ) ;
 }
 fecharPopup ( ) {
 documento. corpo . lista de classes . remover ( 'pop-up-aberto' ) ; 
documento. querySelector ( '.age-verification__section' ) . lista de classes . add ( 'pop-up-ocultar' )
 }
 verificarIdade ( ) {
 const ageToVerify = this . conjunto de dados . idadeParaVerificar ;
 deixe calcAge ; 
switch ( este . conjunto de dados . verificador ) {
 caso "data completa" :
 calcIdade = isto . calculadora de idade ( ) ;
 quebrar ;

 caso "somente ano" : 
const entrada do usuário = this . querySelector ( 'entrada' ) . valor ;
 const anoAtual = this . conjunto de dados . ano atual ;
 calcIdade = anoAtual - entrada do usuário ;
 quebrar ;

 caso "sim-não" : 
calcIdade = isto . querySelector ( 'entrada' ) . valor ;
 quebrar ;
 }

 if ( calcAge >= idadeToVerify ) { 
esse . querySelector ( '.popup--mensagem de erro' ) . lista de classes . toggle ( 'pop-up-ocultar' ) ;
 esse . fecharPopup ( ) ; 
sessãoArmazenamento. setItem ( 'idade_verificada' , 'verdadeiro' ) ;
 } outro {
 esse . querySelector ( '.popup--mensagem de erro' ) . lista de classes . toggle ( 'pop-up-ocultar' ) ; 
const redireccionamentoLink = ( função ( ) {
 janela. localização . href = isto . conjunto de dados . redirecionarLink
 } ) . vincular ( este ) ;

 setTimeout ( redirectLink , 500 ) 
}
 }

 calculadora de idade ( ) {
 const entrada do usuário = Array. from ( this.querySelectorAll ( 'select' ) , ( select ) = > select.value ) ; 
const dob ​​= nova data ( entrada do usuário ) ;
 const mês_diff = Data. agora ( ) - dob. consiga tempo ( ) ;
 const idade_dt = nova data ( mês_diff ) ; 
const ano = idade_dt. getUTCFullYear ( ) ;
 const idade = matemática. abs ( ano - 1970 ) ;

 idade de retorno
 }
 }
 elementos personalizados. define ( 'verificador de idade' , AgeVerifier ) ; 
</roteiro> _
 <estilo> _
 . idade - verificação__seção {
 posição : fixa ;
 largura : 100 %;
 altura : 100 %;
 índice z : 9999 ;
 exibição : flexível ; 
justificar - conteúdo : centro ;
 alinhar - itens : centro ;
 alinhar - conteúdo : centro ;
 estouro : oculto ;
 plano de fundo : #000000c9;
 }
 . idade - verificação__seção > img {
 topo : 0 ; 
esquerda : 0 ;
 posição : absoluta ;
 largura : 100 %;
 altura : 100 %;
 ajuste ao objeto : capa ;
 z - índice : -1 ;
 }
 . idade - verificação__pop - up { 
largura : 40rem ;
 plano de fundo : var ( -select - box - background ) ;
 exibição : flexível ;
 flex - direction : coluna ;
 justificar - conteúdo : centro ;
 alinhar - itens : centro ;
 preenchimento : 3rem ; 
lacuna : 2rem ;
 }
 . idade - verificação__pop - up > * {
 margem : 0 ;
 altura da linha : 1 ;
 }
 . idade - verificação__pop - up img {
 largura : 100 %; 
altura : automático ;
 }
 . idade - verificação__input -- container {
 tamanho da fonte : 1,4em ;
 largura : 100 %;
 raio da borda : 0px ;
 borda : 2px sólido transparente ;
 alinhamento de texto : centro ; 
exibição : flexível ;
 justificar - conteúdo : centro ;
 alinhar - itens : centro ;
 lacuna : 5px ;
 }
 . idade - verificação__select {
 posição : relativa ;
 exibição : flexível ;
 largura : 100 %;
 altura : 4rem ; 
altura da linha : 2 ;
 estouro : oculto ;
 raio da borda : 0,25em ;
 cor : var ( -selecionar - fundo ) ;
 }
 . idade - verificação__select :: depois de { 
conteúdo : " \25 AC" ;
 posição : absoluta ;
 topo : 0 ;
 direita : 0 ;
 preenchimento : 0 0,5rem ;
 background : var ( -botão de seleção ) ;
 cursor : ponteiro ; 
eventos de ponteiro : nenhum ;
 transição : 0,25s com total facilidade ;
 largura : automático ;
 altura : 100 %;
 proporção de aspecto : 1 ;
 }
 . idade - verificação__select : passe o mouse : depois de { 
filtro : brilho ( 0,5 ) ;
 }
 . idade - verificação__select : pairar :: depois de {
 cor : var ( -select - color ) ;
 }
 . idade - verificação__input -- container select { 
-webkit -aparência : nenhum ;
 -moz -aparência : nenhum ;
 -ms -aparência : nenhuma ;
 aparência : nenhuma ;
 contorno : 0 ;
 box - shadow : nenhum ; 
borda : 0 ! importante ;
 flexível : 1 ;
 preenchimento : 0 0,5em ;
 cursor : ponteiro ;
 tamanho da fonte : 1em ;
 plano de fundo : var ( -selecionar - plano de fundo ) ; 
cor : var ( -select - color ) ;
 }
 . idade - verificação__input - seleção de contêiner ::- ms - expandir {
 Mostrar nenhum ;
 }
 . idade - verificação__pop - up . idade - verificação__button { 
preenchimento : 1rem 2rem ;
 espaçamento entre letras : 1,5px ;
 borda : nenhuma ;
 aparência : nenhuma ;
 cor de fundo : transparente ;
 borda : 2px var sólido ( -popup - btn - color ) ;
 raio da borda : 10px ; 
dimensionamento da caixa : caixa de borda ;
 cor : var ( -popup - btn - color ) ;
 cursor : ponteiro ;
 exibição : flexível ;
 margem : automática ;
 esboço : nenhum ;
 alinhamento de texto : centro ; 
decoração de texto : nenhuma ;
 transição : todos os 300ms cúbico - bezier ( 0,23 , 1 , 0,32 , 1 ) ;
 seleção de usuário : nenhum ;
 -webkit - user - select : nenhum ; 
ação de toque : manipulação ;
 will - change : transformar ;
 largura : conteúdo máximo ;
 }
 . idade - verificação__pop - up . idade - verificação__button : desativado {
 eventos de ponteiro : nenhum ;
 } 
. idade - verificação__pop - up . idade - verificação__button : hover {
 cor : var ( -popup - btn - background ) ;
 cor de fundo : var ( -popup - btn - color ) ; 
caixa - sombra : rgba ( 0 , 0 , 0 , 0,25 ) 0 8px 15px ;
 transformar : traduzirY ( -2px ) ;
 } 
. idade - verificação__pop - up . idade - verificação__button : ativo {
 box - shadow : nenhum ;
 transformar : traduzirY ( 0 ) ;
 }
 . pop-up -- erro - mensagem {
 posição : relativa ; 
exibição : bloco ;
 preenchimento : 0,5rem 0 ;
 }
 . pop-up -- termos {
 alinhamento de texto : centro ;
 cor : var ( -termos - cor ) ;
 }
 . pop-up - termos a { 
cor : var ( -termos - link - cor ) ;
 }
 . idade - verificação__seção entrada [ tipo = "número" ] {
 altura : 4rem ;
 largura : 20rem ;
 exibição : flexível ;
 margem : automática ; 
tamanho da fonte : 2,5rem ;
 alinhamento de texto : centro ;
 }
 . sim - não --contêiner {
 exibição : flexível ;
 justificar - conteúdo : centro ;
 alinhar - itens : centro ;
 largura : 100 %; 
lacuna : 1rem ;
 }
 . sim - não -- contêiner > * {
 largura máxima : 18rem ;
 tamanho da fonte : 1,5rem ;
 }
 corpo. pop-up - abrir {
 estouro : oculto ;
 } 
. pop-up - ocultar {
 visibilidade : oculta ;
 }
 </ estilo >
 { % fim se % }
 { % esquema % }
 {
 "name" : "Pop-up de verificação de idade" , 
"class" : "idade-verificação__seção" ,
 "configurações" : [
 {
 "tipo" : "intervalo" ,
 "id" : "idade_para_verificar" ,
 "min" : 10 , 
"máximo" : 100 ,
 " passo 1 ,
 "unidade" : "s/o" ,
 "label" : "Idade para verificar" ,
 "info" : "Por favor, não deixe em branco" ,
 "padrão" : 18 
} ,
 {
 "type" : "image_picker" ,
 "id" : "seção_imagem" ,
 "label" : "Imagem da seção"
 } ,
 {
 "tipo" : "cor" , 
"label" : "Cor de fundo pop-up" ,
 "id" : "seção_bg" ,
 "default" : "#ececec"
 } ,
 {
 "tipo" : "intervalo" ,
 "id" : "border_radius" , 
"min" : 0 ,
 "máximo" : 100 ,
 " passo 1 ,
 "unidade" : "px" ,
 "label" : "Raio da borda pop-up" ,
 "padrão" : 0 
} ,
 {
 "tipo" : "selecionar" ,
 "id" : "show_on_pages" ,
 "opções" : [
 {
 "valor" : "produto" ,
 "label" : "Páginas de produtos" 
} ,
 {
 "valor" : "página" ,
 "label" : "Páginas"
 } ,
 {
 "valor" : "blog" ,
 "label" : "Blogs"
 } ,
 { 
"valor" : "índice" ,
 "rótulo" : "Página inicial"
 } ,
 {
 "valor" : "coleção_produto" ,
 "label" : "Coleção e páginas de produtos"
 } ,
 { 
"valor" : "todos" ,
 "label" : "Todas as páginas"
 }
 ] ,
 "padrão" : "todos" ,
 "label" : "Mostrar nas páginas"
 } ,
 { 
"tipo" : "url" ,
 "id" : "url_específico" ,
 "label" : "Especifique o URL para o pop-up aparecer" ,
 "info" : "Deixe em branco se não quiser aparecer em uma URL específica"
 }
 ] ,
 "blocos" : [
 { 
"tipo" : "imagem" ,
 "nome" : "Imagem" ,
 "configurações" : [
 {
 "type" : "image_picker" ,
 "id" : "imagem" ,
 "rótulo" : "Imagem" 
}
 ]
 } ,
 {
 "tipo" : "título" ,
 "nome" : "Título" ,
 "configurações" : [
 {
 "tipo" : "texto" , 
"id" : "título" ,
 "rótulo" : "Título" ,
 "default" : "Bem-vindo"
 } ,
 {
 "tipo" : "selecionar" ,
 "id" : "heading_size" , 
"opções" : [
 {
 "valor" : "h3" ,
 "rótulo" : "pequeno"
 } ,
 {
 "valor" : "h2" ,
 "rótulo" : "médio" 
} ,
 {
 "valor" : "h1" ,
 "rótulo" : "grande"
 }
 ] ,
 "padrão" : "h1" ,
 "label" : "Tamanho do título"
 } , 
{
 "tipo" : "cor" ,
 "label" : "Cor do texto do título" ,
 "id" : "heading_color" ,
 "padrão" : "#000"
 }
 ]
 } ,
 { 
"tipo" : "conteúdo" ,
 "nome" : "Conteúdo" ,
 "configurações" : [
 {
 "type" : "richtext" ,
 "id" : "conteúdo" , 
"label" : "Texto do conteúdo" ,
 "default" : "<p>Verifique sua idade para continuar</p>"
 } ,
 {
 "tipo" : "cor" ,
 "label" : "Cor do texto do conteúdo" , 
"id" : "content_color" ,
 "padrão" : "#000"
 }
 ]
 } ,
 {
 "tipo" : "data_completa" ,
 "name" : "Estilo de data completa" , 
"limite" : 1 ,
 "configurações" : [
 {
 "tipo" : "cabeçalho" ,
 "content" : "Certifique-se de usar UM estilo"
 } ,
 {
 "tipo" : "cor" , 
"label" : "Selecione a cor de fundo" ,
 "id" : "input_bg" ,
 "padrão" : "#000"
 } ,
 {
 "tipo" : "cor" ,
 "label" : "Selecione a cor do texto" , 
"id" : "input_color" ,
 "padrão" : "#fff"
 } ,
 {
 "tipo" : "cor" ,
 "label" : "Fundo suspenso" ,
 "id" : "dropdown_bg" , 
"padrão" : "#000"
 } ,
 {
 "tipo" : "texto" ,
 "id" : "button_label" ,
 "label" : "Etiqueta do botão" ,
 "default" : "Continuar" 
} ,
 {
 "tipo" : "texto" ,
 "id" : "error_msg" ,
 "label" : "Mensagem de erro para menores de idade" ,
 "default" : "Desculpe, você não pode entrar. Você será redirecionado"
 } ,
 { 
"tipo" : "texto" ,
 "id" : "link_de_redirecionamento" ,
 "label" : "Link de redirecionamento" ,
 "info" : "Link para onde será redirecionado quando menor de idade" ,
 "padrão" : "https://www.google.com"
 } , 
{
 "tipo" : "cor" ,
 "label" : "Cor de fundo do botão" ,
 "id" : "button_bg_color" ,
 "padrão" : "#fff"
 } ,
 { 
"tipo" : "cor" ,
 "label" : "Cor do texto do botão" ,
 "id" : "button_text_color" ,
 "padrão" : "#000"
 }
 ]
 } ,
 { 
"tipo" : "somente_ano" ,
 "name" : "Estilo somente ano" ,
 "limite" : 1 ,
 "configurações" : [
 {
 "tipo" : "cabeçalho" , 
"content" : "Certifique-se de usar UM estilo"
 } ,
 {
 "tipo" : "texto" ,
 "id" : "button_label_year_only" ,
 "label" : "Etiqueta do botão" ,
 "default" : "Continuar" 
} ,
 {
 "tipo" : "texto" ,
 "id" : "error_msg_year_only" ,
 "label" : "Mensagem de erro para menores de idade" ,
 "default" : "Desculpe, você não pode entrar. Você será redirecionado"
 } ,
 { 
"tipo" : "texto" ,
 "id" : "redirect_link_year_only" ,
 "label" : "Link de redirecionamento" ,
 "info" : "Link para onde será redirecionado quando menor de idade" ,
 "padrão" : "https://www.google.com"
 } , 
{
 "tipo" : "cor" ,
 "label" : "Inserir plano de fundo" ,
 "id" : "input_bg" ,
 "padrão" : "#fff"
 } ,
 {
 "tipo" : "cor" , 
"label" : "Cor de fundo do botão" ,
 "id" : "button_bg_color_year_only" ,
 "padrão" : "#fff"
 } ,
 {
 "tipo" : "cor" ,
 "label" : "Cor do texto do botão" , 
"id" : "button_text_color_year_only" ,
 "padrão" : "#000"
 }
 ]
 } ,
 {
 "tipo" : "sim_não" ,
 "nome" : "Estilo Sim/Não" , 
"limite" : 1 ,
 "configurações" : [
 {
 "tipo" : "cabeçalho" ,
 "content" : "Certifique-se de usar UM estilo"
 } ,
 {
 "tipo" : "texto" , 
"id" : "button_label_yes" ,
 "label" : "Etiqueta do botão SIM" ,
 "default" : "Sim, tenho mais de 21 anos"
 } ,
 {
 "tipo" : "texto" ,
 "id" : "button_label_no" , 
"label" : "Botão SEM etiqueta" ,
 "default" : "Não, tenho menos de 21 anos"
 } ,
 {
 "tipo" : "texto" ,
 "id" : "error_msg_yes_no" ,
 "label" : "Mensagem de erro para menores de idade" , 
"default" : "Desculpe, você não pode entrar. Você será redirecionado"
 } ,
 {
 "tipo" : "texto" ,
 "id" : "redirect_link_yes_no" ,
 "label" : "Link de redirecionamento" , 
"info" : "Link para onde será redirecionado quando menor de idade" ,
 "padrão" : "https://www.google.com"
 } ,
 {
 "tipo" : "cor" ,
 "label" : "Cor de fundo do botão" , 
"id" : "button_bg_color_yes_no" ,
 "padrão" : "#fff"
 } ,
 {
 "tipo" : "cor" ,
 "label" : "Cor do texto do botão" ,
 "id" : "button_text_color_yes_no" , 
"padrão" : "#000"
 }
 ]
 } ,
 {
 "tipo" : "termos" ,
 "nome" : "Termos" ,
 "configurações" : [
 { 
"type" : "richtext" ,
 "id" : "termos" ,
 "label" : "Texto dos termos" ,
 "info" : "Por favor, forneça o link das suas páginas" ,
 "default" : "<p>Ao entrar neste site você concorda com os Termos de uso e Política de privacidade</p>" 
} ,
 {
 "tipo" : "cor" ,
 "label" : "Cor do texto dos termos" ,
 "id" : "terms_color" ,
 "padrão" : "#000"
 } ,
 { 
"tipo" : "cor" ,
 "label" : "Cor do link dos termos" ,
 "id" : "terms_link_color" ,
 "padrão" : "#000"
 }
 ]
 }
 ] ,
 "predefinições" : [ 
{
 "name" : "Pop-up de verificação de idade" ,
 "blocos" : [
 {
 "tipo" : "título"
 } ,
 {
 "tipo" : "conteúdo"
 } ,
 { 
"tipo" : "data_completa"
 }
 ]
 }
 ]
 }
 { % termina o esquema % }