Fix text wrapping in modal title
This commit is contained in:
@@ -653,6 +653,7 @@ const keyboard_event = evt => {
|
|||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
padding: 4px;
|
padding: 4px;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
@media(max-height: 600px) {
|
@media(max-height: 600px) {
|
||||||
.headerbar {
|
.headerbar {
|
||||||
|
@@ -11,7 +11,8 @@ export let nobg = false
|
|||||||
class:nobg
|
class:nobg
|
||||||
target={embedded_viewer ? "_blank" : ""}
|
target={embedded_viewer ? "_blank" : ""}
|
||||||
title="Go to the pixeldrain home page">
|
title="Go to the pixeldrain home page">
|
||||||
<PixeldrainLogo style="height: 1.6em; width: 1.6em; margin: 0 4px 0 0;"></PixeldrainLogo>
|
<PixeldrainLogo style="height: 1.6em; width: 1.6em; margin: 0;"></PixeldrainLogo>
|
||||||
|
<span class="label"></span>
|
||||||
</a>
|
</a>
|
||||||
{:else}
|
{:else}
|
||||||
<a
|
<a
|
||||||
@@ -28,7 +29,10 @@ export let nobg = false
|
|||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.button_home::after {
|
.button {
|
||||||
|
flex: 0 0 content;
|
||||||
|
}
|
||||||
|
.label::after {
|
||||||
content: "pixeldrain";
|
content: "pixeldrain";
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -38,7 +42,7 @@ export let nobg = false
|
|||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 600px) {
|
@media (max-width: 600px) {
|
||||||
.button_home::after {
|
.label::after {
|
||||||
content: "pd";
|
content: "pd";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@@ -180,7 +180,7 @@ const leave_confirmation = e => {
|
|||||||
max-height: 50%;
|
max-height: 50%;
|
||||||
right: 20px;
|
right: 20px;
|
||||||
bottom: 20px;
|
bottom: 20px;
|
||||||
border-radius: 20px 20px 8px 8px;
|
border-radius: 8px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
box-shadow: 1px 1px 8px var(--shadow_color);
|
box-shadow: 1px 1px 8px var(--shadow_color);
|
||||||
}
|
}
|
||||||
|
@@ -74,10 +74,10 @@ const keydown = e => {
|
|||||||
<slot name="title">
|
<slot name="title">
|
||||||
{#if form !== ""}
|
{#if form !== ""}
|
||||||
<Button click={hide} icon="close" label="Cancel"/>
|
<Button click={hide} icon="close" label="Cancel"/>
|
||||||
<div class="title">{title}</div>
|
<span class="title">{title}</span>
|
||||||
<Button highlight type="submit" form={form} click={hide} icon="save" label="Save"/>
|
<Button highlight type="submit" form={form} click={hide} icon="save" label="Save"/>
|
||||||
{:else}
|
{:else}
|
||||||
<div class="title">{title}</div>
|
<span class="title">{title}</span>
|
||||||
<Button round click={hide} icon="close" />
|
<Button round click={hide} icon="close" />
|
||||||
{/if}
|
{/if}
|
||||||
</slot>
|
</slot>
|
||||||
@@ -133,18 +133,16 @@ these padding divs to move it 25% up */
|
|||||||
padding: 1px;
|
padding: 1px;
|
||||||
background: var(--background_color);
|
background: var(--background_color);
|
||||||
color: var(--background_text_color);
|
color: var(--background_text_color);
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
.title {
|
.title {
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
flex-shrink: 1;
|
flex-shrink: 1;
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
font-size: 1.2em;
|
font-size: 1.2em;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
.body {
|
.body {
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
|
@@ -260,7 +260,7 @@ func (s styleSheet) String() string {
|
|||||||
s.BodyBackground.CSS(),
|
s.BodyBackground.CSS(),
|
||||||
s.BodyText.CSS(),
|
s.BodyText.CSS(),
|
||||||
s.Separator.CSS(),
|
s.Separator.CSS(),
|
||||||
s.BodyColor.WithAlpha(0.6).CSS(), // shaded_background
|
s.BodyColor.WithAlpha(0.75).CSS(), // shaded_background
|
||||||
s.CardColor.CSS(),
|
s.CardColor.CSS(),
|
||||||
s.Chart1.CSS(),
|
s.Chart1.CSS(),
|
||||||
s.Chart2.CSS(),
|
s.Chart2.CSS(),
|
||||||
|
Reference in New Issue
Block a user