Mailspring/internal_packages/preferences/stylesheets/preferences-identity.less
Evan Morikawa 7210c80c5a fix(subscription): show Nylas Basic subscription with CTA to upgrade
Summary:
Removes references to the N1 ID expring.

Luckily, local-sync Nylas Mail Basic doesn't need the nylas ID to do
pretty much anything, which means we don't need to worry about the "trial"
status of the Nylas ID. The existing trial infrastructure will only kick
into place when someone connects an email account with the Nylas Cloud
Sync servers for the first time.

The one place we do check for the Nylas ID is in the
cloud-api/src/authentication route. Here we hit
https://billing.nylas.com/n1/user and simply expect to get back a Nylas
ID. As long as we return the existence of a Nylas ID (which should ignore
whether or not the old subscription system is "valid"), the API calls will
succeed.

This makes the "Upgrade Now" button go to
billing.nylas.com/dashboard?upgrade_to_pro=true with the auto-sign in
features enabled. This will automatically log the user into the Nylas
billing site with the upgrade_to_pro=true flag set.

There is also a new "Learn More" button which goes to
https://nylas.com/nylas-pro.

@mike, will these urls work?

Test Plan: manual

Reviewers: khamidou, mike, juan

Reviewed By: juan

Subscribers: mike

Differential Revision: https://phab.nylas.com/D3680
2017-01-14 17:40:54 -08:00

75 lines
1.7 KiB
Text

@import "ui-variables";
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
.container-identity {
width: 50%;
min-width: 530px;
margin: auto;
padding-top: @padding-base-vertical * 2;
.id-header {
color: @text-color-very-subtle;
margin-bottom: @padding-base-vertical * 2;
}
.refresh {
float: right;
color: @text-color-very-subtle;
margin-bottom: @padding-base-vertical * 2;
img { background-color: @text-color-very-subtle; }
}
.refresh.spinning img {
animation:spin 1.4s linear infinite;
}
.identity-content-box {
display: flex;
flex-direction: column;
align-items: flex-start;
color: @text-color-subtle;
border-radius: @border-radius-large;
border: 1px solid @border-color-primary;
background-color: @background-secondary;
.row {
display: flex;
align-items: center;
width: 100%;
}
.payment-row {
flex-direction: column;
align-items: flex-start;
border-top: 1px solid @border-color-primary;
padding: 20px;
padding-left: 137px;
&>div:first-child {
margin-bottom: @padding-base-vertical * 2;
}
}
.info-row {
padding: 30px;
.logo {
margin-right: 30px;
}
.identity-info {
line-height: 1.9em;
.name {
font-size: 1.2em;
}
.identity-actions {
margin-top: @padding-small-vertical + 1;
.btn {
width: 170px;
text-align: center;
margin-right: @padding-base-horizontal;
margin-bottom: @padding-base-horizontal;
}
}
}
}
}
}