/** * Generic mixins */ @mixin box-shadow($shadow) { -webkit-box-shadow: $shadow; -moz-box-shadow: $shadow; -ms-box-shadow: $shadow; -o-box-shadow: $shadow; box-shadow: $shadow; } @mixin border-radius($radius) { -webkit-border-radius: $radius; -moz-border-radius: $radius; -ms-border-radius: $radius; -o-border-radius: $radius; border-radius: $radius; } @mixin border-radius-left($radius) { @include border-radius($radius 0 0 $radius) } @mixin border-radius-right($radius) { @include border-radius(0 0 $radius $radius) } @mixin linear-gradient($from, $to) { background-image: -webkit-gradient(linear, 0 0, 0 100%, from($from), to($to)); background-image: -webkit-linear-gradient($from, $to); background-image: -moz-linear-gradient($from, $to); background-image: -ms-linear-gradient($from, $to); background-image: -o-linear-gradient($from, $to); } @mixin transition($transition) { -webkit-transition: $transition; -moz-transition: $transition; -ms-transition: $transition; -o-transition: $transition; transition: $transition; } /** * Prefilled mixins * Mixins with fixed values */ @mixin shade { @include box-shadow(0 0 3px #ddd); } @mixin solid-shade { @include box-shadow(0 0 0 3px #f1f1f1); } @mixin md-typography { color: $md-text-color; a { color: $md-link-color; } img { max-width: 100%; } *:first-child { margin-top: 0; } code { font-family: $monospace_font; white-space: pre; word-wrap: normal; padding: 1px 2px; } kbd { display: inline-block; padding: 3px 5px; font-size: 11px; line-height: 10px; color: #555; vertical-align: middle; background-color: #FCFCFC; border-width: 1px; border-style: solid; border-color: #CCC #CCC #BBB; border-image: none; border-radius: 3px; box-shadow: 0px -1px 0px #BBB inset; } h1 { font-size: 1.3em; font-weight: 600; margin: 24px 0 12px 0; padding: 0 0 10px 0; border-bottom: 1px solid #e7e9ed; color: #313236; } h2 { font-size: 1.2em; font-weight: 600; margin: 24px 0 12px 0; color: #313236; } h3 { margin: 24px 0 12px 0; font-size: 1.25em; } h4 { margin: 24px 0 12px 0; font-size: 1.1em; } h5 { margin: 24px 0 12px 0; font-size: 1em; } h6 { margin: 24px 0 12px 0; font-size: 0.90em; } blockquote { padding: 8px 21px; margin: 12px 0 12px; border-left: 3px solid #e7e9ed; } blockquote p { color: #7f8fa4 !important; font-size: 15px; line-height: 1.5; } p { color:#5c5d5e; margin:6px 0 0 0; } table { @extend .table; @extend .table-bordered; margin: 12px 0 12px 0; color: #5c5d5e; th { background: #f8fafc; } } pre { @include border-radius(2px); } p > code { font-weight: inherit; } ul { color: #5c5d5e; } li { line-height: 1.6em; } a[href*="/uploads/"], a[href*="storage.googleapis.com/google-code-attachments/"] { &:before { margin-right: 4px; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; content: "\f0c6"; } &:hover:before { text-decoration: none; } } } @mixin str-truncated($max_width: 82%) { display: inline-block; overflow: hidden; text-overflow: ellipsis; vertical-align: top; white-space: nowrap; max-width: $max_width; } /* * Base mixin for lists in GitLab */ @mixin basic-list { margin: 5px 0px; padding: 0px; list-style: none; > li { padding: 10px 0; border-bottom: 1px solid #EEE; overflow: hidden; display: block; margin: 0px; &:last-child { border-bottom: none; } &.active { background: #f9f9f9; a { font-weight: 600; } } &.hide { display: none; } &.light { a { color: $gl-gray; } } } } @mixin input-big { height: 36px; padding: 5px 10px; font-size: 16px; line-height: 24px; color: #7f8fa4; background-color: #fff; border-color: #e7e9ed; } @mixin btn-big { height: 36px; padding: 5px 10px; font-size: 16px; line-height: 24px; } @mixin nav-menu { padding: 0; margin: 0; list-style: none; margin-top: 5px; height: 56px; li { display: inline-block; a { padding: 14px; font-size: 17px; line-height: 28px; color: #7f8fa4; border-bottom: 2px solid transparent; &:hover, &:active, &:focus { text-decoration: none; } } &.active a { color: #4c4e54; border-bottom: 2px solid #1cacfc; } .badge { font-weight: normal; background-color: #fff; background-color: #eee; color: #78a; } } } .fa-align { top: 20px; position: relative; }