// This file is part of Moodle - http://moodle.org/
//
// Moodle is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// Moodle is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
/**
 * Moodle user profile page.
 *
 * @package   theme_snap
 * @copyright Copyright (c) 2017 Open LMS (https://www.openlms.net)
 * @license   http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
 */

#page-user-profile,
.path-course.path-user {
    // Full screen width for profile pages.
    #region-main {
        max-width: 100%;
        padding: 1em 4%;
        .snap-page-heading-button {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            .singlebutton {
                margin-bottom: 20px;
            }
        }
    }
    // User image and name.
    .page-context-header {
        text-align: center;
        display: block;

        .page-header-image,
        .page-header-headings,
        .header-button-group {
            display: block;
            padding: 0;
            float: none;
            @include clearfix;
        }

        .page-header-headings {
            padding-bottom: 0.5em;
        }

        .header-button-group {
            display: inline-block;

            .btn {
                border-color: transparent;
            }
        }
    }

    // Hide button text on small screens.
    @include media-breakpoint-down(xs) {
        .header-button-title {
            display: none;
        }
    }

    // Float edit blocks and reset buttons.
    .singlebutton {
        float: right;
    }

    .userprofile {
        clear: both;
        // Profile text.
        .description {
            max-width: 43.5em;
            margin: 0 auto;
        }
        // Profile option lists.
        .profile_tree {
            // Reset core col counts.
            column-count: 1; // IE doesn't support initial (March 2017).
            @include make-row();

            // Make colums for sections.
            @include media-breakpoint-up(sm) {
                .node_category {
                    @include make-col(3);
                    border: none;
                }
                .node_category:nth-of-type(5) {
                    clear: left;
                }
            }
            // Small screen colums to full width.
            @include media-breakpoint-down(sm) {
                .node_category {
                    @include make-col(12);
                    border: none;
                }
            }

            .node_category {
                // Titles.
                h3 {
                    @extend h5;
                }
                // Edit profile link.
                .editprofile {
                    text-align: left;
                }
            }
            // Datalists.
            .node_category li.contentnode dl dd {
                margin: 0;
            }

        }
    }
}

// Pull up the course user profile when there is a cover image.
.path-course.path-user.pagelayout-standard {
    // If course image, pull the user image up.
    #page-header.mast-image {
        margin-bottom: -3.75em;
    }
}

// SHAME - Course partisipants page user profiles list.
.path-course.path-user {
    .userinfobox {
        border: none;
        border-bottom: 1px solid $gray-lighter;
        padding: 0;
        margin-bottom: 0.5em;
        @include make-row();
    }
    .left.side {
        @include make-col(2);
        .userpicture {
            max-width: 75%;
            height: auto;
        }
    }
    .content {
        @include make-col(10);
        .username {
            padding: 0;
        }
        .info {
            font-size: small;
        }
    }
    .links {
        clear: both;
        @include make-col(12);
        br {
            display: none;
        }
        a {
            float: right;
            display: inline-block;
            margin-right: 0.5em;
        }
    }
}

#page-user-profile .label-info {
    color: white;
}