Improve template for social's skills block - refs #7881

1.10.x
Angel Fernando Quiroz Campos 10 years ago
parent 2de7a58f69
commit 38bbf757ae
  1. 41
      app/Resources/public/css/base.css
  2. 10
      main/template/default/social/skills_block.tpl

@ -4140,40 +4140,23 @@ i.size-32.icon-new-work{
margin-bottom: 10px;
margin-top: 10px;
}
#skillList .list-badges{
list-style: none;
padding-left: 8px;
margin:0px;
}
#skillList .list-badges li{
margin-top: 10px;
#skillList .list-badges .thumbnail{
border-color: #bce8f1;
display: inline-block;
width: 120px;
margin-right: 5px;
font-size: 11px;
text-align: center;
border: 1px solid #bce8f1;
border-radius: 5px;
box-sizing: border-box;
margin-right: 15px;
padding: 0;
vertical-align: top;
box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.09);
width: 120px;
}
#skillList .list-badges li img{
height: 100%;
max-height: 64px;
width: 100%;
max-width: 64px;
margin-top: 10px;
margin-bottom: 10px;
#skillList .list-badges .thumbnail img{
margin-bottom: 4px;
margin-top: 4px;
}
#skillList .list-badges .badges-name{
#skillList .list-badges .thumbnail .caption{
background: #D9EDF7;
min-height: 35px;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
color: #31708F;
padding-left: 5px;
padding-right: 5px;
}
#skillList .list-badges .thumbnail .caption p{
margin-bottom: 0;
}
#skillList .dropdown-menu{
top: 30px;

@ -29,11 +29,13 @@
<div id="skillList" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
<div class="panel-body">
{% if skills %}
<ul class="list-badges">
<ul class="list-unstyled list-badges">
{% for skill in skills %}
<li>
<img title="{{ skill.name }}" src="{{ skill.icon ? skill.web_icon_thumb_path : 'badges-default.png'|icon(64) }}" width="64" height="64" alt="{{ skill.name }}">
<div class="badges-name">{{ skill.name }}</div>
<li class="thumbnail">
<img title="{{ skill.name }}" class="img-responsive" src="{{ skill.icon ? skill.web_icon_thumb_path : 'badges-default.png'|icon(64) }}" width="64" height="64" alt="{{ skill.name }}">
<div class="caption">
<p class="text-center">{{ skill.name }}</p>
</div>
</li>
{% endfor %}
</ul>

Loading…
Cancel
Save