.history{
    display: flex;
    flex-direction: column;

}
.history .filter{

    color: #000;
    padding-right: 10px;
    padding-left: 10px;
    margin-bottom: 20px;
}
.history .filter .filter-item{
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
}
.history .filter .btn{
    margin-top: 15px;
    border: solid 1px #000;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px;
}
.history .main{
    padding-right: 20px;
    padding-left: 20px;
    flex: 1;
    overflow: auto;
    padding-bottom: 20px;
}
.history .content{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.history .item{
    width: calc( 100% / 2 - 15px);
    height: max-content;
    background: rgb(36,95,80);
    border-radius: 12px;
    padding: 10px;
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: #fff;
    user-select: none; /* 标准语法 */
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE 10及以下 */
}

.history .item .item-name{
    font-size: 20px;
    overflow: hidden; /* 确保超出容器的内容被裁剪 */
    white-space: nowrap; /* 确保文本在一行内显示 */
    text-overflow: ellipsis; /* 超出部分显示省略号 */
    height: max-content;
}
.history .item .publisher{
    text-align: right;
    overflow: hidden; /* 确保超出容器的内容被裁剪 */
    white-space: nowrap; /* 确保文本在一行内显示 */
    text-overflow: ellipsis; /* 超出部分显示省略号 */
    height: max-content;
}
.history .item .controls{
    display: flex;
    align-items: center;
    justify-content: center;
    /*margin-top: 5px;*/
    height: 50px;
}
.history .item .controls .btn{
    border: solid 1px #000;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3px;

}