Black Friday Sale! Get up to $40 off GP Premium!Learn more

Reply To: CSS Menu

Home Forums Support CSS Menu Reply To: CSS Menu

#180550
MaksymPS

Tom,

Thanks for answering!
It seems it’s hard to make just using a Simple CSS plugin. I guess it has to be changed in style.css all .mai-navigation classes…

Why I was asking? I found an amazing examples of menues, (page how to do) and wanted to make it with GP, but I couldn’t.. (not good enough at HTML and CSS)

I renamed all theirs .menu classes into a .main-navigation and put it into a Simple CSS plugin,

.main-navigation .main-navigation a {
	position: relative;
	display: block;
	margin: 0 1.5em;
	padding: 0.75em 0;
	text-align: center;
	color: #b5b5b5;
	transition: color 0.3s;
}

.main-navigation .main-navigation a:hover,
.main-navigation .main-navigation a:focus {
	color: #929292;
}

.main-navigation .main-navigation ul .current-menu-item > a .main-navigation a {
	color: #d94f5c;
}

.main-navigation .menu-item::before {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 4px;
	background: #d94f5c;
	transform: scale3d(0, 1, 1);
	transition: transform 0.1s;
}

.main-navigation ..main-navigation ul .current-menu-item > a .menu-item::before {
	transform: scale3d(1, 1, 1);
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	transition-duration: 0.3s;
}

and it doesn’t work 🙁

Anyway thanks for helping 😉

  • This reply was modified 4 years, 8 months ago by MaksymPS.