publications

by toubia95

HTML

<h3>Publications récentes</h3>
        <div class="publications">
            <div class="item">
                <a href="/market/corpora/doc-stl">
                    <img class="logo" holder-js="holder.js/160x160?theme=d&amp;text=DO&amp;size=56"
                        alt="DO [160x160]" data-src="holder.js/160x160?theme=d&amp;text=DO&amp;size=56"
                        style="width: 160px; height: 160px;"
                        src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22160%22%20height%3D%22160%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20160%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_17c74beedfd%20text%20%7B%20fill%3A%23FFFFFF%3Bfont-weight%3Anormal%3Bfont-family%3AArial%2C%20Helvetica%2C%20Open%20Sans%2C%20sans-serif%2C%20monospace%3Bfont-size%3A56pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_17c74beedfd%22%3E%3Crect%20width%3D%22160%22%20height%3D%22160%22%20fill%3D%22%2300c0a0%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%2224%22%20y%3D%22105.2%22%3EDO%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"
                        data-holder-rendered="true">
                    <h3 class="title">DOC-STL</h3>
                    <div class="date">11 oct. 2021</div>
                </a>
            </div>
            <div class="item">
                <a href="/market/corpora/ortolang-000918">
                    <img class="logo" holder-js="holder.js/160x160?theme=a&amp;text=An&amp;size=56"
                        alt="An [160x160]" data-src="holder.js/160x160?theme=a&amp;text=An&amp;size=56"
                        style="width: 160px; height: 160px;"
                       ...

CSS

a {
    text-decoration: none;
}
.publications {
  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333333;
  background-color: #fff;
  overflow: hidden;
  height: 300px;
}
.publications .item {
    margin: 5px;
    border-top: 1px solid #d9d9d9;
    border-left: 1px solid #d9d9d9;
    border-right: 1px solid #d9d9d9;
    border-bottom: 3px solid #d9d9d9;
    border-radius: 3px;
    line-height: 1.42857143;
    background-color: #f8f8f8;
    width: 160px;
    overflow: hidden;
    cursor: pointer;
    float: left;
}
.publications .item:hover {
    background-color: #e9e9e9;
    border-bottom-color: #cdcdcd;
    transition: all 0.3s;
}
.publications .item a {
    color: inherit;
    display: block;
}
.publications .item a:hover {
    text-decoration: none;
}

.publications .item .logo {
    height: 160px;
    width: 160px;
    background-color: #ffffff;
    border-bottom: 1px solid #e7e7e7;
}
.publications .item .title {
    position: relative;
    color: inherit;
    font-size: 12px;
    margin: 10px 8px 16px;
    height: 60px;
    font-weight: 600;
}
.publications .item .date {
    font-size: 12px;
    font-style: italic;
    margin: 6px 8px 16px;
    color: #777777;
}