revert merge error

shubhsherl · Feb 24, 2020 · c3f86e1 · c3f86e1
1 parent cbd3ee6
commit c3f86e1
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 1 deletion.
diff --git a/app/theme/client/imports/forms/button.css b/app/theme/client/imports/forms/button.css
@@ -119,6 +119,11 @@
 		border: 0;
 		border-color: var(--button-cancel-color);
 		background-color: var(--button-cancel-color);
+
+		.rc-button-icon {
+			display: none;
+			visibility: hidden;
+		}
 	}
 
 	&--cancel.rc-button--outline {
@@ -222,4 +227,18 @@
 	.rc-button--full {
 		width: 100%;
 	}
+
+	.rc-button--cancel {
+		padding: 0 1rem;
+
+		.rc-button-icon {
+			display: block;
+			visibility: visible;
+		}
+
+		.rc-button-text {
+			display: none;
+			visibility: hidden;
+		}
+	}
 }
diff --git a/app/ui-account/client/accountPreferences.html b/app/ui-account/client/accountPreferences.html
@@ -48,7 +48,12 @@ <h1>{{_ "Privacy"}}</h1>
 									{{/each}}
 								</select>
 							</div>
-							<button class="rc-button rc-button--cancel setting-action js-dont-ask-remove">{{_ "Remove"}}</button>
+							<button text="{{_ 'Remove'}}" class="rc-button rc-button--cancel setting-action js-dont-ask-remove">
+								<!-- will be displayed only if width < 780px -->
+								<i class="rc-button-icon icon-ccw color-error-contrast"></i>
+								<!-- will be displayed if width >= 780px -->
+								<div class="rc-button-text">{{_ "Remove"}}</div>
+							</button>
 						</div>
 					</div>
 				</div>