Question

Responsive Footer - CSS

  • 8 May 2023
  • 4 replies
  • 100 views

Userlevel 1

I am trying to edit our CSS to allow the footer to be clickable and send folks to a job aid housed in our company’s Share Point. I have no clue about coding, and the person who initially set it up is no longer with our company. How do I add in something to ensure the footer is clickable and takes the user to the job aid on our website?

 

Additionally, I am trying to figure out why the course tiles cover the footer in the catalogs. They scroll right over them and I’m not sure why and would like to fix it. Thanks in advance! 

 

Here is the current code, that I would like to leave exactly as is: 

.footer-custom-text {

  vertical-align: top;

  text-align: center;

  color: #fff;

}



.doc-layout-common-footer.hyd-shadow-md {

  background-color: #2d2a26;

  position: fixed;

  left: 0;

  bottom: 0;

  width: 100%;

  height: 50px;

}



.course-catalog-content-wrapper.course-catalog-content-wrapper-cards-1.course-catalog-content-wrapper-small {

    padding: 0.15;

    margin: 0.15;

}



.ui-data-browser-controls-bar.shadowed.ng-star-inserted.ui-media-xs {

  display: none;

}



.course-catalog-calendar.wrapper-shadow.ng-star-inserted {

    margin-top: 0;

    padding-top: 0;

}



.course-catalog-total-count.ui-typography-subtitle.ui-color-typography-primary.ng-star-inserted {

    display: none;

}



.ui-data-browser-controls-bar.shadowed.ng-star-inserted.ui-media-lg {

    display: none;

}

 


4 replies

Userlevel 7
Badge +6

You want to use the Docebo White Label App (no CSS necessary).

https://help.docebo.com/hc/en-us/articles/360020128659-Managing-the-White-Label-App

Userlevel 7
Badge +7

was going to suggest the same...no need to code for your footer unless you want to get really fancy.

Userlevel 1

@dklinger @lrnlab I’m not seeing where I’d be able to make the footer clickable. I tried to URL option, but it just inserts it above the footer. 

Userlevel 7
Badge +6

@dklinger @lrnlab I’m not seeing where I’d be able to make the footer clickable. I tried to URL option, but it just inserts it above the footer. 

Anyway you can:

  • take a screen cap of what you have going on? Because you may have some css interacting…your css here is probably interacting (in other words take it out temporarily and add it back or comment it out and then remove the comment) .footer-custom-text {   vertical-align: top;   text-align: center;   color: #fff; }
  • can you iframe your custom footer (which may give you ultimate control)

Reply