vertically center CLEAR ALL "button" using newly created mixin and resolve merge conflict

This commit is contained in:
kialam
2018-05-25 10:34:03 -04:00
parent a9bdac0d53
commit 376a763cc0
4 changed files with 14 additions and 6 deletions

View File

@@ -178,6 +178,10 @@
padding: 6px @at-padding-input 6px @at-padding-input; padding: 6px @at-padding-input 6px @at-padding-input;
} }
.jobz-searchClearAllContainer {
.at-mixin-VerticallyCenter();
}
.jobz-searchClearAll { .jobz-searchClearAll {
font-size: 10px; font-size: 10px;
padding-bottom: @at-space; padding-bottom: @at-space;

View File

@@ -40,9 +40,9 @@
<div class="TagComponentWrapper" ng-repeat="tag in vm.tags track by $index"> <div class="TagComponentWrapper" ng-repeat="tag in vm.tags track by $index">
<at-tag tag="tag" remove-tag="vm.removeSearchTag($index)"></at-tag> <at-tag tag="tag" remove-tag="vm.removeSearchTag($index)"></at-tag>
</div> </div>
<div><a href class="jobz-searchClearAll" ng-click="vm.clearSearch()" ng-show="!(vm.tags | isEmpty)"> <div class="jobz-searchClearAllContainer">
{{:: vm.strings.get('search.CLEAR_ALL') }} <a href class="jobz-searchClearAll" ng-click="vm.clearSearch()" ng-show="!(vm.tags | isEmpty)">{{:: vm.strings.get('search.CLEAR_ALL') }}</a>
</a></div> </div>
</div> </div>
<div class="jobz-searchKeyPaneContainer" ng-show="vm.key"> <div class="jobz-searchKeyPaneContainer" ng-show="vm.key">

View File

@@ -41,9 +41,7 @@
.TagComponent-button { .TagComponent-button {
padding: 0 @at-space; padding: 0 @at-space;
display: flex; .at-mixin-VerticallyCenter();
flex-direction: column;
justify-content: center;
} }
.TagComponent-button:hover { .TagComponent-button:hover {

View File

@@ -103,3 +103,9 @@
.at-mixin-FontFixedWidth () { .at-mixin-FontFixedWidth () {
font-family: Menlo, Monaco, Consolas, "Courier New", monospace; font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
} }
.at-mixin-VerticallyCenter () {
display: flex;
flex-direction: column;
justify-content: center;
}