hubl/src/styles/job-offers.scss

#offers-list {
  @extend .grid-layer;
  
  > sib-form {
    grid-column-start: start;
    grid-column-end: middle;
    grid-row-start: start;
    grid-row-end: middle;
  }
  
  > div {
    grid-column-start: start;
    grid-column-end: end;
    grid-row-start: middle;
    grid-row-end: end;
    
    &:first-of-type {
      margin-top: 5rem;
    }
    
    > sib-display {
      @extend %frame;
      display: block;
      font-size: 1.5rem;
      margin: 1.7rem 0;
      padding: 3.4rem;
      /*&:nth-child(odd) {
        background-color: $color-anti-flash-white;
      }*/
      
      [name='user-thumb'] {
        align-items: center;
        display: flex;
        margin: -0.25em;
      
        > * {
          margin: 0.25em;
        }
  
        [name='author.first_name'] {
          color: $color-quartz;
          font-weight: 600;
        }

        sib-multiple[name$='groups'] {
          display: flex;

          label {
            display: none;
          }

          > * {
            @extend %group;
          }
        }
      
        sib-display-img {
          background-color: $color-white;
          border-radius: 50%;
          height: 4.25rem;
          overflow: hidden;
          position: relative;
          width: 4.25rem;

          img {
            height: 100%;
            left: 0;
            object-fit: cover;
            position: absolute;
            top: 0;
            width: 100%;
          }
        }
      }
      
      [name='creationDate'] {
        display: block;
        margin-bottom: 0.7rem;
        margin-top: 2rem;
      }

      [name='title'] {
        @extend h3;
        display: block;
        font-weight: bold;
        line-height: 19px;
      }
      
      [name='description'] {
        display: block;
        line-height: 1.6;
        margin-bottom: 1.6rem;
      }

      [name='skills'] {
        label {
          display: none;
        }
      }
      
      [name='send'] {
        color: $color-majorelle-blue;
        font-size: 1.3rem;
        float: right;
      
        > sib-link {
          cursor: pointer;
          @include icon('speech');
      
          &::before {
            font-size: 1.5rem;
            margin-right: 1.2rem;
          }
        }
      }
      
      [name='status'] {
        float: right;
        display: flex;
        align-items: center;
        margin: -0.25em;
        
        > * {
          margin: 0.25em;
        }
        
        strong {
          @extend %status-open;
        }
      } 
    }
  }
}