Comments

4 comments

  • Avatar
    Brandon Griggs

     Hi Brad, here's the CSS.  It's basically two lists, each filtered by a job "type".  The lists are formatted to use 3 columns in Knack.

    /* Font styles */
    .kn-content h3 {
      color: #8f3181; 
      margin-top: 18px;
      margin-bottom: 8px;
      line-height: 160%;
      font-size: 115%;
    }
    body .kn-content p {
      line-height: 160%;
    }
    .kn-content .kn-scenes p, .kn-content .kn-scenes td {
    	font-size: 16px;
    }
    .kn-content b {
      color: #8f3181;
    }
     
    /* job cards */
    .kn-list .kn-details-column.first {
      background-color: #e2e2e2;
      padding: 8px 0 10px 14px;
    }
     
    /* apply link */
    .kn-list .kn-details-column a {
      border-radius: 5px;
      text-decoration: none !important;
      padding: 5px 13px;
      background-color: #eee;
    }
    .kn-list .kn-details-column a:hover {
      background-color: #f6f6f6;
    }
     
    /* same height for all job descriptions */
    .kn-list .field_6 td {
      height: 100px;
    }

     

  • Avatar
    Brad Stevens

    Thanks Brandon - that's excellent - I wasn't getting the .kn-details-column.first right.

  • Avatar
    Brad Stevens

    Thanks Brandon - that's excellent - I wasn't getting the .kn-details-column.first right.

  • Avatar
    Nick Bonnafous

    Thanks, very useful. try this if you have links:

    .kn-list .kn-details-link a {
    border-radius: 5px;
    text-decoration: none !important;
    padding: 5px 13px;
    background-color: #eee;
    }
    .kn-list .kn-details-link a:hover {
    background-color: #f6f6f6;
    }

Please sign in to leave a comment.