Siempre que hago una nueva marca o edito un tema en Blackboard para algún cliente, me encuentro con algo nuevo, puede ser de la forma de "queremos que esto se vea así" o simple casualidad que, ajustando un elemento, otro se cambie o se vea afectado por el cambio, que, por suerte, casi siempre es a bien.
Hoy os muestro cómo modificar algunas cosas en la hoja de estilos. Son pequeños cambios, pero que pueden hacer una gran diferencia.
Cabeceras con menos altura en las páginas:
#pageHeader{
padding: 10px 15px !important;
}
#schemePreviewHead{
padding: 10px 15px !important;
}
.pageTitle{
padding: 10px 15px !important;
}
Menor espacio entre items de contenido en un curso:
.contentList > li{
padding: 5px 30px;
}
.buildList > li{
padding: 5px 30px;
}
.contentListPlain > li{
padding: 5px 30px;
}
.announcementList > li{
padding: 5px 30px;
}
.contentPageItem{
padding: 5px 30px;
}
Avatares más grandes en el listado del curso:
.profileCardAvatarThumb img {
height: 57px !important;
width: 57px!important;
}
Espacios en portlets:
/*portlet anuncios con menos espacio*/
.collapsible ul.portletList{
margin-bottom: 2px !important;
padding-bottom: 0px !important;
}
EDIT:
Esta es la forma correcta:
/*portlet anuncios con menos espacio*/
.collapsible ul.portletList li{
margin-bottom: 2px !important;
padding-top: 0px !important;
}
/*portlet cursos con menos espacio*/
.portlet .portletList-img > li{
padding-top: 2px;
margin-bottom: 2px;
}
Cajetillas de login con un borde más delgado, y esquinas cuadradas:
#loginBox input[type="text"], #loginBox input[type="password"]{
border: 1px solid #CCCCCC;
-moz-border-radius: 0px;
-webkit-border-radius:0px;
border-radius: 0px;
}
Logo superior izquierda más grande y separado de los bordes:
.bannerImage{
padding: 25px 0 0 25px;
max-height: 90px !important;
}
Botón de logout redondo:
div.global-nav-bar .logout-link{
width: 25px!important;
-moz-border-radius: 12px;
-webkit-border-radius:12px;
border-radius: 12px;
}
Eliminar el borde y la sombra de la caja inferior:
div.contentBox{
background-image: none !important;
border: none !important;
-moz-box-shadow: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}
Os recuerdo que estos cambios se realizan añadiendo el código correspondiente al final del archivo themes.css.
¿Alguien está interesado en algún cambio en particular?
Comentarios (0)
Leave a comment