diff --git a/style.css b/style.css index c9e39135eeb16450d0e9e131df0886a4f13f53f4..b4ff8b1ea38514519874cde6ac33f1ec190efa27 100644 --- a/style.css +++ b/style.css @@ -233,6 +233,11 @@ body { hyphens: auto; } +/* prevents scrolling in the background if dialog popup is opened */ +body:has(dialog[open]) { + overflow: hidden; +} + button, input, select, details summary { cursor: pointer; diff --git a/style.min.css b/style.min.css index 686efc8936bbff2fec62689fe80306b35ea364c1..c4f4ec4603f0947e1a1c6b0a924b806ffdce1bcc 100644 --- a/style.min.css +++ b/style.min.css @@ -1 +1 @@ -:root{--default-top-padding:1.5em;--default-body-bottom-margin:2vmin;--default-min-font-size-px:12px;--default-min-font-size:12;--default-max-font-size-px:18px;--default-max-font-size:18;}html{font-size:calc(var(--default-min-font-size-px) + (var(--default-max-font-size) - var(--default-min-font-size)) * ((100vw - 360px) / 1560));font-size:clamp(var(--default-min-font-size-px),calc(var(--default-min-font-size-px) + (var(--default-max-font-size) - var(--default-min-font-size)) * ((100vw - 360px) / 1560)),var(--default-max-font-size-px));}body{height:calc(100vh - 3vmin);font-size:inherit;font-family:helvetica,Arial,sans-serif;background-color:#555;color:white;margin:3vmin 4vmin calc(var(--default-body-bottom-margin) - var(--default-body-bottom-margin)) 4vmin;}*:focus{outline:2px solid white;outline-offset:2px;}a{color:#ffffff;}header a{text-decoration:none;}a:not([href]){color:#AAAAAA;}header{margin-bottom:1.0;}nav{display:flex;align-items:baseline;column-gap:.7em;}nav a{margin-top:auto;margin-bottom:auto;}h1{font-size:1.5em;margin:0;}#github{margin-left:auto;}#github-cat{height:1.5em;}*,*::before,*::after{box-sizing:unset;}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0;}ul[role='list'],ol[role='list']{list-style:none;}html:focus-within{scroll-behavior:smooth;}body{text-rendering:optimizeSpeed;line-height:1.5;}a:not([class]){text-decoration-skip-ink:auto;}img,picture{max-width:100%;font-style:italic;}input,button,textarea,select{font:inherit;}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}body{font-size:2em;}#dialogText{font-size:23vw;line-height:.8em;}#dialog-wrapper{background:rgba(85,85,85,.97);}#dialogText{color:#fff;background-color:#555;}select{color:#000;}button,input{color:white;background-color:#333;}input[type=radio]{accent-color:#333;}th{background-color:#444444;}tr:nth-child(even){background-color:#505050;}#dialogText{border:1px solid white;border-radius:10px;}button,input,select{border:2px solid white;}button,input{-webkit-border-radius:5px;border-radius:5px;}select#channel{border-radius:5px;}body{hyphens:auto;}button,input,select,details summary{cursor:pointer;}#dialog-wrapper{cursor:pointer;}#dialogText{cursor:pointer;}#copyIcon{text-decoration:none;}td:nth-child(even){cursor:pointer;}main .first-in-main{padding-top:calc(var(--default-top-padding) - .8em);}.horizontal{margin-top:10px;}.horizontal label{margin-right:10px;}#dialogText{padding:.25em;}th,td{padding:0;padding-left:10px;padding-right:10px;}#copyIcon{margin-left:10px;}.space{margin:.6em;}p.label{margin-right:15px;}p{margin-block-start:0;}ul{margin-block-start:0;}p#source{margin-top:2em;margin-left:auto;}body{display:flex;flex-direction:column}main{display:flex;flex-direction:column;height:100%}#logo img{width:2em;height:auto;}#dialog-wrapper{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;}.horizontal{display:inline-flex;}th{text-align:left;}table,tr,td{overflow:hidden;}th:nth-child(1),td:nth-child(1){width:2ch;}th:nth-child(2),td:nth-child(2){width:13ch;}th:nth-child(3),td:nth-child(3){width:fit-content;}select#channel{width:fit-content;height:1.3em;}p#source{width:fit-content;} \ No newline at end of file +:root{--default-top-padding:1.5em;--default-body-bottom-margin:2vmin;--default-min-font-size-px:12px;--default-min-font-size:12;--default-max-font-size-px:18px;--default-max-font-size:18;}html{font-size:calc(var(--default-min-font-size-px) + (var(--default-max-font-size) - var(--default-min-font-size)) * ((100vw - 360px) / 1560));font-size:clamp(var(--default-min-font-size-px),calc(var(--default-min-font-size-px) + (var(--default-max-font-size) - var(--default-min-font-size)) * ((100vw - 360px) / 1560)),var(--default-max-font-size-px));}body{height:calc(100vh - 3vmin);font-size:inherit;font-family:helvetica,Arial,sans-serif;background-color:#555;color:white;margin:3vmin 4vmin calc(var(--default-body-bottom-margin) - var(--default-body-bottom-margin)) 4vmin;}*:focus{outline:2px solid white;outline-offset:2px;}a{color:#ffffff;}header a{text-decoration:none;}a:not([href]){color:#AAAAAA;}header{margin-bottom:1.0;}nav{display:flex;align-items:baseline;column-gap:.7em;}nav a{margin-top:auto;margin-bottom:auto;}h1{font-size:1.5em;margin:0;}#github{margin-left:auto;}#github-cat{height:1.5em;}*,*::before,*::after{box-sizing:unset;}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0;}ul[role='list'],ol[role='list']{list-style:none;}html:focus-within{scroll-behavior:smooth;}body{text-rendering:optimizeSpeed;line-height:1.5;}a:not([class]){text-decoration-skip-ink:auto;}img,picture{max-width:100%;font-style:italic;}input,button,textarea,select{font:inherit;}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}body{font-size:2em;}#dialogText{font-size:23vw;line-height:.8em;}#dialog-wrapper{background:rgba(85,85,85,.97);}#dialogText{color:#fff;background-color:#555;}select{color:#000;}button,input{color:white;background-color:#333;}input[type=radio]{accent-color:#333;}th{background-color:#444444;}tr:nth-child(even){background-color:#505050;}#dialogText{border:1px solid white;border-radius:10px;}button,input,select{border:2px solid white;}button,input{-webkit-border-radius:5px;border-radius:5px;}select#channel{border-radius:5px;}body{hyphens:auto;}body:has(dialog[open]){overflow:hidden;}button,input,select,details summary{cursor:pointer;}#dialog-wrapper{cursor:pointer;}#dialogText{cursor:pointer;}#copyIcon{text-decoration:none;}td:nth-child(even){cursor:pointer;}main .first-in-main{padding-top:calc(var(--default-top-padding) - .8em);}.horizontal{margin-top:10px;}.horizontal label{margin-right:10px;}#dialogText{padding:.25em;}th,td{padding:0;padding-left:10px;padding-right:10px;}#copyIcon{margin-left:10px;}.space{margin:.6em;}p.label{margin-right:15px;}p{margin-block-start:0;}ul{margin-block-start:0;}p#source{margin-top:2em;margin-left:auto;}body{display:flex;flex-direction:column}main{display:flex;flex-direction:column;height:100%}#logo img{width:2em;height:auto;}#dialog-wrapper{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;}.horizontal{display:inline-flex;}th{text-align:left;}table,tr,td{overflow:hidden;}th:nth-child(1),td:nth-child(1){width:2ch;}th:nth-child(2),td:nth-child(2){width:13ch;}th:nth-child(3),td:nth-child(3){width:fit-content;}select#channel{width:fit-content;height:1.3em;}p#source{width:fit-content;} \ No newline at end of file