Revision | 44 (tree) |
---|---|
Time | 2020-05-26 11:06:12 |
Author | derekwildstar |
Zost.bsdesign e styles.css
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Janela modal de sistema adicionada ao template
com_content/featured/default.php
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Ajustes nos estilos de paginação
layouts/joomla/content/icons/edit.php e layouts/joomla/content/icons/email.php
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Incluída uma borda direita para substituir o caractere pipe que causava problemas visuais no momento da tradução do site
layouts/joomla/content/info_block.php
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Removida codificação que incluía o caractere pipe para separar os ícones editar e email
layouts/joomla/system/message.php
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Incluído o layout que renderiza mensagens de sistema
index.php
¯¯¯¯¯¯¯¯¯
Janela modal de sistema adicionada ao arquivo principal do template juntamente com o placeholder
templateDetails.xml
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Arquivo de detalhamento do template atualizado para conter os arquivos template_preview.png e template_thumbnail.png
template_preview.png e template_thumbnail.png
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Atualizados!
@@ -28,6 +28,7 @@ | ||
28 | 28 | --module-title-shadow-color: #000000; |
29 | 29 | --module-tile-shadow: 0 0 3px var(--module-title-shadow-color), 0 0 3px var(--module-title-shadow-color), 0 0 3px var(--module-title-shadow-color), 0 0 3px var(--module-title-shadow-color); |
30 | 30 | --module-title-gradient: linear-gradient(to bottom, var(--line-color) 0%, var(--page-background-color) 100%); |
31 | + --module-footer-gradient: linear-gradient(to bottom, var(--page-background-color) 0%, var(--line-color) 100%); | |
31 | 32 | --list-bullet-color: #677073; |
32 | 33 | --text-highlighted-color: rgba(255,255,0,0.4); |
33 | 34 | --input-focused-border-color: #FFF; |
@@ -398,6 +399,88 @@ | ||
398 | 399 | width: 100%; |
399 | 400 | } |
400 | 401 | |
402 | +div.modal { | |
403 | + font-family: 'Abel'; | |
404 | +} | |
405 | + | |
406 | +div.modal-header { | |
407 | + height: 53px; | |
408 | + background: var(--module-title-gradient); | |
409 | + border-bottom: 1px solid var(--line-color); | |
410 | +} | |
411 | + | |
412 | +div.modal-header > h2.modal-title { | |
413 | + line-height: 1; | |
414 | +} | |
415 | + | |
416 | +div.modal-header > button.close { | |
417 | + display: none; | |
418 | +} | |
419 | + | |
420 | +div.modal-content { | |
421 | + background-color: var(--module-background-color); | |
422 | +} | |
423 | + | |
424 | +div.modal-footer { | |
425 | + height: 53px; | |
426 | + border-top: 1px solid var(--line-color); | |
427 | + background: var(--module-footer-gradient); | |
428 | +} | |
429 | + | |
430 | +div#SysModalText > ul { | |
431 | + margin-bottom: 0; | |
432 | + padding-left: 1rem; | |
433 | + list-style: none; | |
434 | +} | |
435 | + | |
436 | +div#SysModalText > ul.SysMessage > li.success { | |
437 | + color: var(--success); | |
438 | +} | |
439 | + | |
440 | +div#SysModalText > ul.SysMessage > li.info { | |
441 | + color: var(--info); | |
442 | +} | |
443 | + | |
444 | +div#SysModalText > ul.SysMessage > li.danger { | |
445 | + color: var(--danger); | |
446 | +} | |
447 | + | |
448 | +div#SysModalText > ul.SysMessage > li.warning { | |
449 | + color: var(--warning); | |
450 | +} | |
451 | + | |
452 | +div#SysModalText > ul.SysMessage > li.success::before { | |
453 | + content: "✔"; | |
454 | + display: inline-block; | |
455 | + width: 19px; | |
456 | + margin-left: -19px; | |
457 | + font-size: 14pt; | |
458 | +} | |
459 | + | |
460 | +div#SysModalText > ul.SysMessage > li.info::before { | |
461 | + content: "🛈"; | |
462 | + display: inline-block; | |
463 | + width: 19px; | |
464 | + margin-left: -19px; | |
465 | + font-size: 14pt; | |
466 | +} | |
467 | + | |
468 | +div#SysModalText > ul.SysMessage > li.danger::before { | |
469 | + content: "🛇"; | |
470 | + display: inline-block; | |
471 | + width: 19px; | |
472 | + margin-left: -19px; | |
473 | + font-size: 11pt; | |
474 | +} | |
475 | + | |
476 | +div#SysModalText > ul.SysMessage > li.warning::before { | |
477 | + content: "⚠️"; | |
478 | + display: inline-block; | |
479 | + width: 19px; | |
480 | + margin-left: -19px; | |
481 | + font-size: 11pt; | |
482 | +} | |
483 | + | |
401 | 484 | /* Estilos para ocultar elementos do Google Translator. Basicamente isso remove um combobox que estava sendo colocado automaticamente acima das bandeiras e uma barra branca de 40 pixels que aparecia toda vez que o site era traduzido. Adicionalmente foi necessário forçar a posição do topo do elemento body como zero, já que o plugin de tradução descia o body 40 pixels para acomodar a tal barra de idiomas. Caso você ache algumas destas características interessantes no futuro, basta comentar os estilos abaixo e remover a forçada de topo = zero do elemento body */ |
402 | 485 | |
403 | 486 | div#google_translate_element2 { |
@@ -575,18 +658,24 @@ | ||
575 | 658 | div.pagination { |
576 | 659 | display: inherit; |
577 | 660 | text-align: left; |
578 | - border-top: 3px dotted var(--line-color); | |
579 | 661 | border-radius: 0; |
580 | 662 | } |
581 | 663 | |
582 | 664 | div.pagination.top { |
583 | - border-top: initial; | |
584 | 665 | border-bottom: 3px dotted var(--line-color); |
585 | 666 | margin-bottom: 1rem; |
667 | + padding-bottom: 5px; | |
586 | 668 | } |
587 | 669 | |
670 | +div.pagination.bottom { | |
671 | + border-top: 3px dotted var(--line-color); | |
672 | + margin-top: 1rem; | |
673 | + padding-top: 5px; | |
674 | +} | |
675 | + | |
588 | 676 | div.pagination > ul.pagination-list { |
589 | 677 | float: right; |
678 | + margin-bottom: 0; | |
590 | 679 | } |
591 | 680 | |
592 | 681 | div.pagination > ul.pagination-list > li { |
@@ -655,4 +744,5 @@ | ||
655 | 744 | |
656 | 745 | div.leading { |
657 | 746 | margin-bottom: 1rem; |
658 | -} | |
\ No newline at end of file | ||
747 | +} | |
748 | + |
@@ -109,7 +109,7 @@ | ||
109 | 109 | $pageLinks = Helpers::indentLines($pageLinks,1); |
110 | 110 | |
111 | 111 | echo <<<EOH |
112 | -<div class="pagination"> | |
112 | +<div class="pagination bottom"> | |
113 | 113 | $pageCounter$pageLinks |
114 | 114 | </div> |
115 | 115 | EOH; |
@@ -42,4 +42,4 @@ | ||
42 | 42 | // Consulte o arquivo original para ver constantes e outras formas de uso do |
43 | 43 | // mesmo |
44 | 44 | ?> |
45 | -<svg viewBox="0 0 8 8" class="icon" style="height: 1rem;"><use style="fill: var(<?php echo($iconColor) ?>)" xlink:href="<?php echo(Helpers::baseSite(true) . "/templates/" . $zostHelpers->app->getTemplate()); ?>/assets/img/open-iconic.min.svg#pencil"></use></svg> | |
\ No newline at end of file | ||
45 | +<svg viewBox="0 0 8 8" class="icon" style="height: 1rem; border-left: 1px solid #FFFFFF; padding-left: 5px; margin-left: 5px"><use style="fill: var(<?php echo($iconColor) ?>)" xlink:href="<?php echo(Helpers::baseSite(true) . "/templates/" . $zostHelpers->app->getTemplate()); ?>/assets/img/open-iconic.min.svg#pencil"></use></svg> | |
\ No newline at end of file |
@@ -42,4 +42,4 @@ | ||
42 | 42 | // JText::_('JGLOBAL_EMAIL'), que meramente exibia o texto "Email". Para maiores |
43 | 43 | // informações, veja o arquivo original |
44 | 44 | ?> |
45 | -<svg viewBox="0 0 8 8" class="icon" style="height: 1rem;"><use style="fill: var(--svg-icon-active-color)" xlink:href="<?php echo(Helpers::baseSite(true) . "/templates/" . $zostHelpers->app->getTemplate()); ?>/assets/img/open-iconic.min.svg#envelope-closed"></use></svg> | |
\ No newline at end of file | ||
45 | +<svg viewBox="0 0 8 8" class="icon" style="height: 1rem; border-left: 1px solid #FFFFFF; padding-left: 5px; margin-left: 5px"><use style="fill: var(--svg-icon-active-color)" xlink:href="<?php echo(Helpers::baseSite(true) . "/templates/" . $zostHelpers->app->getTemplate()); ?>/assets/img/open-iconic.min.svg#envelope-closed"></use></svg> | |
\ No newline at end of file |
@@ -62,6 +62,11 @@ | ||
62 | 62 | $icons[] = JHtml::_('icon.edit', $item, $params, array(), true); |
63 | 63 | } |
64 | 64 | |
65 | +// Originalmente usei um array para poder separar usando um caractere pipe, mas | |
66 | +// resolvi não usar mais porque ao traduzir o site, as dimensões do pipe ficam | |
67 | +// erradas. Mantive a codificação por preguiça mesmo, e para que eu mesmo, um | |
68 | +// dia saiba como fazer este tipo de coisa | |
69 | + | |
65 | 70 | if ($item->images) { |
66 | 71 | $articleImage = $item->zost->baseSiteUrl . json_decode($item->images)->image_fulltext; |
67 | 72 | } |
@@ -69,7 +74,7 @@ | ||
69 | 74 | <table class="article-info"> |
70 | 75 | <tr> |
71 | 76 | <td itemprop="author" itemscope itemtype="https://schema.org/Person"><?php echo($this->sublayout("author", $displayData)); ?></td> |
72 | - <td><?php echo(implode(" | ",$icons)); ?></td> | |
77 | + <td><?php echo(implode("",$icons)); ?></td> | |
73 | 78 | </tr> |
74 | 79 | <tr> |
75 | 80 | <td><?php echo($this->sublayout('create_date', $displayData)); ?></td> |
@@ -0,0 +1,103 @@ | ||
1 | +<?php | |
2 | +/******************************************************************************* | |
3 | +Nome: layouts/joomla/system/message.php | |
4 | +Descrição: Script responsável por renderizar mensagens de sistema | |
5 | +Detalhes: O conteúdo da variável displayData é passado como segundo parâmetro | |
6 | + para a função JLayoutHelper::render na forma de um array associativo. | |
7 | + Arquivos de layout como este são renderizados por esta função, | |
8 | + portanto tudo que precisar ser acessado aqui deve ser passado no array | |
9 | + associativo (segundo parâmetro) da função JLayoutHelper::render. | |
10 | + Conclui-se que este arquivo só é processado por meio desta função, a | |
11 | + qual deve ter sido chamada em algum lugar | |
12 | +Mais informações: https://docs.joomla.org/Display_error_messages_and_notices | |
13 | + | |
14 | +Variáveis definidas por padrão: | |
15 | +> $this (Joomla\CMS\Layout\FileLayout) | |
16 | +> $displayData | |
17 | +> $layoutOutput | |
18 | +> $path | |
19 | +> Variáveis definidas nos requires imediatos | |
20 | + | |
21 | +Use get_included_files() e get_defined_vars() para obter informações importantes | |
22 | +*******************************************************************************/ | |
23 | +defined('_JEXEC') or die('Restricted access'); | |
24 | + | |
25 | +/* | |
26 | +Mensagens são colocadas numa fila usando funções como as abaixo | |
27 | + | |
28 | +$zostHelpers->app->enqueueMessage("Nota 2","Notice"); | |
29 | +$zostHelpers->app->enqueueMessage("Mensagem simples 1"); | |
30 | +$zostHelpers->app->enqueueMessage("Nota 1","Notice"); | |
31 | +$zostHelpers->app->enqueueMessage("Erro 2","Error"); | |
32 | +$zostHelpers->app->enqueueMessage("Aviso 2","Warning"); | |
33 | +$zostHelpers->app->enqueueMessage("Erro 1","Error"); | |
34 | +$zostHelpers->app->enqueueMessage("Aviso 1","Warning"); | |
35 | +$zostHelpers->app->enqueueMessage("Erro 3","Error"); | |
36 | +$zostHelpers->app->enqueueMessage("Mensagem simples 2"); | |
37 | +*/ | |
38 | + | |
39 | +$msgList = $displayData['msgList']; | |
40 | + | |
41 | +// As mensagens enfileiradas já vem agrupadas por tipo. Isso torna o | |
42 | +// desenvolvimento mais fácil | |
43 | +if (is_array($msgList) && !empty($msgList)) { | |
44 | +?> | |
45 | + <script type="text/javascript"> | |
46 | + /* <![CDATA[ */ | |
47 | + | |
48 | +var sysModalText = ""; | |
49 | +<?php | |
50 | + echo('sysModalText += "<ul class=\"SysMessage\">";' . "\n"); | |
51 | + | |
52 | + foreach ($msgList as $type => $msgs) { | |
53 | + | |
54 | + switch($type) { | |
55 | + case "notice": | |
56 | + $class = "success"; | |
57 | + break; | |
58 | + case "message": | |
59 | + $class = "info"; | |
60 | + break; | |
61 | + case "error": | |
62 | + $class = "danger"; | |
63 | + break; | |
64 | + case "warning": | |
65 | + $class = "warning"; | |
66 | + break; | |
67 | + } | |
68 | + | |
69 | + echo('sysModalText += " <li class=\"' . $class . '\">";' . "\n"); | |
70 | + echo('sysModalText += " ' . mb_convert_case(JText::_($type),MB_CASE_UPPER,"UTF-8") . '";' . "\n"); | |
71 | + | |
72 | + if (!empty($msgs)) { | |
73 | + | |
74 | + echo('sysModalText += " <ul>";' . "\n"); | |
75 | + | |
76 | + foreach ($msgs as $msg) { | |
77 | + echo('sysModalText += " <li>' . $msg . '</li>";' . "\n"); | |
78 | + | |
79 | + } | |
80 | + | |
81 | + echo('sysModalText += " </ul>";' . "\n"); | |
82 | + } | |
83 | + | |
84 | + echo('sysModalText += " </li>";' . "\n"); | |
85 | + } | |
86 | + | |
87 | + echo('sysModalText += "</ul>";' . "\n"); | |
88 | +?> | |
89 | + | |
90 | +jQuery("#SysModal").on("show.bs.modal", function(e) { | |
91 | + document.getElementById("SysModalTitle").innerText = "Mensagem do sistema"; | |
92 | + document.getElementById("SysModalText").innerHTML = sysModalText; | |
93 | +}); | |
94 | + | |
95 | +jQuery("#SysModal").modal({ | |
96 | + backdrop: "static" | |
97 | +}); | |
98 | + | |
99 | +jQuery("#SysModal").modal("show"); | |
100 | + /* ]]> */ | |
101 | + </script><?php | |
102 | +} | |
103 | +?> | |
\ No newline at end of file |
@@ -162,5 +162,17 @@ | ||
162 | 162 | } |
163 | 163 | ?> |
164 | 164 | <div class="overlay"></div> |
165 | + <div class="modal fade" role="dialog" tabindex="-1" id="SysModal"> | |
166 | + <div class="modal-dialog modal-lg modal-dialog-centered" role="document"> | |
167 | + <div class="modal-content"> | |
168 | + <div class="modal-header"> | |
169 | + <h2 class="modal-title" id="SysModalTitle">Título não especificado!</h2><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> | |
170 | + </div> | |
171 | + <div class="modal-body" id="SysModalText"><span>Conteúdo não especificado</span></div> | |
172 | + <div class="modal-footer"><button class="btn btn-primary btn-sm" type="button" style="display: none;">Salvar</button><button class="btn btn-primary btn-sm" type="button" data-dismiss="modal">Fechar (ESC)</button></div> | |
173 | + </div> | |
174 | + </div> | |
175 | + </div> | |
176 | +<jdoc:include type="message" /><!-- System Messages Configurations --> | |
165 | 177 | </body> |
166 | 178 | </html> |
\ No newline at end of file |
@@ -14,6 +14,8 @@ | ||
14 | 14 | <folder>assets</folder> |
15 | 15 | <filename>index.php</filename> |
16 | 16 | <filename>templateDetails.xml</filename> |
17 | + <filename>template_preview.png</filename> | |
18 | + <filename>template_thumbnail.png</filename> | |
17 | 19 | </files> |
18 | 20 | <positions> |
19 | 21 | <position>basicblack-Row1Column1</position> |