diff --git a/docs/prod-install.md b/docs/prod-install.md index c905f0f30f..bc597adfa0 100644 --- a/docs/prod-install.md +++ b/docs/prod-install.md @@ -141,12 +141,16 @@ administrator for your new Zulip organization. After getting oriented, we recommend visiting the special "Administration" tab linked to from the upper-right gear menu in the Zulip app to configure important policy settings like how users can join your new -organization. By default, your organization will be configured as -follows ([screenshot here](_images/zulip-admin-settings.png)): +organization. By default, your organization will be configured as +follows depending on what type of organization you selected: -* `restricted_to_domain=True`: Only people with emails with the same ending as yours can join. -* `invite_required=False`: An invitation is not required to join the realm. -* `invite_by_admin_only=False`: You don't need to be an admin user to invite other users. +Community Organization: +* `restricted_to_domain=False`: No restriction on user email addresses. +* `invite_required=True`: A user must be invited to join. + +Corporate Organization: +* `restricted_to_domain=True`: New users must have an email address in the same domain (e.g. @acme.com) as yours. +* `invite_required=False`: No invitation is required to join. Next, you'll likely want to do one of the following: diff --git a/frontend_tests/casper_tests/00-realm-creation.js b/frontend_tests/casper_tests/00-realm-creation.js index 2c23bcba20..3cfa805339 100644 --- a/frontend_tests/casper_tests/00-realm-creation.js +++ b/frontend_tests/casper_tests/00-realm-creation.js @@ -47,9 +47,11 @@ casper.then(function () { this.test.assertSelectorContains('.pitch', "You're almost there."); }); - this.test.assertEvalEquals(function () { - return $('.controls.fakecontrol input[type=text]').attr('placeholder'); - }, email); + this.waitForSelector('#id_email', function () { + this.test.assertEvalEquals(function () { + return $('#id_email').attr('placeholder'); + }, email); + }); this.waitForSelector('label[for=id_team_name]', function () { this.test.assertSelectorHasText('label[for=id_team_name]', 'Organization name'); @@ -87,9 +89,12 @@ casper.then(function () { this.test.assertSelectorHasText('.app-main.portico-page-container', "You're the first one here!"); }); - this.waitForSelector('.invite_row', function () { - this.test.assertSelectorHasText('.invite_row', domain); - }); + // Getting rid of the invite page in the onboarding flow, so getting rid + // of this currently failing test. The test is implicitly expecting a + // realm created with restricted_to_domain=True, but we changed the + // default when introducting org_type + // this.waitForSelector('.invite_row', function () { + // this.test.assertSelectorHasText('.invite_row', domain); }); this.waitForSelector('#submit_invitation', function () { this.click('#submit_invitation'); diff --git a/static/styles/portico.css b/static/styles/portico.css index 67d36aa592..81a9b72ac4 100644 --- a/static/styles/portico.css +++ b/static/styles/portico.css @@ -79,6 +79,36 @@ li { font-style: italic; } +.help-box { + width: 500px; + + padding: 10px; + margin: 10px 0px; + + font-size: 0.9rem; + font-weight: 500; + line-height: 1.2; + + color: #444; + + border-width: order: 1px solid #CCC; + border-radius: 4px; + background-color: #FAFAFA; +} + +.display-none { + display: none; +} + +.help-box .blob { + margin-top: 0px; +} + +.help-inline { + font-weight: 500; + font-size: 0.9rem; +} + #company-email { display: none; } @@ -904,6 +934,10 @@ a.bottom-signup-button { width: auto; } +.input-group.margin { + margin: 10px 0px; +} + .password-reset .input-group { margin: 15px 0px; } @@ -936,7 +970,7 @@ a.bottom-signup-button { .center-container { height: calc(100vh - 94px); - min-height: 500px; + min-height: 700px; display: flex; align-items: center; -wekbit-box-align: center; @@ -1148,3 +1182,101 @@ a.bottom-signup-button { width: 25px; vertical-align: text-bottom; } + +/* --- new settings styling --- */ +.input-group input[type=radio], +.input-group input[type=checkbox] { + margin: 0 10px 0 0; +} + +.input-group input[type=radio] { + position: relative; + top: 8px; +} + +.input-group label { + padding: 5px 0px; +} + +.input-group label { + margin: 0; + padding: 5px 0px; +} + +.m-v-20 { + margin: 20px 0px; +} + +.input-group.radio { + margin-left: 25px; +} + +.input-group.grid label.inline-block { + width: 200px; +} + +.input-group.grid { + padding: 10px 0px; + border-bottom: 1px solid #DDD; +} + +label.label-title { + font-weight: 600; +} + +.input-group label.inline-block { + /* eyeballing off-centered aesth. */ + margin-top: 1px; +} + +.display-none { + display: none; +} + +.inline-block { + display: inline-block; + vertical-align: top; +} + +.button-new { + padding: 8px 15px; + margin: 0; + min-width: 130px; + + font-weight: 400; + + background-color: #478fca; + color: #FFF; + outline: none; + border: none; + border-radius: 2px; + + cursor: pointer; + transition: all 0.3s ease; +} + +/* -- button states -- */ +.button-new:hover { + -webkit-filter: brightness(1.1); + -moz-filter: brightness(1.1); + filter: brightness(1.1); +} + +.button-new:active { + -webkit-filter: brightness(0.9); + -moz-filter: brightness(0.9); + filter: brightness(0.9); +} + +.button-new.sea-green { + background-color: #24cac2; + color: #fff; +} + +.float-left { + float: left; +} + +.float-right { + float: right; +} diff --git a/templates/zerver/register.html b/templates/zerver/register.html index f31dd02fd0..b0db6fe492 100644 --- a/templates/zerver/register.html +++ b/templates/zerver/register.html @@ -19,52 +19,46 @@ Form is validated both client-side using jquery-validate (see signup.js) and ser
           We just need you to do one last thing.
-          
-          Tell us a bit about yourself.