123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249 |
- .arrow {
- border-width: @arrow-outer-width;
- z-index: 10;
- &,
- &:after {
- position: absolute;
- display: block;
- width: 0;
- height: 0;
- border-color: transparent;
- border-style: solid;
- }
- &:after{
- border-width: @arrow-width;
- content: "";
- }
- &.top {
- left: 50%;
- margin-left: -@arrow-outer-width;
- border-top-width: 0;
- border-bottom-color: @arrow-outer-color;
- top: -@arrow-outer-width;
- &:after {
- top: 1px;
- margin-left: -@arrow-width;
- border-top-width: 0;
- border-bottom-color: @arrow-color;
- }
- &.arrow-primary{
- &:after{
- border-bottom-color: @brand-primary;
- }
- }
- &.arrow-info{
- &:after{
- border-bottom-color: @brand-info;
- }
- }
- &.arrow-success{
- &:after{
- border-bottom-color: @brand-success;
- }
- }
- &.arrow-danger{
- &:after{
- border-bottom-color: @brand-danger;
- }
- }
- &.arrow-warning{
- &:after{
- border-bottom-color: @brand-warning;
- }
- }
- &.arrow-light{
- &:after{
- border-bottom-color: @brand-light;
- }
- }
- &.arrow-dark{
- &:after{
- border-bottom-color: @brand-dark;
- }
- }
- &.arrow-black{
- &:after{
- border-bottom-color: @brand-black;
- }
- }
- }
- &.right {
- top: 50%;
- right: -@arrow-outer-width;
- margin-top: -@arrow-outer-width;
- border-right-width: 0;
- border-left-color: @arrow-outer-color;
- &:after {
- right: 1px;
- bottom: -@arrow-width;
- border-right-width: 0;
- border-left-color: @arrow-color;
- }
- &.arrow-primary{
- &:after{
- border-left-color: @brand-primary;
- }
- }
- &.arrow-info{
- &:after{
- border-left-color: @brand-info;
- }
- }
- &.arrow-success{
- &:after{
- border-left-color: @brand-success;
- }
- }
- &.arrow-danger{
- &:after{
- border-left-color: @brand-danger;
- }
- }
- &.arrow-warning{
- &:after{
- border-left-color: @brand-warning;
- }
- }
- &.arrow-light{
- &:after{
- border-left-color: @brand-light;
- }
- }
- &.arrow-dark{
- &:after{
- border-left-color: @brand-dark;
- }
- }
- &.arrow-black{
- &:after{
- border-left-color: @brand-black;
- }
- }
- }
- &.bottom {
- left: 50%;
- bottom: -@arrow-outer-width;
- margin-left: -@arrow-outer-width;
- border-bottom-width: 0;
- border-top-color: @arrow-outer-color;
- &:after {
- bottom: 1px;
- margin-left: -@arrow-width;
- border-bottom-width: 0;
- border-top-color: @arrow-color;
- }
- &.arrow-primary{
- &:after{
- border-top-color: @brand-primary;
- }
- }
- &.arrow-info{
- &:after{
- border-top-color: @brand-info;
- }
- }
- &.arrow-success{
- &:after{
- border-top-color: @brand-success;
- }
- }
- &.arrow-danger{
- &:after{
- border-top-color: @brand-danger;
- }
- }
- &.arrow-warning{
- &:after{
- border-top-color: @brand-warning;
- }
- }
- &.arrow-light{
- &:after{
- border-top-color: @brand-light;
- }
- }
- &.arrow-dark{
- &:after{
- border-top-color: @brand-dark;
- }
- }
- &.arrow-black{
- &:after{
- border-top-color: @brand-black;
- }
- }
- }
- &.left {
- top: 50%;
- left: -@arrow-outer-width;
- margin-top: -@arrow-outer-width;
- border-left-width: 0;
- border-right-color: @arrow-outer-color;
- &:after {
- left: 1px;
- bottom: -@arrow-width;
- border-left-width: 0;
- border-right-color: @arrow-color;
- }
- &.arrow-primary{
- &:after{
- border-right-color: @brand-primary;
- }
- }
- &.arrow-info{
- &:after{
- border-right-color: @brand-info;
- }
- }
- &.arrow-success{
- &:after{
- border-right-color: @brand-success;
- }
- }
- &.arrow-danger{
- &:after{
- border-right-color: @brand-danger;
- }
- }
- &.arrow-warning{
- &:after{
- border-right-color: @brand-warning;
- }
- }
- &.arrow-light{
- &:after{
- border-right-color: @brand-light;
- }
- }
- &.arrow-dark{
- &:after{
- border-right-color: @brand-dark;
- }
- }
- &.arrow-black{
- &:after{
- border-right-color: @brand-black;
- }
- }
- }
- &.pull-left{
- left: @arrow-outer-width + 10;
- }
- &.pull-right{
- left: auto;
- right: @arrow-outer-width + 10;
- }
- &.pull-up{
- top: @arrow-outer-width + 10;
- }
- &.pull-down{
- top: auto;
- bottom: @arrow-outer-width + 10;
- }
- }
|