diff --git a/static/css/core-ui.css b/static/css/core-ui.css index 40c3239af..28e0b8fb9 100644 --- a/static/css/core-ui.css +++ b/static/css/core-ui.css @@ -866,6 +866,14 @@ a:focus { margin-right: 6px; } +.co-dialog .co-single-field-dialog { + padding: 10px; +} + +.co-dialog .co-single-field-dialog input { + margin-top: 10px; +} + .co-step-bar .co-step-element { cursor: default; display: inline-block; @@ -1370,3 +1378,46 @@ a:focus { float: none; } } + +.co-list-table tr td:first-child { + font-weight: bold; + padding-right: 10px; + vertical-align: top; + width: 120px; + padding-left: 0px; +} + +.co-list-table tr td { + padding: 10px; + font-size: 15px; +} + +.co-list-table .help-text { + margin-top: 6px; + font-size: 14px; + color: #aaa; +} + +.co-modify-link:after { + font-family: FontAwesome; + content: "\f054"; + color: #ccc; + vertical-align: middle; + display: inline-block; + margin-left: 10px; + font-size: 10px; + line-height: 16px; +} + +.co-option-table tr td:first-child { + padding-left: 16px; + padding-right: 16px; + padding-top: 0px; + vertical-align: top; +} + +.co-option-table tr td:last-child { + padding-bottom: 10px; +} + + diff --git a/static/css/directives/ui/billing-management-panel.css b/static/css/directives/ui/billing-management-panel.css new file mode 100644 index 000000000..8a4623136 --- /dev/null +++ b/static/css/directives/ui/billing-management-panel.css @@ -0,0 +1,32 @@ +.billing-management-panel-element .credit-card-image { + width: 33px; + margin-right: 10px; +} + +.billing-management-panel-element .credit-card-number { + display: inline-block; + font-size: 16px; + margin-right: 10px; +} + +.billing-management-panel-element .receipt-form { + padding-top: 20px; + padding-bottom: 12px; +} + +.billing-management-panel-element .sub-usage { + margin-bottom: 10px; + font-size: 16px; +} + +.billing-management-panel-element .sub-usage .fa { + margin-right: 4px; +} + +.billing-management-panel-element .sub-usage .red { + color: #D64456; +} + +.billing-management-panel-element .sub-usage .yellow { + color: #FCA657; +} \ No newline at end of file diff --git a/static/css/directives/ui/billing-options.css b/static/css/directives/ui/billing-options.css deleted file mode 100644 index 3e0f4ee06..000000000 --- a/static/css/directives/ui/billing-options.css +++ /dev/null @@ -1,15 +0,0 @@ -.billing-options .settings-option { - padding: 4px; - font-size: 18px; - margin-bottom: 10px; -} - -.billing-options .settings-option label { - margin-left: 6px; -} - -.billing-options .settings-option .settings-description { - font-size: 16px; - color: #888; - padding-left: 26px; -} \ No newline at end of file diff --git a/static/css/directives/ui/convert-user-to-org.css b/static/css/directives/ui/convert-user-to-org.css index eefa6c44a..00e508acb 100644 --- a/static/css/directives/ui/convert-user-to-org.css +++ b/static/css/directives/ui/convert-user-to-org.css @@ -2,6 +2,10 @@ padding: 10px; } +.convert-user-to-org .convert-form { + padding: 20px; +} + .convert-user-to-org .convert-form h3 { margin-bottom: 20px; } @@ -66,4 +70,8 @@ .convert-user-to-org .form-group-content .co-table { margin: 0px; +} + +.convert-user-to-org .co-option-table { + margin-top: 12px; } \ No newline at end of file diff --git a/static/css/pages/billing.css b/static/css/pages/billing.css new file mode 100644 index 000000000..c9ca7379f --- /dev/null +++ b/static/css/pages/billing.css @@ -0,0 +1,3 @@ +.billing-page .co-main-content-panel { + padding: 40px; +} \ No newline at end of file diff --git a/static/css/pages/org-view.css b/static/css/pages/org-view.css index f922343c1..1ae82352b 100644 --- a/static/css/pages/org-view.css +++ b/static/css/pages/org-view.css @@ -6,4 +6,9 @@ .org-view h3 { margin-bottom: 20px; margin-top: 0px; -} \ No newline at end of file +} + +.org-view .settings-section { + margin-bottom: 50px; +} + diff --git a/static/css/pages/user-view.css b/static/css/pages/user-view.css index 32892d6ba..d98968491 100644 --- a/static/css/pages/user-view.css +++ b/static/css/pages/user-view.css @@ -8,27 +8,15 @@ } .user-view h3 { - margin-bottom: 20px; margin-top: 0px; } .user-view .section-description-header { - padding-left: 40px; position: relative; margin-bottom: 20px; min-height: 50px; } -.user-view .section-description-header:before { - font-family: FontAwesome; - content: "\f05a"; - position: absolute; - top: -4px; - left: 6px; - font-size: 27px; - color: #888; -} - .user-view .user-settings-form .row { padding: 10px; margin: 0px; @@ -53,3 +41,6 @@ box-shadow: none; } +.user-view .settings-section { + margin-bottom: 50px; +} diff --git a/static/css/quay.css b/static/css/quay.css index ffd627e63..f2095b9e7 100644 --- a/static/css/quay.css +++ b/static/css/quay.css @@ -449,48 +449,6 @@ i.toggle-icon:hover { visibility: hidden; } - -.billing-options-element .current-card { - font-size: 16px; - margin-bottom: 20px; -} - - -.billing-options-element .current-card .no-card-outline { - display: inline-block; - width: 73px; - height: 44px; - vertical-align: middle; - margin-right: 10px; - border: 1px dashed #aaa; - border-radius: 4px; -} - -.billing-options-element .current-card .last4 { - color: #aaa; -} - -.billing-options-element .current-card .last4 b { - color: black; -} - -.billing-options-element .current-card .expires:before { - content: "Expires:"; - color: #aaa; - font-size: 12px; -} - - -.billing-options-element .current-card .expires { - margin-left: 20px; - font-size: 12px; -} - -.billing-options-element .current-card img { - margin-right: 10px; - vertical-align: middle; -} - .organization-header-element { padding: 20px; margin-bottom: 20px; @@ -4077,24 +4035,12 @@ i.rocket-icon { } .section-description-header { - padding-left: 40px; position: relative; - margin-bottom: 20px; + margin-bottom: 10px; min-height: 50px; - border-bottom: 1px solid #eee; padding-bottom: 10px; } -.section-description-header:before { - font-family: FontAwesome; - content: "\f05a"; - position: absolute; - top: -4px; - left: 6px; - font-size: 27px; - color: #888; -} - .nvtooltip h3 { margin: 0; padding: 4px 14px; diff --git a/static/directives/billing-management-panel.html b/static/directives/billing-management-panel.html new file mode 100644 index 000000000..3049d8d4d --- /dev/null +++ b/static/directives/billing-management-panel.html @@ -0,0 +1,80 @@ +
+
+
+ + + + + + + + + + + + + + + + + +
Current Plan: +
+ {{ subscription.usedPrivateRepos }} private repositories exceeds the amount allowed by your plan. Upgrade your plan to avoid service disruptions. +
+ +
+ {{ subscription.usedPrivateRepos }} private repositories is the maximum allowed by your plan. Upgrade your plan to create more private repositories. +
+ + {{ currentPlan.privateRepos }} private repositories +
Up to {{ currentPlan.privateRepos }} private repositories, unlimited public repositories
+
Credit Card: + + + ••••  + ••••  + ••••  + {{ currentCard.last4 }} + + Change card +
Expires {{ currentCard.exp_month }}/{{ currentCard.exp_year }}
+
Invoices: + View Invoices +
Receipts: + Do not email after successful charges + Email receipts to {{ invoice_email_address }} +
+
+ + +
+
+ + + + + + + + + +
+ +
Log into your account to view invoices
+
+ +
+ After every successful charge send an email to: +
+
+
+
+
+ +
\ No newline at end of file diff --git a/static/directives/billing-options.html b/static/directives/billing-options.html deleted file mode 100644 index 8eb1eb42f..000000000 --- a/static/directives/billing-options.html +++ /dev/null @@ -1,65 +0,0 @@ -
- -
-
- Credit Card -
-
-
-
-
- Your current credit card is expiring soon! -
- - - - - ****-****-****-{{ currentCard.last4 }} - - {{ currentCard.exp_month }} / {{ currentCard.exp_year }} - - - No credit card found -
- - -
-
- - -
-
- Billing Receipts -
-
-
-
- - -
- If checked, a receipt email will be sent to {{ obj.invoice_email_address || obj.email }} on every successful charge -
-
-
-
- - - -
diff --git a/static/directives/convert-user-to-org.html b/static/directives/convert-user-to-org.html index 774260822..7e507311e 100644 --- a/static/directives/convert-user-to-org.html +++ b/static/directives/convert-user-to-org.html @@ -1,112 +1,108 @@
- -
-
- Cannot convert this account into an organization, as it is a member of {{user.organizations.length}} other - organization{{user.organizations.length > 1 ? 's' : ''}}. -

- Please leave the following organizations first: - -
+
+ + + +
+
+ Please enter a new email address. + +
+
diff --git a/static/partials/user-view.html b/static/partials/user-view.html index 74c674e91..ba6fff05a 100644 --- a/static/partials/user-view.html +++ b/static/partials/user-view.html @@ -28,24 +28,16 @@ - - - - - - - - - - + - - + + + + + @@ -60,149 +52,129 @@
- + +
+
+
+ +
-
-
- - -
+
+
+
- -
-

Plan Usage and Billing

-
-
-
-
- - -
-

Billing Invoices

-
-
-
-

User Settings

- - -
-
E-mail Address
-
- -
- An e-mail has been sent to {{ sentEmail }} to verify the change. -
- -
-
- -
+ +
+

Docker CLI Password

+
+ The Docker CLI stores passwords entered on the command line in plaintext. It is therefore highly recommended to generate an an encrypted version of your password to use for docker login.
-
- -
-
Password
-
-
- - -
-
-
Generate Encrypted Password
- -
-
- Due to Docker storing passwords entered on the command line in plaintext, it is highly recommended to use the button below to generate an an encrypted version of your password. -
- -
- This installation is set to require encrypted passwords when - using the Docker command line interface. To generate an encrypted password, click the button below. -
- - -
-
-
- - -
-
-
Change Password
- - - Password changed successfully - - -
-
Note: Changing your password will also invalidate any generated encrypted passwords.
- - -
- - - -
-
-
-
+
+ This installation is set to require encrypted passwords when + using the Docker command line interface.
-
- -
-
Convert to organization
-
-
-
+ + + + + +
CLI Password: + Generate Encrypted Password +
-
-
+ +
+

User Settings

+ + + + + + + + + + + + + + + + + + + + + +
Username: + {{ context.viewuser.username }} +
Usernames cannot currently be changed. Please contact support to migrate accounts.
+
Avatar: + +
Avatar is generated based off of your username.
+
Avatar is served by Gravatar based on the {{ context.viewuser.email }} e-mail address.
+
Email Address: + {{ context.viewuser.email }} +
Password: + Change password +
Account Type: + Individual account +
+
+ + +
+

Billing Information

+
+
+ +
+ +
+
+ Please enter a new email address. A verification email will be sent before being applied. + +
+
+ + +
+
+ Enter a new password. Passwords must be at least 8 characters in length. + + +
+
+ + +
+ -