RM 1.0 Location of Watch this resource

[Andy.N]

I have mostly fileless resources and I'd like to know how to remove the Watch this Resource link lower since it seems to block the title to fully span the whole line.
Ideally, it would stay to the right of the tagline.

Maybe some CSS trick.

 

[EQnoble]

you could try adding these properties to this selector and change it how you see fit...

.resourceInfo .primaryLinks.noButton {
left: 680px;
margin-top: 1px !important;
position: absolute;
}

edit:
n/m that above...it's trash

this is what you need to override to make this happen with the most minimal changes...

.resourceInfo h1 {
    margin-top: 17px;
}
 
.resourceInfo .primaryLinks.noButton {
    margin-top: 0;
}

 

[Andy.N]

you could try adding these properties to this selector and change it how you see fit...

.resourceInfo .primaryLinks.noButton {
left: 680px;
margin-top: 1px !important;
position: absolute;
}

edit:
n/m that above...it's trash

this is what you need to override to make this happen with the most minimal changes...

.resourceInfo h1 {
    margin-top: 17px;
}
 
.resourceInfo .primaryLinks.noButton {
    margin-top: 0;
}

It does not make any difference. I'm using Flexile style, btw

 

[EQnoble]

Where did you add that?

 

[Andy.N]

extra.css
live link https://www.quantnet.com/resources/ucla-financial-engineering-program.10/

 

[EQnoble]

Just on a hunch...try removing it from extra.css and adding it to the very end of the resource_view.css template like this with the !important in there

.resourceInfo h1 {
    margin-top: 17px !important;
}
 
.resourceInfo .primaryLinks.noButton {
    margin-top: 0 !important;
}

 

[Andy.N]

It works but the title and the avatar is not lining up properly like before on the RM index page as well as the individual resource page.

Must be padding somewhere?

 

[EQnoble]

I am having a hard time understanding what you want....

do these pictures describe what you want?

 

[Paul B]

I could be wrong but I believe he wants something like this:



Of course, a longer tagline will cause it to wrap.

I would be tempted to say that a template edit and associated changes may be the best option.

 

[EQnoble]

I could be wrong but I believe he wants something like this:

View attachment 44586

Of course, a longer tagline will cause it to wrap.

I would be tempted to say that a template edit and associated changes may be the best option.

Well I did the above images with css only and the reason I did it the way I did it is it allows for the title to go end to end without interfering with the watch this resource clickable when there is a long title like the first and third images I posted.

I could do the same alignment you were showing with css only as well like this...

but the whole reason I put the watch resource above it was so in the event that a title was very long it wouldn't have to move the alignment of the watch clickable or end up overlapping it nor would have to deal with the length of the tagline.

 

[Andy.N]

I am having a hard time understanding what you want....

do these pictures describe what you want?

View attachment 44578View attachment 44579View attachment 44580

My question is that how to fix the issue of the title and the avatar not align correctly. In your images, the title is a bit higher up but on my site, it was way down in middle of the avatar.

 

[EQnoble]

Try using this css and see if it places it how you like...mind that without this style installed with the RM I am limited to testing on the public side of your site so it may need tweaking.

.resourceInfo {
    padding-top: 10px !important;
}
 
.resourceInfo h1 {
    margin-top: 0 !important;
}
 
.resourceInfo .primaryLinks.noButton {
    font-size: 10px !important;
    margin-top: -13px !important;
}

 

[Andy.N]

Try using this css and see if it places it how you like...mind that without this style installed with the RM I am limited to testing on the public side of your site so it may need tweaking.

I made some minor change to the last piece of code and it seems to work really well for short/medium length title. It all works inside extra.css now (because of the !important) so it's even better.
Ultimately, it comes down to the length of the title which I have little control over.
Thanks again for your excellent support.

.resourceInfo {
    padding-top: 10px !important;
}
 
.resourceInfo h1 {
    margin-top: 0 !important;
}
 
.resourceInfo .primaryLinks.noButton {
    font-size: 11px !important;
    margin-top: -8px !important;
}

 

[EQnoble]

In case you were wondering, that is why I added the space up top...without editing templates it is the only way you can do it and have it be full length like this where I added text to the title to show how I was intending it...I also thought the added space looked good up top because it more closely matches the padding to the left of the avatar.

 

[Paul B]

Ideally, it would stay to the right of the tagline.

Have you checked the RM here lately?

 

[Andy.N]

Have you checked the RM here lately?

Thanks. All our efforts have been wasted and answered. Love it. hahaha
The new location is perfect.
Thanks Mike.

 

[Andy.N]

On another related question, I have been running RM 1.1 and recounter this issue again.
There seems to be some top padding needed for the resource avatar
https://www.quantnet.com/resources/john-hopkins-university-financial-mathematics-program.34/

 

[Paul B]

Try:

.resourceInfo .resourceImage .resourceIcon {
margin-top: 15px;
}