Alterar a altura do cabeçalho das categorias
4 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Alterar a altura do cabeçalho das categorias
Detalhes da questão
Endereço do fórum: https://bzl-esports.forumeiros.com/
Versão do fórum: ModernBB
Descrição
Ola,
As categorias são bem altas, eu gostaria de ver se tem como alterar a altura da categoria? deixar elas mais fina?
Exemplo:
https://i.servimg.com/u/f54/20/00/83/12/forum10.png
Edit1:Estava andando pelo forum em busca de conhecimento até que me deparei com essa pergunta, Não responderam mas eu queria saber como faz ent eu vim fazer a mesma pergunta
Última edição por pedxz em 28.03.21 17:49, editado 2 vez(es) (Motivo da edição : Renomear o título do tópico.)
Re: Alterar a altura do cabeçalho das categorias
Saudações @-Xerox- , aqui esta
- Código:
<ul class="linklist top">
<!-- BEGIN switch_user_logged_in -->
<li>
<a href="{U_SEARCH_NEW}"><i class="ion-ios-flame"></i>{L_SEARCH_NEW}</a>
</li>
<li>
<a href="{U_SEARCH_SELF}"><i class="ion-ios-box-outline"></i>{L_SEARCH_SELF}</a>
</li>
<!-- END switch_user_logged_in -->
<li>
<a href="{U_SEARCH_UNANSWERED}"><i class="ion-ios-chatbubble-outline"></i>{L_SEARCH_UNANSWERED}</a>
</li>
<!-- BEGIN switch_user_logged_in -->
<li class="rightside">
<a href="{U_MARK_READ}" accesskey="m"><i class="ion-android-checkmark-circle"></i>{L_MARK_FORUMS_READ}</a>
</li>
<!-- END switch_user_logged_in -->
</ul>
<!-- BEGIN catrow -->
<!-- BEGIN tablehead -->
<div class="forabg">
<ul class="topiclist">
<li class="header">
<dl class="icon">
<dd class="dterm"><div class="table-title">{catrow.tablehead.L_FORUM}</div></dd>
<dd class="topics"><i class="ion-android-list" data-tooltip="{L_TOPICS}"></i></dd>
<dd class="posts"><i class="ion-android-chat" data-tooltip="{L_POSTS}"></i></dd>
<dd class="lastpost"><i class="ion-android-time" data-tooltip="{L_LASTPOST}"></i></dd>
</dl>
</li>
</ul>
<ul class="topiclist forums">
<!-- END tablehead -->
<!-- BEGIN forumrow -->
<li class="row">
<dl class="icon" style="background:url({catrow.forumrow.FORUM_FOLDER_IMG}) no-repeat scroll {catrow.forumrow.INC_LEVEL} 50%;">
<dd class="dterm">
<div style="display: block; margin : 0 {catrow.forumrow.INC_LEVEL_RIGHT} 0 {catrow.forumrow.INC_LEVEL_LEFT};">
<h{catrow.forumrow.LEVEL} class="hierarchy">
<a href="{catrow.forumrow.U_VIEWFORUM}" class="forumtitle">{catrow.forumrow.FORUM_NAME}</a>
</h{catrow.forumrow.LEVEL}>
{catrow.forumrow.FORUM_DESC}
<!-- BEGIN switch_moderators_links -->
{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
<!-- END switch_moderators_links -->
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
<strong>{forumrow.L_SUBFORUM_STR}</strong> {forumrow.SUBFORUMS}
</div>
</dd>
<dd class="topics">{catrow.forumrow.TOPICS} <dfn>{L_TOPICS}</dfn></dd>
<dd class="posts">{catrow.forumrow.POSTS} <dfn>{L_POSTS}</dfn></dd>
<dd class="lastpost">
<!-- BEGIN ads -->
<span class="AD_LastPA">
<span class="lastpost-avatar"><img src="{catrow.forumrow.ads.IMG}" alt="{catrow.forumrow.ads.TITLE}" /></span>
<span class="AD_LastInfos">
<a href="{catrow.forumrow.ads.LINK}">{catrow.forumrow.ads.TITLE}</a>
{catrow.forumrow.ads.DATE}<br />
{catrow.forumrow.ads.LOCATION}
</span>
</span>
<!-- END ads -->
<!-- BEGIN avatar -->
<span class="lastpost-avatar">{catrow.forumrow.avatar.LAST_POST_AVATAR}</span>
<!-- END avatar -->
<span>
<!-- BEGIN switch_topic_title -->
<a href="{catrow.forumrow.U_LATEST_TOPIC}" title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><br />
<!-- END switch_topic_title -->
{catrow.forumrow.USER_LAST_POST}
</span>
</dd>
</dl>
</li>
<!-- END forumrow -->
<!-- BEGIN tablefoot -->
</ul>
</div>
<!-- END tablefoot -->
<!-- END catrow -->
<!-- BEGIN switch_on_index -->
<ul class="linklist bottom">
<li>
<a href="{U_TODAY_ACTIVE}">{L_TODAY_ACTIVE}</a>
</li>
<li>
<a href="{U_TODAY_POSTERS}">{L_TODAY_POSTERS}</a>
</li>
<li class="last">
<a href="{U_OVERALL_POSTERS}">{L_OVERALL_POSTERS}</a>
</li>
<!-- BEGIN switch_delete_cookies -->
<li class="rightside">
<a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}" rel="nofollow"><i class="ion-trash-a"></i>{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
</li>
<!-- END switch_delete_cookies -->
</ul>
<!-- END switch_on_index -->
<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
var btn_collapse = $('<div></div>', {
class: 'btn-collapse'
});
var btn_collapse_show = $('<i></i>', {
class: 'ion-android-add-circle hidden',
'data-tooltip': '{L_EXPEND_CAT}'
}).appendTo(btn_collapse);
var btn_collapse_hide = $('<i></i>', {
class: 'ion-android-remove-circle',
'data-tooltip': '{L_HIDE_CAT}'
}).appendTo(btn_collapse);
var collapsed = [];
if (readCookie('collapsed') != null && readCookie('collapsed') != '') {
collapsed = readCookie('collapsed').split(',');
}
$(document).on('click', '.btn-collapse', function() {
$(this).children('.ion-android-add-circle').toggleClass('hidden');
$(this).children('.ion-android-remove-circle').toggleClass('hidden');
$(this).parents('.forabg').toggleClass('hidden');
if (readCookie('collapsed') != null && readCookie('collapsed') != '') {
collapsed = readCookie('collapsed').split(',');
}
if (!$(this).parents('.forabg').hasClass('hidden')) {
removeFromArray('' + $(this).parents('.forabg').data('cindex'), collapsed);
createCookie('collapsed', collapsed);
} else {
collapsed.push('' + $(this).parents('.forabg').data('cindex'));
createCookie('collapsed', collapsed);
}
});
$('.forabg').each(function(i) {
$(this).data('cindex', '' + i);
$(btn_collapse)
.clone()
.attr('id', 'forabg' + i)
.appendTo($(this).find('.header'));
if ($.inArray('' + i, collapsed) > -1) {
$(this).toggleClass('hidden');
$('#forabg' + i).children('.ion-android-add-circle').toggleClass('hidden');
$('#forabg' + i).children('.ion-android-remove-circle').toggleClass('hidden');
}
});
});
function removeFromArray(item, array) {
var i = array.indexOf(item);
if (i > -1) {
array = array.splice(i, 1);
}
}
function createCookie(name, value, days) {
var expires;
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = "; expires=" + date.toGMTString();
} else {
expires = "";
}
document.cookie = encodeURIComponent(name) + "=" + encodeURIComponent(value) + expires + "; path=/";
}
function readCookie(name) {
var nameEQ = encodeURIComponent(name) + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) === ' ') c = c.substring(1, c.length);
if (c.indexOf(nameEQ) === 0) return decodeURIComponent(c.substring(nameEQ.length, c.length));
}
return null;
}
//]]>
</script>
Re: Alterar a altura do cabeçalho das categorias
Olá, @AnonimoDaNWD !
Peço perdão pelo erro. Esqueci de acrescentar que precisarei de seu CSS para fazer adaptações com a atualização das categorias, se não for incomodo.
Peço perdão pelo erro. Esqueci de acrescentar que precisarei de seu CSS para fazer adaptações com a atualização das categorias, se não for incomodo.
Re: Alterar a altura do cabeçalho das categorias
Claro, aqui esta.
- Código:
/*Avatar retangular ai poh*/
.post .postprofile-avatar img {
width: unset;
height: unset;
border-radius: 0;
max-height: 250px;
}
.block-footer a[href^="/g"] {
transition: .3s;
}
.block-footer {
font-size: 0;
}
.block-footer b {
font-size: 14px;
margin: 5px;
}
.block-footer a[href^="/g"]:hover {
background: #ddd;
padding: 12px 10px 9px;
}
#legend {
font-size: 0;
}
#legend a {
font-size: 14px;
margin: 8px;
}
#legend {
text-align: center !important;
}
.fa-category-controller {
margin: 20px 193px!important;
}
.navbar.navlinks {
text-align: center !important;
}
ul.topiclist li.header dl dd {
margin-top: 39px;
}
li.header dl.icon dd.dterm, li.header dl.icon dt {
margin-top: 39px;
}
li.header dl.icon {
height: 100px;
}
.panel,
.block {
border-radius: 6px!important;
}
.forabg .header {
border-bottom: 5px solid black;
}
li.row {
border-left: 5px solid black;
}
.forabg .header {
border-bottom: 5px solid black;
}
li.row {
border-left: 5px solid black;
}
li.row:hover {
border-left: 5px solid #f00;
}
.sub-header-info {
width: 100%;
text-align: center;
background-color: #000000;
padding: 9px;
}
h1.page-title a {
color: white!important;
}
.forabg.hidden {
background-color: red!important;
background-image: none!important;
background-weight: bold!important;
}
.forumtitle {
font-weight: bold!important;
}
.statistics, #page-footer {
background-color: rgba(0,0,0,0.2);
color: #FF0000;
}
[id^="p"].online .postprofile[id^="profile"]:not(#profile0):before {
background-color: #54962f;
content: 'Online';
color: #fff;
text-shadow: 0 1px 1px rgba(0,0,0,0.2);
}
[id^="p"] .postprofile[id^="profile"]:not(#profile0):before {
background-color: #e6e6e6;
color: black;
content: 'Offline';
display: block;
padding: 3px 6px;
margin: -10px auto 10px auto;
border-radius: 2px;
width: max-content;
font-weight: 500;
}
.socialmedia {
position: absolute;
top: 80%;
right: 6%;
}
.socialmedia .social {
box-shadow: inset 0 3px rgba(255,255,255,0.15), inset 0 -3px rgba(0,0,0,0.15), 0 3px rgba(0,0,0,0.1);
width: 40px;
height: 40px;
border: 1px solid rgba(0,0,0,0.2);
border-radius: 20px;
margin-top: 0px;
text-align: center;
color: #FFF;
text-shadow: 0 4px rgba(0,0,0,0.2);
font-size: 18px;
float: left;
padding: 5%;
margin-right: 10px;
}
.social.facebook {
background: linear-gradient(to bottom, #50719c, #375073);
}
.social.whatsapp {
background: linear-gradient(to bottom, #34af23, #227317);
}
.social.instagram {
background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
text-shadow: none;
}
.social.discord {
background: linear-gradient(to bottom, #7289da, #869adf);
}
.social.server {
background: linear-gradient(to bottom, #830103, #500000);
}
.fa.fa-gamepad {
margin-left: -4px!important;
}
.socialmedia .social i {
margin-top: -3px;
margin-left: -1px;
}
.stream {
margin-left: 75%;
margin-top: 5%;
}
.block-footer {
text-align: center;
}
::-webkit-scrollbar
{
width: 12px;
background-color: #F5F5F5;
}
::-webkit-scrollbar-thumb {
background: #888;
}
::-webkit-scrollbar-thumb:hover {
background: #555;
}
::-webkit-scrollbar-button {
background: black;
box-shadow: 0 0 3px rgba(0,0,0,0.9);
}
::-webkit-scrollbar-track
{
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px;
background-color: #000000;
}
::-webkit-scrollbar-thumb
{
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
}
#LEGENDA
.block-groups { font-size: 0!important; text-align: center; }
.block-groups b { font-size: 12px!important; }
.block-groups b:not(:last-child) { padding-right: 1em; }
.block-footer.block-groups {
font-size: 0;
}
.forabg {
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border: 1px solid #6E6B6B;
}
.postprofile {
text-align: center;
}
div.postprofile dl dt img {
-moz-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
-moz-transition: all .5s ease;
-o-transition: all .5s ease;
-webkit-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
-webkit-transition: all .5s ease-out;
border: 5px solid #eee;
box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
margin-left: 3px;
}
.postprofile-avatar:hover {
-moz-transform: rotate(-7deg);
-o-transform: rotate(-7deg);
-webkit-transform: rotate(-7deg);
}
.postprofile-avatar {
-moz-transition: all .5s ease;
-webkit-transition: all .5s ease-out;
-o-transition: all .5s ease;
}
###LEGENDA
.block-footer a[href^="/g"] {
transition: .3s;
}
.block-footer a[href^="/g"]:hover {
background: #ddd;
padding: 12px 10px 9px;
}
###brilho
a[href^="/g0"],
a[href^="/u"] span[style$="#FF0000"] {
background: url(https://i.imgur.com/6EHq3rY.gif);
text-shadow: 2px 0px 11px red;
}
a[href^="/g1"],
a[href^="/u"] span[style$="#FF0000"] {
background: url(https://i.imgur.com/6EHq3rY.gif);
text-shadow: 2px 0px 11px red;
}
a[href^="/g2"],
a[href^="/u"] span[style$="#FF0000"] {
background: url(https://i.imgur.com/6EHq3rY.gif);
text-shadow: 2px 0px 11px red;
}
a[href^="/g3"],
a[href^="/u"] span[style$="#FF0000"] {
background: url(https://i.imgur.com/6EHq3rY.gif);
text-shadow: 2px 0px 11px red;
}
a[href^="/g4"],
a[href^="/u"] span[style$="#FF0000"] {
background: url(https://i.imgur.com/6EHq3rY.gif);
text-shadow: 2px 0px 11px red;
}
a[href^="/g5"],
a[href^="/u"] span[style$="#FF0000"] {
background: url(https://i.imgur.com/6EHq3rY.gif);
text-shadow: 2px 0px 11px red;
}
a[href^="/g6"],
a[href^="/u"] span[style$="#FF0000"] {
background: url(https://i.imgur.com/6EHq3rY.gif);
text-shadow: 2px 0px 11px red;
}
a[href^="/g8"],
a[href^="/u"] span[style$="#FF0000"] {
background: url(https://i.imgur.com/6EHq3rY.gif);
text-shadow: 2px 0px 11px red;
}
.postprofile {
background: #f8f8f8;
border-color: rgba(0,0,0,0.18);
border-style: solid;
border-width: 1px;
box-shadow: 0 1px 6px rgba(0,0,0,0.06);
margin-top: 1% !important;
margin-bottom: 1% !important;
margin-right: 1% !important;
max-width: 200px !important;
text-align: center;
}
.postprofile img {
max-width: 100%;
border-radius: 0!important;
}
.post-head {
padding-right: 230px !important
}
.postprofile-avatar img {
height: auto !important;
max-width: 150px !important;
width: auto !important;
border-radius: 0% !important;
}
/*************** EE CONTA ************************/
.topBar {
float: right;
height: 50px;
margin-right: 40px;
max-width: 1400px;
width: 25%;
}
.register {
background: rgba(0,0,0,0.2);
float: right;
font-size: 14px;
font-weight: 300;
}
.topBar li {
margin: 0!important;
}
.topBar a {
color: #FFFFFF !important; /** cor do texto **/
display: inline-block!important;
font-family: 'Fira Sans Condensed', sans-serif, "Trebuchet MS", Sans-serif, Arial, Helvetica, Verdana!important;
font-size: 13px!important;
font-weight: 700!important;
height: 50px!important;
line-height: 50px!important;
padding: 0 12px!important;
text-shadow: none!important;
transition-duration: 300ms!important;
width: 100%;
}
.fa {
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.fa-plus-square:before {
content: "\f0fe";
}
.login {
background: rgba(0,0,0,0.2);
float: right;
font-size: 14px;
font-weight: 300;
margin-right: 5px;
}
.fa-user-circle:before {
content: "\f2bd";
}
.topBar a:hover {
background-color: #000!important; /** cor do mouse **/
border-radius: 0;
}
/**************************** ESTRUTURA ************************************/
.dropdown {
display: inline-block;
position: relative;
}
.navbar a {
color: #FFFFFF!important; /** cor do link **/
display: inline-block!important;
height: 50px!important;
line-height: 53px!important;
padding: 0 12px!important;
text-shadow: none!important;
transition-duration: 300ms!important;
width: 100%;
}
.navbar a {
border-radius: 3px;
font-size: 1.3rem;
}
.fa-navicon:before, .fa-reorder:before, .fa-bars:before {
content: "\f0c9";
}
.navbar li {
margin: 0!important;
}
.navbar li {
display: inline-block;
}
.fa-newspaper-o:before {
content: "\f1ea";
}
.fa-info-circle:before {
content: "\f05a";
}
.fa-shopping-cart:before {
content: "\f07a";
}
#tabs:after, .navbar:after, dl.polls:after, fieldset dl:after, ul.linklist:after, ul.topiclist dl:after {
clear: both;
content: ".";
display: block;
height: 0;
visibility: hidden;
}
.navbar a:hover {
background-color: #000000!important; /** cor do link quando passa o mouse **/
border-radius: 0;
}
.navbar a:hover {
box-shadow: 0 1px 6px rgba(0,0,0,0.06);
}
.dropdown-content {
background-color: #2c353b; /** cor dos submenus **/
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
min-width: 160px;
position: absolute;
z-index: 10;
display: none;
}
.fa-list:before {
content: "\f03a";
}
.fa-book:before {
content: "\f02d";
}
.fa-group:before, .fa-users:before {
content: "\f0c0";
}
.dropdown:hover .dropdown-content {
display: block;
}
.dropdown-content a:hover {
background-color: #000;
}
.navbar {
background: #000!important; /** cor da barra de navegação **/
background-position: center center;
height: 50px;
line-height: 38px;
width: 100%;
z-index: 999;
}
.fa-user:before {
content: "\f007";
}
.fa-envelope-o:before {
content: "\f003";
}
.mensp {
background: rgba(0,0,0,0.2);
color: #fff;
display: block;
float: left;
font-weight: 400;
list-style: none;
margin-right: 5px;
transition: .05s all;
}
.sair {
background: rgba(0,0,0,0.2);
color: #fff;
display: block;
float: left;
font-weight: 400;
list-style: none;
margin-right: 5px;
transition: .05s all;
}
.fa-sign-out:before {
content: "\f08b";
}
.perfil {
background: rgba(0,0,0,0.2);
color: #fff;
display: block;
float: left;
font-weight: 400;
list-style: none;
margin-right: 5px;
transition: .05s all;
}
.dropdown {
float: left!important;
}
.navbar {
border-radius: 5px 5px 5px 5px!important;
}
/# PERFFIL
.headerbar {
background-color: transparent;
background-image: url(https://2img.net/i.imgur.com/F2RTiRY.png);
background-position: center;
background-repeat: no-repeat;
background-size: contain!important;
height: 150px!important;
margin: 0;
overflow: hidden;
padding: 0;
position: relative!important;
}
#header-banner {
height: 220px;
width: 100%;
}
.block-footer a.gensmall[href^="/g"] {
border-bottom: 6px solid transparent;
transition: border-color 0.6s linear;
}
.block-footer a.gensmall[href^="/g"]:hover {
border-color: currentColor;
}
.block-footer#legend {
background: darkgrey;
}
#AVATAR
.lastpost-avatar img {
height: 50px;
width: 50px;
margin-top: -7px;
}
li.header dl.icon {
background-color: #000000;
border-bottom: 3px solid #FF0000;
border-radius: 4px;
}
.headerbar {
background-size: auto;
background-color: #010101;
}
Re: Alterar a altura do cabeçalho das categorias
Olá @AnonimoDaNWD
Pode dar uma olhada nessa questão aqui: https://ajuda.forumeiros.com/t116403-diminuir-tamanho-das-categorias
Talvez seja a mesma que o senhor tenha dúvidas sobre, espero que tenha ajudado o mesmo. Caso não resolva, informe aqui.
Atenciosamente, Wusthy
Pode dar uma olhada nessa questão aqui: https://ajuda.forumeiros.com/t116403-diminuir-tamanho-das-categorias
Talvez seja a mesma que o senhor tenha dúvidas sobre, espero que tenha ajudado o mesmo. Caso não resolva, informe aqui.
Atenciosamente, Wusthy
Re: Alterar a altura do cabeçalho das categorias
Tópico resolvidoTópico arquivado por inatividade por parte do autor, marcado como resolvido por ter solução apropriada à questão. |
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217
Tópicos semelhantes
» Diminuir a altura do cabeçalho
» Como mudar a altura do cabeçalho do fórum
» Mesma altura para widgets e categorias
» Aumentar altura e largura das categorias do fórum
» Alterar cor da borda do cabeçalho
» Como mudar a altura do cabeçalho do fórum
» Mesma altura para widgets e categorias
» Aumentar altura e largura das categorias do fórum
» Alterar cor da borda do cabeçalho
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos