// // OSIVIA Bootstrap extensions - Person // -------------------------------------------------- @person-height: @line-height-computed + floor((@font-size-small * @line-height-base)); .person { .clearfix; &, .person-avatar, .person-title, .person-extra { display: block; } // Avatar .person-avatar { .pull-left; .text-center; height: @person-height; width: @person-height; margin-right: @padding-base-horizontal; img, i { .translate(@x: 0, @y: -50%); position: relative; top: 50%; } img { .img-responsive; .center-block; max-height: 100%; } i { font-size: @line-height-computed; } } // Title .person-title { .text-overflow; &:last-child { .form-control-static; } } // Extra .person-extra { .small; .text-muted; .text-overflow; } // Link a&, a & { &, &:hover, &:focus { color: inherit; text-decoration: none; } &.active { .bg-primary; .person-extra { color: inherit; } } } // Table .table & { @media screen and (max-width: @screen-xs-max) { margin-bottom: @padding-small-vertical; } .person-extra { @line-height: floor(@font-size-small * @line-height-base); line-height: @line-height; margin-bottom: @input-height-base - @line-height-computed - @line-height; } } a&, a & { .table-row & { margin: -@table-cell-padding; padding: @table-cell-padding; } } // Select2 highlighted option .select2-results__option--highlighted & { .person-extra { color: inherit; } } // Select2 disabled option .select2-results__option[aria-disabled=true] & { .person-avatar { img { filter: grayscale(100%); } } } // Select2 selection .select2-selection__rendered &, .select2-selection__choice & { .person-avatar, .person-title { display: inline; } .person-avatar { overflow: hidden; height: @line-height-computed; width: @line-height-computed; margin-right: @padding-xs-horizontal; img, i { position: static; transform: none; } img { height: 100%; max-width: inherit; } } .person-title { &, &:last-child { padding: 0; } } } // List group active item .list-group .list-group-item.active & { .person-extra { color: inherit; } } }