ref: master
plugins/evaluation/public/stylesheets/evaluation.scss
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 |
@import 'base'; /* Images */ $image-star: "/plugins/evaluation/images/star.png"; $image-star-empty: "/plugins/evaluation/images/star_empty.png"; $image-star-width: 29px; $image-star-height: 25px; /* Colors */ $color-text-area-border: #C5AAA5; .evaluation-mean { .evaluation-star-value-wrap { margin-bottom: $margin; } } .evaluation-star-value-wrap { background: url($image-star-empty); width: 5*$image-star-width; height: $image-star-height; .value-icon { background: url($image-star); height: $image-star-height; &.value-0 { width: 0*$image-star-width; } &.value-1 { width: 1*$image-star-width; } &.value-2 { width: 2*$image-star-width; } &.value-3 { width: 3*$image-star-width; } &.value-4 { width: 4*$image-star-width; } &.value-5 { width: 5*$image-star-width; } } } .evaluation-snippet { &.left { .profile-image, .arrow-wrap, .evaluation-text { float: left; } } &.right { .profile-image, .arrow-wrap, .evaluation-text { float: right; } } $arrow-size: $base/2; $arrow-inner-size: $base/2 - $border; .arrow-wrap { margin-top: $profile-thumb-size/2 - $arrow-size; width: 0; height: 0; position: relative; .arrow { margin-top: -$arrow-inner-size; } &.left { left: $border; border-style: solid; border-width: $arrow-size $arrow-size $arrow-size 0; border-color: transparent $color-text-area-border transparent transparent; .arrow { margin-left: $border; border-style: solid; border-width: $arrow-inner-size $arrow-inner-size $arrow-inner-size 0; border-color: transparent white transparent transparent; } } &.right { left: -$border; border-style: solid; border-width: $arrow-size 0 $arrow-size $arrow-size; border-color: transparent transparent transparent $color-text-area-border; .arrow { margin-left: -($arrow-inner-size + $border); border-style: solid; border-width: $arrow-inner-size 0 $arrow-inner-size $arrow-inner-size; border-color: transparent transparent transparent white; } } } .evaluation-text { width: $module04 + $intercolumn - $arrow-size; padding: $padding - $border; border: $border solid $color-text-area-border; .evaluation-message { } .evaluation-footer { } } } |