.prev-next-nav { margin-right: 64px; margin-left: 64px; overflow: hidden; font-size: 14px; border-top: 1px solid @site-border-color-split; > .prev-page, > .next-page { float: left; width: 50%; height: 72px; line-height: 72px; text-decoration: none; .ant-row-rtl & { float: right; .footer-nav-icon-before, .footer-nav-icon-after { transform: rotate(180deg); } } } > a.prev-page { .footer-nav-icon-before { position: relative; left: 0; margin-right: 1em; color: @site-text-color-secondary; font-size: 12px; transition: all 0.3s; .ant-row-rtl & { right: 0; left: auto; margin-right: 0; margin-left: 1em; } } .footer-nav-icon-after { display: none; } &:hover .footer-nav-icon-before { left: -3px; color: @primary-color; .ant-row-rtl & { right: -3px; left: auto; } } } > .next-page { float: right; text-align: right; .ant-row-rtl & { float: left; text-align: left; } .footer-nav-icon-after { position: relative; right: 0; margin-left: 1em; color: @site-text-color-secondary; font-size: 12px; transition: all 0.3s; .ant-row-rtl & { right: auto; left: 0; margin-right: 1em; margin-left: 0; } } .footer-nav-icon-before { display: none; } &:hover .footer-nav-icon-after { right: -3px; color: @primary-color; .ant-row-rtl & { right: auto; left: -3px; } } } .chinese { margin-left: 0.5em; } }