feat(ui): custom elevation for posts #158

simonsmh · 2017-01-19T11:27:20Z

Contributing rules

Fork the repo and create your branch from canary. Then be sure to put the canary branch as the target for your pull request.
Please be sure to follow the contributing guidelines

What kind of change does this PR introduce? (check one with "x")

Does this PR introduce a breaking change? (check one with "x")

Yes
No

Fix #54
Reference: cards-section
to review

ghost · 2017-01-19T11:27:24Z

Your pull request doesn't follow our guidelines. Please fix the following:

Pull request description must include a screenshot (?)
Pull request description must include verification steps (?)
Pull request title must be in imperative, present tense (e.g. "add", "fix", "change") (?)

Click here for details.

Thank you! 🙏
_{This comment was made by GitMagic – Magically enforcing your contribution guidelines.}

ghost · 2017-01-19T11:39:27Z

This pull request still violates some of our guidelines:

Pull request description must include verification steps (?)
Pull request title must be in imperative, present tense (e.g. "add", "fix", "change") (?)

Click here for details.

ghost · 2017-01-19T11:39:56Z

This pull request still violates some of our guidelines:

Pull request description must include verification steps (?)
Pull request title must have one of the following prefixes: "feat(*): ", "fix(*): ", "docs(*): ", "style(*): ", "refactor(*): ", "test(*): ", "chore(*): " (?)

Click here for details.

ghost · 2017-01-19T11:40:17Z

This pull request still violates some of our guidelines:

Pull request description must include verification steps (?)
Pull request title must be in imperative, present tense (e.g. "add", "fix", "change") (?)

Click here for details.

ghost · 2017-01-19T11:40:28Z

This pull request still violates some of our guidelines:

Pull request description must include verification steps (?)

Click here for details.

ghost · 2017-01-19T11:41:56Z

Thank you, the title and description now looks good!

simonsmh · 2017-01-19T11:43:01Z

烦透了！！

cubesky · 2017-01-19T11:43:42Z

@simonsmh 我第一次用的时候跟他奋斗了2个小时

simonsmh · 2017-01-19T12:36:52Z

done done done

cubesky · 2017-01-19T12:37:58Z

@simonsmh 恭喜，第一次遇到这个确实挺难过的

iblh

I haven't decided whether to change this elevation.
It's a preference, so at least we should add a configuration.

simonsmh · 2017-01-19T13:06:34Z

@viosey
Please read https://material.google.com/material-design/elevation-shadows.html#elevation-shadows-elevation-android

Don't.
Without a shadow, nothing indicates that the floating action button is separate from the background surfaces.

如果这算是material design，那么就应当采用card应有的形式。Google mdl的template只是个sample，项目可以自己修改，不用完全照搬啊。
此外，post有相关的elevation设置，与主页的设置不符，造成视觉不适，以及logo区域圆角矩形CSS与card CSS设置亦不相同，造成视觉冲突，此pr也一同修复。

iblh · 2017-01-19T14:17:33Z

@simonsmh 这套 scheme 叫做 paradox 的原意就是表明并非纯粹的 Material Design，而 nexus scheme 才遵守 Material Design。
如果要修改 elevation 的话需要以自定义功能的形式，不能写死。

simonsmh · 2017-01-19T14:21:18Z

好的，不过大概明天晚上才能改了
今天还得写作业（唉

simonsmh · 2017-01-20T02:48:34Z

done

iblh · 2017-01-20T08:02:08Z

呃，可能我没有说清楚，就是配置的话不要使用开关的形式，而是自定义高度，以数值为参数

simonsmh · 2017-01-20T08:10:25Z

viosey是做产品经理的么 Viosey <notifications@github.com>于2017年1月20日周五 16:02写道：

…

呃，可能我没有说清楚，就是配置的话不要使用开关的形式，而是自定义高度，以数值为参数 — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#158 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AJEkg3QTrW_kWzygHCu5FOXa8bMRncr-ks5rUGoBgaJpZM4Ln_ji> .

Halyul · 2017-01-20T08:11:32Z

分明是一只大学汪

simonsmh · 2017-01-20T11:00:06Z

是这种样子的嘛？

iblh · 2017-01-20T11:50:40Z

差不多了，我再修改一下

pidupuis · 2017-01-20T12:03:35Z

source/css/style.css

@@ -552,7 +552,7 @@ a {
    min-height: 400px;
    flex-direction: column;
    align-items: stretch;
-  border-radius: 5px;
+  border-radius: 2px;


Please fix tab (use 4 tabs)

pidupuis · 2017-01-20T12:03:48Z

layout/_partial/Isolation-post_entry.ejs

@@ -1,4 +1,4 @@
-<div class="post_entry-module mdl-card mdl-cell mdl-cell--12-col fade out">
+<div class="post_entry-module mdl-card <% if(theme.card_elevation) { %>mdl-shadow--<%= theme.card_elevation %>dp<% } %> mdl-cell mdl-cell--12-col fade out">
    <!-- Post_entry Header -->
    <% if(post.thumbnail == undefined) { %>


Please use <% if(!post.thumbnail) { %>

pidupuis · 2017-01-20T12:04:01Z

source/css/style.css

@@ -1287,7 +1287,7 @@ a {
 #scheme-Isolation .post_entry-module {
  margin-bottom: 24px;
  width: 100%;
-    border-radius: 5px;
+    border-radius: 2px;


Please fix tab (use 4 tabs)

pidupuis · 2017-01-20T12:05:20Z

source/css/style.css

@@ -1812,7 +1812,7 @@ a {

 #scheme-Isolation .material-post .mdl-card{
  width: 100%;
-  border-radius: 5px;
+  border-radius: 2px;


Please fix tab (use 4 tabs)

pidupuis · 2017-01-20T12:11:40Z

layout/_partial/Paradox-post_entry.ejs

@@ -1,4 +1,4 @@
-<div class="post_entry-module mdl-card mdl-cell mdl-cell--12-col fade out">
+<div class="post_entry-module mdl-card <% if(theme.card_elevation) { %>mdl-shadow--<%= theme.card_elevation %>dp<% } %> mdl-cell mdl-cell--12-col fade out">


I would use <% if(theme.card_elevation) { %><%= 'mdl-shadow--' + theme.card_elevation + 'dp' %><% } %> for more readability

pidupuis · 2017-01-20T12:11:58Z

layout/_partial/blog_info.ejs

@@ -1,5 +1,5 @@
 <!-- Blog info -->
-<div class="mdl-card something-else mdl-cell mdl-cell--8-col mdl-cell--4-col-desktop index-top-block">
+<div class="mdl-card <% if(theme.card_elevation) { %>mdl-shadow--<%= theme.card_elevation %>dp<% } %> something-else mdl-cell mdl-cell--8-col mdl-cell--4-col-desktop index-top-block">


I would use <% if(theme.card_elevation) { %><%= 'mdl-shadow--' + theme.card_elevation + 'dp' %><% } %> for more readability

pidupuis · 2017-01-20T12:12:10Z

layout/_partial/daily_pic.ejs

@@ -1,5 +1,5 @@
 <!-- Daily pic -->
-<div class="mdl-card daily-pic mdl-cell mdl-cell--8-col index-top-block">
+<div class="mdl-card <% if(theme.card_elevation) { %>mdl-shadow--<%= theme.card_elevation %>dp<% } %> daily-pic mdl-cell mdl-cell--8-col index-top-block">


I would use <% if(theme.card_elevation) { %><%= 'mdl-shadow--' + theme.card_elevation + 'dp' %><% } %> for more readability

pidupuis · 2017-01-20T12:12:29Z

layout/post.ejs

@@ -16,7 +16,7 @@
    <!-- Hidden Page -->
    <div class="material-post_container">
        <div class="material-post mdl-grid">
-            <div class="mdl-card mdl-shadow--4dp mdl-cell mdl-cell--12-col">
+            <div class="mdl-card <% if(theme.card_elevation) { %>mdl-shadow--<%= theme.card_elevation %>dp<% } %> mdl-cell mdl-cell--12-col">


I would use <% if(theme.card_elevation) { %><%= 'mdl-shadow--' + theme.card_elevation + 'dp' %><% } %> for more readability

simonsmh · 2017-01-20T12:40:34Z

Review please. Pierre Dupuis <notifications@github.com>于2017年1月20日周五 20:13写道：

…

***@***.**** requested changes on this pull request. ------------------------------ In source/css/style.css <#158 (review)> : > @@ -552,7 +552,7 @@ a { min-height: 400px; flex-direction: column; align-items: stretch; - border-radius: 5px; + border-radius: 2px; - Please fix tab (use 4 tabs) ------------------------------ In layout/_partial/Isolation-post_entry.ejs <#158 (review)> : > @@ -1,4 +1,4 @@ -<div class="post_entry-module mdl-card mdl-cell mdl-cell--12-col fade out"> +<div class="post_entry-module mdl-card <% if(theme.card_elevation) { %>mdl-shadow--<%= theme.card_elevation %>dp<% } %> mdl-cell mdl-cell--12-col fade out">  <% if(post.thumbnail == undefined) { %> - Please use <% if(!post.thumbnail) { %> ------------------------------ In source/css/style.css <#158 (review)> : > @@ -1287,7 +1287,7 @@ a { #scheme-Isolation .post_entry-module { margin-bottom: 24px; width: 100%; - border-radius: 5px; + border-radius: 2px; - Please fix tab (use 4 tabs) ------------------------------ In source/css/style.css <#158 (review)> : > @@ -1812,7 +1812,7 @@ a { #scheme-Isolation .material-post .mdl-card{ width: 100%; - border-radius: 5px; + border-radius: 2px; - Please fix tab (use 4 tabs) ------------------------------ In layout/_partial/Paradox-post_entry.ejs <#158 (review)> : > @@ -1,4 +1,4 @@ -<div class="post_entry-module mdl-card mdl-cell mdl-cell--12-col fade out"> +<div class="post_entry-module mdl-card <% if(theme.card_elevation) { %>mdl-shadow--<%= theme.card_elevation %>dp<% } %> mdl-cell mdl-cell--12-col fade out"> I would use <% if(theme.card_elevation) { %><%= 'mdl-shadow--' + theme.card_elevation + 'dp' %><% } %> for more readability ------------------------------ In layout/_partial/blog_info.ejs <#158 (review)> : > @@ -1,5 +1,5 @@  -<div class="mdl-card something-else mdl-cell mdl-cell--8-col mdl-cell--4-col-desktop index-top-block"> +<div class="mdl-card <% if(theme.card_elevation) { %>mdl-shadow--<%= theme.card_elevation %>dp<% } %> something-else mdl-cell mdl-cell--8-col mdl-cell--4-col-desktop index-top-block"> I would use <% if(theme.card_elevation) { %><%= 'mdl-shadow--' + theme.card_elevation + 'dp' %><% } %> for more readability ------------------------------ In layout/_partial/daily_pic.ejs <#158 (review)> : > @@ -1,5 +1,5 @@  -<div class="mdl-card daily-pic mdl-cell mdl-cell--8-col index-top-block"> +<div class="mdl-card <% if(theme.card_elevation) { %>mdl-shadow--<%= theme.card_elevation %>dp<% } %> daily-pic mdl-cell mdl-cell--8-col index-top-block"> I would use <% if(theme.card_elevation) { %><%= 'mdl-shadow--' + theme.card_elevation + 'dp' %><% } %> for more readability ------------------------------ In layout/post.ejs <#158 (review)> : > @@ -16,7 +16,7 @@  <div class="material-post_container"> <div class="material-post mdl-grid"> - <div class="mdl-card mdl-shadow--4dp mdl-cell mdl-cell--12-col"> + <div class="mdl-card <% if(theme.card_elevation) { %>mdl-shadow--<%= theme.card_elevation %>dp<% } %> mdl-cell mdl-cell--12-col"> I would use <% if(theme.card_elevation) { %><%= 'mdl-shadow--' + theme.card_elevation + 'dp' %><% } %> for more readability — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#158 (review)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AJEkg-Xdalmm0WgD-cDFEEH8kiu9JWI1ks5rUKTkgaJpZM4Ln_ji> .

pidupuis · 2017-01-20T13:29:13Z

Don't worry about gitmagic for this time, your commit message is good. It was bad config from our part sorry

simonsmh changed the title ~~fix(layout): elevation for posts #54~~ fix: layout elevation for posts #54 Jan 19, 2017

simonsmh changed the title ~~fix: layout elevation for posts #54~~ fix(layout): elevation for posts #54 Jan 19, 2017

simonsmh changed the title ~~fix(layout): elevation for posts #54~~ fix(layout): fix elevation for posts #54 Jan 19, 2017

simonsmh changed the title ~~fix(layout): fix elevation for posts #54~~ fix(layout): fix elevation for posts Jan 19, 2017

fix(layout): fix elevation for posts

b50321a

cubesky requested review from pidupuis, cubesky, iblh and neoFelhz January 19, 2017 12:39

iblh requested changes Jan 19, 2017

View reviewed changes

add a configuration and fix layout

14caa6a

cubesky approved these changes Jan 20, 2017

View reviewed changes

fix config

bbe9cf9

pidupuis requested changes Jan 20, 2017

View reviewed changes

fix

8a73c3e

pidupuis approved these changes Jan 20, 2017

View reviewed changes

Merge branch 'canary' into patch-1

4a6c517

pidupuis merged commit 339831f into iblh:canary Jan 22, 2017

cubesky mentioned this pull request Jan 23, 2017

文章卡片的海拔(elevation)可以高一点 #54

Closed

iblh changed the title ~~fix(layout): fix elevation for posts~~ feat(ui): custom elevation for posts Jan 28, 2017

iblh mentioned this pull request Jan 28, 2017

1.3.0 #183

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(ui): custom elevation for posts #158

feat(ui): custom elevation for posts #158

simonsmh commented Jan 19, 2017 •

edited by iblh

ghost commented Jan 19, 2017

ghost commented Jan 19, 2017

ghost commented Jan 19, 2017

ghost commented Jan 19, 2017

ghost commented Jan 19, 2017

ghost commented Jan 19, 2017

simonsmh commented Jan 19, 2017 •

edited

cubesky commented Jan 19, 2017

simonsmh commented Jan 19, 2017

cubesky commented Jan 19, 2017

iblh left a comment

simonsmh commented Jan 19, 2017

iblh commented Jan 19, 2017

simonsmh commented Jan 19, 2017

simonsmh commented Jan 20, 2017

iblh commented Jan 20, 2017

simonsmh commented Jan 20, 2017 via email

Halyul commented Jan 20, 2017

simonsmh commented Jan 20, 2017

iblh commented Jan 20, 2017

pidupuis Jan 20, 2017

pidupuis Jan 20, 2017

pidupuis Jan 20, 2017

pidupuis Jan 20, 2017

pidupuis Jan 20, 2017

pidupuis Jan 20, 2017

pidupuis Jan 20, 2017

pidupuis Jan 20, 2017

simonsmh commented Jan 20, 2017 via email

pidupuis commented Jan 20, 2017

		@@ -1,4 +1,4 @@
		<div class="post_entry-module mdl-card mdl-cell mdl-cell--12-col fade out">
		<div class="post_entry-module mdl-card <% if(theme.card_elevation) { %>mdl-shadow--<%= theme.card_elevation %>dp<% } %> mdl-cell mdl-cell--12-col fade out">

feat(ui): custom elevation for posts #158

feat(ui): custom elevation for posts #158

Conversation

simonsmh commented Jan 19, 2017 • edited by iblh

ghost commented Jan 19, 2017

ghost commented Jan 19, 2017

ghost commented Jan 19, 2017

ghost commented Jan 19, 2017

ghost commented Jan 19, 2017

ghost commented Jan 19, 2017

simonsmh commented Jan 19, 2017 • edited

cubesky commented Jan 19, 2017

simonsmh commented Jan 19, 2017

cubesky commented Jan 19, 2017

iblh left a comment

Choose a reason for hiding this comment

simonsmh commented Jan 19, 2017

iblh commented Jan 19, 2017

simonsmh commented Jan 19, 2017

simonsmh commented Jan 20, 2017

iblh commented Jan 20, 2017

simonsmh commented Jan 20, 2017 via email

Halyul commented Jan 20, 2017

simonsmh commented Jan 20, 2017

iblh commented Jan 20, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

simonsmh commented Jan 20, 2017 via email

pidupuis commented Jan 20, 2017

simonsmh commented Jan 19, 2017 •

edited by iblh

simonsmh commented Jan 19, 2017 •

edited