diff --git a/playlist/static/img/check.png b/playlist/static/img/check.png new file mode 100644 index 0000000..b184ecc Binary files /dev/null and b/playlist/static/img/check.png differ diff --git a/playlist/static/img/error.png b/playlist/static/img/error.png new file mode 100644 index 0000000..6e84307 Binary files /dev/null and b/playlist/static/img/error.png differ diff --git a/playlist/static/img/warning.png b/playlist/static/img/warning.png new file mode 100644 index 0000000..309941e Binary files /dev/null and b/playlist/static/img/warning.png differ diff --git a/playlist/static/style.css b/playlist/static/style.css index 7cccadf..f96cfcb 100644 --- a/playlist/static/style.css +++ b/playlist/static/style.css @@ -6,7 +6,7 @@ body { margin: 0; } -.window:not([role="tabpanel"]) { +#main-window { position: fixed; z-index:99; min-height: 520px; @@ -17,6 +17,53 @@ body { display: flex; flex-flow: column nowrap; justify-content: space-between; + margin: 10px; +} +@media (max-width: 600px) { + #main-window { + margin: 0; + transform: none !important; + } +} + +.hide { + display: none; +} + +.window.popup { + position: fixed; + z-index: 100; + top: calc(50% - 75px); + left: calc(50% - 150px); + min-width: 300px; +} + +.window.popup .window-body { + display: flex; + flex-flow: row nowrap; +} +.window.popup .window-body .text { + display: flex; + flex-flow: column nowrap; + justify-content: space-between; +} + +.window.popup .window-body .icon { + width: 32px; + height: 32px; + padding: 16px; + background-position: center center; + background-attachment: fixed; + background-repeat: no-repeat; + background-image: url('img/check.png'); +} + +.window.popup .window-body .icon.error { + background-image: url('img/error.png'); +} + +.window.popup .window-body .icon.warning { + background-image: url('img/warning.png'); } @media (max-width: 600px) { @@ -29,6 +76,7 @@ body { .window { flex-grow: 1; flex-shrink: 0; + max-width:calc(100% - 5px); } .window.hide { diff --git a/playlist/templates/Base.html b/playlist/templates/Base.html index 8607386..2eb6a6a 100644 --- a/playlist/templates/Base.html +++ b/playlist/templates/Base.html @@ -5,7 +5,7 @@
-
+
{% block window-title %}{% endblock %}
@@ -39,7 +39,7 @@ {% block clippy %}{% endblock %} + +{% endif %} {% endblock %}