mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-07 20:31:06 -05:00
Add .nav-pills styling for v2
This commit is contained in:
parent
a2a98e0be1
commit
bc89d8fb11
5 changed files with 24 additions and 2 deletions
7
services/web/public/stylesheets/components/navs-ol.less
Normal file
7
services/web/public/stylesheets/components/navs-ol.less
Normal file
|
@ -0,0 +1,7 @@
|
|||
.nav-pills {
|
||||
> li {
|
||||
> a {
|
||||
border-radius: @btn-border-radius-base;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -123,8 +123,14 @@
|
|||
// Links rendered as pills
|
||||
> a {
|
||||
border-radius: @nav-pills-border-radius;
|
||||
border: 2px solid @link-color;
|
||||
border: 2px solid @nav-pills-link-color;
|
||||
color: @nav-pills-link-color;
|
||||
padding: 8px 13px;
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: @nav-pills-link-hover-bg;
|
||||
border: 2px solid @nav-pills-link-hover-bg;
|
||||
}
|
||||
}
|
||||
+ li {
|
||||
margin-left: 2px;
|
||||
|
@ -136,6 +142,7 @@
|
|||
&:hover,
|
||||
&:focus {
|
||||
color: @nav-pills-active-link-hover-color;
|
||||
border: 2px solid @nav-pills-active-link-hover-bg;
|
||||
background-color: @nav-pills-active-link-hover-bg;
|
||||
}
|
||||
}
|
||||
|
@ -247,4 +254,4 @@
|
|||
margin-top: -1px;
|
||||
// Remove the top rounded corners here since there is a hard edge above the menu
|
||||
.border-top-radius(0);
|
||||
}
|
||||
}
|
|
@ -370,6 +370,9 @@
|
|||
@nav-tabs-justified-active-link-border-color: @body-bg;
|
||||
|
||||
//== Pills
|
||||
@nav-pills-link-color: @link-color;
|
||||
@nav-pills-link-hover-color: @nav-link-hover-bg;
|
||||
@nav-pills-link-hover-bg: @nav-link-hover-bg;
|
||||
@nav-pills-border-radius: @border-radius-base;
|
||||
@nav-pills-active-link-hover-bg: @component-active-bg;
|
||||
@nav-pills-active-link-hover-color: @component-active-color;
|
||||
|
|
|
@ -34,6 +34,10 @@
|
|||
@navbar-default-border : transparent;
|
||||
@navbar-brand-image-url : url(/img/ol-brand/overleaf-white.svg);
|
||||
@navbar-default-link-bg : transparent;
|
||||
@nav-pills-active-link-hover-bg: @ol-dark-green;
|
||||
@nav-pills-link-color : @btn-default-bg;
|
||||
@nav-pills-link-hover-bg : darken(@ol-blue-gray-4, 8%); // match button-variant mixin
|
||||
|
||||
// Backgrounds
|
||||
@body-bg : #FFF;
|
||||
@content-alt-bg-color : @ol-blue-gray-1;
|
||||
|
|
|
@ -8,6 +8,7 @@
|
|||
@import "_ol_style_includes.less";
|
||||
@import "components/embed-responsive.less";
|
||||
@import "components/icons.less";
|
||||
@import "components/navs-ol.less";
|
||||
@import "components/pagination.less";
|
||||
|
||||
// Pages
|
||||
|
|
Loading…
Reference in a new issue