|
<!DOCTYPE html> |
|
<html> |
|
|
|
<head> |
|
<meta charset="utf-8" /> |
|
<title>glossary</title> |
|
<style> |
|
.markdown-preview:not([data-use-github-style]) { |
|
padding: 2em; |
|
font-size: 1.2em; |
|
color: rgb(186, 190, 189); |
|
overflow: auto; |
|
background-color: rgb(14, 17, 18); |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style])>:first-child { |
|
margin-top: 0px; |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) h1, |
|
.markdown-preview:not([data-use-github-style]) h2, |
|
.markdown-preview:not([data-use-github-style]) h3, |
|
.markdown-preview:not([data-use-github-style]) h4, |
|
.markdown-preview:not([data-use-github-style]) h5, |
|
.markdown-preview:not([data-use-github-style]) h6 { |
|
line-height: 1.2; |
|
margin-top: 1.5em; |
|
margin-bottom: 0.5em; |
|
color: rgb(255, 255, 255); |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) h1 { |
|
font-size: 2.4em; |
|
font-weight: 300; |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) h2 { |
|
font-size: 1.8em; |
|
font-weight: 400; |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) h3 { |
|
font-size: 1.5em; |
|
font-weight: 500; |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) h4 { |
|
font-size: 1.2em; |
|
font-weight: 600; |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) h5 { |
|
font-size: 1.1em; |
|
font-weight: 600; |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) h6 { |
|
font-size: 1em; |
|
font-weight: 600; |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) strong { |
|
color: rgb(255, 255, 255); |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) del { |
|
color: rgb(143, 151, 148); |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) a, |
|
.markdown-preview:not([data-use-github-style]) a code { |
|
color: rgb(186, 190, 189); |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) img { |
|
max-width: 100%; |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style])> p { |
|
margin-top: 0px; |
|
margin-bottom: 1.5em; |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style])> ul, |
|
.markdown-preview:not([data-use-github-style])> ol { |
|
margin-bottom: 1.5em; |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) blockquote { |
|
margin: 1.5em 0px; |
|
font-size: inherit; |
|
color: rgb(143, 151, 148); |
|
border-color: rgb(50, 60, 64); |
|
border-width: 4px; |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) hr { |
|
margin: 3em 0px; |
|
border-top-width: 2px; |
|
border-top-style: dashed; |
|
border-top-color: rgb(50, 60, 64); |
|
background: none; |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) table { |
|
margin: 1.5em 0px; |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) th { |
|
color: rgb(255, 255, 255); |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) th, |
|
.markdown-preview:not([data-use-github-style]) td { |
|
padding: 0.66em 1em; |
|
border: 1px solid rgb(50, 60, 64); |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) code { |
|
color: rgb(255, 255, 255); |
|
background-color: rgb(32, 39, 41); |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) pre.editor-colors { |
|
margin: 1.5em 0px; |
|
padding: 1em; |
|
font-size: 0.92em; |
|
border-radius: 3px; |
|
background-color: rgb(23, 28, 29); |
|
} |
|
|
|
.markdown-preview:not([data-use-github-style]) kbd { |
|
color: rgb(255, 255, 255); |
|
border-width: 1px 1px 2px; |
|
border-style: solid; |
|
border-color: rgb(50, 60, 64) rgb(50, 60, 64) rgb(36, 44, 47); |
|
background-color: rgb(32, 39, 41); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] { |
|
font-family: 'Helvetica Neue', Helvetica, 'Segoe UI', Arial, freesans, sans-serif; |
|
line-height: 1.6; |
|
word-wrap: break-word; |
|
padding: 30px; |
|
font-size: 16px; |
|
color: rgb(51, 51, 51); |
|
overflow: scroll; |
|
background-color: rgb(255, 255, 255); |
|
} |
|
|
|
.markdown-preview[data-use-github-style]>:first-child { |
|
margin-top: 0px !important; |
|
} |
|
|
|
.markdown-preview[data-use-github-style]>:last-child { |
|
margin-bottom: 0px !important; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] a:not([href]) { |
|
color: inherit; |
|
text-decoration: none; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] .absent { |
|
color: rgb(204, 0, 0); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] .anchor { |
|
position: absolute; |
|
top: 0px; |
|
left: 0px; |
|
display: block; |
|
padding-right: 6px; |
|
padding-left: 30px; |
|
margin-left: -30px; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] .anchor:focus { |
|
outline: none; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h1, |
|
.markdown-preview[data-use-github-style] h2, |
|
.markdown-preview[data-use-github-style] h3, |
|
.markdown-preview[data-use-github-style] h4, |
|
.markdown-preview[data-use-github-style] h5, |
|
.markdown-preview[data-use-github-style] h6 { |
|
position: relative; |
|
margin-top: 1em; |
|
margin-bottom: 16px; |
|
font-weight: bold; |
|
line-height: 1.4; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h1 .octicon-link, |
|
.markdown-preview[data-use-github-style] h2 .octicon-link, |
|
.markdown-preview[data-use-github-style] h3 .octicon-link, |
|
.markdown-preview[data-use-github-style] h4 .octicon-link, |
|
.markdown-preview[data-use-github-style] h5 .octicon-link, |
|
.markdown-preview[data-use-github-style] h6 .octicon-link { |
|
display: none; |
|
color: rgb(0, 0, 0); |
|
vertical-align: middle; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h1:hover .anchor, |
|
.markdown-preview[data-use-github-style] h2:hover .anchor, |
|
.markdown-preview[data-use-github-style] h3:hover .anchor, |
|
.markdown-preview[data-use-github-style] h4:hover .anchor, |
|
.markdown-preview[data-use-github-style] h5:hover .anchor, |
|
.markdown-preview[data-use-github-style] h6:hover .anchor { |
|
padding-left: 8px; |
|
margin-left: -30px; |
|
text-decoration: none; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h1:hover .anchor .octicon-link, |
|
.markdown-preview[data-use-github-style] h2:hover .anchor .octicon-link, |
|
.markdown-preview[data-use-github-style] h3:hover .anchor .octicon-link, |
|
.markdown-preview[data-use-github-style] h4:hover .anchor .octicon-link, |
|
.markdown-preview[data-use-github-style] h5:hover .anchor .octicon-link, |
|
.markdown-preview[data-use-github-style] h6:hover .anchor .octicon-link { |
|
display: inline-block; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h1 tt, |
|
.markdown-preview[data-use-github-style] h2 tt, |
|
.markdown-preview[data-use-github-style] h3 tt, |
|
.markdown-preview[data-use-github-style] h4 tt, |
|
.markdown-preview[data-use-github-style] h5 tt, |
|
.markdown-preview[data-use-github-style] h6 tt, |
|
.markdown-preview[data-use-github-style] h1 code, |
|
.markdown-preview[data-use-github-style] h2 code, |
|
.markdown-preview[data-use-github-style] h3 code, |
|
.markdown-preview[data-use-github-style] h4 code, |
|
.markdown-preview[data-use-github-style] h5 code, |
|
.markdown-preview[data-use-github-style] h6 code { |
|
font-size: inherit; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h1 { |
|
padding-bottom: 0.3em; |
|
font-size: 2.25em; |
|
line-height: 1.2; |
|
border-bottom-width: 1px; |
|
border-bottom-style: solid; |
|
border-bottom-color: rgb(238, 238, 238); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h1 .anchor { |
|
line-height: 1; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h2 { |
|
padding-bottom: 0.3em; |
|
font-size: 1.75em; |
|
line-height: 1.225; |
|
border-bottom-width: 1px; |
|
border-bottom-style: solid; |
|
border-bottom-color: rgb(238, 238, 238); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h2 .anchor { |
|
line-height: 1; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h3 { |
|
font-size: 1.5em; |
|
line-height: 1.43; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h3 .anchor { |
|
line-height: 1.2; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h4 { |
|
font-size: 1.25em; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h4 .anchor { |
|
line-height: 1.2; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h5 { |
|
font-size: 1em; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h5 .anchor { |
|
line-height: 1.1; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h6 { |
|
font-size: 1em; |
|
color: rgb(119, 119, 119); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] h6 .anchor { |
|
line-height: 1.1; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] p, |
|
.markdown-preview[data-use-github-style] blockquote, |
|
.markdown-preview[data-use-github-style] ul, |
|
.markdown-preview[data-use-github-style] ol, |
|
.markdown-preview[data-use-github-style] dl, |
|
.markdown-preview[data-use-github-style] table, |
|
.markdown-preview[data-use-github-style] pre { |
|
margin-top: 0px; |
|
margin-bottom: 16px; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] hr { |
|
height: 4px; |
|
padding: 0px; |
|
margin: 16px 0px; |
|
border: 0px none; |
|
background-color: rgb(231, 231, 231); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] ul, |
|
.markdown-preview[data-use-github-style] ol { |
|
padding-left: 2em; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] ul.no-list, |
|
.markdown-preview[data-use-github-style] ol.no-list { |
|
padding: 0px; |
|
list-style-type: none; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] ul ul, |
|
.markdown-preview[data-use-github-style] ul ol, |
|
.markdown-preview[data-use-github-style] ol ol, |
|
.markdown-preview[data-use-github-style] ol ul { |
|
margin-top: 0px; |
|
margin-bottom: 0px; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] li> p { |
|
margin-top: 16px; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] dl { |
|
padding: 0px; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] dl dt { |
|
padding: 0px; |
|
margin-top: 16px; |
|
font-size: 1em; |
|
font-style: italic; |
|
font-weight: bold; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] dl dd { |
|
padding: 0px 16px; |
|
margin-bottom: 16px; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] blockquote { |
|
padding: 0px 15px; |
|
color: rgb(119, 119, 119); |
|
border-left-width: 4px; |
|
border-left-style: solid; |
|
border-left-color: rgb(221, 221, 221); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] blockquote>:first-child { |
|
margin-top: 0px; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] blockquote>:last-child { |
|
margin-bottom: 0px; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] table { |
|
display: block; |
|
width: 100%; |
|
overflow: auto; |
|
word-break: keep-all; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] table th { |
|
font-weight: bold; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] table th, |
|
.markdown-preview[data-use-github-style] table td { |
|
padding: 6px 13px; |
|
border: 1px solid rgb(221, 221, 221); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] table tr { |
|
border-top-width: 1px; |
|
border-top-style: solid; |
|
border-top-color: rgb(204, 204, 204); |
|
background-color: rgb(255, 255, 255); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] table tr:nth-child(2n) { |
|
background-color: rgb(248, 248, 248); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] img { |
|
max-width: 100%; |
|
box-sizing: border-box; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] .emoji { |
|
max-width: none; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.frame { |
|
display: block; |
|
overflow: hidden; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.frame> span { |
|
display: block; |
|
float: left; |
|
width: auto; |
|
padding: 7px; |
|
margin: 13px 0px 0px; |
|
overflow: hidden; |
|
border: 1px solid rgb(221, 221, 221); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.frame span img { |
|
display: block; |
|
float: left; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.frame span span { |
|
display: block; |
|
padding: 5px 0px 0px; |
|
clear: both; |
|
color: rgb(51, 51, 51); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.align-center { |
|
display: block; |
|
overflow: hidden; |
|
clear: both; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.align-center> span { |
|
display: block; |
|
margin: 13px auto 0px; |
|
overflow: hidden; |
|
text-align: center; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.align-center span img { |
|
margin: 0px auto; |
|
text-align: center; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.align-right { |
|
display: block; |
|
overflow: hidden; |
|
clear: both; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.align-right> span { |
|
display: block; |
|
margin: 13px 0px 0px; |
|
overflow: hidden; |
|
text-align: right; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.align-right span img { |
|
margin: 0px; |
|
text-align: right; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.float-left { |
|
display: block; |
|
float: left; |
|
margin-right: 13px; |
|
overflow: hidden; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.float-left span { |
|
margin: 13px 0px 0px; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.float-right { |
|
display: block; |
|
float: right; |
|
margin-left: 13px; |
|
overflow: hidden; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] span.float-right> span { |
|
display: block; |
|
margin: 13px auto 0px; |
|
overflow: hidden; |
|
text-align: right; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] code, |
|
.markdown-preview[data-use-github-style] tt { |
|
padding: 0.2em 0px; |
|
margin: 0px; |
|
font-size: 85%; |
|
border-radius: 3px; |
|
background-color: rgba(0, 0, 0, 0.0392157); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] code::before, |
|
.markdown-preview[data-use-github-style] tt::before, |
|
.markdown-preview[data-use-github-style] code::after, |
|
.markdown-preview[data-use-github-style] tt::after { |
|
letter-spacing: -0.2em; |
|
content: " "; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] code br, |
|
.markdown-preview[data-use-github-style] tt br { |
|
display: none; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] del code { |
|
text-decoration: inherit; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] pre> code { |
|
padding: 0px; |
|
margin: 0px; |
|
font-size: 100%; |
|
word-break: normal; |
|
white-space: pre; |
|
border: 0px; |
|
background: transparent; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] .highlight { |
|
margin-bottom: 16px; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] .highlight pre, |
|
.markdown-preview[data-use-github-style] pre { |
|
padding: 16px; |
|
overflow: auto; |
|
font-size: 85%; |
|
line-height: 1.45; |
|
border-radius: 3px; |
|
background-color: rgb(247, 247, 247); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] .highlight pre { |
|
margin-bottom: 0px; |
|
word-break: normal; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] pre { |
|
word-wrap: normal; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] pre code, |
|
.markdown-preview[data-use-github-style] pre tt { |
|
display: inline; |
|
max-width: initial; |
|
padding: 0px; |
|
margin: 0px; |
|
overflow: initial; |
|
line-height: inherit; |
|
word-wrap: normal; |
|
border: 0px; |
|
background-color: transparent; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] pre code::before, |
|
.markdown-preview[data-use-github-style] pre tt::before, |
|
.markdown-preview[data-use-github-style] pre code::after, |
|
.markdown-preview[data-use-github-style] pre tt::after { |
|
content: normal; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] kbd { |
|
display: inline-block; |
|
padding: 3px 5px; |
|
font-size: 11px; |
|
line-height: 10px; |
|
color: rgb(85, 85, 85); |
|
vertical-align: middle; |
|
border-style: solid; |
|
border-width: 1px; |
|
border-color: rgb(204, 204, 204) rgb(204, 204, 204) rgb(187, 187, 187); |
|
border-radius: 3px; |
|
box-shadow: rgb(187, 187, 187) 0px -1px 0px inset; |
|
background-color: rgb(252, 252, 252); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] a { |
|
color: rgb(51, 122, 183); |
|
} |
|
|
|
.markdown-preview[data-use-github-style] code { |
|
color: inherit; |
|
} |
|
|
|
.markdown-preview[data-use-github-style] pre.editor-colors { |
|
padding: 0.8em 1em; |
|
margin-bottom: 1em; |
|
font-size: 0.85em; |
|
border-radius: 4px; |
|
overflow: auto; |
|
} |
|
|
|
.scrollbars-visible-always .markdown-preview pre.editor-colors::shadow .vertical-scrollbar, |
|
.scrollbars-visible-always .markdown-preview pre.editor-colors::shadow .horizontal-scrollbar { |
|
visibility: hidden; |
|
} |
|
|
|
.scrollbars-visible-always .markdown-preview pre.editor-colors:hover::shadow .vertical-scrollbar, |
|
.scrollbars-visible-always .markdown-preview pre.editor-colors:hover::shadow .horizontal-scrollbar { |
|
visibility: visible; |
|
} |
|
|
|
.conflict-resolved { |
|
background: #7494a3; |
|
} |
|
|
|
.conflict-ours { |
|
background: rgba(116, 148, 163, 0.4); |
|
} |
|
|
|
.conflict-ours.cursor-line { |
|
background: rgba(116, 148, 163, 0.3); |
|
} |
|
|
|
.conflict-theirs { |
|
background: rgba(141, 193, 73, 0.4); |
|
} |
|
|
|
.conflict-theirs.cursor-line { |
|
background: rgba(141, 193, 73, 0.3); |
|
} |
|
|
|
.conflict-base { |
|
background: rgba(41, 60, 68, 0.4); |
|
} |
|
|
|
.conflict-base.cursor-line { |
|
background: rgba(41, 60, 68, 0.3); |
|
} |
|
|
|
.conflict-dirty { |
|
background: rgba(204, 62, 68, 0.4); |
|
} |
|
|
|
.conflict-dirty.cursor-line { |
|
background: rgba(204, 62, 68, 0.3); |
|
} |
|
|
|
.bracket-matcher .region { |
|
border-bottom: 1px dotted lime; |
|
position: absolute; |
|
} |
|
|
|
.spell-check-misspelling .region { |
|
border-bottom: 2px dotted rgba(255, 51, 51, 0.75); |
|
} |
|
|
|
.pre.editor-colors, |
|
.host { |
|
background-color: #0e1112; |
|
color: #babebd; |
|
} |
|
|
|
.pre.editor-colors, |
|
.host { |
|
background-color: #0e1112; |
|
color: #babebd; |
|
} |
|
|
|
.pre.editor-colors .wrap-guide, |
|
.host .wrap-guide { |
|
background: rgba(245, 250, 255, 0.04); |
|
} |
|
|
|
.pre.editor-colors .indent-guide, |
|
.host .indent-guide { |
|
color: rgba(245, 250, 255, 0.04); |
|
} |
|
|
|
.pre.editor-colors .invisible-character, |
|
.host .invisible-character { |
|
color: rgba(255, 255, 255, 0.1); |
|
} |
|
|
|
.pre.editor-colors .gutter, |
|
.host .gutter { |
|
background-color: #090b0d; |
|
color: #4d5a5e; |
|
} |
|
|
|
.pre.editor-colors .gutter .line-number, |
|
.host .gutter .line-number { |
|
background: #090b0d; |
|
color: #4d5a5e; |
|
padding-left: 10px; |
|
} |
|
|
|
.pre.editor-colors .gutter .line-number.cursor-line, |
|
.host .gutter .line-number.cursor-line { |
|
background-color: #0e1112; |
|
color: #7494a3; |
|
font-weight: 100; |
|
} |
|
|
|
.pre.editor-colors .gutter .line-number.cursor-line-no-selection, |
|
.host .gutter .line-number.cursor-line-no-selection { |
|
background-color: #0e1112 !important; |
|
color: #7494a3; |
|
} |
|
|
|
.pre.editor-colors .gutter .line-number:hover, |
|
.host .gutter .line-number:hover { |
|
background-color: #090b0d !important; |
|
color: #7494a3; |
|
} |
|
|
|
.pre.editor-colors .gutter .line-number.folded, |
|
.host .gutter .line-number.folded, |
|
.pre.editor-colors .gutter .line-number:after, |
|
.host .gutter .line-number:after, |
|
.pre.editor-colors .fold-marker:after, |
|
.host .fold-marker:after { |
|
color: #FFF; |
|
background: #4d5a5e; |
|
} |
|
|
|
.pre.editor-colors .invisible, |
|
.host .invisible { |
|
color: rgba(255, 255, 255, 0.1); |
|
} |
|
|
|
.pre.editor-colors .cursor, |
|
.host .cursor { |
|
border-color: #babebd !important; |
|
border-left: solid 2px; |
|
} |
|
|
|
.pre.editor-colors .selection .region, |
|
.host .selection .region { |
|
background-color: #293c44; |
|
} |
|
|
|
.pre.editor-colors .scroll-view, |
|
.host .scroll-view { |
|
padding-left: 10px; |
|
} |
|
|
|
.pre.editor-colors .line.cursor-line, |
|
.host .line.cursor-line { |
|
background: rgba(0, 0, 0, 0.2) !important; |
|
} |
|
|
|
.bracket-matcher .region { |
|
border-bottom: 1px solid #7494a3; |
|
margin-top: 2px; |
|
} |
|
|
|
pre.editor-colors[mini] .scroll-view, |
|
.host(.mini) .scroll-view { |
|
padding-left: 1px; |
|
} |
|
|
|
.text { |
|
color: #babebd; |
|
} |
|
|
|
.complete_tag { |
|
color: #cc3e44; |
|
} |
|
|
|
.comment { |
|
color: #4d5a5e; |
|
background: none; |
|
} |
|
|
|
.constant { |
|
color: #519aba; |
|
} |
|
|
|
.constant.character.escape { |
|
color: #519aba; |
|
} |
|
|
|
.constant.name.attribute.tag { |
|
color: #7494a3; |
|
} |
|
|
|
.constant.numeric { |
|
color: #519aba; |
|
} |
|
|
|
.constant.other.color { |
|
color: #519aba; |
|
} |
|
|
|
.constant.other.symbol { |
|
color: #519aba; |
|
} |
|
|
|
.entity { |
|
color: #cbcb41; |
|
} |
|
|
|
.entity.name.class, |
|
.entity.name.type.class { |
|
color: #519aba; |
|
} |
|
|
|
.entity.name.function { |
|
color: #cbcb41; |
|
} |
|
|
|
.entity.name.section { |
|
color: #cbcb41; |
|
} |
|
|
|
.entity.name.tag { |
|
color: #7494a3; |
|
text-decoration: none; |
|
} |
|
|
|
.entity.name.tag.block, |
|
.entity.name.tag.inline, |
|
.entity.name.tag.name { |
|
color: #7494a3; |
|
} |
|
|
|
.entity.name.tag.structure { |
|
color: #7494a3; |
|
} |
|
|
|
.entity.name.tag.block { |
|
color: #7494a3; |
|
} |
|
|
|
.entity.name.type { |
|
color: #7494a3; |
|
text-decoration: none; |
|
} |
|
|
|
.entity.name.type.tag { |
|
color: #a074c4; |
|
} |
|
|
|
.entity.other.attribute-name { |
|
color: #a074c4; |
|
} |
|
|
|
.entity.other.attribute-name.id { |
|
color: #a074c4; |
|
} |
|
|
|
.entity.other.inherited-class { |
|
color: #cbcb41; |
|
} |
|
|
|
.invalid.illegal, |
|
.invalid.deprecated { |
|
background: none; |
|
color: #cc3e44; |
|
} |
|
|
|
.keyword { |
|
color: #8dc149; |
|
} |
|
|
|
.keyword.control { |
|
color: #a074c4; |
|
} |
|
|
|
.keyword.operator { |
|
color: #8dc149; |
|
} |
|
|
|
.keyword.operator.assignment { |
|
color: #4d5a5e; |
|
} |
|
|
|
.keyword.operator.new { |
|
color: #cc3e44; |
|
} |
|
|
|
.keyword.other.important { |
|
color: #cc3e44; |
|
} |
|
|
|
.keyword.other.special-method { |
|
color: #8dc149; |
|
} |
|
|
|
.keyword.other.unit { |
|
color: #8dc149; |
|
} |
|
|
|
.markup.bold { |
|
color: #babebd; |
|
font-weight: bold; |
|
} |
|
|
|
.markup.changed { |
|
color: #babebd; |
|
} |
|
|
|
.markup.deleted { |
|
color: #babebd; |
|
} |
|
|
|
.markup.heading .punctuation.definition.heading { |
|
color: #babebd; |
|
} |
|
|
|
.markup.inserted { |
|
color: #babebd; |
|
} |
|
|
|
.markup.italic { |
|
color: #babebd; |
|
font-style: italic; |
|
} |
|
|
|
.markup.list { |
|
color: #babebd; |
|
} |
|
|
|
.markup.quote { |
|
color: #b1c3cc; |
|
} |
|
|
|
.markup.raw.inline { |
|
color: #babebd; |
|
} |
|
|
|
.meta.link { |
|
color: #babebd; |
|
} |
|
|
|
.meta.require { |
|
color: #babebd; |
|
} |
|
|
|
.meta.brace.curly { |
|
color: #6b7471; |
|
} |
|
|
|
.meta.brace.round { |
|
color: #babebd; |
|
} |
|
|
|
.meta.control.flow { |
|
color: #a074c4; |
|
} |
|
|
|
.meta.comma { |
|
color: #4d5a5e; |
|
} |
|
|
|
.meta.selector { |
|
color: #4d5a5e; |
|
} |
|
|
|
.meta.separator { |
|
background-color: #4d5a5e; |
|
color: #4d5a5e; |
|
} |
|
|
|
.meta.tag { |
|
color: #7494a3; |
|
} |
|
|
|
.none { |
|
color: #babebd; |
|
} |
|
|
|
.punctuation { |
|
color: #4d5a5e; |
|
} |
|
|
|
.punctuation.terminator { |
|
color: #4d5a5e; |
|
} |
|
|
|
.punctuation.separator { |
|
color: #4d5a5e; |
|
} |
|
|
|
.punctuation.definition { |
|
color: #4d5a5e; |
|
} |
|
|
|
.punctuation.definition.array { |
|
color: #7494a3; |
|
} |
|
|
|
.punctuation.definition.bold { |
|
color: #babebd; |
|
font-weight: bold; |
|
} |
|
|
|
.punctuation.definition.comment { |
|
color: #4d5a5e; |
|
} |
|
|
|
.punctuation.definition.heading, |
|
.punctuation.definition.identity, |
|
.punctuation.definition.italic { |
|
color: #babebd; |
|
} |
|
|
|
.punctuation.definition.italic { |
|
font-style: italic; |
|
} |
|
|
|
.punctuation.definition.string { |
|
color: #7494a3; |
|
} |
|
|
|
.punctuation.definition.string.begin, |
|
.punctuation.definition.string.end { |
|
color: #b1c3cc; |
|
} |
|
|
|
.punctuation.definition.variable { |
|
color: #cc3e44; |
|
} |
|
|
|
.punctuation.definition.parameters { |
|
color: #babebd; |
|
} |
|
|
|
.punctuation.definition.tag { |
|
color: #7494a3; |
|
} |
|
|
|
.punctuation.section.embedded { |
|
color: #babebd; |
|
} |
|
|
|
.string { |
|
color: #7494a3; |
|
} |
|
|
|
.string .constant { |
|
color: #519aba; |
|
} |
|
|
|
.string.interpolated { |
|
color: #cc3e44; |
|
} |
|
|
|
.string.regexp { |
|
color: #7494a3; |
|
} |
|
|
|
.string.regexp .constant.character.escape, |
|
.string.regexp .source.ruby.embedded, |
|
.string.regexp .string.regexp.arbitrary-repitition { |
|
color: #7494a3; |
|
} |
|
|
|
.string.regexp.group { |
|
color: #7494a3; |
|
} |
|
|
|
.string.regexp.character-class { |
|
color: #7494a3; |
|
} |
|
|
|
.string.regexp .source.ruby.embedded { |
|
color: #7494a3; |
|
} |
|
|
|
.string.quoted.double { |
|
color: #b1c3cc; |
|
} |
|
|
|
.string.quoted.single { |
|
color: #b1c3cc; |
|
} |
|
|
|
.string .variable { |
|
color: #cc3e44; |
|
} |
|
|
|
.string.other.link { |
|
color: #7494a3; |
|
} |
|
|
|
.source { |
|
color: #7494a3; |
|
} |
|
|
|
.storage { |
|
color: #d4d7d6; |
|
} |
|
|
|
.storage.modifier { |
|
color: #d4d7d6; |
|
} |
|
|
|
.storage.type.class { |
|
color: #d4d7d6; |
|
} |
|
|
|
.storage.type.function { |
|
color: #d4d7d6; |
|
} |
|
|
|
.storage.type.var { |
|
color: #d4d7d6; |
|
} |
|
|
|
.support { |
|
color: #519aba; |
|
} |
|
|
|
.support.class { |
|
color: #519aba; |
|
} |
|
|
|
.support.function { |
|
color: #cbcb41; |
|
} |
|
|
|
.support.function.decl { |
|
color: #7494a3; |
|
} |
|
|
|
.support.constant { |
|
color: #519aba; |
|
} |
|
|
|
.support.type.property-name { |
|
color: #babebd; |
|
} |
|
|
|
.variable { |
|
color: #cc3e44; |
|
} |
|
|
|
.variable.control.import.include { |
|
color: #a074c4; |
|
} |
|
|
|
.variable.other { |
|
color: #8dc149; |
|
} |
|
|
|
.variable.other.property { |
|
color: #8dc149; |
|
} |
|
|
|
.variable.other.module { |
|
color: #519aba; |
|
} |
|
|
|
.variable.other.module-alias { |
|
color: #7494a3; |
|
} |
|
|
|
.variable.other.object { |
|
color: #a074c4; |
|
} |
|
|
|
.variable.parameter.function { |
|
color: #cbcb41; |
|
} |
|
|
|
.source.json .meta.structure.dictionary.json> .string.quoted.json { |
|
color: #7494a3; |
|
} |
|
|
|
.source.json .meta.structure.dictionary.json> .string.quoted.json> .punctuation.string { |
|
color: #7494a3; |
|
} |
|
|
|
.source.json .meta.structure.dictionary.json> .value.json> .string.quoted.json, |
|
.source.json .meta.structure.array.json> .value.json> .string.quoted.json, |
|
.source.json .meta.structure.dictionary.json> .value.json> .string.quoted.json> .punctuation, |
|
.source.json .meta.structure.array.json> .value.json> .string.quoted.json> .punctuation { |
|
color: #babebd; |
|
} |
|
|
|
.source.json .meta.structure.dictionary.json> .constant.language.json, |
|
.source.json .meta.structure.array.json> .constant.language.json { |
|
color: #519aba; |
|
} |
|
|
|
.mustache .meta.tag.template { |
|
color: #7494a3; |
|
} |
|
|
|
.mustache .meta.tag.template .entity.name.tag { |
|
color: #b1c3cc; |
|
} |
|
|
|
.source.python .class { |
|
color: #519aba; |
|
} |
|
|
|
.source.python .support.function.magic, |
|
.source.python .inherited-class { |
|
color: #d7666b; |
|
} |
|
|
|
.source.python .support.function.magic .support.function.builtin.python, |
|
.source.python .inherited-class .support.function.builtin.python { |
|
color: #d7666b; |
|
} |
|
|
|
.source.python .storage, |
|
.source.python .keyword { |
|
color: #d4d7d6; |
|
} |
|
|
|
.source.python .string { |
|
color: #7494a3; |
|
} |
|
|
|
.source.python .string.block { |
|
color: #465f6b; |
|
} |
|
|
|
.source.python .string.block .keyword { |
|
color: #465f6b; |
|
} |
|
|
|
pre.editor-colors .line.split-diff-added, |
|
pre.editor-colors::shadow .line.split-diff-added { |
|
background: #8dc149 !important; |
|
color: rgba(0, 0, 0, 0.5) !important; |
|
} |
|
|
|
pre.editor-colors .line.split-diff-added .text span, |
|
pre.editor-colors::shadow .line.split-diff-added .text span, |
|
pre.editor-colors .line.split-diff-added .source span, |
|
pre.editor-colors::shadow .line.split-diff-added .source span { |
|
color: rgba(0, 0, 0, 0.5) !important; |
|
} |
|
|
|
pre.editor-colors .line.split-diff-added .indent-guide, |
|
pre.editor-colors::shadow .line.split-diff-added .indent-guide { |
|
opacity: 0; |
|
} |
|
|
|
pre.editor-colors .line.split-diff-removed, |
|
pre.editor-colors::shadow .line.split-diff-removed { |
|
background: #cc3e44 !important; |
|
color: rgba(255, 255, 255, 0.8) !important; |
|
} |
|
|
|
pre.editor-colors .line.split-diff-removed .text span, |
|
pre.editor-colors::shadow .line.split-diff-removed .text span, |
|
pre.editor-colors .line.split-diff-removed .source span, |
|
pre.editor-colors::shadow .line.split-diff-removed .source span { |
|
color: rgba(255, 255, 255, 0.8) !important; |
|
} |
|
|
|
pre.editor-colors .line.split-diff-removed .indent-guide, |
|
pre.editor-colors::shadow .line.split-diff-removed .indent-guide { |
|
opacity: 0; |
|
} |
|
strong { |
|
text-transform: capitalize; |
|
} |
|
</style> |
|
</head> |
|
|
|
<body class='markdown-preview' data-use-github-style> |
|
<h1 id="responsive-web-design-glossary">Responsive Web Design Glossary</h1> |
|
<p><strong>adaptive</strong> — While responsive designs fluidly serve all devices with |
|
one set of client-side code, adaptive solutions require server-side negotiation |
|
to serve different content or HTML to the same URL, targeted based on device type |
|
or other known contextual variables. See adaptive content, adaptive design.</p> |
|
<p><strong>adaptive content</strong> — Structured content that can be targeted based |
|
on known characteristics of the user or the device. Serving different content to |
|
smartphones, tablets, and desktops is one common use, but adaptive content also |
|
supports contextual targeting (like location or time of day) and user-specific |
|
personalization. |
|
</p> |
|
<p><strong>adaptive design</strong> — Serving different HTML to solve device-specific |
|
layout problems. This can include device-specific pages (like a mobile landing |
|
page) or even device-specific functionality (like serving a different table to |
|
smartphone and desktop users).</p> |
|
<p><strong>adaptive grid</strong> — A series of fixed-width grid structures that snap |
|
into place at device-specific sizes, rather than being completely fluid, as in |
|
a fully responsive design. Unlike other adaptive solutions, adaptive grids do not |
|
require different HTML or server-side negotiation. See fixed-width, fluid grid.</p> |
|
<p><strong>breakpoint</strong> — The specified browser widths and heights where the |
|
layout shifts to rearrange, collapse, or hide elements on the page in a responsive |
|
design. Major breakpoints define significant changes in the design (like shifting |
|
the layout from a single column to two columns.) Minor breakpoints define small |
|
Gloss ary 129 adjustments to improve readability or usability (like increasing |
|
the font size or adding more padding around elements.)</p> |
|
<p><strong>canonical URL</strong> — When the same web page may appear at multiple URLs, |
|
Google prefers that a single URL is selected as the preferred URL for indexing. |
|
To prevent Google from indexing the identical content on both a desktop site and |
|
an m-dot domain, a canonical URL defines which version should be used. See m-dot.</p> |
|
<p><strong>content choreography</strong> — Maintaining correct hierarchy of modules |
|
as layouts shift across multiple columns. Rather than simply stacking modules (so |
|
items in the right column at larger breakpoints wind up at the bottom of the page |
|
at smaller breakpoints), these modules can be interleaved at smaller breakpoints |
|
so they appear in the correct order.</p> |
|
<p><strong>design system</strong> — A defined set of grids, color palettes, type treatments, |
|
and graphic elements like lines, buttons, and image styles, which can be applied |
|
in different ways to create a more consistent visual identity. See pattern library, |
|
frontend framework. |
|
</p> |
|
<p><strong>designing in the browser</strong> — Using code-based prototyping tools in |
|
the design process instead of applications like Photoshop that provide static layouts. |
|
Front-end frameworks are often used to simplify this process.</p> |
|
<p><strong>device detection</strong> — Using a third-party library (often proprietary) |
|
to identify the device type and capabilities of the device. Device detection is |
|
required for adaptive and m-dot sites; responsive sites are built fluidly on the |
|
client side and do not require it. See adaptive, m-dot, UA detection.</p> |
|
<p><strong>fixed-width</strong> — A web page with a static, predefined pixel width that |
|
does not change in relation to the size of the browser window. Before responsive |
|
design, most websites had a fixed width of around 1000 pixels, which was designed |
|
to fill the screen of\ a 1024×768 monitor, the most common screen resolution at |
|
the time. See adaptive grid, fluid grid.</p> |
|
<p><strong>fluid grid</strong> — Responsive design is based on a fluid grid, where the |
|
maximum width of the web page, as well as the columns and containers within, are |
|
defined using proportional widths instead of fixed pixel-based dimensions. Objects |
|
change their widths and heights in relation to the size of the browser window. |
|
See adaptive grid, fixed-width, relative units.</p> |
|
<p><strong>the fold</strong> — Content placed at the top of the page that does not require |
|
scrolling to view is considered “above the fold.” Because mobile devices have diverse, |
|
smaller screen sizes, it is less important to place information above the fold. |
|
Design techniques should encourage scrolling and ensure that calls to action are |
|
placed where users are prepared to act on them.</p> |
|
<p><strong>front-end framework</strong> — A mostly complete package of all the commonly |
|
used structures, layouts, and components that make up a website, implemented with |
|
standardized HTML, CSS, and JavaScript so developers can reuse predefined (but |
|
generic) code. See design system, pattern library.</p> |
|
<p><strong>graceful degradation</strong> — Delivers an ideal experience to users with |
|
modern browsers or devices, but offers fallbacks for situations where the ideal |
|
experience is not supported. See progressive enhancement. |
|
</p> |
|
<p><strong>hamburger menu</strong> — An icon showing three lines, which users tap to |
|
see the navigation options on devices with insufficient screen real estate to display |
|
the full navigation bar. Critics argue that hiding the menu under an unclear icon |
|
makes the site more difficult to navigate.</p> |
|
<p><strong>high-res images</strong> — Devices with higher pixel density (like Retina |
|
devices from Apple) require images with the same pixel density—otherwise the images |
|
appear pixellated or too small. Images with higher resolution are heavier and will |
|
slow down performance, so they should only be sent to devices that require them. |
|
See responsive images.</p> |
|
<p><strong>m-dot</strong> — Instead of a single responsively designed website, a separate |
|
website served only to mobile devices, usually served on a subdomain like m.domain.com. |
|
See device detection.</p> |
|
<p><strong>media queries</strong> — Enable the browser to test whether a device supports |
|
a particular media type and desired features, like a screen that has a minimum |
|
width of 780 pixels. In response, the browser loads different CSS which changes |
|
the way the content appears. Adding support for media queries to the CSS3 spec |
|
is what made responsive web design possible.</p> |
|
<p><strong>mobile first</strong> — Using the constraints and capabilities of mobile |
|
devices to focus and prioritize. By starting with the most constrained smartphone |
|
form factor, teams are forced to make choices. It’s easier to start small and work |
|
up than to start with a desktop site and try to fit everything into a smaller view.</p> |
|
<p><strong>pattern library</strong> — A set of reusable interactive elements, like date |
|
pickers, pagination, or navigation styles, that developers can copy and paste into |
|
designs to save time and foster consistency across the site. Usually custom-designed |
|
for a specific website or brand and intended to be used as independent objects. |
|
See design system, front-end framework.</p> |
|
<p><strong>perceived performance</strong> — Techniques to optimize how fast the website |
|
appears to load so users can begin interacting. Sites that enable users to begin |
|
interacting more quickly feel faster, even if the page has not fully rendered.</p> |
|
<p><strong>pixel perfect</strong> — Coding and testing websites so they are identical |
|
across every browser. A responsive design does not need to look the same in all |
|
browsers.</p> |
|
<p><strong>progressive disclosure</strong> — A design technique that sequences the flow |
|
of information across screens, so users can focus on what’s required to complete |
|
a task without being distracted or overwhelmed by unnecessary information. It is |
|
not the same as progressive enhancement.</p> |
|
<p><strong>progressive enhancement</strong> — Delivers a baseline of usable functionality |
|
to everyone, then layers on additional features or enhancements for browsers that |
|
can support them. By starting with the lowest common denominator and testing for |
|
support for enhancements before applying them, more capable browsers can deliver |
|
a better user experience while less capable browsers still deliver a functional |
|
experience. See graceful degradation. |
|
</p> |
|
<p><strong>prototype</strong> — Responsive designs require a prototype for making design |
|
decisions, rather than relying solely on static comps. Responsive prototypes often |
|
show only front-end behaviors, though some are integrated with data from the backend.</p> |
|
<p><strong>relative units</strong> — Responsive designs use proportional sizing, like |
|
percentages for widths or ems for font sizes, rather than using absolute units |
|
like pixels. Sizes of page elements like fonts or images are defined in relation |
|
to the size of the browser window.</p> |
|
<p><strong>responsive images</strong> — Because screens have different sizes and pixel |
|
densities, different images often need to be sent to different devices. New HTML |
|
markup attributes srcset, sizes, and picture enable developers to scale image sizes |
|
appropriately and provide multiple image source files.</p> |
|
<p><strong>user agent (UA) detection</strong> — Identifying the browser rendering engine |
|
using the user-agent string for the purpose of serving different HTML to different |
|
browsers. Notoriously inaccurate, as browsers identify themselves as other browsers |
|
to “spoof ” UA detection. Responsive design does not require UA detection. See |
|
device detection.</p> |
|
<p><strong>viewport</strong> — The size of a webpage rendered in the browser window |
|
minus any browser chrome. Early mobile devices relied on two sizes of viewports: |
|
the visual viewport defined the visible screen real estate (say, 320 pixels), while |
|
the layout viewport was a larger virtual screen size (say, 980 pixels). This enabled |
|
existing desktop websites to be scaled and zoomed on smaller devices.</p> |
|
<p><strong>web standards</strong> — A philosophy of web design and development that |
|
encourages adhering to formal standards and practices for writing HTML, CSS, and |
|
JavaScript, to ensure accessibility and valid semantic encoding.</p> |
|
</body> |
|
|
|
</html> |
