Changeset - 97a99ced3b85
[Not reviewed]
default
0 1 0
domruf - 8 years ago 2017-10-27 18:54:59
dominikruf@gmail.com
less: remove borders and padding around navbar items

Navbar items were styled with borders to look like embossed areas that could be
clicked. The top menu also had it in the drop-down menu, while the context menu
didn't.

The areas are big, and it is quite clear it is some kind of clickable menu ...
and the clickable area is also highlighted when hovering. We can thus do
without the borders and get a slightly cleaner look.
1 file changed with 1 insertions and 27 deletions:
0 comments (0 inline, 0 general)
kallithea/public/css/contextbar.css
Show inline comments
 
@@ -4,95 +4,69 @@
 
i[class^='icon-'] {
 
  background-repeat: no-repeat;
 
  background-position: center;
 
  display: inline-block;
 
  min-width: 16px;
 
  min-height: 16px;
 
  margin: -2px 0 -4px 0;
 
  /* background-color: red; /* for debugging */
 
}
 
/* Note: class 'icon-empty' or 'icon-gravatar' can be used to get icon styling without an actual glyph */
 
nav.navbar #quick a,
 
#content #context-bar,
 
#content #context-bar a {
 
  color: #FFFFFF;
 
}
 
nav.navbar #quick a:hover,
 
#content #context-bar a:hover {
 
  text-decoration: none;
 
  background: inherit;
 
}
 
.navbar-text {
 
  margin-top: 0;
 
  margin-bottom: 0;
 
}
 
ul#quick ul.dropdown-menu > li {
 
  border-bottom: 1px solid rgba(0,0,0,0.1);
 
  border-top: 1px solid rgba(255,255,255,0.1);
 
}
 
ul#quick ul.dropdown-menu > li:first-child {
 
  border-top: none;
 
}
 
ul#quick ul.dropdown-menu > li:last-child {
 
  border-bottom: none;
 
}
 
nav.navbar #quick ul,
 
#context-pages ul {
 
  background: #577632;
 
}
 
.repo-switcher-dropdown.select2-drop.select2-drop-active .select2-results .select2-highlighted,
 
ul.dropdown-menu li a:focus,
 
nav.navbar #quick li:hover,
 
#quick_login > .pull-right .list-group-item:hover,
 
#context-pages li:hover,
 
nav.navbar #quick li.active,
 
nav.navbar #quick li a.menu_link:focus,
 
#context-pages li.active {
 
  background: linear-gradient(to bottom, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0.1) 100%); /* W3C */
 
}
 
#quick_login > .pull-right .list-group-item {
 
  background-color: #577632;
 
  border: 0;
 
}
 
#content #context-pages .follow .show-following,
 
#content #context-pages .following .show-follow {
 
  display: none;
 
}
 
nav.navbar #quick li,
 
nav.navbar #quick_login .pull-right,
 
#content #context-pages li {
 
  border-right: 1px solid rgba(0,0,0,0.1);
 
  border-left: 1px solid rgba(255,255,255,0.1);
 
  padding: 0;
 
}
 

	
 
.nav .open > a {
 
  background: inherit !important;
 
}
 
nav.navbar #quick li:last-child,
 
#content #context-pages li:last-child {
 
  border-right: none;
 
}
 
nav.navbar #quick > li:first-child {
 
  border-left: none;
 
}
 
nav.navbar #quick > li:first-child > a {
 
  border-radius: 4px 0 0 4px;
 
}
 
nav.navbar #quick > li > a,
 
nav.navbar #quick .select2-container .select2-choice .select2-chosen,
 
#context-pages > ul > li > a,
 
#context-pages .select2-container .select2-choice .select2-chosen {
 
  padding: 0px 15px 1px 15px;
 
  line-height: 43px;
 
}
 
nav.navbar #quick a#quick_login_link {
 
  padding-left: 0px;
 
}
 
nav.navbar #quick a {
 
  overflow: hidden;
 
}
 
#context-pages a.dropdown-toggle:after {
 
  position: absolute;
 
  float: right;
 
  padding-left: 5px;
 
  padding-right: 5px;
 
}
0 comments (0 inline, 0 general)