f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-07 18:32:40 +00:00
Code Wiki Activity

style lint

Browse Source
This commit is contained in:
Víctor Losada Hernández
2025-03-18 19:38:58 +01:00
parent 0234de12bb
commit 163e3927b5
43 changed files with 1470 additions and 1818 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
shared/naturalcrit/styles/tooltip.less
View File

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