Merge pull request #705 from patriceac/fix-cut-off-tooltips-display

Fix cut off tooltips display
This commit is contained in:
cmdr2 2022-12-27 10:26:46 +05:30 committed by GitHub
commit f364958c13
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 5 deletions

View File

@ -55,7 +55,7 @@
<input id="prompt_from_file" name="prompt_from_file" type="file" /> <!-- hidden --> <input id="prompt_from_file" name="prompt_from_file" type="file" /> <!-- hidden -->
<label for="negative_prompt" class="collapsible" id="negative_prompt_handle"> <label for="negative_prompt" class="collapsible" id="negative_prompt_handle">
Negative Prompt Negative Prompt
<a href="https://github.com/cmdr2/stable-diffusion-ui/wiki/Writing-prompts#negative-prompts" target="_blank"><i class="fa-solid fa-circle-question help-btn"><span class="simple-tooltip top-left">Click to learn more about Negative Prompts</span></i></a> <a href="https://github.com/cmdr2/stable-diffusion-ui/wiki/Writing-prompts#negative-prompts" target="_blank"><i class="fa-solid fa-circle-question help-btn"><span class="simple-tooltip top">Click to learn more about Negative Prompts</span></i></a>
<small>(optional)</small> <small>(optional)</small>
</label> </label>
<div class="collapsible-content"> <div class="collapsible-content">
@ -97,7 +97,7 @@
</div> </div>
<div id="editor-inputs-tags-container" class="row"> <div id="editor-inputs-tags-container" class="row">
<label>Image Modifiers <i class="fa-solid fa-circle-question help-btn"><span class="simple-tooltip top-left">click an Image Modifier to remove it, use Ctrl+Mouse Wheel to adjust its weight</span></i>:</label> <label>Image Modifiers <i class="fa-solid fa-circle-question help-btn"><span class="simple-tooltip right">click an Image Modifier to remove it, right-click to temporarily disable it, use Ctrl+Mouse Wheel to adjust its weight</span></i>:</label>
<div id="editor-inputs-tags-list"></div> <div id="editor-inputs-tags-list"></div>
</div> </div>

View File

@ -876,10 +876,11 @@ input::file-selector-button {
font-size: 12px; font-size: 12px;
background-color: var(--background-color3); background-color: var(--background-color3);
visibility: hidden; visibility: hidden;
opacity: 0; opacity: 0;
position: absolute; position: absolute;
white-space: nowrap; width: max-content;
max-width: 300px;
padding: 8px 12px; padding: 8px 12px;
transition: 0.3s all; transition: 0.3s all;
@ -895,7 +896,7 @@ input::file-selector-button {
.simple-tooltip.right { .simple-tooltip.right {
right: 0px; right: 0px;
top: 50%; top: 50%;
transform: translate(calc(100% - 15%), -50%); transform: translate(100%, -50%);
} }
:hover > .simple-tooltip.right { :hover > .simple-tooltip.right {
transform: translate(100%, -50%); transform: translate(100%, -50%);