/**
 * @date: 2024/6/19
 * @author: 小红
 * @fileName: links
 * @Description: 链接
 */

@use '../core';
@use "../core/util";
@use "../modules/components";

.links {
  .groups {
    --w: 60px;

    .item {
      .name {
        font-size: 1.2rem;
        margin: 15px 0;
      }

      .logo {
        width: var(--w);
        height: 60px;
        border-radius: 50%;
        transition: width .3s;
      }

      .list {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
        gap: 16px;
      }


      .link {
        padding: 16px;
        display: flex;
        align-items: center;
        gap: 16px;
        text-decoration: none;
        transition: .3s;
        position: relative;
        overflow: hidden;
        height: 100px;
        border: 3px solid #eef1ef;
        border-radius: 15px;

        &:hover {
          border-color: var(--theme);
        }

        .info {
          width: calc(100% - var(--w) - 16px);
          display: flex;
          flex-direction: column;
          justify-content: space-between;
        }

        .n {
          @include util.text-clamp(1);
          font-size: .9rem;
          font-weight: 700;
        }

        .d {
          @include util.text-clamp(2);
          line-height: 1.3;
          font-size: .8rem;
        }
      }
    }

  }
}
 
 
