mirror of
https://github.com/squidfunk/mkdocs-material.git
synced 2024-11-27 17:00:54 +01:00
Migrated first features to RxJS
This commit is contained in:
squidfunk
parent
34cc56bf28
commit
a633f4fec7
2
Makefile
2
Makefile
@ -127,7 +127,7 @@ SCRIPT_PARTIALS = $(shell find src -name "*.ts*")
|
||||
material/assets/javascripts: $$@/lunr material/assets/javascripts/app.js
|
||||
material/assets/javascripts/app.js: ${SCRIPT} ${SCRIPT_PARTIALS} | $$(@D)/.
|
||||
@ echo "+ $@"
|
||||
@ node -r ts-node/register fusebox
|
||||
@ ${BIN}/webpack --mode production
|
||||
|
||||
# -----------------------------------------------------------------------------
|
||||
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -3,7 +3,6 @@ button[data-md-color-accent] {
|
||||
width: 6.5rem;
|
||||
margin-bottom: 0.2rem;
|
||||
padding: 1.2rem 0.4rem 0.2rem;
|
||||
-webkit-transition: background-color 0.25s, opacity 0.25s;
|
||||
transition: background-color 0.25s, opacity 0.25s;
|
||||
border-radius: 0.1rem;
|
||||
color: white;
|
||||
@ -33,6 +32,18 @@ button[data-md-color-primary="red"] {
|
||||
[data-md-color-primary="red"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="red"] .md-nav__source {
|
||||
background-color: rgba(190, 66, 64, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="red"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #ef5350; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="red"] .md-tabs {
|
||||
background-color: #ef5350; } }
|
||||
|
||||
button[data-md-color-primary="pink"] {
|
||||
background-color: #e91e63; }
|
||||
|
||||
@ -52,6 +63,18 @@ button[data-md-color-primary="pink"] {
|
||||
[data-md-color-primary="pink"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="pink"] .md-nav__source {
|
||||
background-color: rgba(185, 24, 79, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="pink"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #e91e63; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="pink"] .md-tabs {
|
||||
background-color: #e91e63; } }
|
||||
|
||||
button[data-md-color-primary="purple"] {
|
||||
background-color: #ab47bc; }
|
||||
|
||||
@ -71,6 +94,18 @@ button[data-md-color-primary="purple"] {
|
||||
[data-md-color-primary="purple"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="purple"] .md-nav__source {
|
||||
background-color: rgba(136, 57, 150, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="purple"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #ab47bc; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="purple"] .md-tabs {
|
||||
background-color: #ab47bc; } }
|
||||
|
||||
button[data-md-color-primary="deep-purple"] {
|
||||
background-color: #7e57c2; }
|
||||
|
||||
@ -90,6 +125,18 @@ button[data-md-color-primary="deep-purple"] {
|
||||
[data-md-color-primary="deep-purple"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="deep-purple"] .md-nav__source {
|
||||
background-color: rgba(100, 69, 154, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="deep-purple"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #7e57c2; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="deep-purple"] .md-tabs {
|
||||
background-color: #7e57c2; } }
|
||||
|
||||
button[data-md-color-primary="indigo"] {
|
||||
background-color: #3f51b5; }
|
||||
|
||||
@ -109,6 +156,18 @@ button[data-md-color-primary="indigo"] {
|
||||
[data-md-color-primary="indigo"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="indigo"] .md-nav__source {
|
||||
background-color: rgba(50, 64, 144, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="indigo"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #3f51b5; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="indigo"] .md-tabs {
|
||||
background-color: #3f51b5; } }
|
||||
|
||||
button[data-md-color-primary="blue"] {
|
||||
background-color: #2196f3; }
|
||||
|
||||
@ -128,6 +187,18 @@ button[data-md-color-primary="blue"] {
|
||||
[data-md-color-primary="blue"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="blue"] .md-nav__source {
|
||||
background-color: rgba(26, 119, 193, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="blue"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #2196f3; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="blue"] .md-tabs {
|
||||
background-color: #2196f3; } }
|
||||
|
||||
button[data-md-color-primary="light-blue"] {
|
||||
background-color: #03a9f4; }
|
||||
|
||||
@ -147,6 +218,18 @@ button[data-md-color-primary="light-blue"] {
|
||||
[data-md-color-primary="light-blue"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="light-blue"] .md-nav__source {
|
||||
background-color: rgba(2, 134, 194, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="light-blue"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #03a9f4; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="light-blue"] .md-tabs {
|
||||
background-color: #03a9f4; } }
|
||||
|
||||
button[data-md-color-primary="cyan"] {
|
||||
background-color: #00bcd4; }
|
||||
|
||||
@ -166,6 +249,18 @@ button[data-md-color-primary="cyan"] {
|
||||
[data-md-color-primary="cyan"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="cyan"] .md-nav__source {
|
||||
background-color: rgba(0, 150, 169, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="cyan"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #00bcd4; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="cyan"] .md-tabs {
|
||||
background-color: #00bcd4; } }
|
||||
|
||||
button[data-md-color-primary="teal"] {
|
||||
background-color: #009688; }
|
||||
|
||||
@ -185,6 +280,18 @@ button[data-md-color-primary="teal"] {
|
||||
[data-md-color-primary="teal"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="teal"] .md-nav__source {
|
||||
background-color: rgba(0, 119, 108, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="teal"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #009688; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="teal"] .md-tabs {
|
||||
background-color: #009688; } }
|
||||
|
||||
button[data-md-color-primary="green"] {
|
||||
background-color: #4caf50; }
|
||||
|
||||
@ -204,6 +311,18 @@ button[data-md-color-primary="green"] {
|
||||
[data-md-color-primary="green"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="green"] .md-nav__source {
|
||||
background-color: rgba(60, 139, 64, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="green"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #4caf50; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="green"] .md-tabs {
|
||||
background-color: #4caf50; } }
|
||||
|
||||
button[data-md-color-primary="light-green"] {
|
||||
background-color: #7cb342; }
|
||||
|
||||
@ -223,6 +342,18 @@ button[data-md-color-primary="light-green"] {
|
||||
[data-md-color-primary="light-green"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="light-green"] .md-nav__source {
|
||||
background-color: rgba(99, 142, 53, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="light-green"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #7cb342; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="light-green"] .md-tabs {
|
||||
background-color: #7cb342; } }
|
||||
|
||||
button[data-md-color-primary="lime"] {
|
||||
background-color: #c0ca33; }
|
||||
|
||||
@ -242,6 +373,18 @@ button[data-md-color-primary="lime"] {
|
||||
[data-md-color-primary="lime"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="lime"] .md-nav__source {
|
||||
background-color: rgba(153, 161, 41, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="lime"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #c0ca33; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="lime"] .md-tabs {
|
||||
background-color: #c0ca33; } }
|
||||
|
||||
button[data-md-color-primary="yellow"] {
|
||||
background-color: #f9a825; }
|
||||
|
||||
@ -261,6 +404,18 @@ button[data-md-color-primary="yellow"] {
|
||||
[data-md-color-primary="yellow"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="yellow"] .md-nav__source {
|
||||
background-color: rgba(198, 134, 29, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="yellow"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #f9a825; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="yellow"] .md-tabs {
|
||||
background-color: #f9a825; } }
|
||||
|
||||
button[data-md-color-primary="amber"] {
|
||||
background-color: #ffa000; }
|
||||
|
||||
@ -280,6 +435,18 @@ button[data-md-color-primary="amber"] {
|
||||
[data-md-color-primary="amber"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="amber"] .md-nav__source {
|
||||
background-color: rgba(203, 127, 0, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="amber"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #ffa000; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="amber"] .md-tabs {
|
||||
background-color: #ffa000; } }
|
||||
|
||||
button[data-md-color-primary="orange"] {
|
||||
background-color: #fb8c00; }
|
||||
|
||||
@ -299,6 +466,18 @@ button[data-md-color-primary="orange"] {
|
||||
[data-md-color-primary="orange"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="orange"] .md-nav__source {
|
||||
background-color: rgba(200, 111, 0, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="orange"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #fb8c00; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="orange"] .md-tabs {
|
||||
background-color: #fb8c00; } }
|
||||
|
||||
button[data-md-color-primary="deep-orange"] {
|
||||
background-color: #ff7043; }
|
||||
|
||||
@ -318,6 +497,18 @@ button[data-md-color-primary="deep-orange"] {
|
||||
[data-md-color-primary="deep-orange"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="deep-orange"] .md-nav__source {
|
||||
background-color: rgba(203, 89, 53, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="deep-orange"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #ff7043; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="deep-orange"] .md-tabs {
|
||||
background-color: #ff7043; } }
|
||||
|
||||
button[data-md-color-primary="brown"] {
|
||||
background-color: #795548; }
|
||||
|
||||
@ -337,6 +528,18 @@ button[data-md-color-primary="brown"] {
|
||||
[data-md-color-primary="brown"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="brown"] .md-nav__source {
|
||||
background-color: rgba(96, 68, 57, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="brown"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #795548; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="brown"] .md-tabs {
|
||||
background-color: #795548; } }
|
||||
|
||||
button[data-md-color-primary="grey"] {
|
||||
background-color: #757575; }
|
||||
|
||||
@ -356,6 +559,18 @@ button[data-md-color-primary="grey"] {
|
||||
[data-md-color-primary="grey"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="grey"] .md-nav__source {
|
||||
background-color: rgba(93, 93, 93, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="grey"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #757575; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="grey"] .md-tabs {
|
||||
background-color: #757575; } }
|
||||
|
||||
button[data-md-color-primary="blue-grey"] {
|
||||
background-color: #546e7a; }
|
||||
|
||||
@ -375,6 +590,18 @@ button[data-md-color-primary="blue-grey"] {
|
||||
[data-md-color-primary="blue-grey"] .md-nav__item--nested > .md-nav__link {
|
||||
color: inherit; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="blue-grey"] .md-nav__source {
|
||||
background-color: rgba(67, 88, 97, 0.9675); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="blue-grey"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #546e7a; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="blue-grey"] .md-tabs {
|
||||
background-color: #546e7a; } }
|
||||
|
||||
button[data-md-color-primary="white"] {
|
||||
background-color: white;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
@ -390,6 +617,30 @@ button[data-md-color-primary="white"] {
|
||||
[data-md-color-primary="white"] .md-hero--expand {
|
||||
border-bottom: 0.05rem solid rgba(0, 0, 0, 0.07); }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="white"] .md-nav__source {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
color: rgba(0, 0, 0, 0.87); } }
|
||||
|
||||
@media only screen and (min-width: 60em) {
|
||||
[data-md-color-primary="white"] .md-search__input {
|
||||
background-color: rgba(0, 0, 0, 0.07); }
|
||||
[data-md-color-primary="white"] .md-search__input::placeholder {
|
||||
color: rgba(0, 0, 0, 0.54); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="white"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: white;
|
||||
color: rgba(0, 0, 0, 0.87); }
|
||||
[data-md-color-primary="white"] .md-hero {
|
||||
border-bottom: 0.05rem solid rgba(0, 0, 0, 0.07); } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="white"] .md-tabs {
|
||||
border-bottom: 0.05rem solid rgba(0, 0, 0, 0.07);
|
||||
background-color: white;
|
||||
color: rgba(0, 0, 0, 0.87); } }
|
||||
|
||||
button[data-md-color-primary="black"] {
|
||||
background-color: #000; }
|
||||
|
||||
@ -399,6 +650,22 @@ button[data-md-color-primary="black"] {
|
||||
[data-md-color-primary="black"] .md-hero {
|
||||
background-color: #000; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="black"] .md-nav__source {
|
||||
background-color: #404040; } }
|
||||
|
||||
@media only screen and (min-width: 60em) {
|
||||
[data-md-color-primary="black"] .md-search__input {
|
||||
background-color: rgba(255, 255, 255, 0.3); } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="black"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #000; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="black"] .md-tabs {
|
||||
background-color: #000; } }
|
||||
|
||||
button[data-md-color-accent="red"] {
|
||||
background-color: #ff1744; }
|
||||
|
||||
@ -1039,157 +1306,4 @@ button[data-md-color-accent="deep-orange"] {
|
||||
[data-md-color-accent="deep-orange"] .md-source-file:hover::before {
|
||||
background-color: #ff6e40; }
|
||||
|
||||
@media only screen and (max-width: 59.9375em) {
|
||||
[data-md-color-primary="red"] .md-nav__source {
|
||||
background-color: rgba(190, 66, 64, 0.9675); }
|
||||
[data-md-color-primary="pink"] .md-nav__source {
|
||||
background-color: rgba(185, 24, 79, 0.9675); }
|
||||
[data-md-color-primary="purple"] .md-nav__source {
|
||||
background-color: rgba(136, 57, 150, 0.9675); }
|
||||
[data-md-color-primary="deep-purple"] .md-nav__source {
|
||||
background-color: rgba(100, 69, 154, 0.9675); }
|
||||
[data-md-color-primary="indigo"] .md-nav__source {
|
||||
background-color: rgba(50, 64, 144, 0.9675); }
|
||||
[data-md-color-primary="blue"] .md-nav__source {
|
||||
background-color: rgba(26, 119, 193, 0.9675); }
|
||||
[data-md-color-primary="light-blue"] .md-nav__source {
|
||||
background-color: rgba(2, 134, 194, 0.9675); }
|
||||
[data-md-color-primary="cyan"] .md-nav__source {
|
||||
background-color: rgba(0, 150, 169, 0.9675); }
|
||||
[data-md-color-primary="teal"] .md-nav__source {
|
||||
background-color: rgba(0, 119, 108, 0.9675); }
|
||||
[data-md-color-primary="green"] .md-nav__source {
|
||||
background-color: rgba(60, 139, 64, 0.9675); }
|
||||
[data-md-color-primary="light-green"] .md-nav__source {
|
||||
background-color: rgba(99, 142, 53, 0.9675); }
|
||||
[data-md-color-primary="lime"] .md-nav__source {
|
||||
background-color: rgba(153, 161, 41, 0.9675); }
|
||||
[data-md-color-primary="yellow"] .md-nav__source {
|
||||
background-color: rgba(198, 134, 29, 0.9675); }
|
||||
[data-md-color-primary="amber"] .md-nav__source {
|
||||
background-color: rgba(203, 127, 0, 0.9675); }
|
||||
[data-md-color-primary="orange"] .md-nav__source {
|
||||
background-color: rgba(200, 111, 0, 0.9675); }
|
||||
[data-md-color-primary="deep-orange"] .md-nav__source {
|
||||
background-color: rgba(203, 89, 53, 0.9675); }
|
||||
[data-md-color-primary="brown"] .md-nav__source {
|
||||
background-color: rgba(96, 68, 57, 0.9675); }
|
||||
[data-md-color-primary="grey"] .md-nav__source {
|
||||
background-color: rgba(93, 93, 93, 0.9675); }
|
||||
[data-md-color-primary="blue-grey"] .md-nav__source {
|
||||
background-color: rgba(67, 88, 97, 0.9675); }
|
||||
[data-md-color-primary="white"] .md-nav__source {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
color: rgba(0, 0, 0, 0.87); }
|
||||
[data-md-color-primary="black"] .md-nav__source {
|
||||
background-color: #404040; } }
|
||||
|
||||
@media only screen and (max-width: 76.1875em) {
|
||||
html [data-md-color-primary="red"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #ef5350; }
|
||||
html [data-md-color-primary="pink"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #e91e63; }
|
||||
html [data-md-color-primary="purple"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #ab47bc; }
|
||||
html [data-md-color-primary="deep-purple"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #7e57c2; }
|
||||
html [data-md-color-primary="indigo"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #3f51b5; }
|
||||
html [data-md-color-primary="blue"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #2196f3; }
|
||||
html [data-md-color-primary="light-blue"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #03a9f4; }
|
||||
html [data-md-color-primary="cyan"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #00bcd4; }
|
||||
html [data-md-color-primary="teal"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #009688; }
|
||||
html [data-md-color-primary="green"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #4caf50; }
|
||||
html [data-md-color-primary="light-green"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #7cb342; }
|
||||
html [data-md-color-primary="lime"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #c0ca33; }
|
||||
html [data-md-color-primary="yellow"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #f9a825; }
|
||||
html [data-md-color-primary="amber"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #ffa000; }
|
||||
html [data-md-color-primary="orange"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #fb8c00; }
|
||||
html [data-md-color-primary="deep-orange"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #ff7043; }
|
||||
html [data-md-color-primary="brown"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #795548; }
|
||||
html [data-md-color-primary="grey"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #757575; }
|
||||
html [data-md-color-primary="blue-grey"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #546e7a; }
|
||||
html [data-md-color-primary="white"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: white;
|
||||
color: rgba(0, 0, 0, 0.87); }
|
||||
[data-md-color-primary="white"] .md-hero {
|
||||
border-bottom: 0.05rem solid rgba(0, 0, 0, 0.07); }
|
||||
html [data-md-color-primary="black"] .md-nav--primary .md-nav__title--site {
|
||||
background-color: #000; } }
|
||||
|
||||
@media only screen and (min-width: 76.25em) {
|
||||
[data-md-color-primary="red"] .md-tabs {
|
||||
background-color: #ef5350; }
|
||||
[data-md-color-primary="pink"] .md-tabs {
|
||||
background-color: #e91e63; }
|
||||
[data-md-color-primary="purple"] .md-tabs {
|
||||
background-color: #ab47bc; }
|
||||
[data-md-color-primary="deep-purple"] .md-tabs {
|
||||
background-color: #7e57c2; }
|
||||
[data-md-color-primary="indigo"] .md-tabs {
|
||||
background-color: #3f51b5; }
|
||||
[data-md-color-primary="blue"] .md-tabs {
|
||||
background-color: #2196f3; }
|
||||
[data-md-color-primary="light-blue"] .md-tabs {
|
||||
background-color: #03a9f4; }
|
||||
[data-md-color-primary="cyan"] .md-tabs {
|
||||
background-color: #00bcd4; }
|
||||
[data-md-color-primary="teal"] .md-tabs {
|
||||
background-color: #009688; }
|
||||
[data-md-color-primary="green"] .md-tabs {
|
||||
background-color: #4caf50; }
|
||||
[data-md-color-primary="light-green"] .md-tabs {
|
||||
background-color: #7cb342; }
|
||||
[data-md-color-primary="lime"] .md-tabs {
|
||||
background-color: #c0ca33; }
|
||||
[data-md-color-primary="yellow"] .md-tabs {
|
||||
background-color: #f9a825; }
|
||||
[data-md-color-primary="amber"] .md-tabs {
|
||||
background-color: #ffa000; }
|
||||
[data-md-color-primary="orange"] .md-tabs {
|
||||
background-color: #fb8c00; }
|
||||
[data-md-color-primary="deep-orange"] .md-tabs {
|
||||
background-color: #ff7043; }
|
||||
[data-md-color-primary="brown"] .md-tabs {
|
||||
background-color: #795548; }
|
||||
[data-md-color-primary="grey"] .md-tabs {
|
||||
background-color: #757575; }
|
||||
[data-md-color-primary="blue-grey"] .md-tabs {
|
||||
background-color: #546e7a; }
|
||||
[data-md-color-primary="white"] .md-tabs {
|
||||
border-bottom: 0.05rem solid rgba(0, 0, 0, 0.07);
|
||||
background-color: white;
|
||||
color: rgba(0, 0, 0, 0.87); }
|
||||
[data-md-color-primary="black"] .md-tabs {
|
||||
background-color: #000; } }
|
||||
|
||||
@media only screen and (min-width: 60em) {
|
||||
[data-md-color-primary="white"] .md-search__input {
|
||||
background-color: rgba(0, 0, 0, 0.07); }
|
||||
[data-md-color-primary="white"] .md-search__input::-webkit-input-placeholder {
|
||||
color: rgba(0, 0, 0, 0.54); }
|
||||
[data-md-color-primary="white"] .md-search__input::-moz-placeholder {
|
||||
color: rgba(0, 0, 0, 0.54); }
|
||||
[data-md-color-primary="white"] .md-search__input:-ms-input-placeholder {
|
||||
color: rgba(0, 0, 0, 0.54); }
|
||||
[data-md-color-primary="white"] .md-search__input::-ms-input-placeholder {
|
||||
color: rgba(0, 0, 0, 0.54); }
|
||||
[data-md-color-primary="white"] .md-search__input::placeholder {
|
||||
color: rgba(0, 0, 0, 0.54); }
|
||||
[data-md-color-primary="black"] .md-search__input {
|
||||
background-color: rgba(255, 255, 255, 0.3); } }
|
||||
/*# sourceMappingURL=app-palette.css.map */
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -212,7 +212,7 @@
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
<script>app.initialize({version:"{{ mkdocs_version }}",url:{base:"{{ base_url }}"}})</script>
|
||||
<script>app({version:"{{ mkdocs_version }}",url:{base:"{{ base_url }}"}})</script>
|
||||
{% for path in config["extra_javascript"] %}
|
||||
<script src="{{ path | url }}"></script>
|
||||
{% endfor %}
|
||||
|
||||
6409
package-lock.json
generated
6409
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -38,10 +38,10 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^12.7.8",
|
||||
"@types/webpack": "^4.39.2",
|
||||
"autoprefixer": "^9.6.1",
|
||||
"css-mqpacker": "^7.0.0",
|
||||
"csso-cli": "^2.0.2",
|
||||
"fuse-box": "^4.0.0-next.139",
|
||||
"html-minifier": "^4.0.0",
|
||||
"material-design-color": "^2.3.2",
|
||||
"material-shadows": "^3.0.1",
|
||||
@ -54,10 +54,13 @@
|
||||
"stylelint-order": "^3.1.1",
|
||||
"stylelint-scss": "^3.11.1",
|
||||
"svgo": "^1.3.0",
|
||||
"ts-loader": "^6.1.2",
|
||||
"ts-node": "^7.0.1",
|
||||
"tslint": "^5.18.0",
|
||||
"tslint-sonarts": "^1.9.0",
|
||||
"typescript": "^3.6.3"
|
||||
"typescript": "^3.6.3",
|
||||
"webpack": "^4.41.0",
|
||||
"webpack-cli": "^3.3.9"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 8"
|
||||
|
||||
@ -1 +1,266 @@
|
||||
console.log("LOL")
|
||||
/*
|
||||
* Copyright (c) 2016-2019 Martin Donath <martin.donath@squidfunk.com>
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to
|
||||
* deal in the Software without restriction, including without limitation the
|
||||
* rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
|
||||
* sell copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in
|
||||
* all copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
|
||||
* IN THE SOFTWARE.
|
||||
*/
|
||||
|
||||
import { equals, reduce } from "rambda"
|
||||
import { BehaviorSubject, combineLatest, fromEvent, merge, of } from "rxjs"
|
||||
import {
|
||||
distinctUntilChanged,
|
||||
filter,
|
||||
map,
|
||||
mapTo,
|
||||
pluck,
|
||||
startWith,
|
||||
switchMapTo
|
||||
} from "rxjs/operators"
|
||||
|
||||
import {
|
||||
fromMediaQuery,
|
||||
watchViewportOffset,
|
||||
watchViewportSize
|
||||
} from "./viewport"
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
const screen$ = fromMediaQuery("(min-width: 1220px)")
|
||||
const offset$ = watchViewportOffset()
|
||||
const size$ = watchViewportSize()
|
||||
|
||||
const hash$ = fromEvent<HashChangeEvent>(window, "hashchange").pipe(
|
||||
startWith(document.location.hash),
|
||||
map(() => document.location.hash),
|
||||
filter(hash => hash.length > 0)
|
||||
)
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
const component$ = of({
|
||||
container: document.querySelector("[data-md-component=container]") as HTMLElement,
|
||||
navigation: document.querySelector("[data-md-component=navigation]") as HTMLElement,
|
||||
header: document.querySelector("[data-md-component=header]") as HTMLElement,
|
||||
title: document.querySelector("[data-md-component=title]") as HTMLElement,
|
||||
toc: document.querySelector("[data-md-component=toc]") as HTMLElement, // TODO: !?
|
||||
headline: document.querySelector(".md-typeset h1") as HTMLElement
|
||||
})
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
// helper function
|
||||
function toArray(collection: HTMLCollection): HTMLElement[] {
|
||||
return Array.from(collection) as HTMLElement[]
|
||||
}
|
||||
|
||||
document.documentElement.classList.remove("no-js")
|
||||
document.documentElement.classList.add("js")
|
||||
|
||||
// we need TWO observables. first, if it's a resize, we need to set up stuff anew
|
||||
// bind size and offset to animationFrame !!!
|
||||
// TODO: combine latest with element!? navigation -> el
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
// sidebar lock + height
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
// Sidebar { offset, height, locked }
|
||||
|
||||
const sidebarOffset$ = size$.pipe(
|
||||
switchMapTo(component$),
|
||||
map(({ header, navigation }) => {
|
||||
return -1 * (header.offsetParent === null ? header.offsetHeight : 0) +
|
||||
reduce((offset, child) => {
|
||||
return Math.max(offset, child.offsetTop)
|
||||
}, 0, toArray(navigation.parentElement!.children))
|
||||
}),
|
||||
distinctUntilChanged<number>(equals)
|
||||
)
|
||||
|
||||
const sidebarHeight$ = combineLatest(offset$, size$, component$, sidebarOffset$).pipe(
|
||||
map(([{ y }, { height }, { header, navigation }, offset]) => {
|
||||
const parent = navigation.parentElement as HTMLElement
|
||||
return height - (
|
||||
header.offsetParent === null ? header.offsetHeight : 0
|
||||
) - Math.max(0, offset - y)
|
||||
- Math.max(0, y + height - parent.offsetTop - parent.offsetHeight)
|
||||
})
|
||||
)
|
||||
|
||||
const sidebarActive$ = combineLatest(offset$, sidebarOffset$).pipe(
|
||||
map(([{ y }, threshold]) => y >= threshold),
|
||||
distinctUntilChanged<boolean>(equals)
|
||||
)
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
combineLatest(component$, sidebarActive$)
|
||||
.subscribe(([{ navigation }, active]) => {
|
||||
navigation.dataset.mdState = active ? "lock" : ""
|
||||
})
|
||||
|
||||
combineLatest(component$, sidebarHeight$)
|
||||
.subscribe(([{ navigation }, height]) => {
|
||||
navigation.style.height = `${height}px`
|
||||
})
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
// re-use calculation for toc, if present!
|
||||
combineLatest(component$, sidebarActive$).pipe(
|
||||
filter(([{ toc }]) => Boolean(toc))
|
||||
)
|
||||
.subscribe(([{ toc }, active]) => {
|
||||
toc.dataset.mdState = active ? "lock" : ""
|
||||
})
|
||||
|
||||
combineLatest(component$, sidebarHeight$).pipe(
|
||||
filter(([{ toc }]) => Boolean(toc))
|
||||
)
|
||||
.subscribe(([{ toc }, height]) => {
|
||||
toc.style.height = `${height}px`
|
||||
})
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
// header shadow
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
// Shadow { offset, locked }
|
||||
|
||||
const shadowOffset$ = size$.pipe(
|
||||
switchMapTo(component$),
|
||||
map(({ container }) => {
|
||||
let parent = container.parentElement as HTMLElement
|
||||
let height = 0
|
||||
do {
|
||||
parent = parent.previousElementSibling as HTMLElement // toElement -> throw if not!
|
||||
height += parent.offsetHeight
|
||||
} while (parent.previousElementSibling)
|
||||
return height
|
||||
})
|
||||
)
|
||||
|
||||
const shadowActive$ = combineLatest(offset$, shadowOffset$).pipe(
|
||||
map(([{ y }, threshold]) => y >= threshold),
|
||||
distinctUntilChanged<boolean>(equals)
|
||||
)
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
combineLatest(component$, shadowActive$)
|
||||
.subscribe(([{ header }, active]) => {
|
||||
header.dataset.mdState = active ? "shadow" : ""
|
||||
})
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
// header title swap
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
const headlineOffset$ = size$.pipe(
|
||||
switchMapTo(component$),
|
||||
map(({ headline }) => headline.offsetTop),
|
||||
distinctUntilChanged<number>(equals)
|
||||
)
|
||||
|
||||
const headlineWidth$ = size$.pipe(
|
||||
switchMapTo(component$),
|
||||
map(({ title }) => title.offsetWidth - 20),
|
||||
distinctUntilChanged<number>(equals)
|
||||
)
|
||||
|
||||
const headlineActive$ = combineLatest(offset$, headlineOffset$).pipe(
|
||||
map(([{ y }, threshold]) => y >= threshold),
|
||||
distinctUntilChanged<boolean>(equals)
|
||||
)
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
combineLatest(component$, headlineActive$)
|
||||
.subscribe(([{ title }, active]) => {
|
||||
title.dataset.mdState = active ? "active" : ""
|
||||
})
|
||||
|
||||
combineLatest(component$, headlineWidth$)
|
||||
.subscribe(([{ title }, width]) => {
|
||||
for (const child of toArray(title.children))
|
||||
child.style.width = `${width}px`
|
||||
})
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
// open details on hashchange
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
hash$.pipe(
|
||||
map(hash => document.querySelector(hash) as HTMLElement), // TODO: write a getElement function...
|
||||
filter<HTMLElement>(Boolean)
|
||||
)
|
||||
.subscribe(el => {
|
||||
let parent = el.parentNode
|
||||
while (parent && !(parent instanceof HTMLDetailsElement))
|
||||
parent = parent.parentNode
|
||||
|
||||
/* If there's a details tag, open it */
|
||||
if (parent && !parent.open) {
|
||||
parent.open = true
|
||||
|
||||
/* Force reload, so the viewport repositions */
|
||||
const hash = location.hash
|
||||
location.hash = " "
|
||||
location.hash = hash // tslint:disable-line
|
||||
}
|
||||
})
|
||||
|
||||
// size$.pipe(
|
||||
// switchMapTo(component$),
|
||||
// map(({ title }) => {
|
||||
// title.children
|
||||
// }
|
||||
|
||||
// just combine all header observables into one!
|
||||
|
||||
// headerLock$.subscribe(console.log)
|
||||
// headerHeight$.subscribe(console.log)
|
||||
// TODO just tap both? toc and nav?
|
||||
|
||||
// // first, calculate top offset
|
||||
// size$.subscribe(size => {
|
||||
// const children = Array.from(navigation.parentElement!.children) as HTMLElement[] // TODO
|
||||
|
||||
// const top = children.reduce((offset, child) => Math.max(offset, child.offsetTop), 0)
|
||||
|
||||
// const offset = top - (adjust ? header.offsetHeight : 0)
|
||||
|
||||
// })
|
||||
|
||||
// const top = Array.from(navigation.parentElement!.children)
|
||||
// .reduce()
|
||||
|
||||
// this.parent_.children, (offset, child) => {
|
||||
// return Math.max(offset, child.offsetTop)
|
||||
// }, 0)
|
||||
|
||||
/* Set lock offset for element with largest top offset */
|
||||
// this.offset_ = top - (this.pad_ ? this.header_.offsetHeight : 0)
|
||||
|
||||
// offset$.subscribe(offset => {
|
||||
// console.log(offset)
|
||||
// })
|
||||
|
||||
export function app(_x: any) {
|
||||
|
||||
}
|
||||
|
||||
@ -20,16 +20,6 @@
|
||||
* IN THE SOFTWARE.
|
||||
*/
|
||||
|
||||
import { fusebox } from 'fuse-box'
|
||||
|
||||
/* ----------------------------------------------------------------------------
|
||||
* Configuration
|
||||
* Types
|
||||
* ------------------------------------------------------------------------- */
|
||||
|
||||
fusebox({
|
||||
target: 'browser',
|
||||
entry: 'src/assets/javascripts/index.ts',
|
||||
output: "material/assets/javascripts",
|
||||
cache: true
|
||||
})
|
||||
.runProd()
|
||||
115
src/assets/javascripts/viewport/_/index.ts
Normal file
115
src/assets/javascripts/viewport/_/index.ts
Normal file
@ -0,0 +1,115 @@
|
||||
/*
|
||||
* Copyright (c) 2016-2019 Martin Donath <martin.donath@squidfunk.com>
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to
|
||||
* deal in the Software without restriction, including without limitation the
|
||||
* rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
|
||||
* sell copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in
|
||||
* all copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
|
||||
* IN THE SOFTWARE.
|
||||
*/
|
||||
|
||||
import { equals } from "rambda"
|
||||
import { Observable, fromEvent, merge } from "rxjs"
|
||||
import { distinctUntilChanged, map, startWith } from "rxjs/operators"
|
||||
|
||||
/* ----------------------------------------------------------------------------
|
||||
* Data
|
||||
* ------------------------------------------------------------------------- */
|
||||
|
||||
/**
|
||||
* Observable for window scroll events
|
||||
*/
|
||||
const scroll$ = fromEvent<UIEvent>(window, "scroll")
|
||||
|
||||
/**
|
||||
* Observable for window resize events
|
||||
*/
|
||||
const resize$ = fromEvent<UIEvent>(window, "resize")
|
||||
|
||||
/* ----------------------------------------------------------------------------
|
||||
* Types
|
||||
* ------------------------------------------------------------------------- */
|
||||
|
||||
/**
|
||||
* Viewport offset
|
||||
*/
|
||||
export interface ViewportOffset {
|
||||
x: number /* Horizontal offset */
|
||||
y: number /* Vertical offset */
|
||||
}
|
||||
|
||||
/**
|
||||
* Viewport size
|
||||
*/
|
||||
export interface ViewportSize {
|
||||
width: number /* Viewport width */
|
||||
height: number /* Viewport height */
|
||||
}
|
||||
|
||||
/* ----------------------------------------------------------------------------
|
||||
* Functions
|
||||
* ------------------------------------------------------------------------- */
|
||||
|
||||
/**
|
||||
* Retrieve the viewport offset
|
||||
*
|
||||
* @return Viewport offset
|
||||
*/
|
||||
export function getViewportOffset(): ViewportOffset {
|
||||
return {
|
||||
x: window.pageXOffset,
|
||||
y: window.pageYOffset
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieve the viewport size
|
||||
*
|
||||
* @return Viewport size
|
||||
*/
|
||||
export function getViewportSize(): ViewportSize {
|
||||
return {
|
||||
width: window.innerWidth,
|
||||
height: window.innerHeight
|
||||
}
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------------------------- */
|
||||
|
||||
/**
|
||||
* Create an observable emitting changes in viewport offset
|
||||
*
|
||||
* @return Viewport offset observable
|
||||
*/
|
||||
export function watchViewportOffset(): Observable<ViewportOffset> {
|
||||
return merge(scroll$, resize$).pipe(
|
||||
map(getViewportOffset),
|
||||
startWith(getViewportOffset()),
|
||||
distinctUntilChanged<ViewportOffset>(equals)
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* Create an observable emitting changes in viewport size
|
||||
*
|
||||
* @return Viewport size observable
|
||||
*/
|
||||
export function watchViewportSize(): Observable<ViewportSize> {
|
||||
return resize$.pipe(
|
||||
map(getViewportSize),
|
||||
startWith(getViewportSize()),
|
||||
distinctUntilChanged<ViewportSize>(equals)
|
||||
)
|
||||
}
|
||||
44
src/assets/javascripts/viewport/breakpoint/index.ts
Normal file
44
src/assets/javascripts/viewport/breakpoint/index.ts
Normal file
@ -0,0 +1,44 @@
|
||||
/*
|
||||
* Copyright (c) 2016-2019 Martin Donath <martin.donath@squidfunk.com>
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to
|
||||
* deal in the Software without restriction, including without limitation the
|
||||
* rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
|
||||
* sell copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in
|
||||
* all copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
|
||||
* IN THE SOFTWARE.
|
||||
*/
|
||||
|
||||
import { Observable, fromEventPattern } from "rxjs"
|
||||
import { startWith } from "rxjs/operators"
|
||||
|
||||
/* ----------------------------------------------------------------------------
|
||||
* Functions
|
||||
* ------------------------------------------------------------------------- */
|
||||
|
||||
/**
|
||||
* Create an observable for a media query
|
||||
*
|
||||
* @param query - Media query
|
||||
*
|
||||
* @return Media query observable
|
||||
*/
|
||||
export function fromMediaQuery(query: string): Observable<boolean> {
|
||||
const media = window.matchMedia(query)
|
||||
return fromEventPattern<boolean>(next =>
|
||||
media.addListener(() => next(media.matches))
|
||||
).pipe(
|
||||
startWith(media.matches)
|
||||
)
|
||||
}
|
||||
24
src/assets/javascripts/viewport/index.ts
Normal file
24
src/assets/javascripts/viewport/index.ts
Normal file
@ -0,0 +1,24 @@
|
||||
/*
|
||||
* Copyright (c) 2016-2019 Martin Donath <martin.donath@squidfunk.com>
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to
|
||||
* deal in the Software without restriction, including without limitation the
|
||||
* rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
|
||||
* sell copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in
|
||||
* all copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
|
||||
* IN THE SOFTWARE.
|
||||
*/
|
||||
|
||||
export * from "./_"
|
||||
export * from "./breakpoint"
|
||||
@ -372,7 +372,7 @@
|
||||
|
||||
<!-- Initialize application -->
|
||||
<script>
|
||||
app.initialize({
|
||||
app({
|
||||
version: "{{ mkdocs_version }}",
|
||||
url: {
|
||||
base: "{{ base_url }}"
|
||||
|
||||
@ -2,9 +2,8 @@
|
||||
"compilerOptions": {
|
||||
"alwaysStrict": true,
|
||||
"baseUrl": ".",
|
||||
"composite": true,
|
||||
"declaration": true,
|
||||
"declarationMap": true,
|
||||
"declaration": false,
|
||||
"declarationMap": false,
|
||||
"lib": [
|
||||
"dom",
|
||||
"es2017",
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
{
|
||||
"extends": [
|
||||
"tslint:latest",
|
||||
"tslint-no-circular-imports",
|
||||
"tslint-sonarts"
|
||||
],
|
||||
"rules": {
|
||||
|
||||
90
webpack.config.ts
Normal file
90
webpack.config.ts
Normal file
@ -0,0 +1,90 @@
|
||||
/*
|
||||
* Copyright (c) 2017-2019 Martin Donath <martin.donath@squidfunk.com>
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to
|
||||
* deal in the Software without restriction, including without limitation the
|
||||
* rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
|
||||
* sell copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in
|
||||
* all copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
|
||||
* IN THE SOFTWARE.
|
||||
*/
|
||||
|
||||
import * as path from "path"
|
||||
import { Configuration } from "webpack"
|
||||
|
||||
/* ----------------------------------------------------------------------------
|
||||
* Configuration
|
||||
* ------------------------------------------------------------------------- */
|
||||
|
||||
/**
|
||||
* Webpack configuration
|
||||
*
|
||||
* @param env - Webpack environment arguments
|
||||
* @param args - Command-line arguments
|
||||
*
|
||||
* @return Webpack configuration
|
||||
*/
|
||||
export default (_env: never, args: Configuration) => {
|
||||
return {
|
||||
mode: args.mode,
|
||||
|
||||
/* Entrypoint */
|
||||
entry: ["src/assets/javascripts/index.ts"],
|
||||
|
||||
/* Loaders */
|
||||
module: {
|
||||
rules: [
|
||||
|
||||
/* TypeScript */
|
||||
{
|
||||
test: /\.tsx?$/,
|
||||
use: [
|
||||
{
|
||||
loader: "ts-loader",
|
||||
options: {
|
||||
transpileOnly: true,
|
||||
compilerOptions: {
|
||||
module: "esnext",
|
||||
noUnusedLocals: args.mode === "production",
|
||||
noUnusedParameters: args.mode === "production",
|
||||
removeComments: false
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
exclude: /\/node_modules\//
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
/* Export class constructor as entrypoint */
|
||||
output: {
|
||||
path: path.resolve(__dirname, "material/assets/javascripts"),
|
||||
filename: "app.js",
|
||||
libraryTarget: "window"
|
||||
},
|
||||
|
||||
/* Module resolver */
|
||||
resolve: {
|
||||
modules: [
|
||||
__dirname,
|
||||
path.resolve(__dirname, "node_modules")
|
||||
],
|
||||
extensions: [".ts", ".tsx", ".js", ".json"]
|
||||
},
|
||||
|
||||
/* Sourcemaps */
|
||||
devtool: "source-map"
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user