Skip to content

Commit 3eb77b7

Browse files
brykSebastian Florek
authored andcommitted
New look and feel for the application (#863)
* Made everything more compact * Used bottons for actions in action bar * Action bar is now unified across views
1 parent 8f15e5c commit 3eb77b7

File tree

91 files changed

+843
-1271
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

91 files changed

+843
-1271
lines changed

i18n/messages-en.xtb

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -352,4 +352,13 @@
352352
<translation id="1409526330139546496" key="MSG_DEPLOYMENT_DETAIL_REPLICAS_UNAVAILABLE_LABEL" source="/home/mirchev/go_workspace/src/github.com/kubernetes/dashboard/.tmp/serve/app-dev.js" desc="The message says that that many replicas are unavailable in the deployment (deployment details page)."><ph name="REPLICAS" /> unavailable</translation>
353353
<translation id="2887557544683001606" key="MSG_DEPLOYMENT_DETAIL_MAX_UNAVAILABLE_LABEL" source="/home/mirchev/go_workspace/src/github.com/kubernetes/dashboard/.tmp/serve/app-dev.js" desc="The message says how many replicas are allowed to be unavailable during an update in the deployment (deployment details page).">Max unavailable: <ph name="REPLICAS" /></translation>
354354
<translation id="7919923317290692250" key="MSG_DEPLOYMENT_DETAIL_MAX_SURGE_LABEL" source="/home/mirchev/go_workspace/src/github.com/kubernetes/dashboard/.tmp/serve/app-dev.js" desc="The message says that that many replicas can be created above the desired number of replicas in a deployment (deployment details page).">Max surge: <ph name="REPLICAS" /></translation>
355+
<translation id="7917748096388880672" key="MSG_YAML_EDIT_MENU_LABEL" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="Label for YAML edit menu item.">View/edit YAML</translation>
356+
<translation id="1496017275205425061" key="MSG_DEPLOY_APP_DEPLOY_ACTION" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="The text is put on the 'Deploy' button at the end of the deploy page.">Deploy</translation>
357+
<translation id="6991419513248176975" key="MSG_DEPLOY_APP_CANCEL_ACTION" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="The text is put on the 'Cancel' button at the end of the deploy page.">Cancel</translation>
358+
<translation id="5168444369924204121" key="MSG_UPLOAD_FILE_ACTION" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="The text is put on the button at the end of the YAML upload page.">Upload</translation>
359+
<translation id="480860823064912408" key="MSG_UPLOAD_FILE_ACTION_CANCEL" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="The text is put on the 'Cancel' button at the end of the YAML upload page.">Cancel</translation>
360+
<translation id="1279419546738089254" key="MSG_LIST_ACTION_BAR_DEPLOY_LABEL" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="Label for deploy app button.">Deploy app</translation>
361+
<translation id="1076978057900823839" key="MSG_LIST_ACTION_BAR_UPLOAD_YAML_LABEL" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="Label for upload YAML button.">Upload YAML</translation>
362+
<translation id="1984076222529061421" key="MSG_RC_DETAIL_ACTION_BAR_EDIT_PODS_LABEL" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="Tooltip for the 'scale' button on the action bar of a replication controller details view.">Scale</translation>
363+
<translation id="8808405168042160441" key="MSG_RC_LIST_EDIT_POD_COUNT_ACTION" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="Action 'Edit Pod Count' on the drop down menu for a single replication controller (replication controller list page).">Scale</translation>
355364
</translationbundle>

i18n/messages-ja.xtb

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -352,4 +352,13 @@
352352
<translation id="1409526330139546496" key="MSG_DEPLOYMENT_DETAIL_REPLICAS_UNAVAILABLE_LABEL" source="/home/mirchev/go_workspace/src/github.com/kubernetes/dashboard/.tmp/serve/app-dev.js" desc="The message says that that many replicas are unavailable in the deployment (deployment details page)."><ph name="REPLICAS" /> unavailable</translation>
353353
<translation id="2887557544683001606" key="MSG_DEPLOYMENT_DETAIL_MAX_UNAVAILABLE_LABEL" source="/home/mirchev/go_workspace/src/github.com/kubernetes/dashboard/.tmp/serve/app-dev.js" desc="The message says how many replicas are allowed to be unavailable during an update in the deployment (deployment details page).">Max unavailable: <ph name="REPLICAS" /></translation>
354354
<translation id="7919923317290692250" key="MSG_DEPLOYMENT_DETAIL_MAX_SURGE_LABEL" source="/home/mirchev/go_workspace/src/github.com/kubernetes/dashboard/.tmp/serve/app-dev.js" desc="The message says that that many replicas can be created above the desired number of replicas in a deployment (deployment details page).">Max surge: <ph name="REPLICAS" /></translation>
355+
<translation id="7917748096388880672" key="MSG_YAML_EDIT_MENU_LABEL" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="Label for YAML edit menu item.">View/edit YAML</translation>
356+
<translation id="1496017275205425061" key="MSG_DEPLOY_APP_DEPLOY_ACTION" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="The text is put on the 'Deploy' button at the end of the deploy page.">Deploy</translation>
357+
<translation id="6991419513248176975" key="MSG_DEPLOY_APP_CANCEL_ACTION" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="The text is put on the 'Cancel' button at the end of the deploy page.">Cancel</translation>
358+
<translation id="5168444369924204121" key="MSG_UPLOAD_FILE_ACTION" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="The text is put on the button at the end of the YAML upload page.">Upload</translation>
359+
<translation id="480860823064912408" key="MSG_UPLOAD_FILE_ACTION_CANCEL" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="The text is put on the 'Cancel' button at the end of the YAML upload page.">Cancel</translation>
360+
<translation id="1279419546738089254" key="MSG_LIST_ACTION_BAR_DEPLOY_LABEL" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="Label for deploy app button.">Deploy app</translation>
361+
<translation id="1076978057900823839" key="MSG_LIST_ACTION_BAR_UPLOAD_YAML_LABEL" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="Label for upload YAML button.">Upload YAML</translation>
362+
<translation id="1984076222529061421" key="MSG_RC_DETAIL_ACTION_BAR_EDIT_PODS_LABEL" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="Tooltip for the 'scale' button on the action bar of a replication controller details view.">Scale</translation>
363+
<translation id="8808405168042160441" key="MSG_RC_LIST_EDIT_POD_COUNT_ACTION" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="Action 'Edit Pod Count' on the drop down menu for a single replication controller (replication controller list page).">Scale</translation>
355364
</translationbundle>

src/app/frontend/chrome/chrome.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ <h2>
3636
</md-progress-circular>
3737
</div>
3838
<div ng-switch-when="false" class="kd-app-content">
39-
<div ui-view></div>
39+
<div ui-view class="md-body-1"></div>
4040
</div>
4141
</div>
4242
</md-content>

src/app/frontend/chrome/chrome.scss

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,12 @@ a {
4747
}
4848
}
4949

50+
.md-toolbar-tools {
51+
a {
52+
color: $primary;
53+
}
54+
}
55+
5056
.kd-success {
5157
color: $success-color;
5258
}

src/app/frontend/common/components/actionbar/actionbar.scss

Lines changed: 9 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
.kd-toolbar {
1818
&.kd-actionbar {
1919
background: $content-background;
20-
color: $muted;
20+
color: $foreground-1;
2121
}
2222
}
2323

@@ -33,20 +33,16 @@
3333
white-space: nowrap;
3434
}
3535

36-
md-toolbar {
37-
.md-button {
38-
&.md-raised {
39-
md-icon {
40-
&.kd-actionbar-icon-button {
41-
color: $muted;
36+
.kd-actionbar {
37+
&.kd-toolbar {
38+
button {
39+
&.md-button {
40+
color: $primary;
41+
42+
md-icon {
43+
color: $primary;
4244
}
4345
}
4446
}
4547
}
46-
47-
md-icon {
48-
&.kd-actionbar-icon-button {
49-
color: $muted;
50-
}
51-
}
5248
}

src/app/frontend/common/components/actionbar/actionbar_module.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import {actionbarComponent} from './actionbar_component';
1818
import {actionbarDeleteItemComponent} from './actionbardeleteitem_component';
1919
import {actionbarDetailButtonsComponent} from './actionbardetailbuttons_component';
2020
import {actionbarEditItemComponent} from './actionbaredititem_component';
21+
import {actionbarListButtonsComponent} from './actionbarlistbuttons_component';
2122

2223
import resourceModule from 'common/resource/resource_module';
2324

@@ -37,4 +38,5 @@ export default angular
3738
.component('kdActionbarDeleteItem', actionbarDeleteItemComponent)
3839
.component('kdActionbarEditItem', actionbarEditItemComponent)
3940
.component('kdActionbarDetailButtons', actionbarDetailButtonsComponent)
41+
.component('kdActionbarListButtons', actionbarListButtonsComponent)
4042
.service('kdBreadcrumbsService', BreadcrumbsService);

src/app/frontend/common/components/actionbar/actionbardeleteitem.html

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,10 @@
1414
limitations under the License.
1515
-->
1616

17-
<md-button class="md-icon-button" ng-click="$ctrl.remove()">
18-
<md-icon class="kd-actionbar-icon-button">delete</md-icon>
17+
<md-button ng-click="$ctrl.remove()">
18+
<md-icon>delete</md-icon>
1919
<md-tooltip md-direction="bottom">
2020
{{::$ctrl.getDeleteTooltip()}}
2121
</md-tooltip>
22+
Delete
2223
</md-button>

src/app/frontend/common/components/actionbar/actionbaredititem.html

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,8 @@
1414
limitations under the License.
1515
-->
1616

17-
<md-button ng-click="$ctrl.edit()" class="md-icon-button">
18-
<md-icon class="kd-actionbar-icon-button">edit</md-icon>
17+
<md-button ng-click="$ctrl.edit()">
18+
<md-icon>edit</md-icon>
1919
<md-tooltip md-direction="bottom">Edit {{::$ctrl.resourceKindName}}</md-tooltip>
20+
Edit
2021
</md-button>

src/app/frontend/deploymentlist/deploymentlistactionbar.html renamed to src/app/frontend/common/components/actionbar/actionbarlistbuttons.html

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,12 @@
1414
limitations under the License.
1515
-->
1616

17-
<md-button class="md-icon-button" ng-click="ctrl.redirectToDeployPage()">
17+
<md-button ng-click="$ctrl.deployApp()">
1818
<md-icon class="kd-actionbar-icon-button">add</md-icon>
19-
<md-tooltip md-direction="left">{{::ctrl.i18n.MSG_DEPLOYMENT_LIST_DEPLOY_TOOLTIP}}</md-tooltip>
19+
{{::$ctrl.i18n.MSG_LIST_ACTION_BAR_DEPLOY_LABEL}}
20+
</md-button>
21+
22+
<md-button ng-click="$ctrl.deployFile()">
23+
<md-icon class="kd-actionbar-icon-button">file_upload</md-icon>
24+
{{::$ctrl.i18n.MSG_LIST_ACTION_BAR_UPLOAD_YAML_LABEL}}
2025
</md-button>
Lines changed: 23 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,12 @@
1212
// See the License for the specific language governing permissions and
1313
// limitations under the License.
1414

15-
import {stateName as deploy} from 'deploy/deploy_state';
15+
import {deployAppStateName, deployFileStateName} from 'deploy/deploy_state';
1616

1717
/**
1818
* @final
1919
*/
20-
export default class ReplicationControllerListActionBarController {
20+
export class ActionBarController {
2121
/**
2222
* @param {!ui.router.$state} $state
2323
* @ngInject
@@ -33,10 +33,28 @@ export default class ReplicationControllerListActionBarController {
3333
/**
3434
* @export
3535
*/
36-
redirectToDeployPage() { this.state_.go(deploy); }
36+
deployApp() { this.state_.go(deployAppStateName); }
37+
38+
/**
39+
* @export
40+
*/
41+
deployFile() { this.state_.go(deployFileStateName); }
3742
}
3843

44+
/**
45+
* Contains common buttons for list pages.
46+
*
47+
* @type {!angular.Component}
48+
*/
49+
export const actionbarListButtonsComponent = {
50+
templateUrl: 'common/components/actionbar/actionbarlistbuttons.html',
51+
controller: ActionBarController,
52+
};
53+
3954
const i18n = {
40-
/** @export {string} @desc Tooltip for the '+' (deploy) button on the replication controller list page. */
41-
MSG_RC_LIST_DEPLOY_TOOLTIP: goog.getMsg('Deploy a containerized app'),
55+
/** @export {string} @desc Label for deploy app button. */
56+
MSG_LIST_ACTION_BAR_DEPLOY_LABEL: goog.getMsg('Deploy app'),
57+
58+
/** @export {string} @desc Label for upload YAML button. */
59+
MSG_LIST_ACTION_BAR_UPLOAD_YAML_LABEL: goog.getMsg('Upload YAML'),
4260
};

0 commit comments

Comments
 (0)