Project

General

Profile

Actions

Bug #17271

closed

CC logo is too close to page/post content

Added by Raffi Khatchadourian over 1 year ago. Updated over 1 year ago.

Status:
Resolved
Priority name:
Normal
Assignee:
Category name:
-
Target version:
Start date:
2022-11-20
Due date:
% Done:

0%

Estimated time:
Deployment actions:

git submodule update wp-content/plugins/cac-creative-commons


Description


Files

Screenshot from 2022-11-20 10-33-40.png (50.4 KB) Screenshot from 2022-11-20 10-33-40.png Raffi Khatchadourian, 2022-11-20 10:33 AM
Actions #1

Updated by Boone Gorges over 1 year ago

  • Assignee set to Raymond Hoh

It looks like this is a result of cac-creative-commons using the 'entry-meta' class. The theme in question, academica, has a declaration `.entry-meta { padding: 0 0 20px; }`

Ray, do you have an idea about how best to address this? If cac-creative-commons was already loading a stylesheet, I would have just plopped some padding-top on the entry-meta-creative-commons element. But maybe you have a better idea.

Actions #2

Updated by Raffi Khatchadourian over 1 year ago

Boone Gorges wrote in #note-1:

It looks like this is a result of cac-creative-commons using the 'entry-meta' class. The theme in question, academica, has a declaration `.entry-meta { padding: 0 0 20px; }`

Ah, which may mean fixing this issue in academia may make it broken in other themes.

Actions #3

Updated by Raffi Khatchadourian over 1 year ago

Boone Gorges wrote in #note-1:

It looks like this is a result of cac-creative-commons using the 'entry-meta' class. The theme in question, academica, has a declaration `.entry-meta { padding: 0 0 20px; }`

Thinking about it some more, it would seem that this "bug" is the result of my theme choice. In that case, I don't think that CAC should make any changes. Instead, can't I add custom CSS to fix it on my site?

Actions #4

Updated by Boone Gorges over 1 year ago

I don't know that it's straightforwardly a bug anywhere, just a coincidence :)

Something like this should fix it on your site:

.entry-meta-creative-commons {
  padding-top: 10px;
}
Actions #5

Updated by Raymond Hoh over 1 year ago

Thinking about it some more, it would seem that this "bug" is the result of my theme choice. In that case, I don't think that CAC should make any changes. Instead, can't I add custom CSS to fix it on my site?

It's not actually due to your theme. If you remove the "Add New Link" portion from your page content, then there is spacing between the page content and the Creative Commons logo. You could also solve this by adding some custom CSS for the "Add New Link" block:

.lladdlink {
  margin-bottom: 16px;
}

I don't know that it's straightforwardly a bug anywhere, just a coincidence :)

Yeah, this :)

If cac-creative-commons was already loading a stylesheet, I would have just plopped some padding-top on the entry-meta-creative-commons element. But maybe you have a better idea.

I didn't really want to add a new stylesheet and network request just for one CSS declaration. With that being said, I can add the following inline CSS declaration with wp_add_inline_style():

.entry-meta-creative-commons {
  clear: both;
  margin-top: 1em;
}

How does that sound?

Actions #6

Updated by Boone Gorges over 1 year ago

  • Target version set to 2.0.12

How does that sound?

Yeah, that sounds good to me. Thank you sir!

Actions #7

Updated by Raffi Khatchadourian over 1 year ago

Boone Gorges wrote in #note-4:

I don't know that it's straightforwardly a bug anywhere, just a coincidence :)

Something like this should fix it on your site:

[...]

That worked. I made it 30px. Thanks!

Actions #8

Updated by Raymond Hoh over 1 year ago

  • Status changed from New to Staged for Production Release
  • Deployment actions updated (diff)

With that being said, I can add the following inline CSS declaration with wp_add_inline_style()

Added in https://github.com/cuny-academic-commons/cac/commit/34f70e226c41f8e77cf0e7084279088b57fecad0. Boone, I've added a note to the Deployment actions section of this ticket.

Actions #9

Updated by Raffi Khatchadourian over 1 year ago

Raymond Hoh wrote in #note-8:

With that being said, I can add the following inline CSS declaration with wp_add_inline_style()

Added in https://github.com/cuny-academic-commons/cac/commit/34f70e226c41f8e77cf0e7084279088b57fecad0. Boone, I've added a note to the Deployment actions section of this ticket.

When this is deployed, will the CSS changes I made now break the site?

Actions #10

Updated by Boone Gorges over 1 year ago

No, nothing should be broken, but you may want to verify that the amount of padding still suits your taste.

Actions #11

Updated by Boone Gorges over 1 year ago

  • Status changed from Staged for Production Release to Resolved
Actions #12

Updated by Raffi Khatchadourian over 1 year ago

Boone Gorges wrote in #note-10:

No, nothing should be broken, but you may want to verify that the amount of padding still suits your taste.

Great. When you deploy it (can you let me know?), I'll check it. Thanks again!

Actions #13

Updated by Boone Gorges over 1 year ago

Deployed!

Actions #14

Updated by Raffi Khatchadourian over 1 year ago

Boone Gorges wrote in #note-13:

Deployed!

Thanks. I didn't see a difference.

Actions #15

Updated by Raymond Hoh over 1 year ago

Thanks. I didn't see a difference.

If you remove your custom padding-top CSS, you should see a small gap where there wasn't one prior (granted the gap is not that big!). We could consider changing the value of the gap to margin-top: 2em instead of 1em, but I'm not sure how big the gap should be across all sites. I think 2em should be fine, but I wanted to be conservative at least for now.

As Boone mentioned though, the good thing is all site owners have access to write custom CSS, so if the gap isn't to your liking, you can increase the gap to whatever you want.

Actions #16

Updated by Raffi Khatchadourian over 1 year ago

Thanks again. I kinda like the gap right now.

Actions

Also available in: Atom PDF