diff --git a/web/account/log-in-form.css b/web/account/log-in-form.css index 9b0230e25..b51ef1e34 100644 --- a/web/account/log-in-form.css +++ b/web/account/log-in-form.css @@ -1,144 +1,37 @@ div.modal-body { - padding: 6px 6px; - width: 100%; - box-sizing: border-box; - background-color: var(--modal-bg); - border-bottom-left-radius: 15px; - border-bottom-right-radius: 15px; - flex: 1; display: flex; flex-direction: column; + padding: 20px 40px; + border-radius: 16px; + background-color: var(--modal-bg); + box-shadow: 0 0 40px rgba(126, 87, 194, 0.5); } -div.resized-modal-body { - min-height: 250px; -} -div.modal-body p { - padding: 1px 3px 4px 3px; - font-size: 14px; - text-align: center; -} -div.modal-body p.form-pre-footer { - padding-top: 5px; - font-size: 12px; - font-style: italic; -} -div.modal-body textarea { - margin: 3px; -} -div.modal-body textarea { - font-size: 14px; - padding: 1px; - width: 175px; -} -div.large-modal-container div.modal-body textarea { - width: 275px; -} -div.modal-body p.confirm-account-password { - color: #777777; - margin-bottom: 4px; - color: var(--fg); -} -div.modal-body div.form-footer { - display: flex; - flex-direction: row-reverse; - justify-content: space-between; - padding-top: 8px; -} -div.modal-body div.form-footer div.modal-form-error { - font-size: 12px; - color: red; - font-style: italic; - padding-left: 6px; - align-self: center; -} -div.modal-body div.form-footer div.modal-form-error ol { - padding-left: 20px; -} -div.modal-body div.form-title { - display: inline-block; - text-align: right; - padding-right: 5px; - padding-top: 5px; - font-size: 14px; - font-weight: 600; - vertical-align: top; - width: 110px; + +div.form-title { + padding: 6px 6px 0 0; + font-size: var(--s-font-14); + font-weight: var(--bold); color: var(--fg); } -div.large-modal-container div.modal-body div.form-title { - width: 140px; -} -div.modal-body div.form-content { - display: inline-block; + +div.form-content { + margin-top: 4px; + margin-bottom: 8px; font-family: var(--font-stack); color: var(--fg); } -div.modal-body div.form-content input { - margin-bottom: 4px; -} -div.modal-body div.form-subtitle { - font-size: 12px; - padding-left: 4px; - font-style: italic; -} -div.form-text { +div.form-footer { display: flex; - align-items: baseline; -} -div.form-text > div.form-title { - vertical-align: initial; - flex-shrink: 0; -} -div.form-text > div.form-content { - margin-left: 3px; - margin-bottom: 3px; - word-break: break-word; + flex-direction: column; + margin-top: 16px; } -div.form-text > div.form-float-title { - float: left; - text-align: right; - padding-right: 5px; - font-size: 14px; - font-weight: 600; - width: 110px; -} -div.form-text > div.form-float-content { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; +div.modal-form-error { + margin-top: 16px; font-size: 14px; - padding: 1px 20px 3px 4px; - margin-top: 5px; -} - -.italic { + color: var(--error); font-style: italic; - color: var(--fg); -} - -ul.tab-panel { - background-color: var(--modal-bg); - padding-left: 10px; - padding-top: 5px; -} -ul.tab-panel > li { - display: inline-block; - list-style-type: none; - font-size: 13px; - font-weight: 600; - cursor: pointer; - padding: 3px 10px 3px 10px; -} -ul.tab-panel > li > a { - color: #555555; -} -ul.tab-panel > li.delete-tab > a { - color: #ff0000 !important; -} - -div.user-settings-current-password { - padding-top: 4px; - margin-top: 5px; + padding-left: 6px; + align-self: center; }