<commit_before>@import "modules/post/variables";
@mixin travelog-post {
    .post {
        margin-bottom: 40px;
    }

    .post-body {
        p { line-height: 18px; }
    }

    .post-header {
        padding-left: 35px;
        min-height: $post-header-height;
        background-repeat: no-repeat;
        background-position: left center;
        background-color: transparent;
        margin-bottom: 15px;
    }

    .post-header--dw {
        background-image: url(/img/icon-page.png);
    }

    .post-header--ar {
        background-image: url(/img/icon-page.png);
    }

    .post-header-title {
        margin-bottom: 5px;
        font-family: $title-font;
        font-size: 18px;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 1px;

        // Force default text colour [as post-header is wrapped by a link]
        color: $text-colour;

        // However let the normal hover colour apply
        &:hover { color: $link-colour-over; }
    }

    .post-header-date {
        font-family: $caption-font;
        font-style: italic;
        font-weight: normal;
        color: #444;
        letter-spacing: 1px;
    }

    .post-image {
        font-size: 0;
        margin-bottom: 15px;

        img,
        video{
            width: 100%;
            max-width: 100%;
        }
    }

    .post-image--split {
        margin-right: -15px;

        img {
            width: calc(50% - 7.5px);
            max-width: 435px;
            margin-right: 15px;
        }

        .post-image-caption {
            margin-right: 15px;
        }
    }

    @media only screen and (max-width : 900px) {
        .post-image--split img {
            width: calc(50% - 15px);
            max-width: none;
        }
    }

    @media only screen and (max-width : 500px) {
        .post-image--split {
            margin-right: 0;

            img {
                margin-right: 0;
                width: 100%;
                display: block;
                margin-bottom: 15px;
            }

            .post-image-caption {
                // Offset margin of full-width split images
                margin-top: -10px;
                margin-right: 0;
            }
        }
    }

    .post-image-caption {
        line-height: 18px;
        vertical-align: middle;
        font-size: 14px;
        font-family: $caption-font;
        font-style: italic;
        color: $caption-colour;
        background: #f6f6f6;
        padding: 15px 20px 13px;
        text-align: center;
        margin-top: 5px;

        // Paragraphs within the caption should have no margin
        p { margin: 0; }

        // Paragraphs following other paragraphs in the caption should have a top margin
        p + p { margin-top: 15px; }
    }

    .post-image-caption-left,
    .post-image-caption-right {
        display: inline-block;
        width: calc(50% - 1.5px);
    }

    .post-image-caption-left {
        text-align: left;
        padding-right: 10px;
    }

    .post-image-caption-right {
        text-align: right;
        padding-left: 10px;
    }

    @media only screen and (max-width : 500px) {
        .post-image-caption-left,
        .post-image-caption-right {
            text-align: left;
            display: block;
            width: 100%;
            padding: 0;
        }

        .post-image-caption-left {
            margin-bottom: 15px;

            &:before {
                content: 'Left';
                text-transform: uppercase;
                font-weight: bold;
                font-style: normal;
                display: block;
            }
        }

        .post-image-caption-right:before {
            content: 'Right';
            text-transform: uppercase;
            font-weight: bold;
            font-style: normal;
            display: block;
        }
    }

    .post-footer {
        margin-top: 35px;
        padding-bottom: 15px;
        border-bottom: 1px solid $border-colour;

        // Both children are floated, so use a clearfix on the parent
        @include clearfix;
    }

    .post-footer-tags,
    .post-footer-location {
        max-width: 50%;
    }

    ul.post-footer-tags { //Remove padding and list style from lists
        padding: 0;
        list-style: none;
    }

    .post-footer-tags {
        // In order to play nicely with the location element floated to the right of the footer
        float: left;
    }

    .post-footer-tag {
        font-family: $title-font;
        font-weight: bold;
        display: inline;
        text-transform: uppercase;
        font-size: $caption-text-size;
        margin-right: 5px;
        letter-spacing: 1px;
    }

    a.social-share-element {
        display: inline-block;
        height: 24px;<commit_msg>Fix CSS limiting post footer tag width<commit_after>@import "modules/post/variables";
@mixin travelog-post {
    .post {
        margin-bottom: 40px;
    }

    .post-body {
        p { line-height: 18px; }
    }

    .post-header {
        padding-left: 35px;
        min-height: $post-header-height;
        background-repeat: no-repeat;
        background-position: left center;
        background-color: transparent;
        margin-bottom: 15px;
    }

    .post-header--dw {
        background-image: url(/img/icon-page.png);
    }

    .post-header--ar {
        background-image: url(/img/icon-page.png);
    }

    .post-header-title {
        margin-bottom: 5px;
        font-family: $title-font;
        font-size: 18px;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 1px;

        // Force default text colour [as post-header is wrapped by a link]
        color: $text-colour;

        // However let the normal hover colour apply
        &:hover { color: $link-colour-over; }
    }

    .post-header-date {
        font-family: $caption-font;
        font-style: italic;
        font-weight: normal;
        color: #444;
        letter-spacing: 1px;
    }

    .post-image {
        font-size: 0;
        margin-bottom: 15px;

        img,
        video{
            width: 100%;
            max-width: 100%;
        }
    }

    .post-image--split {
        margin-right: -15px;

        img {
            width: calc(50% - 7.5px);
            max-width: 435px;
            margin-right: 15px;
        }

        .post-image-caption {
            margin-right: 15px;
        }
    }

    @media only screen and (max-width : 900px) {
        .post-image--split img {
            width: calc(50% - 15px);
            max-width: none;
        }
    }

    @media only screen and (max-width : 500px) {
        .post-image--split {
            margin-right: 0;

            img {
                margin-right: 0;
                width: 100%;
                display: block;
                margin-bottom: 15px;
            }

            .post-image-caption {
                // Offset margin of full-width split images
                margin-top: -10px;
                margin-right: 0;
            }
        }
    }

    .post-image-caption {
        line-height: 18px;
        vertical-align: middle;
        font-size: 14px;
        font-family: $caption-font;
        font-style: italic;
        color: $caption-colour;
        background: #f6f6f6;
        padding: 15px 20px 13px;
        text-align: center;
        margin-top: 5px;

        // Paragraphs within the caption should have no margin
        p { margin: 0; }

        // Paragraphs following other paragraphs in the caption should have a top margin
        p + p { margin-top: 15px; }
    }

    .post-image-caption-left,
    .post-image-caption-right {
        display: inline-block;
        width: calc(50% - 1.5px);
    }

    .post-image-caption-left {
        text-align: left;
        padding-right: 10px;
    }

    .post-image-caption-right {
        text-align: right;
        padding-left: 10px;
    }

    @media only screen and (max-width : 500px) {
        .post-image-caption-left,
        .post-image-caption-right {
            text-align: left;
            display: block;
            width: 100%;
            padding: 0;
        }

        .post-image-caption-left {
            margin-bottom: 15px;

            &:before {
                content: 'Left';
                text-transform: uppercase;
                font-weight: bold;
                font-style: normal;
                display: block;
            }
        }

        .post-image-caption-right:before {
            content: 'Right';
            text-transform: uppercase;
            font-weight: bold;
            font-style: normal;
            display: block;
        }
    }

    .post-footer {
        margin-top: 35px;
        padding-bottom: 15px;
        border-bottom: 1px solid $border-colour;

        // Both children are floated, so use a clearfix on the parent
        @include clearfix;
    }

    .post-footer-tags,
    .post-footer-location {
        max-width: 100%;
    }

    ul.post-footer-tags { //Remove padding and list style from lists
        padding: 0;
        list-style: none;
    }

    .post-footer-tags {
        // In order to play nicely with the location element floated to the right of the footer
        float: left;
    }

    .post-footer-tag {
        font-family: $title-font;
        font-weight: bold;
        display: inline;
        text-transform: uppercase;
        font-size: $caption-text-size;
        margin-right: 5px;
        letter-spacing: 1px;
    }

    a.social-share-element {
        display: inline-block;
        height: 24px;
{'fraction_non_alphanumeric': 0.11218082879866052, 'fraction_numerical': 0.02249895353704479, 'mean_word_length': 1.3673519940549914, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6789896', 'n_tokens_mistral': 3115, 'n_tokens_neox': 2801, 'n_words': 665}