diff --git a/pytorrent/static/styles.css b/pytorrent/static/styles.css index 5924199..1c2ec05 100644 --- a/pytorrent/static/styles.css +++ b/pytorrent/static/styles.css @@ -4181,13 +4181,44 @@ body, /* Operation logs */ .operation-log-toolbar, -.operation-log-settings-grid { +.operation-log-toolbar-main, +.operation-log-settings-grid, +.operation-log-view-settings { display: flex; flex-wrap: wrap; gap: .5rem; align-items: end; } +.operation-log-toolbar { + justify-content: space-between; +} + +.operation-log-toolbar-main { + flex: 1 1 auto; +} + +.operation-log-toolbar-toggle { + flex: 0 0 auto; + margin-left: auto; +} + +.operation-log-view-settings { + align-items: center; + border-top: 1px solid var(--bs-border-color); + margin-top: 1rem; + padding-top: 1rem; +} + +.operation-log-view-settings > div:first-child { + flex: 1 1 220px; +} + +.operation-log-view-settings small { + color: var(--bs-secondary-color); + display: block; +} + .operation-log-type-filter { max-width: 180px; } @@ -4257,8 +4288,20 @@ body, width: 100%; } - .operation-log-toolbar > .btn, - .operation-log-settings-actions > .btn { + .operation-log-toolbar, + .operation-log-toolbar-main, + .operation-log-view-settings { + align-items: stretch; + flex-direction: column; + } + + .operation-log-toolbar-toggle { + margin-left: 0; + } + + .operation-log-toolbar-main > .btn, + .operation-log-settings-actions > .btn, + .operation-log-view-settings > .btn { width: 100%; } } diff --git a/pytorrent/templates/index.html b/pytorrent/templates/index.html index 4350a2e..7b95c1d 100644 --- a/pytorrent/templates/index.html +++ b/pytorrent/templates/index.html @@ -264,7 +264,7 @@