[OJS 3.3] Article sidebar and Logo

Software Support
,
1

Greetings,

I wanted to have the article sidebar on the left similar to this image.
I tried to add some CSS rules to make this change and was successful for a certain extent.
I don’t know how to remove these lines and a still have some problems with the screen width.
Is there a better way to do this?

css1

@media (min-width: 992px){
    .obj_article_details .main_entry {
        width: 352px;
    }
}

@media (min-width: 751px){
    
    .obj_article_details .main_entry {
        float: right;
        width: 60%;
        border-right: 1px solid #ddd;
    }

    .obj_article_details .entry_details {
        float: left;
        width: 30%;
        margin: 0 0 0 -1px;
        border-top: none;
        border-left: 1px solid #ddd;
    }
    
    .obj_article_details .entry_details {
        width: 240px;
        margin-left: 30px;
    }
}

On another note, I have this banner with the dimension 6000x908 px my target is to fully occupy the header but with a screen 991px wide and lower the image goes out of the header, is there a way to restrict this with CSS or is it a problem with the dimensions?

banner
banner2

Best regards,
José Nobre

2

Hi everyone,

I’ve been able to solve my problem with the article through trial and error and the image to some degree.
If anyone can help me with the image problem it would be greatly appreciated.

Best regards,
José Nobre

3

Hi @josenobre,

Are you looking to make logo larger on large screens and keep mobile as is? If your logos isn’t full-width, you could give this a try.

/* rule for bigger screens */
@media (min-width:768px) {
.navbar-logo {
max-width:100%!important;
}

I hope that this suggestion is helpful, but please let me know if you have any additional questions.

Kind Regards,
Patricia

4

Hi @pmangahis

Thank you for your response. I’ve added the code but i didn’t see any change.
This is the link for the page.
I was able to make the logo fit the header but if i want to center the logo i wasn’t able to do it through the margin but through padding.
Is it possible to have two logos? One for lager screens and another for mobile?

Best regards,
José Nobre

6

Hi @josenobre,

I don’t believe it is possible to have two logos.

@israel.cefrin - I wonder if you could confirm if this would be possible.

Kind Regards,
Patricia
Public Knowledge Project Team

7

Hi @josenobre
Unfortunately, there is not a theme in OJS that support 2 logos. It is possible to extend a child theme to do that. However, you will need to customize both theme and the backend to allow you to upload a second image for logo.
It will impact any future upgrade, once you will need to keep porting the dashboard customization to work in coming versions.

Best.
Israel

1 Like