diff options
Diffstat (limited to 'web-ui/src/account_recovery/forms/forms.scss')
-rw-r--r-- | web-ui/src/account_recovery/forms/forms.scss | 76 |
1 files changed, 74 insertions, 2 deletions
diff --git a/web-ui/src/account_recovery/forms/forms.scss b/web-ui/src/account_recovery/forms/forms.scss index 1ef0e8d3..09d8f2ce 100644 --- a/web-ui/src/account_recovery/forms/forms.scss +++ b/web-ui/src/account_recovery/forms/forms.scss @@ -15,6 +15,78 @@ * along with Pixelated. If not, see <http://www.gnu.org/licenses/>. */ -.account-recovery-progress { - width: 100%; +.account-recovery-form { + display: flex; + flex-direction: column; + + img { + margin: 1em 0; + align-self: center; + } + + .user-code-form-content { + display: flex; + flex-direction: column; + align-items: center; + } + + .account-recovery-progress { + width: 100%; + } + + .admin-code-image { + height: 2.7em; + } + + .user-code-image { + height: 4em; + } + + .input-field-group { + margin-top: 0; + } +} + +.new-password { + .input-field-group:first-of-type { + margin-bottom: 0; + } +} + +@media only screen and (min-width : 500px) { + .account-recovery-form { + align-items: center; + + .account-recovery-progress, h1 { + width: 80%; + } + + .user-code-form-content { + flex-direction: row; + width: 80%; + + img { + margin: 1.6em; + } + } + } +} + +@media only screen and (min-width : 960px) { + .account-recovery-form { + .account-recovery-progress { + width: 80%; + margin-top: 0; + } + + h1 { + max-width: 80%; + width: auto; + } + + .input-field-group, .submit-button { + width: 60%; + align-self: center; + } + } } |