Skip to content

Add avatar round & opacity & animation feature#267

Merged
sli1989 merged 4 commits intotheme-next:masterfrom
sli1989:avatar-circular
May 14, 2018
Merged

Add avatar round & opacity & animation feature#267
sli1989 merged 4 commits intotheme-next:masterfrom
sli1989:avatar-circular

Conversation

@sli1989
Copy link
Collaborator

@sli1989 sli1989 commented Apr 30, 2018 •
edited
Loading

PR Checklist

Please check if your PR fulfills the following requirements:

  • The commit message follows our guidelines.
  • Tests for the changes have been added (for bug fixes / features).
    • Muse | Mist have been tested.
    • Pisces | Gemini have been tested.
  • Docs have been added / updated (for bug fixes / features).

PR Type

What kind of change does this PR introduce?

  • Bugfix.
  • Feature.
  • Code style update (formatting, local variables).
  • Refactoring (no functional changes, no api changes).
  • Build related changes.
  • CI related changes.
  • Documentation content changes.
  • Other... Please describe:

What is the current behavior?

Issue Number(s): N/A

What is the new behavior?

  1. refactor the avatar option, add the enable option of rounded, opacity and rotated.
  2. the feature is not working in mobile.
  • Screens with this changes: N/A

1
2
3
4

How to use?

In NexT _config.yml:

# Sidebar Avatar
avatar:
  # in theme directory(source/images): /images/avatar.gif
  # in site  directory(source/uploads): /uploads/avatar.gif
  # You can also use other linking images.
  url: #/images/avatar.gif
  # If true, the avatar would be dispalyed in circle. 
  rounded: false
  # The value of opacity should be choose from 0 to 1 to set the opacity of the avatar.
  opacity: 1
  # If true, the avatar would be rotated with the cursor.
  rotated: false

Does this PR introduce a breaking change?

  • Yes.
  • No.

@sli1989 sli1989 mentioned this pull request Apr 30, 2018
Closed
ivan-nginx
ivan-nginx requested changes Apr 30, 2018
View reviewed changes
_config.yml Outdated
# in site directory(source/uploads): /uploads/avatar.gif
#avatar: /images/avatar.gif
avatar:
rul:
Copy link
Member

@ivan-nginx ivan-nginx Apr 30, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Mb url?

Copy link
Collaborator Author

@sli1989 sli1989 Apr 30, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

omg... Used to remaining useful life...

Copy link
Member

@ivan-nginx ivan-nginx Apr 30, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Don't understand here. It is just mistake, right?

Copy link
Collaborator Author

@sli1989 sli1989 Apr 30, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yes, it is a mistake.

_config.yml
#avatar: /images/avatar.gif
avatar:
rul:
rounded: false
Copy link
Member

@ivan-nginx ivan-nginx Apr 30, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some comments here?

_config.yml Outdated
rounded: false
# The value of opacity should be choose from 0 to 1
opacity: 1
animated: false
Copy link
Member

@ivan-nginx ivan-nginx Apr 30, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some comments here too?

Copy link
Collaborator Author

@sli1989 sli1989 Apr 30, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ok, any else?

Copy link
Member

@ivan-nginx ivan-nginx Apr 30, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Comments on all this parameters. As for me, IDK what mean animated. Is it round on 360 with cursor in or what?

Copy link
Collaborator Author

@sli1989 sli1989 Apr 30, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just mean the rotation of the avatar with cursor.

ivan-nginx
ivan-nginx reviewed Apr 30, 2018
View reviewed changes
layout/_macro/sidebar.swig Outdated
<div class="site-author motion-element" itemprop="author" itemscope itemtype="http://schema.org/Person">
{% if theme.avatar %}
{% if theme.avatar.url %}
<a href="/" class="site-author-image" rel="start" style="border:none">
Copy link
Member

@ivan-nginx ivan-nginx Apr 30, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok, what about a href? Is it needed or mb not? And if yes, mb need to add additional option to redefine this url?

Copy link
Collaborator Author

@sli1989 sli1989 May 1, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I prefer to add the function clicking the avatar to homepage as the inherent function. Besides, i don't know how to add this in if condition. 😢

Copy link
Member

@ivan-nginx ivan-nginx May 1, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

url, path, click, href, link mb one of this can be clicking on avatar.
Also, this coption must be disable by default (empty string) and if user want, he can add any link he want.

Copy link
Collaborator Author

@sli1989 sli1989 May 1, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You mean

  • the default to homepage?
  • the custom to custom linking?

Copy link
Member

@ivan-nginx ivan-nginx May 1, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No, i mean:

  • the default for nothing (as it for now)
  • custom - is custom; if user want, he can define link

Copy link
Collaborator Author

@sli1989 sli1989 May 1, 2018 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How about this one?

  • the default for nothing, but linking to the present page. (it's seems redundancy to add enable option working seem as the master branch.)
  • user can custom the external url of avatar.

Copy link
Member

@ivan-nginx ivan-nginx May 1, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No need to use exturl option.

Copy link
Collaborator Author

@sli1989 sli1989 May 1, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

well, I delete the linking function of avatar.

@sli1989 sli1989 added this to the v6.3.0 milestone May 13, 2018
@sli1989 sli1989 merged commit bbb523a into theme-next:master May 14, 2018
@sli1989 sli1989 deleted the avatar-circular branch July 20, 2018 07:48
tongluyang pushed a commit to tongluyang/hexo-theme-next that referenced this pull request Nov 19, 2019
Add avatar round & opacity & animation feature (theme-next#267)
7808602 
* Add avatar round & opacity & animation feature

* Update grammatical meaning

* Add external url of avatar

* Delete the linking option of avatar
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@ivan-nginx ivan-nginx ivan-nginx requested changes

Assignees

No one assigned

Labels

💥 Breaking Change ⭐ Feature

Projects

None yet

Milestone

v6.3.0

Development

Successfully merging this pull request may close these issues.

2 participants

@sli1989 @ivan-nginx