334 lines
13 KiB
SCSS
334 lines
13 KiB
SCSS
// Detect lightness
|
|
@function detectLightness($color) {
|
|
@if (lightness($color) > 60) {
|
|
@return mix($color, #000, 90%);
|
|
} @else {
|
|
@return mix($color, #fff, 90%);
|
|
}
|
|
}
|
|
|
|
// Spacing
|
|
@function spacing($type) {
|
|
@if $type == 'compact' {
|
|
@return 12px;
|
|
}
|
|
@if $type == 'spacious' {
|
|
@return 22px;
|
|
}
|
|
@else {
|
|
@return 16px;
|
|
}
|
|
}
|
|
|
|
// Description
|
|
@function desc($display) {
|
|
@if $display == false {
|
|
@return none;
|
|
}
|
|
@else {
|
|
@return block;
|
|
}
|
|
}
|
|
|
|
// Layout type
|
|
@mixin layout-type($type) {
|
|
@if $type == 'small' {
|
|
max-width: 500px;
|
|
min-width: 400px;
|
|
}
|
|
@if $type == 'normal' {
|
|
max-width: 600px;
|
|
min-width: 500px;
|
|
}
|
|
@if $type == 'large' {
|
|
max-width: 800px;
|
|
min-width: 600px;
|
|
}
|
|
@if $type == 'full' {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
// Alignement type
|
|
@mixin alignment-type($type) {
|
|
@if $type == 'left' {
|
|
left: 0 !important;
|
|
right: inherit !important;
|
|
}
|
|
@if $type == 'right' {
|
|
right: 0 !important;
|
|
left: inherit !important;
|
|
}
|
|
@if $type == 'center' {
|
|
left: 0 !important;
|
|
right: 0 !important;
|
|
margin: auto !important;
|
|
}
|
|
}
|
|
|
|
// Mixin - Shadow type
|
|
@mixin shadow-type($type) {
|
|
@if $type == 'light' {
|
|
box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.2), 0 2px 3px 0 rgba(0, 0, 0, 0.1) ;
|
|
}
|
|
@if $type == 'heavy' {
|
|
box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
|
|
}
|
|
}
|
|
|
|
@mixin dropdown(
|
|
$main-color: #458EE1,
|
|
$layout-type: normal,
|
|
$layout-alignment: right,
|
|
$layout-width: 800,
|
|
$background-color: #FFFFFF,
|
|
$border-radius: 4,
|
|
$border-width: 1,
|
|
$border-color: #d9d9d9,
|
|
$box-shadow: light,
|
|
$branding-position: bottom,
|
|
$font-size: normal,
|
|
$header-color: #33363D ,
|
|
$title-color: #02060C,
|
|
$subtitle-color: #A4A7AE,
|
|
$text-color: #63676D,
|
|
$highlight-color: #3881FF,
|
|
$spacing: normal,
|
|
$include-desc: true,
|
|
$background-category-header: #FFFFFF
|
|
){
|
|
|
|
$padding: spacing($spacing);
|
|
|
|
$header-size: 1em;
|
|
$title-size: .9em;
|
|
$text-size: .85em;
|
|
$subtitle-size: .9em;
|
|
|
|
@if $font-size == 'small' {
|
|
$header-size: .95em;
|
|
$title-size: .8em;
|
|
$text-size: .75em;
|
|
$subtitle-size: .8em;
|
|
}
|
|
|
|
@else if $font-size == 'large' {
|
|
$header-size: 1.1em;
|
|
$title-size: 1em;
|
|
$text-size: .9em;
|
|
$subtitle-size: 1em;
|
|
}
|
|
|
|
.algolia-autocomplete {
|
|
display: block;
|
|
height: 100%;
|
|
}
|
|
|
|
// powered by
|
|
.algolia-docsearch-footer {
|
|
width: 100px;
|
|
height: 20px;
|
|
z-index: 2000;
|
|
margin-top: $padding/2;
|
|
float: right;
|
|
font-size: 0;
|
|
line-height: 0;
|
|
&--logo {
|
|
background-image: url('data:image/svg+xml;utf8,<svg width="86" height="13" viewBox="0 0 86 13" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><path d="M5.01 8.1c0 .63-.228 1.12-.684 1.47-.456.352-1.074.528-1.855.528-.84 0-1.49-.11-1.95-.327v-.8c.3.13.61.22.96.3.35.07.69.11 1.03.11.56 0 .97-.1 1.25-.31s.42-.5.42-.87c0-.25-.05-.45-.15-.61-.09-.15-.26-.3-.49-.43-.24-.14-.59-.29-1.07-.46-.66-.23-1.13-.52-1.42-.84C.76 5.52.61 5.1.61 4.57c0-.55.21-.985.62-1.31.42-.325.96-.488 1.64-.488.71 0 1.37.13 1.96.39l-.26.72c-.59-.25-1.16-.37-1.71-.37-.44 0-.78.09-1.03.28-.25.19-.37.45-.37.78 0 .24.05.45.14.6.09.16.246.3.46.43.22.13.55.277.996.437.75.26 1.264.55 1.545.86.29.3.43.7.43 1.19zm3.598 2c-.79 0-1.415-.24-1.872-.723-.458-.482-.686-1.15-.686-2.007 0-.862.212-1.548.637-2.056.425-.507.995-.76 1.71-.76.672 0 1.203.22 1.593.66.39.44.586 1.023.586 1.746v.513H6.89c.016.63.175 1.106.476 1.43.3.327.725.49 1.272.49.576 0 1.146-.12 1.71-.362v.73c-.288.13-.56.22-.814.27-.256.06-.564.08-.926.08zm-.22-4.87c-.43 0-.772.14-1.027.42-.25.28-.4.67-.45 1.164h2.8c0-.512-.11-.903-.34-1.175-.23-.28-.55-.41-.97-.41zM15.25 10l-.16-.762h-.04c-.266.336-.532.563-.798.68-.265.12-.596.18-.993.18-.53 0-.95-.137-1.25-.41-.3-.274-.45-.663-.45-1.167 0-1.08.86-1.64 2.59-1.7l.91-.02v-.34c0-.42-.09-.73-.27-.93-.18-.2-.47-.3-.87-.3-.45 0-.95.14-1.52.41l-.25-.62c.26-.14.55-.25.86-.33.31-.08.63-.12.94-.12.63 0 1.11.15 1.41.43.3.29.46.74.46 1.37V10h-.6zm-1.83-.57c.505 0 .9-.14 1.19-.416.287-.277.43-.664.43-1.162v-.484l-.81.034c-.644.023-1.11.123-1.394.3-.284.178-.427.454-.427.828 0 .293.09.516.26.67.18.152.42.23.74.23zm6.543-4.88c.24 0 .452.02.64.06l-.112.75c-.22-.048-.41-.072-.58-.072-.43 0-.8.176-1.11.527-.31.352-.46.79-.46 1.314V10h-.81V4.648h.67l.1.992h.04c.2-.35.44-.617.72-.806.28-.19.59-.283.93-.283zm3.58 5.548c-.775 0-1.374-.24-1.8-.716-.424-.477-.636-1.15-.636-2.024 0-.895.215-1.587.646-2.075.432-.488 1.046-.732 1.844-.732.257 0 .514.03.77.09.258.06.46.12.607.2l-.248.69c-.18-.07-.375-.13-.586-.18-.212-.04-.4-.07-.562-.07-1.087 0-1.63.7-1.63 2.08 0 .66.132 1.16.397 1.52.267.35.66.53 1.18.53.446 0 .904-.09 1.373-.28v.72c-.358.19-.81.28-1.353.28zm6.28-.098V6.538c0-.436-.1-.762-.297-.976-.198-.215-.51-.323-.932-.323-.563 0-.974.15-1.233.45-.25.3-.38.81-.38 1.5V10h-.81V2.402h.81v2.3c0 .277-.01.506-.04.69h.05c.16-.26.39-.46.68-.61.3-.147.63-.22 1.01-.22.66 0 1.15.154 1.47.465.33.31.49.805.49 1.482V10h-.81zm7.565-5.44c.703 0 1.25.24 1.638.72.39.48.583 1.16.583 2.04 0 .878-.2 1.56-.59 2.048-.39.486-.94.73-1.64.73-.35 0-.67-.065-.96-.193-.29-.13-.53-.327-.73-.593h-.06l-.17.688h-.58V2.402h.81v1.846c0 .413-.02.785-.04 1.113h.04c.38-.53.94-.8 1.68-.8zm-.117.68c-.55 0-.95.158-1.19.475-.24.318-.36.852-.36 1.604 0 .75.13 1.29.38 1.61.25.32.66.48 1.21.48.5 0 .87-.19 1.12-.55.25-.37.37-.89.37-1.57 0-.7-.12-1.22-.36-1.56-.24-.35-.62-.52-1.13-.52zm2.71-.592h.87L42.02 7.7c.257.697.416 1.2.48 1.51h.037c.042-.167.13-.45.266-.853.136-.402.578-1.638 1.327-3.71H45l-2.3 6.095c-.23.602-.496 1.03-.8 1.282-.304.252-.678.378-1.12.378-.248 0-.49-.027-.733-.083v-.65c.18.04.38.06.6.06.557 0 .954-.32 1.192-.94l.29-.76-2.16-5.39z" fill="%23797979"/><path d="M70.883 4.8l-.553 2.06 1.782-1.025c-.26-.5-.7-.876-1.23-1.034zM67.76 3.41c-.237-.25-.624-.25-.862 0l-.108.114c-.238.252-.238.66 0 .91l.115.122c.244-.414.556-.78.918-1.08l-.062-.066zm3.73-.63c0-.014.003-.027.003-.042v-.322c0-.355-.273-.644-.61-.644h-1.068c-.337 0-.61.288-.61.644v.317c.34-.1.698-.156 1.068-.156.424 0 .833.072 1.216.203" fill="%2346AEDA"/><path d="M70.316 4.243c1.34 0 2.428 1.145 2.428 2.552 0 1.408-1.09 2.553-2.428 2.553-1.34 0-2.428-1.145-2.428-2.553 0-1.407 1.09-2.552 2.428-2.552m-3.4 2.552c0 1.974 1.522 3.574 3.4 3.574s3.4-1.6 3.4-3.58-1.522-3.58-3.4-3.58-3.4 1.6-3.4 3.57z" fill="%2346AEDA"/><path d="M54.758 10.175c-.14-.39-.27-.776-.395-1.155-.124-.378-.25-.763-.383-1.154H50.1l-.78 2.31h-1.247c.33-.958.64-1.843.927-2.656.288-.813.57-1.585.847-2.316.275-.73.55-1.43.82-2.094.273-.666.557-1.324.854-1.977h1.1c.3.653.58 1.31.86 1.977.27.665.55 1.363.82 2.094.28.73.56 1.503.85 2.316.29.813.6 1.698.93 2.655h-1.31zm-1.124-3.353c-.264-.757-.525-1.49-.785-2.2-.26-.708-.53-1.388-.81-2.04-.29.652-.57 1.332-.83 2.04-.26.71-.52 1.443-.77 2.2h3.19zm5.45 3.483c-.71-.017-1.21-.178-1.508-.482-.297-.305-.445-.78-.445-1.423V.26l1.15-.21v8.155c0 .2.02.365.05.496.04.13.09.24.16.32.08.08.18.14.3.18.13.04.28.08.46.1l-.16 1.02m5.47-.81c-.1.07-.29.16-.57.27-.28.11-.61.17-.99.17s-.75-.06-1.09-.19c-.34-.13-.64-.33-.89-.6-.26-.27-.46-.61-.61-1.02-.15-.4-.22-.89-.22-1.46 0-.49.07-.95.21-1.36.14-.41.35-.77.61-1.07.27-.3.6-.53.99-.7.39-.17.83-.25 1.31-.25.54 0 1.01.04 1.41.12.4.09.73.16 1.01.23V9.7c0 1.044-.25 1.8-.76 2.27s-1.29.705-2.33.705c-.4 0-.78-.035-1.14-.104-.36-.07-.67-.15-.93-.24l.21-1.06c.23.09.51.18.84.25.34.08.68.11 1.05.11.69 0 1.18-.14 1.48-.43.3-.28.45-.74.45-1.37v-.3zm-.47-5.13c-.19-.03-.45-.04-.78-.04-.61 0-1.09.22-1.42.64-.33.43-.5.99-.5 1.7 0 .39.05.73.14 1.01.1.28.23.51.39.69.16.18.35.32.56.41.21.09.43.13.65.13.31 0 .59-.04.84-.13.26-.09.46-.2.61-.32v-4c-.11-.03-.27-.06-.46-.09zm12.77 5.95c-.7-.02-1.21-.18-1.5-.48-.29-.3-.44-.78-.44-1.42V.26l1.15-.21v8.155c0 .2.02.365.05.496.04.13.09.24.16.32.08.08.18.14.3.18.13.04.28.08.46.1l-.16 1.02m2.01-8.14c-.2 0-.38-.07-.52-.21-.14-.14-.21-.34-.21-.58 0-.24.07-.44.22-.58.14-.14.32-.21.52-.21.21 0 .38.08.53.22.15.15.22.34.22.58 0 .25-.07.44-.21.58-.15.15-.32.22-.53.22zm-.57 1.23h1.15v6.79H78.3V3.4zm5.2-.17c.46 0 .85.07 1.17.19.32.13.57.31.77.54.2.23.33.5.42.82.08.32.12.67.12 1.05v4.24l-.41.07c-.17.03-.37.06-.6.09-.22.03-.46.05-.72.08-.26.02-.51.03-.77.03-.36 0-.69-.04-1-.12-.3-.08-.56-.2-.79-.37-.22-.17-.39-.39-.52-.67S81 8.57 81 8.18c0-.37.07-.692.22-.962s.34-.49.59-.653c.25-.164.53-.286.86-.364.33-.08.68-.12 1.04-.12.12 0 .24.01.36.02.13.02.24.03.35.05.12.03.21.04.3.06.083.02.14.03.174.04V5.9c0-.2-.02-.395-.07-.59-.04-.198-.114-.37-.22-.524-.107-.15-.253-.273-.44-.364-.183-.09-.424-.13-.72-.13-.38 0-.71.03-.996.09-.29.055-.5.114-.64.175l-.14-1.007c.147-.07.395-.133.74-.2.346-.064.72-.1 1.125-.1zm.1 6.08c.27 0 .52 0 .73-.02.21-.01.39-.03.53-.07V7.19c-.08-.044-.22-.08-.4-.11-.18-.03-.41-.047-.67-.047-.17 0-.36.02-.55.04-.19.03-.37.08-.53.17-.16.085-.29.198-.4.34-.11.145-.16.33-.16.57 0 .435.13.737.39.906.26.17.62.25 1.07.25z" fill="%231D3657"/></g></svg>');
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
background-size: 100%;
|
|
overflow: hidden;
|
|
text-indent: -9000px;
|
|
padding: 0!important;
|
|
width: 100%;
|
|
height: 100%;
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
|
|
// Dropdown wrapper
|
|
.aa-dropdown-menu {
|
|
position: relative;
|
|
top: -6px;
|
|
border-radius: $border-radius+px;
|
|
margin: 6px 0 0;
|
|
padding: 0;
|
|
text-align: left;
|
|
height: auto;
|
|
position: relative;
|
|
background: transparent;
|
|
border: none;
|
|
@include layout-type($layout-type);
|
|
@include alignment-type($layout-alignment);
|
|
@include shadow-type($box-shadow);
|
|
|
|
// Arrow
|
|
&:before {
|
|
position: absolute;
|
|
content: '';
|
|
width: 14px;
|
|
height: 14px;
|
|
background: $background-color;
|
|
z-index: 0;
|
|
top: -7px;
|
|
border-top: $border-width+px solid $border-color;
|
|
border-right: $border-width+px solid $border-color;
|
|
transform: rotate(-45deg);
|
|
border-radius: 2px;
|
|
z-index: 999;
|
|
@if $layout-alignment == 'center' {
|
|
display: none;
|
|
}
|
|
@else {
|
|
display: block;
|
|
#{$layout-alignment}: 48px;
|
|
}
|
|
}
|
|
|
|
.aa-suggestions {
|
|
position: relative;
|
|
z-index: 1000;
|
|
}
|
|
|
|
[class^="aa-dataset-"] {
|
|
position: relative;
|
|
border: solid $border-width+px $border-color;
|
|
background: $background-color;
|
|
border-radius: $border-radius+px;
|
|
overflow: auto;
|
|
padding: 0 $padding $padding/2;
|
|
}
|
|
|
|
// Inner-grid setup
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
}
|
|
|
|
// Each suggestion item is wrapped
|
|
.algolia-docsearch-suggestion {
|
|
position: relative;
|
|
padding: 0;
|
|
background: $background-color;
|
|
color: $title-color;
|
|
overflow: hidden;
|
|
|
|
&--highlight {
|
|
color: darken($main-color,10%);
|
|
background-color: rgba($main-color,.08);
|
|
.algolia-docsearch-suggestion--category-header &{
|
|
color: inherit;
|
|
background: inherit;
|
|
}
|
|
}
|
|
|
|
&--content {
|
|
display: block;
|
|
float: right;
|
|
width: 70%;
|
|
position: relative;
|
|
cursor: pointer;
|
|
|
|
@if $padding == 12px {
|
|
padding: 0 0 0 $padding/1.5;
|
|
}
|
|
@else {
|
|
padding: $padding/3 0 $padding/3 $padding/1.5;
|
|
}
|
|
|
|
.aa-cursor &{
|
|
background: rgba(black, .03);
|
|
}
|
|
|
|
&:before {
|
|
content: '';
|
|
position: absolute;
|
|
display: block;
|
|
top: 0;
|
|
height: 100%;
|
|
width: 1px;
|
|
background: #ddd;
|
|
left: -1px;
|
|
}
|
|
}
|
|
|
|
&--category-header {
|
|
position: relative;
|
|
border-bottom: 1px solid #ddd;
|
|
display: none;
|
|
padding: $padding/4 0;
|
|
font-size: $header-size;
|
|
color: $header-color;
|
|
|
|
.algolia-docsearch-suggestion__main & {
|
|
display: block;
|
|
margin-top: $padding/6;
|
|
}
|
|
}
|
|
|
|
&--wrapper {
|
|
width: 100%;
|
|
float: left;
|
|
@if $padding == 12px {
|
|
padding: 0;
|
|
}
|
|
@else {
|
|
padding: $padding/2 0 0 0;
|
|
}
|
|
}
|
|
|
|
&--subcategory-column {
|
|
float: left;
|
|
width: 30%;
|
|
display: none;
|
|
padding-left: 0;
|
|
text-align: right;
|
|
position: relative;
|
|
color: $subtitle-color;
|
|
font-size: $subtitle-size;
|
|
word-wrap: break-word;
|
|
|
|
@if $padding == 12px {
|
|
padding: 0 $padding/1.5;
|
|
}
|
|
@else {
|
|
padding: $padding/3 $padding/1.5;
|
|
}
|
|
|
|
&:before {
|
|
content: '';
|
|
position: absolute;
|
|
display: block;
|
|
top: 0;
|
|
height: 100%;
|
|
width: 1px;
|
|
background: #ddd;
|
|
right: 0;
|
|
}
|
|
|
|
.algolia-docsearch-suggestion__secondary & {
|
|
display: block !important;
|
|
}
|
|
}
|
|
|
|
&--subcategory-inline {
|
|
display: none;
|
|
}
|
|
|
|
&--title {
|
|
margin-bottom: $padding/4;
|
|
color: $title-color;
|
|
font-size: $title-size;
|
|
font-weight: bold;
|
|
}
|
|
|
|
&--text {
|
|
display: desc($include-desc);
|
|
line-height: 1.2em;
|
|
font-size: $text-size;
|
|
color: $text-color;
|
|
}
|
|
}
|
|
}
|