Minor CSS fixes
This commit is contained in:
parent
ea49e6c93b
commit
557cf4ca34
20
app.py
20
app.py
@ -136,6 +136,8 @@ HTML_FORM = '''
|
||||
}
|
||||
|
||||
.preview-card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: #23282d;
|
||||
padding: 2em 1.4em 1em 1.4em;
|
||||
border-radius: 1.5em;
|
||||
@ -145,6 +147,7 @@ HTML_FORM = '''
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
margin-left: 0;
|
||||
align-items: center;
|
||||
}
|
||||
img {
|
||||
margin-top: 1em;
|
||||
@ -200,10 +203,10 @@ HTML_FORM = '''
|
||||
|
||||
.print-frame {
|
||||
position: relative;
|
||||
background: #fff;
|
||||
padding: 10px 15px;
|
||||
padding: 10px 0 10px 0;
|
||||
margin-top: 1em;
|
||||
overflow: hidden;
|
||||
max-width: 384px;
|
||||
}
|
||||
|
||||
.print-frame::before,
|
||||
@ -211,28 +214,29 @@ HTML_FORM = '''
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 101%;
|
||||
width: 100%;
|
||||
height: 10px;
|
||||
background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDQuMjMzMyA0LjIzMzMiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiIHN0cm9rZS1vcGFjaXR5PSIuOTc2NDciPgo8cmVjdCB4PSItNS41NTExZS0xNyIgd2lkdGg9IjQuMjMzMyIgaGVpZ2h0PSI0LjIzMzMiIGZpbGw9IiMyMjI4MmMiIHN0cm9rZS13aWR0aD0iLjE5MjI2Ii8+CjxwYXRoIHRyYW5zZm9ybT0ibWF0cml4KC4wMzYxMzUgMCAwIC4wNDE3MjUgMS4xNTY4IDEuMTI4OSkiIGQ9Im04NS4xNDEgNzQuNDAzLTExNy4xNS0xZS02IDU4LjU3Ny0xMDEuNDZ6IiBmaWxsPSIjZmZmIiBzdHJva2Utd2lkdGg9Ii4yNjQ1OCIvPgo8L2c+Cjwvc3ZnPgo=') repeat-x left;
|
||||
background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDQuMjMzMyA0LjIzMzMiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIHRyYW5zZm9ybT0ibWF0cml4KC4wMzYxMzUgMCAwIC4wNDE3MjUgMS4xNTY4IDEuMTI4OSkiIGQ9Im04NS4xNDEgNzQuNDAzLTExNy4xNS0xZS02IDU4LjU3Ny0xMDEuNDZ6IiBmaWxsPSIjZmZmIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIiBzdHJva2Utb3BhY2l0eT0iLjk3NjQ3IiBzdHJva2Utd2lkdGg9Ii4yNjQ1OCIvPgo8L3N2Zz4K') repeat-x left;
|
||||
background-size: 10px 384px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.print-frame::before {
|
||||
top: 0;
|
||||
top: 1px;
|
||||
}
|
||||
|
||||
.print-frame::after {
|
||||
bottom: 0;
|
||||
bottom: 1px;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.print-frame img {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
position: relative;
|
||||
width: 100%
|
||||
max-width: 384px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
@ -314,7 +318,7 @@ HTML_FORM = '''
|
||||
</div>
|
||||
<div class="preview-card">
|
||||
{% if img %}
|
||||
<h3 style="margin-top:0.1em;margin-bottom:0.6em;">Vista previa</h3>
|
||||
<h2 style="margin-top:0.1em; margin-bottom:0;">Vista previa</h2>
|
||||
<div class="print-frame">
|
||||
<img src="data:image/png;base64,{{ img }}">
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user