You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@samza.apache.org by ja...@apache.org on 2018/10/21 19:23:58 UTC
samza git commit: Fix styling for LinkedIn logo;
Add support for loading logos from URLs
Repository: samza
Updated Branches:
refs/heads/master 40aa6a54c -> fd6f1ed25
Fix styling for LinkedIn logo; Add support for loading logos from URLs
The current styling for logos:
- Trims the logos by overlaying a circular foreground
- Auto-fetches images from Clearbit's logo API, which returns LinkedIn logo with pointed corners
Branding guidelines dictate that
- We don't apply any foreground
- We leave the corners in their perfectly rounded-form
To conform with them, we will
- Remove CSS settings for "background-radius"
- Add support for loading images from custom URLs other than clearbit
**Before:**
On image load:
<img width="133" alt="li-circular" src="https://user-images.githubusercontent.com/18561937/47271223-81a22f80-d52b-11e8-853b-22bd550c623a.png">
On mouse-over:
<img width="148" alt="li-rectangular" src="https://user-images.githubusercontent.com/18561937/47271222-81a22f80-d52b-11e8-8e40-0c87e7499052.png">
**After:**
<img width="161" alt="li-correct" src="https://user-images.githubusercontent.com/18561937/47271225-8830a700-d52b-11e8-97d0-d985027af436.png">
Author: Jagadish <jv...@linkedin.com>
Reviewers: Jagadish<ja...@apache.org>
Closes #750 from vjagadish1989/website-reorg22
Project: http://git-wip-us.apache.org/repos/asf/samza/repo
Commit: http://git-wip-us.apache.org/repos/asf/samza/commit/fd6f1ed2
Tree: http://git-wip-us.apache.org/repos/asf/samza/tree/fd6f1ed2
Diff: http://git-wip-us.apache.org/repos/asf/samza/diff/fd6f1ed2
Branch: refs/heads/master
Commit: fd6f1ed2539c5b055d97e078ccc9b5e9e498d4a5
Parents: 40aa6a5
Author: Jagadish <jv...@linkedin.com>
Authored: Sun Oct 21 12:22:16 2018 -0700
Committer: Jagadish <jv...@linkedin.com>
Committed: Sun Oct 21 12:22:16 2018 -0700
----------------------------------------------------------------------
docs/_case-studies/linkedin.md | 1 +
docs/_layouts/default.html | 4 ++++
docs/css/main.new.css | 4 ----
3 files changed, 5 insertions(+), 4 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/samza/blob/fd6f1ed2/docs/_case-studies/linkedin.md
----------------------------------------------------------------------
diff --git a/docs/_case-studies/linkedin.md b/docs/_case-studies/linkedin.md
index 66e4108..f4dfe6b 100644
--- a/docs/_case-studies/linkedin.md
+++ b/docs/_case-studies/linkedin.md
@@ -5,6 +5,7 @@ title: Air Traffic Controller with Samza at LinkedIn
study_domain: linkedin.com # just the domain, not the protocol
priority: 4
menu_title: LinkedIn # what shows up in the menu
+logo_url: https://upload.wikimedia.org/wikipedia/commons/c/ca/LinkedIn_logo_initials.png
excerpt_separator: <!--more-->
---
<!--
http://git-wip-us.apache.org/repos/asf/samza/blob/fd6f1ed2/docs/_layouts/default.html
----------------------------------------------------------------------
diff --git a/docs/_layouts/default.html b/docs/_layouts/default.html
index 6c7d0c8..a3fa44b 100644
--- a/docs/_layouts/default.html
+++ b/docs/_layouts/default.html
@@ -206,7 +206,11 @@
<div class="section__item">
<a class="section__item-logo" href="{{ study.url }}" title="{{ study.menu_title }}">
+ {% if study.logo_url %}
+ <div class="section__item-logo-bg" style="background-image: url('{{ study.logo_url }}');"></div>
+ {% else %}
<div class="section__item-logo-bg" style="background-image: url('https://logo.clearbit.com/{{ study.study_domain}}?size=256');"></div>
+ {% endif %}
</a>
</div>
http://git-wip-us.apache.org/repos/asf/samza/blob/fd6f1ed2/docs/css/main.new.css
----------------------------------------------------------------------
diff --git a/docs/css/main.new.css b/docs/css/main.new.css
index 468e10e..035fc7c 100644
--- a/docs/css/main.new.css
+++ b/docs/css/main.new.css
@@ -741,10 +741,6 @@ footer .side-by-side > * {
border-radius: 4px;
}
-.section__item-logo-bg {
- border-radius: 100%;
-}
-
.is-selected .section__item-logo-bg,
.section--brands .section__item:hover .section__item-logo-bg {
border-radius: 4px;