+
diff --git a/app/assets/stylesheets/svg-dimensions.css b/app/assets/stylesheets/svg-dimensions.css
index d6aadee84..ac17073f2 100644
--- a/app/assets/stylesheets/svg-dimensions.css
+++ b/app/assets/stylesheets/svg-dimensions.css
@@ -12,13 +12,17 @@
.icon-dashboard { width: 24px; height: 24px; }
.icon-diagonal-cross { width: 13px; height: 13px; }
.icon-download { width: 14px; height: 13px; }
+.icon-email-button { width: 29px; height: 22px; }
.icon-email { width: 17px; height: 17px; }
+.icon-facebook-button { width: 29px; height: 22px; }
.icon-facebook { width: 17px; height: 17px; }
.icon-full-logo { width: 175px; height: 50px; }
+.icon-google-button { width: 29px; height: 22px; }
.icon-group { width: 24px; height: 24px; }
.icon-help { width: 16px; height: 16px; }
.icon-important { width: 16px; height: 16px; }
.icon-in-process { width: 64px; height: 64px; }
+.icon-linkedin-button { width: 29px; height: 22px; }
.icon-list { width: 16px; height: 16px; }
.icon-loading { width: 16px; height: 16px; }
.icon-lock-open { width: 16px; height: 16px; }
@@ -65,5 +69,6 @@
.icon-tools { width: 24px; height: 24px; }
.icon-total-tickets { width: 48px; height: 83px; }
.icon-trash { width: 16px; height: 16px; }
+.icon-twitter-button { width: 29px; height: 22px; }
.icon-twitter { width: 17px; height: 17px; }
.icon-user { width: 16px; height: 16px; }
\ No newline at end of file
diff --git a/app/assets/stylesheets/zammad.css.scss b/app/assets/stylesheets/zammad.css.scss
index 0f29598aa..6de936a8a 100644
--- a/app/assets/stylesheets/zammad.css.scss
+++ b/app/assets/stylesheets/zammad.css.scss
@@ -1475,7 +1475,6 @@ ol.tabs li {
height: 1px;
top: 50%;
left: 0;
- margin-top: -1px;
background: #e6e6e6;
}
@@ -1490,76 +1489,62 @@ ol.tabs li {
position: relative;
}
-.auth_provider,
-.auth_provider:hover {
- padding: 9px 10px 9px 7px;
- color: white;
+.auth-providers {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: space-between;
+ margin-bottom: -10px;
+}
+
+.auth-provider {
+ height: 40px;
+ padding: 0 10px 0 7px;
+ margin-bottom: 10px;
+ color: white !important;
line-height: 22px;
text-align: center;
border-radius: 4px;
display: flex;
+ align-items: center;
+ text-decoration: none;
+ width: calc(33.33% - 6px);
- &.auth_provider--wide {
+ &.auth-provider--wide {
padding-right: 25px;
}
-}
- .auth_providers .auth_provider:not(:last-child) {
- margin-right: 8px;
- }
-
- .auth_provider:hover {
- color: white;
- text-decoration: none;
- @extend .u-clickable;
- }
-
- .auth_provider.facebook,
- .btn.facebook:hover {
+ &.auth-provider--facebook {
background: #4f699c;
}
- .auth_provider.google,
- .btn.google:hover {
+ &.auth-provider--google {
background: #d8543c;
}
- .auth_provider.twitter,
- .btn.twitter:hover {
- background: hsl(197, 75%, 53%);
+ &.auth-provider--twitter {
+ background: #2daee1;
}
- .auth_provider.email,
- .btn.email:hover {
- background: hsl(47, 100%, 59%);
+ &.auth-provider--email {
+ background: #ffd22e;
}
- .provider_name {
+ &.auth-provider--linkedin {
+ background: #006087;
+ }
+
+ .provider-name {
flex: 1;
}
-.provider_icon {
- width: 29px;
- height: 22px;
- background: image_url("/assets/images/provider.svg") no-repeat;
+ .provider-icon {
+ width: 29px;
+ height: 22px;
+ margin-right: 10px;
+ margin-top: 1px;
+ }
}
- .facebook.provider_icon {
- background-position: 0 0;
- }
-
- .google.provider_icon {
- background-position: -30px 0;
- }
-
- .twitter.provider_icon {
- background-position: -60px 0;
- }
-
- .email.provider_icon {
- background-position: -90px 0;
- }
-
/*
global icon definitions
diff --git a/contrib/icon-sprite.sketch b/contrib/icon-sprite.sketch
index d8685df6d..2fdfc162a 100644
Binary files a/contrib/icon-sprite.sketch and b/contrib/icon-sprite.sketch differ
diff --git a/public/assets/images/icons.svg b/public/assets/images/icons.svg
index 6f86c9eda..bd758ac23 100644
--- a/public/assets/images/icons.svg
+++ b/public/assets/images/icons.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/public/assets/images/icons/email-button.svg b/public/assets/images/icons/email-button.svg
new file mode 100644
index 000000000..358db1fce
--- /dev/null
+++ b/public/assets/images/icons/email-button.svg
@@ -0,0 +1,12 @@
+
+
\ No newline at end of file
diff --git a/public/assets/images/icons/facebook-button.svg b/public/assets/images/icons/facebook-button.svg
new file mode 100644
index 000000000..e569e43e1
--- /dev/null
+++ b/public/assets/images/icons/facebook-button.svg
@@ -0,0 +1,18 @@
+
+
\ No newline at end of file
diff --git a/public/assets/images/icons/google-button.svg b/public/assets/images/icons/google-button.svg
new file mode 100644
index 000000000..0f01a9d0d
--- /dev/null
+++ b/public/assets/images/icons/google-button.svg
@@ -0,0 +1,18 @@
+
+
\ No newline at end of file
diff --git a/public/assets/images/icons/linkedin-button.svg b/public/assets/images/icons/linkedin-button.svg
new file mode 100644
index 000000000..b4fb08076
--- /dev/null
+++ b/public/assets/images/icons/linkedin-button.svg
@@ -0,0 +1,12 @@
+
+
\ No newline at end of file
diff --git a/public/assets/images/icons/twitter-button.svg b/public/assets/images/icons/twitter-button.svg
new file mode 100644
index 000000000..895ba4bae
--- /dev/null
+++ b/public/assets/images/icons/twitter-button.svg
@@ -0,0 +1,17 @@
+
+
\ No newline at end of file
diff --git a/public/assets/images/provider.svg b/public/assets/images/provider.svg
deleted file mode 100644
index 3e3bd0313..000000000
--- a/public/assets/images/provider.svg
+++ /dev/null
@@ -1,31 +0,0 @@
-
-
\ No newline at end of file