f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-29 19:52:43 +00:00
Code Wiki Activity

yay for waindows pathing

Browse Source
This commit is contained in:
Scott Tolksdorf
2016-05-06 14:29:44 -04:00
parent 8aef39a81e
commit cf8bcd2bb4
27 changed files with 0 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

129
shared/naturalcrit2/styles/tooltip.less Normal file
View File

@@ -0,0 +1,129 @@
@tooltipColor : #383838;
@arrowSize : 6px;
@arrowPosition : 18px;
[data-tooltip]{
.tooltip(attr(data-tooltip));
}
[data-tooltip-top]{
.tooltipTop(attr(data-tooltip-top));
}
[data-tooltip-bottom]{
.tooltipBottom(attr(data-tooltip-bottom));
}
[data-tooltip-left]{
.tooltipLeft(attr(data-tooltip-left));
}
[data-tooltip-right]{
.tooltipRight(attr(data-tooltip-right));
}
.tooltip(@content){
.tooltipBottom(@content);
}
.tooltipTop(@content){
.tooltipBase(@content);
&:before {
margin-bottom: -@arrowSize * 2;
border-top-color: @tooltipColor;
}
&:after{ margin-left: -18px; }
&:before, &:after {
bottom: 100%;
left: 50%; }
&:hover:after, &:hover:before, &:focus:after, &:focus:before {
.transform(translateY(-(@arrowSize + 2)));
}
}
.tooltipBottom(@content){
.tooltipBase(@content);
&:before {
margin-top: -@arrowSize * 2;
border-bottom-color: @tooltipColor;
}
&:after{ margin-left: -18px; }
&:before, &:after {
top: 100%;
left: 50%; }
&:hover:after, &:hover:before, &:focus:after, &:focus:before {
.transform(translateY(@arrowSize + 2));
}
}
.tooltipLeft(@content){
.tooltipBase(@content);
&:before {
margin-right: -@arrowSize * 2;
margin-bottom: -@arrowSize;
border-left-color: @tooltipColor;
}
&:after{ margin-bottom: -14px;}
&:before, &:after {
right: 100%;
bottom: 50%; }
&:hover:after, &:hover:before, &:focus:after, &:focus:before {
.transform(translateX(-(@arrowSize + 2)));
}
}
.tooltipRight(@content){
.tooltipBase(@content);
&:before {
margin-left: -@arrowSize * 2;
margin-bottom: -@arrowSize;
border-right-color: @tooltipColor;
}
&:after{ margin-bottom: -14px;}
&:before, &:after {
left: 100%;
bottom: 50%; }
&:hover:after, &:hover:before, &:focus:after, &:focus:before {
.transform(translateX(@arrowSize + 2));
}
}
.tooltipShow(){
}
.tooltipBase(@content){
position: relative;
&:before, &:after{
.animateAll();
position: absolute;
opacity: 0;
z-index: 1000000;
pointer-events: none;
}
//Arrow
&:before{
content: '';
background: transparent;
border: @arrowSize solid transparent;
z-index: 1000001;
}
//Box
&:after{
content: @content;
color: white;
background: @tooltipColor;
padding: 8px 10px;
font-size: 12px;
line-height: 12px;
white-space: nowrap;
visibility: hidden;
}
&:hover:before, &:hover:after {
visibility: visible;
opacity: 1;
}
}