Initial Commit
This commit is contained in:
@@ -0,0 +1,64 @@
|
||||
<div class="tooltipWrapper">
|
||||
<div class="tooltipContent">
|
||||
@((MarkupString)InfoText)
|
||||
</div>
|
||||
@ChildContent
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.tooltipWrapper {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.tooltipContent {
|
||||
visibility: hidden;
|
||||
position: absolute;
|
||||
width: 520px;
|
||||
max-width: 93vw;
|
||||
bottom: 100%;
|
||||
|
||||
margin-top: 60px;
|
||||
|
||||
margin-left: -60px;
|
||||
margin-bottom: 36px;
|
||||
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
padding-bottom: 20px;
|
||||
padding-top: 20px;
|
||||
white-space: break-spaces;
|
||||
z-index: 2147483647;
|
||||
|
||||
background-color: var(--info-secondary);
|
||||
border: 1px solid var(--info-secondary-border);
|
||||
border-radius: 2px;
|
||||
|
||||
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
|
||||
.tooltipWrapper:hover .tooltipContent {
|
||||
visibility: visible;
|
||||
|
||||
}
|
||||
|
||||
@@media only screen and (max-width: 1025px) {
|
||||
.tooltipContent {
|
||||
margin: auto;
|
||||
margin-bottom: 20px;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@code {
|
||||
|
||||
[Parameter] public RenderFragment ChildContent { get; set; } = default!;
|
||||
|
||||
[Parameter] public string InfoText { get; set; } = default!;
|
||||
|
||||
[Parameter] public int? Margin { get; set; }
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user