From 7e477b3c8dee5c8c1b71c2a7264368d5b7218bba Mon Sep 17 00:00:00 2001
From: Bruno Windels <brunow@matrix.org>
Date: Wed, 14 Oct 2020 10:33:48 +0200
Subject: [PATCH] rename button.styled to .button-action so it can also be used
 for links

---
 src/ui/web/css/themes/element/theme.css | 21 ++++++++++++++-------
 src/ui/web/login/LoginView.js           |  4 ++--
 src/ui/web/login/SessionPickerView.js   |  4 ++--
 3 files changed, 18 insertions(+), 11 deletions(-)

diff --git a/src/ui/web/css/themes/element/theme.css b/src/ui/web/css/themes/element/theme.css
index b4a1b546..c87b1f72 100644
--- a/src/ui/web/css/themes/element/theme.css
+++ b/src/ui/web/css/themes/element/theme.css
@@ -71,7 +71,7 @@ limitations under the License.
     margin-right: 0px;
 }
 
-.button-row button {
+.button-row .button-action {
     margin: 10px 0;
     flex: 1 0 auto;
 }
@@ -92,32 +92,39 @@ limitations under the License.
     display: block;
 }
 
-button.styled.secondary {
+a.button-action {
+    text-decoration: none;
+    text-align: center;
+    display: block;
+}
+
+.button-action.secondary {
     color: #03B381;
 }
 
-button.styled.primary {
+.button-action.primary {
     background-color: #03B381;
     border-radius: 8px;
     color: white;
 }
 
-button.styled.primary.destructive {
+.button-action.primary.destructive {
     background-color: #FF4B55;
 }
 
-button.styled.secondary.destructive {
+.button-action.secondary.destructive {
     color: #FF4B55;
 }
 
-button.styled {
+.button-action {
     border: none;
     padding: 10px;
     background: none;
     font-weight: 500;
 }
 
-button.utility {
+.button-utility {
+    cursor: pointer;
     width: 32px;
     height: 32px;
     background-position: center;
diff --git a/src/ui/web/login/LoginView.js b/src/ui/web/login/LoginView.js
index d1fc8930..e03eab6b 100644
--- a/src/ui/web/login/LoginView.js
+++ b/src/ui/web/login/LoginView.js
@@ -52,11 +52,11 @@ export class LoginView extends TemplateView {
                 t.mapView(vm => vm.loadViewModel, loadViewModel => loadViewModel ? new SessionLoadStatusView(loadViewModel) : null),
                 t.div({className: "button-row"}, [
                     t.a({
-                        className: "button styled secondary",
+                        className: "button-action secondary",
                         href: vm.cancelUrl
                     }, [vm.i18n`Go Back`]),
                     t.button({
-                        className: "styled primary",
+                        className: "button-action primary",
                         onClick: () => vm.login(username.value, password.value, homeserver.value),
                         disabled
                     }, vm.i18n`Log In`),
diff --git a/src/ui/web/login/SessionPickerView.js b/src/ui/web/login/SessionPickerView.js
index 4bb9b6b7..279135ac 100644
--- a/src/ui/web/login/SessionPickerView.js
+++ b/src/ui/web/login/SessionPickerView.js
@@ -110,11 +110,11 @@ export class SessionPickerView extends TemplateView {
                 t.view(sessionList),
                 t.div({className: "button-row"}, [
                     t.button({
-                        className: "styled secondary",
+                        className: "button-action secondary",
                         onClick: async () => vm.import(await selectFileAsText("application/json"))
                     }, vm.i18n`Import a session`),
                     t.a({
-                        className: "button styled primary",
+                        className: "button-action primary",
                         href: vm.cancelUrl
                     }, vm.i18n`Sign In`)
                 ]),