Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Steven

    (@shazahm1hotmailcom)

    @ mustermann

    The CSS is being “Autoptimized” so it is impossible to know where the CSS conflict is occurring. Something is changing the left padding. My best guess is the theme. Seems like is is messing up PageNavi too. Seeing as the alignment is all messed up. Add the following to the theme’s custom CSS area:

    #cn-page-nav .page-numbers,
    #cn-page-nav a {
    	padding: 3px 6px !important;
    }

    That will fix up the display.

    You can style the Connections to better match the style being applied to PageNavi with this CSS:

    #cn-page-nav .page-numbers.current,
    #cn-page-nav .page-numbers.dots,
    #cn-page-nav .disabled {
    	color: #fff !important;
    }
    
    #cn-page-nav .page-numbers.current {
    	margin: 0 3px 5px;
    	padding: 6px 8px;
    	background: #1050a3;
    	border: 1px solid #1050a3;
    	-webkit-border-radius: 2px;
    	-webkit-border-radius: 2px;
    	border-radius: 2px;
    	color: #fff;
    }
    
    #cn-page-nav .page-numbers {
    	margin: 0;
    	padding: 10px 0 10px 110px;
    	overflow: hidden;
    	color: #666;
    	font-weight: bold;
    }
    
    #cn-page-nav .page-numbers,
    #cn-page-nav a {
    	margin: 0 3px 6px;
    	padding: 6px 8px !important;
    	display: inline-block;
    	background: #f7f7f7;
    	border: 1px solid #e5e5e5;
    	-webkit-border-radius: 2px;
    	border-radius: 2px;
    	color: #666;
    	-webkit-transition: all .15s ease-in-out;
    	-moz-transition: all .15s ease-in-out;
    	-o-transition: all .15s ease-in-out;
    	transition: all .15s ease-in-out;
    }
    
    #cn-page-nav a.page-numbers:hover {
    	background: #090;
    	border: 1px solid #bfbfbf;
    	color: #fff !important;
    	text-decoration: none;
    }

    This is all simply copy/pasted from the style being applied to PageNavi with the selectors changed to target the Connections pagination.

    Hope that helps!

    FYI: you can un-autoptimize any request by appending ?ao_noptimize=1 to the URL, that way you can see the orginal CSS.

    have fun,
    frank-the-allseeing-autoptimize-guy

    Plugin Author Steven

    (@shazahm1hotmailcom)

    @ Frank

    Thanks for the tip! I actually know that but I forgot about it.

    Thread Starter mustermann

    (@mustermann)

    Thank you very much for help. It works fine. You can see it here:

    https://oldtimer-veranstaltung.de/service/gastronomie-verzeichnis-touren-reisen/

    Regards
    mustermann

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Navigation with many entries in driectory’ is closed to new replies.