From 91d754eb17ca449000815e17252b60af5e953823 Mon Sep 17 00:00:00 2001 From: VladlenaCravcenco Date: Fri, 26 Apr 2024 23:04:05 +0300 Subject: [PATCH 1/2] dark-theme --- .DS_Store | Bin 0 -> 8196 bytes example_dev.html | 5 +- example_prod.html | 2 + labs/.DS_Store | Bin 0 -> 6148 bytes script.js | 19 ++++++ webassets/ermac.css | 137 +++++++++++++++++++------------------------- 6 files changed, 84 insertions(+), 79 deletions(-) create mode 100644 .DS_Store create mode 100644 labs/.DS_Store create mode 100644 script.js diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..9562986cd2675160d0f3cfb3211cd17e2b176029 GIT binary patch literal 8196 zcmeHM%Wl&^6ur}?twR6>iAOg`me^LIFBKs+N!l(d@sOGd7J!1Cq^-fRBil(@MU}Dz z{()a$317m$u!3`Erj_k9u&WT6iDu5kbC1V!eD65dAtF)lx7Uc4iO51_ESJz+Qh1!} zM48h^?g9n)L_6qrc` zcz>`_8LJw{3gy;;My3G30uIZ9KJoy`u{BmTjulEO&Z)8op{YWr7(&r8ZnHVCs&TAP z(Mc#e2|csW8H$jzgJ(-~5>7+ObHFhqc~^(^>6m>Fz)H|e{*}j7bmN$Kg8U8VPSE}TCz&k+s1J? zY$Q(7kLynKn!g={q3@pe9rvZz88*wex5FTDyr2_Fg4gcAjID)S({v6w+x{B5@z%X-PA-|A#!8CFP_kLYRoU6n?&0B+ZvsWTm!L;=P zuG*nK)H=>tvQ|?pQ?B^^$|H4oG+N(6cy4TN{vlL36j7#zD(jG1`-CU%L%$mB&@*5K zp485&BmE$)P7(Va?|&XVF#+R!{ywn}h?^-NSOg;ir+JAj?tR9##PnX8xweh^4wVbrjTK4?8kvp*WjYSL_`?u=8>Y;uY8)%X5tJ)`5uktjnCHKg J-!wC-z;DY2=e7U< literal 0 HcmV?d00001 diff --git a/example_dev.html b/example_dev.html index e4f3ad4..8998896 100755 --- a/example_dev.html +++ b/example_dev.html @@ -5,7 +5,9 @@ - + + + + diff --git a/example_prod.html b/example_prod.html index b4280fd..cf9660f 100755 --- a/example_prod.html +++ b/example_prod.html @@ -5,6 +5,8 @@ + + diff --git a/labs/.DS_Store b/labs/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..e08de4e72ab2d93f740c9e39289bb2caa19c648d GIT binary patch literal 6148 zcmeHKO-sW-5Z!I7O({YT3OxqA7Oib5h?iLF!K)EHsMN+34aRKghdq=+&iaS^CH@_K zv%4*5^(2Ut8JK;O*_jRVHtc4E5VAE6_k<`3Asi@Srhwrap?T6J$yiSoC~1w8SltG( z3h+z|viyGrXzy~OFG5il;g|h8#N5ui7G209E|?7acAsB^ejE)))#{tfWOHllc_;4_ zoooMIP5e=JG#<9PgG+ikQz{PTb~iYWdXr9R^GGG5Zj|%}Iw1;s2)Vk5l2A=rYMg{a zo$H$kr{EMirSf!IYgQ|6z0sIe-06M|cB9^$%?i%e_U^%H=OKPf)U%;p;=9zcVQ~&G zFc$SZ`GX`@$sK(2_<0;7Gr$Zm1FOh@J?os}Di+5zF$2uNuNa{7!G#if7E^=z=)j;` z0ALPoEwJ^kKhPxy(6g8tga;x`D$t}#+hR!DIY^U^dC$hD22Hw<`psC!zFFE1McT$g zx;k7)&mfP?05kBJ0qXrACA$BQfA0Tv5D&}%Gq9Qr$XwfRw@{nCTbHV&yVix?KuIVr mHMmHDp|4`Z(p6lBYJuM+1L#>y4Z;KA9|27R56r-yGVlRf!c+wS literal 0 HcmV?d00001 diff --git a/script.js b/script.js new file mode 100644 index 0000000..a9531cf --- /dev/null +++ b/script.js @@ -0,0 +1,19 @@ +const options = { + + top: '64px', // default: '32px' + right: 'unset', // default: '32px' + left: '32px', // default: 'unset' + time: '0.3s', // default: '0.3s' + mixColor: '#fff', // default: '#fff' + backgroundColor: '#fff', // default: '#fff' + buttonColorDark: '#100f2c', // default: '#100f2c' + buttonColorLight: '#fff', // default: '#fff' + saveInCookies: true, // default: true, + label: '🌓', // default: '' + autoMatchOsTheme: true // default: true + + } + + const darkmode = new Darkmode(options); + darkmode.showWidget(); + \ No newline at end of file diff --git a/webassets/ermac.css b/webassets/ermac.css index 3b1cb32..7a95018 100755 --- a/webassets/ermac.css +++ b/webassets/ermac.css @@ -1,16 +1,15 @@ /* COMMON */ -html, body{height:100%;text-size-adjust:100%;font-family:Exo2,Arial;margin:0;padding:0;} +html, body{text-size-adjust:100%;font-family:Exo2,Arial;margin:0;padding:0;} /* body.noscroll{overflow:hidden;} */ sup, sub{font-size:12px;} -.sky{background:#fff;} -#overlay{position:fixed;left:0;top:0;width:100%;height:100%;text-align:center;z-index:100;overflow:hidden;background:#fff;opacity:0.9;} -#visavis{display:none;z-index:50;position:fixed;top:56px;left:50%;margin-left:-36%;width:72%;height:99%;background:#fff;} +#overlay{position:fixed;left:0;top:0;width:100%;height:100%;text-align:center;z-index:100;overflow:hidden;opacity:0.9;} +#visavis{display:none;z-index:50;position:fixed;top:56px;left:50%;margin-left:-36%;width:72%;height:99%;} .wmbutton{cursor:pointer;user-select:none;font-size:1.3em;text-align:center;border:1px solid #999;background:#999;color:#fff;line-height:1.4em;border-radius:2px;text-decoration:none;box-shadow:inset 0 2px 2px rgba(255,255,255,0.3), inset 0 -2px 2px rgba(0,0,0,0.3), inset 0 20px 10px rgba(255,255,255,0.3), 0 0 2px 1px rgba(0,0,0,0.2), 0 2px 2px rgba(0,0,0,0.3);} .wmbutton:hover{box-shadow:inset 0 2px 2px rgba(255,255,255,0.2), inset 0 -2px 2px rgba(0,0,0,0.2), inset 0 20px 10px rgba(255,255,255,0.2), 0 0 2px 1px rgba(0,0,0,0.2), 0 2px 2px rgba(0,0,0,0.2);} .wmbutton:active{transform:translateY(1px);} -.wmbutton.disabled{cursor:not-allowed;box-shadow:none;background:#eee !important;border-color:#eee !important;} +.wmbutton.disabled{cursor:not-allowed;box-shadow:none;border-color:#eee !important;} input[type=text], input[type=email], input[type=password], textarea, div.selectize-input{outline:none;border-radius:2px;box-shadow:inset 0 2px 2px rgba(0,0,0,0.15);font-family:Exo2,Arial;} select{font-family:Exo2,Arial;} @@ -28,16 +27,20 @@ div.gear{float:right;margin:12px 2px 0 0;width:16px;height:16px;font-size:10px;t #ermac_logo > a{display:block;width:100%;height:100%;} #main{width:100%;min-height:100%;height:auto !important;margin:0 0 -33px 0;padding:0;} -#footer{width:100%;height:24px;padding-top:8px;text-align:center;font-size:0.85em;color:#555;background:#fff;} +#footer{width:100%;height:24px;padding-top:8px;text-align:center;font-size:0.85em;color:#555;position: fixed;bottom: 10px;margin-top: 10px;} #footer a{text-decoration:none;color:#555;border-bottom:1px solid #555;} h2, h3{line-height:3em;font-weight:normal;color:#E36868;} -h4{font-weight:normal;font-size:1.1em;line-height:2.15em;text-align:center;background:#fcfcbb;margin-bottom:10px;} +h4{font-weight:normal;font-size:1.1em;line-height:2.15em;text-align:center;margin-bottom:10px;} + +.darkmode-layer, .darkmode-toggle { + z-index: 500; +} /* SEARCH FIELD */ /* HEIGHT 52px */ #search_box{position:fixed;top:0;left:50%;width:590px;margin-left:-295px;z-index:51;clear:both;padding-top:15px;} -#search_box.fluid{width:100%;margin-left:-50%;background:#fff;} +#search_box.fluid{width:100%;margin-left:-50%;} #search_area{width:590px;height:30px;margin:0 auto;margin-bottom:16px;} #search_area.prolonged{width:770px;} @@ -53,33 +56,32 @@ h4{font-weight:normal;font-size:1.1em;line-height:2.15em;text-align:center;backg #hierarchy_trigger span{position:absolute;} #hierarchy_trigger span sub{display:block;position:relative;left:0;top:16px;font-size:10px;line-height:8px;} #hierarchy_trigger span sup{display:block;position:relative;left:-1px;top:0;font-size:20px;line-height:10px;} -#legend{width:100%;margin-top:-5px;letter-spacing:0.5px;color:#333;height:22px;line-height:22px;} -#legend a{text-decoration:none;color:#333;border-bottom:1px solid #333;} -#legend > *{background:#fbfbfb;} +#legend{width:100%;margin-top:-5px;letter-spacing:0.5px;text-decoration:none;height:22px;line-height:22px;} +#legend a{text-decoration:none;border-bottom:1px solid #333;} + /* ADVANCED SEARCH */ -#advsbox{display:none;z-index:102;top:6%;margin-left:-275px;width:500px;height:auto;padding:22px 25px;background:#fff;} +#advsbox{-webkit-backdrop-filter: blur(200px); display:none;z-index:102;top:6%;margin-left:-275px;width:500px;height:auto;padding:22px 25px;} #advsbox div.advs{clear:both;width:100%;height:42px;padding:7px 0;} #advsbox div.advs > div.advs_capt{font-size:1.1em;float:left;width:34%;line-height:42px;text-align:left;} #advsbox div.advs > div.advs_capt:after{content:':';} #advsbox div.advs > input{float:right;width:63%;height:30px;font-size:1.1em;padding-left:2px;margin-top:5px;text-align:left;} #advsbox div.advs > div.advs_legend{clear:both;float:right;color:#888;line-height:12px;font-size:0.85em;margin-right:2px;} #advsbox div.advs > div.advs_legend a{text-decoration:none;color:#888;border-bottom:1px solid #888;letter-spacing:0.5px;} -#crtab{margin:2.5vmin 0 1.5vmin;} +#crtab{color: #555; margin:2.5vmin 0 1.5vmin;} #crtab > div{display:inline-block;width:49%;font-size:1.1em;height:4vmin;line-height:40px;letter-spacing:-0.5px;} #crtab > div:nth-child(even){text-align:right;} -#crtab strong.numeric{font-size:0.85em;letter-spacing:0.5px;font-weight:normal;cursor:pointer;border-bottom:1px solid #fff;background:#ffd;} +#crtab strong.numeric{font-size:0.85em;letter-spacing:0.5px;font-weight:normal;cursor:pointer;border-bottom:1px solid #fff;} #crtab strong.numeric:hover{border-bottom:1px solid #000;} #advstab_triggers, #numericbox_triggers{width:100%;} #advsearch_do_trigger, #numericbox_do_trigger{display:inline-block;width:125px;margin-left:179px;} #advsearch_drop_trigger, #numericbox_drop_trigger{display:inline-block;width:100px;margin-left:1px;background:#c00;border:1px solid #c00;} -#advstab_options{margin:-52px 0 0 0;padding:0;} +#advstab_options{color: #555; margin:-52px 0 0 0;padding:0;} #advstab_options:after{display:block;clear:both;content:'';} -#advstab_options li{margin:0 2px;cursor:pointer;user-select:none;float:left;padding:5px 10px;list-style:none;line-height:20px;font-size:0.95em;background:#eee;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;} -#advstab_options li:hover{background:#fff;} -#advstab_options li.working{background:#fff;} +#advstab_options li{margin:0 2px;cursor:pointer;user-select:none;float:left;padding:5px 10px;list-style:none;line-height:20px;font-size:0.95em;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;} + div.advstab{display:none;} div.advs.advs_props > div{color:#ff8400;} @@ -109,8 +111,6 @@ div.advs.advs_years > input{border:1px solid #E36868;} #databrowser.tabled{padding-top:102px;} #databrowser.thumbed{padding-top:80px;} #databrowser.tabled tr{width:100%;height:26px;} -#databrowser.tabled tr:nth-child(even){background:#fdfdfd;} -#databrowser.tabled tr:hover{background:#fafafa;} #databrowser.tabled tr.busy_entry{color:#f00;} #databrowser.tabled tr > td{border-bottom:1px solid #eee;padding:6px 3px;cursor:pointer;} #databrowser.thumbed tr{width:100%;} @@ -119,7 +119,7 @@ div.advs.advs_years > input{border:1px solid #E36868;} div.gallery_item{display:inline-block;width:150px;height:200px;margin:0 6px 8px;cursor:pointer;border:1px solid #fff;user-select:none;} div.gallery_item:hover, div.gallery_item.busy_entry{background:#fcfcbb;} div.gallery_item > span{display:block;text-align:center;font-size:0.9em;} -div.gallery_img{width:140px;margin:4px auto 0;min-height:140px;text-align:center;display:table;table-layout:fixed;position:relative;overflow:hidden;text-overflow:ellipsis;word-break:break-all;background-size:65%;background-position:center top;background-repeat:no-repeat;background-color:#fff;} +div.gallery_img{width:140px;margin:4px auto 0;min-height:140px;text-align:center;display:table;table-layout:fixed;position:relative;overflow:hidden;text-overflow:ellipsis;word-break:break-all;background-size:65%;background-position:center top;background-repeat:no-repeat;} div.gallery_img > img{display:table-cell;vertical-align:middle;max-width:140px;max-height:140px;margin:0 auto;} div.gallery_img > div{display:table-cell;vertical-align:middle;width:140px;height:140px;border:1px solid #999;padding:0 2px;font-size:0.9em;letter-spacing:-0.5px;} div.gallery_img > div:first-letter {font-size:1.25em;text-transform:uppercase;} @@ -129,16 +129,15 @@ div.gallery_img > div.articled{vertical-align:top;padding:8px 2px;} div.gallery_img > div.articled > span{color:#777;} div.gallery_img > p{position:absolute;top:50px;left:0;width:100%;text-align:center;font-size:1.3em;color:#333;letter-spacing:-1px;white-space:nowrap;} div.gallery_img > span{display:table-cell;vertical-align:bottom;} -div.gallery_img > span > p{background:#fff;line-height:20px;letter-spacing:-0.5px;} +div.gallery_img > span > p{line-height:20px;letter-spacing:-0.5px;} div.gallery_label{font-size:0.95em;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:2px 0;letter-spacing:-0.5px;line-height:1.6em;} div.gallery_label > a.launch_id{text-decoration:none;color:#c00;border-bottom:1px solid #c00;} div.gallery_label > a.launch_id:hover{color:#000;border-bottom:1px solid #000;} -div.pd_full{background:#f6f6f6;} a.resolve_ref{text-decoration:none;} a.resolve_ref.visited, a.resolve_ref:visited{color:#f00;border-bottom:1px solid #f00;} -th{text-align:center;background:#fafafa;} +th{text-align:center;} th.header{background:#fafafa url(ascdesc.gif) right center no-repeat;cursor:pointer;} th.headerSortUp{background:#fafafa url(asc.gif) right center no-repeat;cursor:pointer;} th.headerSortDown{background:#fafafa url(desc.gif) right center no-repeat;cursor:pointer;} @@ -195,7 +194,7 @@ div.context_msg{display:none;width:70%;margin:0 auto;padding-top:10px;color:#555 #plt_matrix > a{background:url(plots.gif) -205px 0 no-repeat;} #plt_cube > a{width:70px !important;background:url(plots.gif) -265px 0 no-repeat;} -#apihint{font-weight:normal;color:#000;font-size:1.15em;line-height:1.5em;margin-bottom:50px;padding:20px 5px 45px;background:#f6f6f6;overflow-wrap:break-word;} +#apihint{font-weight:normal;color:#000;font-size:1.15em;line-height:1.5em;margin-bottom:50px;padding:20px 5px 45px;overflow-wrap:break-word;} #apihint span{color:#c00;} #apihint a{text-decoration:none;color:#000;border-bottom:1px solid #000;} /* @@ -223,10 +222,10 @@ div.opened div.gallery_img:after{content:"";position:absolute;top:0;right:0;bott /* COLUMNS */ -div.col_title{width:100%;height:40px;font-size:0.9em;letter-spacing:1.5px;text-align:center;line-height:40px;margin-bottom:6px;color:#333;background:#fafafa;overflow:hidden;text-transform:uppercase;} +div.col_title{width:100%;height:40px;font-size:0.9em;letter-spacing:1.5px;text-align:center;line-height:40px;margin-bottom:6px;color:#333;overflow:hidden;text-transform:uppercase;} div.col_title a{text-decoration:none;color:#000;border-bottom:1px solid #000;} -#ctx_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:90%;z-index:56;background:#fff;border-top:1px solid #888;} +#ctx_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:90%;z-index:56;border-top:1px solid #888;} #ctx_col > ul{margin:0;padding:0;} #ctx_col > ul > li{list-style:none;width:80px;height:96px;margin:0 auto;display:block;} #ctx_col > ul > li > a{display:block;width:100%;height:100%;} @@ -248,13 +247,13 @@ div.col_title a{text-decoration:none;color:#000;border-bottom:1px solid #000;} #download_inp{background:url(icons.png) 0 -589px no-repeat;} #download_raw{background:url(icons.png) 0 -687px no-repeat;} -#visavis_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:90%;z-index:57;background:#fff;border-top:1px solid #888;} +#visavis_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:90%;z-index:57;border-top:1px solid #888;} #visavis_col li{display:block;cursor:pointer;user-select:none;text-align:left;list-style:none;color:#fff;border-bottom-right-radius:4px;letter-spacing:0.5px;} #visavis_col ul{margin:0;padding:0;} #visavis_col > ul > li{line-height:1.1em;margin-bottom:4px;padding:4px 0 4px 6px;background:#bfbfbf;} #visavis_col > ul > li.embodied{background:#FE9A2E;} #visavis_col > ul > li > a{display:block;outline:none;text-decoration:none;color:#fff;} -#ind_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:90%;z-index:54;background:#fff;border-top:1px solid #888;text-align:center;line-height:2em;overflow:hidden;} +#ind_col{color: #555; display:none;position:fixed;top:62px;left:0;width:13.5%;height:90%;z-index:54;border-top:1px solid #888;text-align:center;line-height:2em;overflow:hidden;} #ind_col a{text-decoration:none;color:#333;border-bottom:1px solid #333;letter-spacing:-0.5px;} #ind_col p{margin:15px 0;} #ind_col strong{font-size:80px;line-height:90px;} @@ -265,13 +264,12 @@ div.ctxpanel{display:none;border-top:1px solid #888;margin-top:4vh;} #ctxpanel_plots li.ss_y{background:#E36868;} #ctxpanel_plots li.ss_z{background:#3e3f95;} #ctxpanel_plots li.embodied{background:#FE9A2E;} -#ctxpanel_plots span.sops{display:inline-block;padding:2px;margin-left:2px;background:#fff;color:#000;font-size:0.8em;line-height:12px;letter-spacing:-0.5px;} +#ctxpanel_plots span.sops{display:inline-block;padding:2px;margin-left:2px;color:#000;font-size:0.8em;line-height:12px;letter-spacing:-0.5px;} #select_cmp_trigger{font-size:1.05em;text-align:center;width:90%;margin:15px 0 0 5%;} -#select_cmp_trigger > option{background:#fff;} #ctxpanel_discovery > ul{margin:0;padding:0;} #ctxpanel_discovery > ul > li.discovery_custom{display:none;background:#FE9A2E;} -#right_col{display:none;position:fixed;top:62px;right:0;width:13.5%;height:auto;z-index:55;border-top:1px solid #888;overflow:hidden;background:#fff;} +#right_col{display:none;position:fixed;top:62px;right:0;width:13.5%;height:auto;z-index:55;border-top:1px solid #888;overflow:hidden;} #interpret{clear:both;margin:16px 0 0 0;padding:0;} #interpret li{text-align:left;list-style:none;cursor:pointer;user-select:none;line-height:1.4em;color:#fff;font-size:1em;margin-bottom:4px;padding:2px 0 2px 3px;border-bottom-left-radius:4px;overflow:hidden;text-overflow:ellipsis;} #interpret li span{font-size:0.9em;letter-spacing:1px;} @@ -286,7 +284,7 @@ div.ctxpanel{display:none;border-top:1px solid #888;margin-top:4vh;} #history > ul > li{text-align:left;list-style:none;line-height:1.15em;margin:10px 0;} #history > ul > li > a{text-decoration:none;font-size:0.95em;} -#refine_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:auto;z-index:55;border-top:1px solid #888;overflow:hidden;background:#fff;} +#refine_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:auto;z-index:55;border-top:1px solid #888;overflow:hidden;} #refine_col > ul{margin:0 0 45px 0;padding:0;} #refine_col > ul > li{text-align:left;list-style:none;line-height:1.3em;margin:0 0 3px 0;padding:0 0 0 6px;border-bottom-right-radius:4px;} #refine_col > ul > li > a{display:block;width:100%;height:100%;text-decoration:none;color:#fff;} @@ -297,13 +295,12 @@ div.ctxpanel{display:none;border-top:1px solid #888;margin-top:4vh;} .fct_classes{background:#E36868;} .fct_props, .fct_numeric{background:#ff8400;} .fct_years, .fct_authors, .fct_codens, .fct_doi, .fct_geos, .fct_orgs, .fct_advsearch{background:#999;} -li.new_rfn_facet{background:#fff;} a.extd_refine, a.collapse_refine{letter-spacing:1px;font-size:0.75em;text-transform:uppercase;text-align:right;} li.extd_refine, li.collapse_refine{padding-right:6px;} -#sim_col{display:none;position:fixed;top:62px;right:0;width:13.5%;height:95%;z-index:56;border-top:1px solid #888;overflow:hidden;background:#fff;} -#sim_col > ul{margin:0;padding:0;} +#sim_col{display:none;position:fixed;top:62px;right:0;width:13.5%;height:95%;z-index:56;border-top:1px solid #888;overflow:hidden;} +#sim_col > ul{color: #555; margin:0;padding:0;} #sim_col > ul > li{list-style:none;line-height:1.8em;background:#999;margin-bottom:3px;border-bottom-left-radius:4px;} #sim_col > ul > li > a{display:block;white-space:nowrap;width:100%;height:100%;text-decoration:none;color:#fff;padding-left:3px;} #sim_legend{text-align:center;margin:25px auto 8px;width:90%;font-size:1.05em;line-height:1.4em;color:#333;} @@ -319,26 +316,25 @@ div.examples > ul{margin:0;padding:0;} div.examples > ul > li{text-align:center;list-style:none;line-height:1.25em;margin:15px 0;padding-left:4px;} div.examples > ul > li > a{text-decoration:none;letter-spacing:-0.5px;} -div.controlswitch{clear:both;width:100%;height:40px;color:#666;background:#eee;margin:5px auto 0;line-height:40px;border-bottom-left-radius:4px;overflow:hidden;white-space:nowrap;} +div.controlswitch{clear:both;width:100%;height:40px;color:#666;margin:5px auto 0;line-height:40px;border-bottom-left-radius:4px;overflow:hidden;white-space:nowrap;} div.controlswitch > div{display:none;float:left;cursor:pointer;user-select:none;text-align:center;font-size:1vmax;} div.controlswitch > div.active, div.controlswitch > div:hover{background:#bfbfbf;color:#fff;} #control_d{letter-spacing:-0.5px;} /* USER ACCOUNT */ -#userbox{position:fixed;top:0;right:0;height:34px;z-index:200;background:#fff;font-size:0.9em;border-bottom-left-radius:4px;line-height:33px;padding:0 8px 0 3px;border-bottom:1px solid #888;border-left:1px solid #888;cursor:pointer;box-shadow:8px 8px 4px -3px rgba(0,0,0,0.4);overflow:hidden;} +#userbox{position:fixed;top:0;right:0;height:34px;z-index:200;font-size:0.9em;border-bottom-left-radius:4px;line-height:33px;padding:0 8px 0 3px;border-bottom:1px solid #888;border-left:1px solid #888;cursor:pointer;box-shadow:8px 8px 4px -3px rgba(0,0,0,0.4);overflow:hidden;} #userbox span{margin:0 3px;} #userbox span.user_title{display:none;color:#555;} -#userbox > div.logged_out{background:#fff;} -#loginbox, #factorbox, #restorebox{display:none;margin-left:-200px;width:350px;padding:25px;background:#fff;text-align:center;} +#loginbox, #factorbox, #restorebox{-webkit-backdrop-filter: blur(1000px); display:none;margin-left:-200px;width:350px;padding:25px;text-align:center;} #loginbox{z-index:109;} #factorbox, #restorebox{z-index:110;} input.factor_form_resp {display:inline-block;font-family:Courier;font-weight:bold;width:20px !important;height:40px !important;font-size:30px !important;margin-right:5px;text-align:center;outline:none;border-top:none !important;border-left:none !important;border-right:none !important;border-bottom:2px solid #000 !important;} -#menubox{display:none;z-index:111;margin-left:-250px;width:450px;padding:25px;background:#fff;text-align:center;} -div.notice{font-size:0.95em;line-height:2.5em;} +#menubox{display:none;z-index:111;margin-left:-250px;width:450px;padding:25px;text-align:center;} +div.notice{color: #555; font-size:0.95em;line-height:2.5em;} span.href, div.notice > a{cursor:pointer;text-decoration:none;color:#3e3f95;border-bottom:1px solid #3e3f95;letter-spacing:0.5px;} #account_holder_name{font-size:1.4em;text-align:center;margin-bottom:0.8em;} #account_holder_acclogin, #account_holder_accpass{line-height:2em;color:#3e3f95;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} @@ -349,13 +345,11 @@ span.href, div.notice > a{cursor:pointer;text-decoration:none;color:#3e3f95;bord #tab_links{margin:-55px 0 0 0;padding:0;} #tab_links:after{display:block;clear:both;content:'';} -#tab_links li{margin:0 2px;cursor:pointer;user-select:none;float:left;padding:5px 8px;list-style:none;line-height:20px;font-size:0.9em;background:#eee;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;} -#tab_links li:hover{background:#fff;} -#tab_links li.working{background:#fff;} +#tab_links li{margin:0 2px;cursor:pointer;user-select:none;float:left;padding:5px 8px;list-style:none;line-height:20px;font-size:0.9em;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;} div.divider{width:100%;border-bottom:1px dotted #000;margin:15px 0;} div.user_dialogue input{width:98%;height:30px;font-size:1.25em;border:1px solid #888;padding:0 2px;text-align:center;} -label{font-size:0.95em;line-height:30px;cursor:pointer;} +label{color: #555; font-size:0.95em;line-height:30px;cursor:pointer;} #usr_api_key strong{display:block;font-size:0.85em;line-height:3em;font-weight:normal;} #perms_view > ul{margin:0;padding:0;} @@ -364,7 +358,7 @@ label{font-size:0.95em;line-height:30px;cursor:pointer;} #hintsbox{display:none;position:fixed;top:5%;left:2%;z-index:111;width:27%;height:auto;background:transparent;border-bottom:1px solid #ddd;} #hintsbox_logo{width:100%;height:175px;background:url(wm_logo_opt.png) center center no-repeat;background-size:32%;margin-bottom:10px;} -#hintsbox_msg{position:relative;width:92%;height:auto;background:#ffd;padding:6% 4%;font-size:1.05em;line-height:1.8em;text-align:center;} +#hintsbox_msg{position:relative;width:92%;height:auto;padding:6% 4%;font-size:1.05em;line-height:1.8em;text-align:center;} #hintsbox_msg a{text-decoration:none;color:#666;border-bottom:1px solid #666;} #hintsbox_msg:after{content:'';position:absolute;top:0;left:50%;width:0;height:0;border:22px solid transparent;border-bottom-color:#ffc;border-top:0;margin-left:-22px;margin-top:-22px;} #tagcloudbox{display:none;position:fixed;top:13vw;right:2%;z-index:110;width:30%;height:auto;background:transparent;text-align:center;} @@ -376,12 +370,10 @@ label{font-size:0.95em;line-height:30px;cursor:pointer;} /* PROPS BOX */ -#hy_box{display:none;z-index:104;position:absolute !important;top:5%;margin-left:-365px;width:680px;height:auto;padding:25px;background:#fff;margin-bottom:100px;} +#hy_box{-webkit-backdrop-filter: blur(200px); display:none;z-index:104;position:absolute !important;top:5%;margin-left:-365px;width:680px;height:auto;padding:25px;margin-bottom:100px;} #hy_options{margin:-55px 0 0 0;padding:0;} #hy_options:after{display:block;clear:both;content:'';} -#hy_options li{margin:0 2px;cursor:pointer;user-select:none;float:left;padding:5px 8px;list-style:none;line-height:20px;font-size:0.95em;background:#eee;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;} -#hy_options li:hover{background:#fff;} -#hy_options li.working{background:#fff;} +#hy_options li{color: #555; margin:0 2px;cursor:pointer;user-select:none;float:left;padding:5px 8px;list-style:none;line-height:20px;font-size:0.95em;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;} #hy_box > div > ul li{list-style:lower-greek inside;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:4.2vh;} #hy_box input{width:70%;margin-top:15px;font-size:0.95em;text-align:left;} #hy_box input::placeholder{color:#ccc;letter-spacing:1px;font-family:Exo2,Arial;} @@ -392,7 +384,7 @@ label{font-size:0.95em;line-height:30px;cursor:pointer;} #hy_textual span{color:#555;border-bottom:1px dotted #555;} #hy_textual a{color:#333 !important;border-bottom:1px solid #333 !important;} #hy_box > div > ul > li > ul > li{padding-left:20px;font-size:0.9em;line-height:1.7em;margin-bottom:10px;} -#hy_box > div > ul > li{padding-left:0;font-size:1.3em;line-height:4.2vh;} +#hy_box > div > ul > li{color: #555; padding-left:0;font-size:1.3em;line-height:4.2vh;} #hy_box > div > ul > li:last-child{margin-bottom:30px;} #hy_box strong.numeric{display:inline-block;float:right;font-size:0.85em;letter-spacing:0.5px;font-weight:normal;cursor:pointer;border-bottom:1px solid #fff;background:#ffd;} #hy_box strong.numeric:hover{border-bottom:1px solid #000;} @@ -400,19 +392,16 @@ label{font-size:0.95em;line-height:30px;cursor:pointer;} /* NUMERIC AND OTHER BOXES */ -#discovery_custom_box{display:none;user-select:none;z-index:198;top:4%;margin-left:-275px;width:500px;height:auto;padding:25px;text-align:center;background:#fff;} +#discovery_custom_box{display:none;user-select:none;z-index:198;top:4%;margin-left:-275px;width:500px;height:auto;padding:25px;text-align:center;} #discovery_enabled, #discovery_disabled{text-align:left;width:90%;margin:0 auto;} #discovery_custom_box div.rearrange{user-select:none;display:inline-block;text-align:center;width:46%;color:#fff;background:#bfbfbf;line-height:28px;border:1px solid #bfbfbf;border-radius:4px;cursor:pointer;margin:4px;} #discovery_custom_box div.rearrange:hover{background:#FE9A2E;border-color:#FE9A2E;} #ml_data, #ab_data, #ab_promise, #pd3d_data{display:none;text-align:center;margin:0 0 15px 3px;color:#555;font-weight:normal;font-size:1.15em;line-height:2em;padding:6px 3px;} #ml_data span, #ab_data span, #ab_promise span, #pd3d_data span{display:block;font-size:0.8em;line-height:1.75em;margin-top:2em;} -#ml_data{background:#f8f7ff;} -#ab_data, #ab_promise{background:#f7fbff;} -#pd3d_data{background:#ffd;} #phases_ctx{user-select:none;} -#phases_ctx span{display:inline-block;background:#ffd;text-align:center;color:#555;font-size:0.95em;line-height:2em;margin:1.5em 0 2em;padding:5px;} +#phases_ctx span{display:inline-block;text-align:center;color:#555;font-size:0.95em;line-height:2em;margin:1.5em 0 2em;padding:5px;} -#ss_custom_box{display:none;z-index:198;top:4%;margin-left:-305px;width:560px;height:auto;padding:25px;text-align:center;background:#fff;overflow:visible;} +#ss_custom_box{display:none;z-index:198;top:4%;margin-left:-305px;width:560px;height:auto;padding:25px;text-align:center;overflow:visible;} div.ss_col, div.sops_col{float:left;} div.ss_col > ul, div.sops_col > ul{margin:0;padding:0;} div.ss_col > ul > li, div.sops_col > ul > li{display:block;list-style:none;user-select:none;text-align:center;color:#fff;background:#bfbfbf;line-height:27px;border-radius:4px;cursor:pointer;margin:8px 4px;} @@ -423,12 +412,12 @@ div.sops_col{letter-spacing:1px;} #all_polyhedra_box{display:none;position:absolute !important;z-index:103;top:4%;margin-left:-49%;margin-bottom:100px;width:98%;height:auto;background:#fff url(wm_logo_opt.png) 28% 3em no-repeat;background-size:3%;} #engines_box{display:none;z-index:198;top:30%;margin-left:-250px;width:450px;height:auto;padding:25px;text-align:center;background:#fff;padding-bottom:3em;} -#tooltip{display:none;position:fixed;z-index:202;width:200px;height:auto;text-align:center;background:#ebffd6;padding:15px 10px;border-right:1px solid #ddd;border-bottom:1px solid #ddd;} +#tooltip{display:none;position:fixed;z-index:202;width:200px;height:auto;text-align:center;padding:15px 10px;border-right:1px solid #ddd;border-bottom:1px solid #ddd;} #tooltip > div{position:relative;width:100%;height:100%;font-size:1em;line-height:2em;} #tooltip > div > span{cursor:pointer;color:#888;border-bottom:1px solid #888;} #tooltip > div:after{content:'';position:absolute;top:0;left:50%;width:0;height:0;border:36px solid transparent;border-bottom-color:#ebffd6;border-top:0;margin-left:-36px;margin-top:-36px;} -#numericbox{display:none;position:fixed;z-index:215;background:#fff;height:auto;bottom:1%;left:50%;margin-left:-490px;width:950px;padding:0 15px 15px;border:1px solid #666;border-radius:4px;box-shadow:10px 10px 4px -3px rgba(0,0,0,0.4);} +#numericbox{display:none;position:fixed;z-index:215;;height:auto;bottom:1%;left:50%;margin-left:-490px;width:950px;padding:0 15px 15px;border:1px solid #666;border-radius:4px;box-shadow:10px 10px 4px -3px rgba(0,0,0,0.4);} #numericbox > ul > li{display:block;list-style:none;clear:both;width:100%;height:60px;margin-bottom:10px;border:1px solid #fff;border-radius:4px;} #numericbox > ul > li:hover{border:1px solid #ddd;} #numericbox > ul > li > div.slider_title{width:35%;float:left;padding-top:22px;letter-spacing:0.5px;line-height:1;text-align:center;} @@ -438,16 +427,16 @@ div.sops_col{letter-spacing:1px;} /* PERIODIC TABLE */ -#ptable_holder{display:none;position:absolute;z-index:1;width:1050px;height:auto;top:280px;left:50%;margin-left:-525px;background:#fff;user-select:none;} +#ptable_holder{display:none;position:absolute;z-index:1;width:1050px;height:auto;top:280px;left:50%;margin-left:-525px;user-select:none;} #ptable_holder.resulted{top:80px;} #ptable_results{width:99%;margin:0 auto;} -#ptable_previews{float:left;width:50%;text-align:left;padding-top:20px;background:#fff;} +#ptable_previews{color: #555; float:left;width:50%;text-align:left;padding-top:20px;} #ptable_previews > p{text-align:center;letter-spacing:0.5px;line-height:60px;} #ptable_previews > div.subphases_trigger{width:50%;margin:30px auto;font-size:0.95em;} #ptable_previews > div.subphases_trigger > span{font-size:26px;} #ptable_previews.ptable_dtype_2 > div.gallery_item:hover, div.gallery_item.active, #ptable_previews.ptable_dtype_3 > div.gallery_item:hover, div.gallery_item.active{background:#cf9;} -#ptable_vis{float:right;width:50%;text-align:right;padding-top:20px;background:#fff;} +#ptable_vis{float:right;width:50%;text-align:right;padding-top:20px;} #ptable_vis.fixed{position:fixed;width:525px;top:30px;left:50%;} #ptable_vis > iframe{border:1px solid #bbb;margin-top:16px;} @@ -519,23 +508,22 @@ div.sops_col{letter-spacing:1px;} #ptable_area > ul li.cat_1:before, #ptable_area > ul li.cat_2:before{content:attr(data-pos);} -#ptable_dtypes_box{display:none;position:fixed;z-index:2;width:460px;height:auto;top:294px;left:50%;margin-left:-297px;color:#333;letter-spacing:0.3px;user-select:none;} +#ptable_dtypes_box{-webkit-backdrop-filter: blur(200px); display:none;position:fixed;z-index:2;width:460px;height:auto;top:294px;left:50%;margin-left:-297px;color:#5c5c5c;letter-spacing:0.3px;user-select:none;} #ptable_dtypes_box.resulted{display:block;top:94px;} -#ptable_dtypes_box > span{display:inline-block;font-size:0.9em;background:#fbfbfb;vertical-align:top;line-height:32px;} +#ptable_dtypes_box > span{display:inline-block;font-size:0.9em;vertical-align:top;line-height:32px;} #ptable_dtypes_box > span > span{font-size:26px;color:#ccc;} #ptable_dtypes_box > div{display:inline-block;padding-top:3px;line-height:32px;} -#ptable_dtypes_box > div > label{font-size:0.9em;background:#fbfbfb;} +#ptable_dtypes_box > div > label{font-size:0.9em;} /* AUTOCOMPLETE */ div.autocomplete-suggestions{ - text-align: left; cursor: default; border: 1px solid #ccc; border-top: 0; background: #fff; box-shadow: -1px 1px 3px rgba(0,0,0,0.1); + text-align: left; cursor: default; border: 1px solid #ccc; border-top: 0; box-shadow: -1px 1px 3px rgba(0,0,0,0.1); /* core styles should not be changed */ position: absolute; display: none; z-index: 250; min-height: 23px; height:auto !important; height:23px; overflow: visible; overflow-y: auto; box-sizing: border-box; } -div.autocomplete-suggestion{ position: relative; padding: 0 .6em; line-height: 23px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 1.02em; color: #333; } +div.autocomplete-suggestion{ position: relative; padding: 0 .6em; line-height: 23px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 1.02em; color: #5c5c5c; } div.autocomplete-suggestion b{ font-weight: normal; color: #ccc; } -div.autocomplete-suggestion.selected{ background: #f0f0f0; } div.facet_switch{width:300px;margin:3px auto;height:20px;text-align:center;color:#555;} div.facet_switch span{margin-right:5px;} div.facet_switch label{display:inline-block;margin:0 3px;cursor:pointer;} @@ -548,7 +536,6 @@ div.primary_term label, div.primary_term input{cursor:pointer;} position: relative; padding: 5px 8px; border-bottom: 1px solid #d0d0d0; - background: #f8f8f8; } .selectize-dropdown-header-close { position: absolute; @@ -605,7 +592,6 @@ div.primary_term label, div.primary_term input{cursor:pointer;} } .selectize-input, .selectize-control.single .selectize-input.input-active { - background: #fff; cursor: text; } .selectize-input { @@ -621,9 +607,7 @@ div.primary_term label, div.primary_term input{cursor:pointer;} .selectize-control.multi .selectize-input.has-items { padding: 5px 8px 2px; } -.selectize-input.full { - background-color: #fff; -} + .selectize-input.focus { box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15); } @@ -664,7 +648,6 @@ div.primary_term label, div.primary_term input{cursor:pointer;} content: ' '; display: block; position: absolute; - background: #f0f0f0; height: 1px; bottom: 0; left: 0; @@ -674,7 +657,6 @@ div.primary_term label, div.primary_term input{cursor:pointer;} position: absolute; z-index: 200; text-align:center; - background: #fff; } div.prolonged .selectize-dropdown { border: 1px solid #ccc; border-top: 0; box-shadow: -1px 1px 3px rgba(0,0,0,0.1); @@ -742,7 +724,6 @@ div.prolonged .selectize-dropdown { } .selectize-control.single .selectize-input { box-shadow: 0 1px 0 rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,0.8); - background-color: #f9f9f9; background-repeat: repeat-x; } .selectize-control.single .selectize-input, @@ -765,7 +746,7 @@ div.advs.advs_aetypes div.selectize-input{border:1px solid #3e3f95;} @keyframes spin { 100% { transform:rotate(360deg); } } #rfn_preloader, #sim_preloader{display:none;margin:100px auto;width:125px;height:60px;font-size:10px;} -#rfn_preloader > div, #sim_preloader > div{height:100%;width:15px;background:#eee;display:inline-block;margin:0 5px;animation:stretchdelay 1.2s infinite ease-in-out;} +#rfn_preloader > div, #sim_preloader > div{height:100%;width:15px;display:inline-block;margin:0 5px;animation:stretchdelay 1.2s infinite ease-in-out;} #rfn_preloader > div.rect2, #sim_preloader > div.rect2{animation-delay:-1.1s;} #rfn_preloader > div.rect3, #sim_preloader > div.rect3{animation-delay:-1.0s;} #rfn_preloader > div.rect4, #sim_preloader > div.rect4{animation-delay:-0.9s;} From e83e14b7644b24aade7c7fdf51c45e675f268eb6 Mon Sep 17 00:00:00 2001 From: Evgeny Blokhin Date: Mon, 29 Apr 2024 18:16:35 +0200 Subject: [PATCH 2/2] Polish dark theme styles, change switcher, add cross-site iframe --- .DS_Store | Bin 8196 -> 0 bytes example_dev.html | 5 +- example_prod.html | 3 - labs/.DS_Store | Bin 6148 -> 0 bytes script.js | 19 --- src_js/events.js | 28 +++- src_js/markup.js | 18 ++- src_js/startup.js | 3 + src_js/third_party/darkmode.js | 270 +++++++++++++++++++++++++++++++++ src_js/wmsettings.js | 1 + webassets/ermac.css | 164 +++++++++++--------- 11 files changed, 408 insertions(+), 103 deletions(-) delete mode 100644 .DS_Store delete mode 100644 labs/.DS_Store delete mode 100644 script.js create mode 100644 src_js/third_party/darkmode.js diff --git a/.DS_Store b/.DS_Store deleted file mode 100644 index 9562986cd2675160d0f3cfb3211cd17e2b176029..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 8196 zcmeHM%Wl&^6ur}?twR6>iAOg`me^LIFBKs+N!l(d@sOGd7J!1Cq^-fRBil(@MU}Dz z{()a$317m$u!3`Erj_k9u&WT6iDu5kbC1V!eD65dAtF)lx7Uc4iO51_ESJz+Qh1!} zM48h^?g9n)L_6qrc` zcz>`_8LJw{3gy;;My3G30uIZ9KJoy`u{BmTjulEO&Z)8op{YWr7(&r8ZnHVCs&TAP z(Mc#e2|csW8H$jzgJ(-~5>7+ObHFhqc~^(^>6m>Fz)H|e{*}j7bmN$Kg8U8VPSE}TCz&k+s1J? zY$Q(7kLynKn!g={q3@pe9rvZz88*wex5FTDyr2_Fg4gcAjID)S({v6w+x{B5@z%X-PA-|A#!8CFP_kLYRoU6n?&0B+ZvsWTm!L;=P zuG*nK)H=>tvQ|?pQ?B^^$|H4oG+N(6cy4TN{vlL36j7#zD(jG1`-CU%L%$mB&@*5K zp485&BmE$)P7(Va?|&XVF#+R!{ywn}h?^-NSOg;ir+JAj?tR9##PnX8xweh^4wVbrjTK4?8kvp*WjYSL_`?u=8>Y;uY8)%X5tJ)`5uktjnCHKg J-!wC-z;DY2=e7U< diff --git a/example_dev.html b/example_dev.html index 8998896..06b9744 100755 --- a/example_dev.html +++ b/example_dev.html @@ -5,9 +5,6 @@ - - - - diff --git a/example_prod.html b/example_prod.html index cf9660f..33b9a75 100755 --- a/example_prod.html +++ b/example_prod.html @@ -5,9 +5,6 @@ - - - diff --git a/labs/.DS_Store b/labs/.DS_Store deleted file mode 100644 index e08de4e72ab2d93f740c9e39289bb2caa19c648d..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 6148 zcmeHKO-sW-5Z!I7O({YT3OxqA7Oib5h?iLF!K)EHsMN+34aRKghdq=+&iaS^CH@_K zv%4*5^(2Ut8JK;O*_jRVHtc4E5VAE6_k<`3Asi@Srhwrap?T6J$yiSoC~1w8SltG( z3h+z|viyGrXzy~OFG5il;g|h8#N5ui7G209E|?7acAsB^ejE)))#{tfWOHllc_;4_ zoooMIP5e=JG#<9PgG+ikQz{PTb~iYWdXr9R^GGG5Zj|%}Iw1;s2)Vk5l2A=rYMg{a zo$H$kr{EMirSf!IYgQ|6z0sIe-06M|cB9^$%?i%e_U^%H=OKPf)U%;p;=9zcVQ~&G zFc$SZ`GX`@$sK(2_<0;7Gr$Zm1FOh@J?os}Di+5zF$2uNuNa{7!G#if7E^=z=)j;` z0ALPoEwJ^kKhPxy(6g8tga;x`D$t}#+hR!DIY^U^dC$hD22Hw<`psC!zFFE1McT$g zx;k7)&mfP?05kBJ0qXrACA$BQfA0Tv5D&}%Gq9Qr$XwfRw@{nCTbHV&yVix?KuIVr mHMmHDp|4`Z(p6lBYJuM+1L#>y4Z;KA9|27R56r-yGVlRf!c+wS diff --git a/script.js b/script.js deleted file mode 100644 index a9531cf..0000000 --- a/script.js +++ /dev/null @@ -1,19 +0,0 @@ -const options = { - - top: '64px', // default: '32px' - right: 'unset', // default: '32px' - left: '32px', // default: 'unset' - time: '0.3s', // default: '0.3s' - mixColor: '#fff', // default: '#fff' - backgroundColor: '#fff', // default: '#fff' - buttonColorDark: '#100f2c', // default: '#100f2c' - buttonColorLight: '#fff', // default: '#fff' - saveInCookies: true, // default: true, - label: '🌓', // default: '' - autoMatchOsTheme: true // default: true - - } - - const darkmode = new Darkmode(options); - darkmode.showWidget(); - \ No newline at end of file diff --git a/src_js/events.js b/src_js/events.js index ba805b4..47f3ffb 100755 --- a/src_js/events.js +++ b/src_js/events.js @@ -1450,7 +1450,7 @@ function register_events(){ return false; });*/ - // Keys press + // keys press $(document).keydown(function(e){ var key = window.event ? e.keyCode : e.which; if (key == 13){ // ENTER: input must trigger submit button via two parent divs! @@ -1471,8 +1471,8 @@ function register_events(){ $(window).bind('hashchange', url_redraw_react); + // execute a command in all the active GUI windows (except the current) e.g. setting a new state $(window).bind('storage', function(ev){ - // This is to execute the command in all the active GUI windows (except the current) e.g. setting a new state if (ev.originalEvent.key != wmgui.store_comm_exec_key) return; @@ -1503,4 +1503,28 @@ function register_events(){ wmgui.ptable.subphases_set(state); } }); + + // theme switcher + document.getElementById('darkmode_trigger').onclick = function(){ + wmgui.darkmode.toggle(); + document.getElementById('darkmode_trigger').innerHTML = wmgui.darkmode.isActivated() ? 'enabled' : 'disabled'; + document.getElementById('comms').contentWindow.postMessage(JSON.stringify({darkmode: wmgui.darkmode.isActivated() ? 1 : 2}), '*'); + } + + // cross-site comms + window.addEventListener('message', function(message){ + //if (message.origin === 'https://trusted.com') { + var received; + try { + received = JSON.parse(message.data); + } catch (ignore){} + var darkmode = received.darkmode; + if (darkmode !== undefined){ + darkmode = (darkmode === 1); + if (darkmode !== wmgui.darkmode.isActivated()) wmgui.darkmode.toggle(); + document.getElementById('darkmode_trigger').innerHTML = wmgui.darkmode.isActivated() ? 'enabled' : 'disabled'; + } + //} + }); + // EOF register_events } diff --git a/src_js/markup.js b/src_js/markup.js index eab8974..343da87 100755 --- a/src_js/markup.js +++ b/src_js/markup.js @@ -490,12 +490,12 @@ function register_html(){
Color legend
    -
  • liquid or gas blue or violet
    • -
  • 1-phase violet
    • -
  • 2-phase gray or white
    • -
  • 3-phase yellow
    • -
  • 4-phase red
    • -
  • 5-phase green
    • +
  • liquid or gas
    • +
  • 1-phase
    • +
  • 2-phase
    • +
  • 3-phase
    • +
  • 4-phase
    • +
  • 5-phase
@@ -837,6 +837,10 @@ function register_html(){ - + + + + + `); } diff --git a/src_js/startup.js b/src_js/startup.js index 74073e7..9a77cd1 100755 --- a/src_js/startup.js +++ b/src_js/startup.js @@ -382,6 +382,9 @@ function satisfy_requirements(){ $('#engines_a').prop('checked', wmgui.engines == 'a'); $('#engines_b').prop('checked', wmgui.engines == 'b'); + wmgui.darkmode = new Darkmode({saveInCookies: false}); + document.getElementById('darkmode_trigger').innerHTML = wmgui.darkmode.isActivated() ? 'enabled' : 'disabled'; + //create_floating_slider('density', 42, 'Mg/m3', 10, 900, 10); // EOF satisfy_requirements } diff --git a/src_js/third_party/darkmode.js b/src_js/third_party/darkmode.js new file mode 100644 index 0000000..0f3b19f --- /dev/null +++ b/src_js/third_party/darkmode.js @@ -0,0 +1,270 @@ +/* https://github.com/sandoche/Darkmode.js */ +!(function (e, t) { + 'object' == typeof exports && 'object' == typeof module + ? (module.exports = t()) + : 'function' == typeof define && define.amd + ? define('darkmode-js', [], t) + : 'object' == typeof exports + ? (exports['darkmode-js'] = t()) + : (e['darkmode-js'] = t()); +})('undefined' != typeof self ? self : this, function () { + return (function (e) { + var t = {}; + function n(o) { + if (t[o]) return t[o].exports; + var r = (t[o] = { i: o, l: !1, exports: {} }); + return e[o].call(r.exports, r, r.exports, n), (r.l = !0), r.exports; + } + return ( + (n.m = e), + (n.c = t), + (n.d = function (e, t, o) { + n.o(e, t) || Object.defineProperty(e, t, { enumerable: !0, get: o }); + }), + (n.r = function (e) { + 'undefined' != typeof Symbol && + Symbol.toStringTag && + Object.defineProperty(e, Symbol.toStringTag, { value: 'Module' }), + Object.defineProperty(e, '__esModule', { value: !0 }); + }), + (n.t = function (e, t) { + if ((1 & t && (e = n(e)), 8 & t)) return e; + if (4 & t && 'object' == typeof e && e && e.__esModule) return e; + var o = Object.create(null); + if ( + (n.r(o), + Object.defineProperty(o, 'default', { enumerable: !0, value: e }), + 2 & t && 'string' != typeof e) + ) + for (var r in e) + n.d( + o, + r, + function (t) { + return e[t]; + }.bind(null, r) + ); + return o; + }), + (n.n = function (e) { + var t = + e && e.__esModule + ? function () { + return e.default; + } + : function () { + return e; + }; + return n.d(t, 'a', t), t; + }), + (n.o = function (e, t) { + return Object.prototype.hasOwnProperty.call(e, t); + }), + (n.p = ''), + n((n.s = 0)) + ); + })([ + function (e, t, n) { + 'use strict'; + Object.defineProperty(t, '__esModule', { value: !0 }), (t.default = void 0); + var o = (function (e) { + if (e && e.__esModule) return e; + var t = {}; + if (null != e) + for (var n in e) + if (Object.prototype.hasOwnProperty.call(e, n)) { + var o = + Object.defineProperty && Object.getOwnPropertyDescriptor + ? Object.getOwnPropertyDescriptor(e, n) + : {}; + o.get || o.set ? Object.defineProperty(t, n, o) : (t[n] = e[n]); + } + return (t.default = e), t; + })(n(1)); + var r = o.default; + (t.default = r), + o.IS_BROWSER && + (function (e) { + e.Darkmode = o.default; + })(window), + (e.exports = t.default); + }, + function (e, t, n) { + 'use strict'; + function o(e, t) { + for (var n = 0; n < t.length; n++) { + var o = t[n]; + (o.enumerable = o.enumerable || !1), + (o.configurable = !0), + 'value' in o && (o.writable = !0), + Object.defineProperty(e, o.key, o); + } + } + Object.defineProperty(t, '__esModule', { value: !0 }), (t.default = t.IS_BROWSER = void 0); + var r = 'undefined' != typeof window; + t.IS_BROWSER = r; + var a = (function () { + function e(t) { + if ( + ((function (e, t) { + if (!(e instanceof t)) throw new TypeError('Cannot call a class as a function'); + })(this, e), + r) + ) { + t = Object.assign( + {}, + { + bottom: '32px', + right: '32px', + left: 'unset', + time: '0.3s', + mixColor: '#fff', + backgroundColor: '#fff', + buttonColorDark: '#100f2c', + buttonColorLight: '#fff', + label: '', + saveInCookies: !0, + autoMatchOsTheme: !0 + }, + t + ); + var n = '\n .darkmode-layer {\n position: fixed;\n pointer-events: none;\n background: ' + .concat(t.mixColor, ';\n transition: all ') + .concat( + t.time, + ' ease;\n mix-blend-mode: difference;\n }\n\n .darkmode-layer--button {\n width: 2.9rem;\n height: 2.9rem;\n border-radius: 50%;\n right: ' + ) + .concat(t.right, ';\n bottom: ') + .concat(t.bottom, ';\n left: ') + .concat( + t.left, + ';\n }\n\n .darkmode-layer--simple {\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n transform: scale(1) !important;\n }\n\n .darkmode-layer--expanded {\n transform: scale(100);\n border-radius: 0;\n }\n\n .darkmode-layer--no-transition {\n transition: none;\n }\n\n .darkmode-toggle {\n background: ' + ) + .concat( + t.buttonColorDark, + ';\n width: 3rem;\n height: 3rem;\n position: fixed;\n border-radius: 50%;\n border:none;\n right: ' + ) + .concat(t.right, ';\n bottom: ') + .concat(t.bottom, ';\n left: ') + .concat( + t.left, + ';\n cursor: pointer;\n transition: all 0.5s ease;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .darkmode-toggle--white {\n background: ' + ) + .concat( + t.buttonColorLight, + ';\n }\n\n .darkmode-toggle--inactive {\n display: none;\n }\n\n .darkmode-background {\n background: ' + ) + .concat( + t.backgroundColor, + ';\n position: fixed;\n pointer-events: none;\n z-index: -10;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n }\n\n img, .darkmode-ignore {\n isolation: isolate;\n display: inline-block;\n }\n\n @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n .darkmode-toggle {display: none !important}\n }\n\n @supports (-ms-ime-align:auto), (-ms-accelerator:true) {\n .darkmode-toggle {display: none !important}\n }\n ' + ), + o = document.createElement('div'), + a = document.createElement('button'), + i = document.createElement('div'); + (a.innerHTML = t.label), + a.classList.add('darkmode-toggle--inactive'), + o.classList.add('darkmode-layer'), + i.classList.add('darkmode-background'); + var d = 'true' === window.localStorage.getItem('darkmode'), + s = t.autoMatchOsTheme && window.matchMedia('(prefers-color-scheme: dark)').matches, + l = null === window.localStorage.getItem('darkmode'); + ((!0 === d && t.saveInCookies) || (l && s)) && + (o.classList.add( + 'darkmode-layer--expanded', + 'darkmode-layer--simple', + 'darkmode-layer--no-transition' + ), + a.classList.add('darkmode-toggle--white'), + document.body.classList.add('darkmode--activated')), + document.body.insertBefore(a, document.body.firstChild), + document.body.insertBefore(o, document.body.firstChild), + document.body.insertBefore(i, document.body.firstChild), + this.addStyle(n), + (this.button = a), + (this.layer = o), + (this.saveInCookies = t.saveInCookies), + (this.time = t.time); + } + } + var t, n, a; + return ( + (t = e), + (n = [ + { + key: 'addStyle', + value: function (e) { + var t = document.createElement('link'); + t.setAttribute('rel', 'stylesheet'), + t.setAttribute('type', 'text/css'), + t.setAttribute('href', 'data:text/css;charset=UTF-8,' + encodeURIComponent(e)), + document.head.appendChild(t); + } + }, + { + key: 'showWidget', + value: function () { + var e = this; + if (r) { + var t = this.button, + n = this.layer, + o = 1e3 * parseFloat(this.time); + t.classList.add('darkmode-toggle'), + t.classList.remove('darkmode-toggle--inactive'), + t.setAttribute('aria-label', 'Activate dark mode'), + t.setAttribute('aria-checked', 'false'), + t.setAttribute('role', 'checkbox'), + n.classList.add('darkmode-layer--button'), + t.addEventListener('click', function () { + var r = e.isActivated(); + r + ? (n.classList.remove('darkmode-layer--simple'), + t.setAttribute('disabled', !0), + setTimeout(function () { + n.classList.remove('darkmode-layer--no-transition'), + n.classList.remove('darkmode-layer--expanded'), + t.removeAttribute('disabled'); + }, 1)) + : (n.classList.add('darkmode-layer--expanded'), + t.setAttribute('disabled', !0), + setTimeout(function () { + n.classList.add('darkmode-layer--no-transition'), + n.classList.add('darkmode-layer--simple'), + t.removeAttribute('disabled'); + }, o)), + t.classList.toggle('darkmode-toggle--white'), + document.body.classList.toggle('darkmode--activated'), + window.localStorage.setItem('darkmode', !r); + }); + } + } + }, + { + key: 'toggle', + value: function () { + if (r) { + var e = this.layer, + t = this.isActivated(), + n = this.button; + e.classList.toggle('darkmode-layer--simple'), + document.body.classList.toggle('darkmode--activated'), + window.localStorage.setItem('darkmode', !t), + n.setAttribute('aria-label', 'De-activate dark mode'), + n.setAttribute('aria-checked', 'true'); + } + } + }, + { + key: 'isActivated', + value: function () { + return r ? document.body.classList.contains('darkmode--activated') : null; + } + } + ]) && o(t.prototype, n), + a && o(t, a), + e + ); + })(); + t.default = a; + } + ]); +}); diff --git a/src_js/wmsettings.js b/src_js/wmsettings.js index 64ad168..c5d58e8 100755 --- a/src_js/wmsettings.js +++ b/src_js/wmsettings.js @@ -47,6 +47,7 @@ wmgui.cliff_counter = null; wmgui.sid = null; wmgui.oauths = null; wmgui.prod = true; // (window.location.host.indexOf('localhost') == -1); +wmgui.darkmode = null; wmgui.cliffhangers = [ "binary compounds with negative thermal expansion", diff --git a/webassets/ermac.css b/webassets/ermac.css index 7a95018..d77fa89 100755 --- a/webassets/ermac.css +++ b/webassets/ermac.css @@ -1,15 +1,16 @@ /* COMMON */ -html, body{text-size-adjust:100%;font-family:Exo2,Arial;margin:0;padding:0;} +html, body{height:100%;text-size-adjust:100%;font-family:Exo2,Arial;margin:0;padding:0;} /* body.noscroll{overflow:hidden;} */ sup, sub{font-size:12px;} -#overlay{position:fixed;left:0;top:0;width:100%;height:100%;text-align:center;z-index:100;overflow:hidden;opacity:0.9;} -#visavis{display:none;z-index:50;position:fixed;top:56px;left:50%;margin-left:-36%;width:72%;height:99%;} +.sky{background:#fff;} +#overlay{position:fixed;left:0;top:0;width:100%;height:100%;text-align:center;z-index:100;overflow:hidden;background:#fff;opacity:0.9;} +#visavis{display:none;z-index:50;position:fixed;top:56px;left:50%;margin-left:-36%;width:72%;height:99%;background:#fff;} .wmbutton{cursor:pointer;user-select:none;font-size:1.3em;text-align:center;border:1px solid #999;background:#999;color:#fff;line-height:1.4em;border-radius:2px;text-decoration:none;box-shadow:inset 0 2px 2px rgba(255,255,255,0.3), inset 0 -2px 2px rgba(0,0,0,0.3), inset 0 20px 10px rgba(255,255,255,0.3), 0 0 2px 1px rgba(0,0,0,0.2), 0 2px 2px rgba(0,0,0,0.3);} .wmbutton:hover{box-shadow:inset 0 2px 2px rgba(255,255,255,0.2), inset 0 -2px 2px rgba(0,0,0,0.2), inset 0 20px 10px rgba(255,255,255,0.2), 0 0 2px 1px rgba(0,0,0,0.2), 0 2px 2px rgba(0,0,0,0.2);} .wmbutton:active{transform:translateY(1px);} -.wmbutton.disabled{cursor:not-allowed;box-shadow:none;border-color:#eee !important;} +.wmbutton.disabled{cursor:not-allowed;box-shadow:none;background:#eee !important;border-color:#eee !important;} input[type=text], input[type=email], input[type=password], textarea, div.selectize-input{outline:none;border-radius:2px;box-shadow:inset 0 2px 2px rgba(0,0,0,0.15);font-family:Exo2,Arial;} select{font-family:Exo2,Arial;} @@ -18,29 +19,26 @@ div.cross{float:right;width:16px;height:16px;font-size:10px;text-align:center;cu div.cross:active{transform:translateY(1px);} div.gear{float:right;margin:12px 2px 0 0;width:16px;height:16px;font-size:10px;text-align:center;cursor:pointer;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAApQAAAKUBcMTeVQAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAHdSURBVDiNdZMxaBRREIa//7iNeGsKS5MIglaCKYSA4GGd61LsC+RsrAIWio2owUoIwRRK0MbuUhhxX7NWm0axMIVtLGwSEEJsDdweepeDsci7Ywmbrd4/M//M/8++J874nHPrwGMASetpmj6pqquPDq1W61wcx/cnJiY2t7a2/gA3RjkzmwVot9sXh8PhcqPR2Oh0Ov8AFKadB7aBO8C+mX2U9ACYDD26kt6a2RJwBdguimIhz/N+LUh8GMgAVyWtlMgAk2b2LJAB5uM4vgdQAxgMBu+AvQqLh8DvivhPSe/HDbIsO5LkSwUHkpre+xnv/bSkJnBQyn/y3hcASpLklaRZ4BYQB0vNNE13yiMXFxdvm9m3AAvgi6RdOefstGzv/UyFbJxzh8BUOVarqFMV+axcDXgBZEEWwJRzrlkxvQlcCrAHfDaz1+OOSZKsht8HJ0tcGu0h+P8AXAaQtJam6cpYknPuAvAduH5q8GGomToV3zs+Pp7LsuyoBmBmdyvIANMVZIBr9Xp9ebQDer1eh5OrDPBL0hrQLRG6wCqwH/BXSW/GDfI87xdFsSDpaRRFN4O/8j3Y8d4/j6JoDnhUFMW89/4vlF5jnud94OUIS9o1s/kAfwCEV7pR9vIf1VyoNh7B/AQAAAAASUVORK5CYII=) no-repeat;} -#notifybox{z-index:210;position:fixed;top:30px;right:20px;width:380px;background:#fc6;border-radius:5px;padding:20px;font-size:1.1em;line-height:1.5em;text-align:center;} +#notifybox{z-index:210;position:fixed;top:40px;right:20px;width:380px;background:#fc6;border-radius:5px;padding:20px;font-size:1.1em;line-height:1.5em;text-align:center;} #notifybox > a{text-decoration:none;color:#3e3f95;border-bottom:1px solid #3e3f95;} #ermac_logo{width:200px;height:200px;margin:0 auto;background:url(wm_logo_opt.png) center center no-repeat;background-size:75%;} +body.darkmode--activated #ermac_logo{filter:invert(100%);} #ermac_logo.cornered{display:block !important;position:fixed;top:0;left:0;width:58px;height:58px;margin:0 0 0 5%;z-index:52;} #ermac_logo.resulted{display:none;} #ermac_logo > a{display:block;width:100%;height:100%;} #main{width:100%;min-height:100%;height:auto !important;margin:0 0 -33px 0;padding:0;} -#footer{width:100%;height:24px;padding-top:8px;text-align:center;font-size:0.85em;color:#555;position: fixed;bottom: 10px;margin-top: 10px;} +#footer{width:100%;height:24px;padding-top:8px;text-align:center;font-size:0.85em;color:#555;background:#fff;} #footer a{text-decoration:none;color:#555;border-bottom:1px solid #555;} h2, h3{line-height:3em;font-weight:normal;color:#E36868;} -h4{font-weight:normal;font-size:1.1em;line-height:2.15em;text-align:center;margin-bottom:10px;} +h4{font-weight:normal;font-size:1.1em;line-height:2.15em;text-align:center;background:#fcfcbb;margin-bottom:10px;} - -.darkmode-layer, .darkmode-toggle { - z-index: 500; -} /* SEARCH FIELD */ /* HEIGHT 52px */ #search_box{position:fixed;top:0;left:50%;width:590px;margin-left:-295px;z-index:51;clear:both;padding-top:15px;} -#search_box.fluid{width:100%;margin-left:-50%;} +#search_box.fluid{width:100%;margin-left:-50%;background:#fff;} #search_area{width:590px;height:30px;margin:0 auto;margin-bottom:16px;} #search_area.prolonged{width:770px;} @@ -56,32 +54,33 @@ h4{font-weight:normal;font-size:1.1em;line-height:2.15em;text-align:center;margi #hierarchy_trigger span{position:absolute;} #hierarchy_trigger span sub{display:block;position:relative;left:0;top:16px;font-size:10px;line-height:8px;} #hierarchy_trigger span sup{display:block;position:relative;left:-1px;top:0;font-size:20px;line-height:10px;} -#legend{width:100%;margin-top:-5px;letter-spacing:0.5px;text-decoration:none;height:22px;line-height:22px;} -#legend a{text-decoration:none;border-bottom:1px solid #333;} - +#legend{width:100%;margin-top:-5px;letter-spacing:0.5px;color:#333;height:22px;line-height:22px;} +#legend a{text-decoration:none;color:#333;border-bottom:1px solid #333;} +#legend > *{background:#fbfbfb;} /* ADVANCED SEARCH */ -#advsbox{-webkit-backdrop-filter: blur(200px); display:none;z-index:102;top:6%;margin-left:-275px;width:500px;height:auto;padding:22px 25px;} +#advsbox{display:none;z-index:102;top:6%;margin-left:-275px;width:500px;height:auto;padding:22px 25px;background:#fff;} #advsbox div.advs{clear:both;width:100%;height:42px;padding:7px 0;} #advsbox div.advs > div.advs_capt{font-size:1.1em;float:left;width:34%;line-height:42px;text-align:left;} #advsbox div.advs > div.advs_capt:after{content:':';} #advsbox div.advs > input{float:right;width:63%;height:30px;font-size:1.1em;padding-left:2px;margin-top:5px;text-align:left;} #advsbox div.advs > div.advs_legend{clear:both;float:right;color:#888;line-height:12px;font-size:0.85em;margin-right:2px;} #advsbox div.advs > div.advs_legend a{text-decoration:none;color:#888;border-bottom:1px solid #888;letter-spacing:0.5px;} -#crtab{color: #555; margin:2.5vmin 0 1.5vmin;} +#crtab{color:#555;margin:2.5vmin 0 1.5vmin;} #crtab > div{display:inline-block;width:49%;font-size:1.1em;height:4vmin;line-height:40px;letter-spacing:-0.5px;} #crtab > div:nth-child(even){text-align:right;} -#crtab strong.numeric{font-size:0.85em;letter-spacing:0.5px;font-weight:normal;cursor:pointer;border-bottom:1px solid #fff;} +#crtab strong.numeric{font-size:0.85em;letter-spacing:0.5px;font-weight:normal;cursor:pointer;border-bottom:1px solid #fff;background:#ffd;} #crtab strong.numeric:hover{border-bottom:1px solid #000;} #advstab_triggers, #numericbox_triggers{width:100%;} #advsearch_do_trigger, #numericbox_do_trigger{display:inline-block;width:125px;margin-left:179px;} #advsearch_drop_trigger, #numericbox_drop_trigger{display:inline-block;width:100px;margin-left:1px;background:#c00;border:1px solid #c00;} -#advstab_options{color: #555; margin:-52px 0 0 0;padding:0;} +#advstab_options{color:#333;margin:-52px 0 0 0;padding:0;} #advstab_options:after{display:block;clear:both;content:'';} -#advstab_options li{margin:0 2px;cursor:pointer;user-select:none;float:left;padding:5px 10px;list-style:none;line-height:20px;font-size:0.95em;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;} - +#advstab_options li{margin:0 2px;cursor:pointer;user-select:none;float:left;padding:5px 10px;list-style:none;line-height:20px;font-size:0.95em;background:#ddd;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;} +#advstab_options li:hover{background:#fff;} +#advstab_options li.working{background:#fff;} div.advstab{display:none;} div.advs.advs_props > div{color:#ff8400;} @@ -111,6 +110,8 @@ div.advs.advs_years > input{border:1px solid #E36868;} #databrowser.tabled{padding-top:102px;} #databrowser.thumbed{padding-top:80px;} #databrowser.tabled tr{width:100%;height:26px;} +#databrowser.tabled tr:nth-child(even){background:#fdfdfd;} +#databrowser.tabled tr:hover{background:#fafafa;} #databrowser.tabled tr.busy_entry{color:#f00;} #databrowser.tabled tr > td{border-bottom:1px solid #eee;padding:6px 3px;cursor:pointer;} #databrowser.thumbed tr{width:100%;} @@ -119,7 +120,7 @@ div.advs.advs_years > input{border:1px solid #E36868;} div.gallery_item{display:inline-block;width:150px;height:200px;margin:0 6px 8px;cursor:pointer;border:1px solid #fff;user-select:none;} div.gallery_item:hover, div.gallery_item.busy_entry{background:#fcfcbb;} div.gallery_item > span{display:block;text-align:center;font-size:0.9em;} -div.gallery_img{width:140px;margin:4px auto 0;min-height:140px;text-align:center;display:table;table-layout:fixed;position:relative;overflow:hidden;text-overflow:ellipsis;word-break:break-all;background-size:65%;background-position:center top;background-repeat:no-repeat;} +div.gallery_img{width:140px;margin:4px auto 0;min-height:140px;text-align:center;display:table;table-layout:fixed;position:relative;overflow:hidden;text-overflow:ellipsis;word-break:break-all;background-size:65%;background-position:center top;background-repeat:no-repeat;background-color:#fff;} div.gallery_img > img{display:table-cell;vertical-align:middle;max-width:140px;max-height:140px;margin:0 auto;} div.gallery_img > div{display:table-cell;vertical-align:middle;width:140px;height:140px;border:1px solid #999;padding:0 2px;font-size:0.9em;letter-spacing:-0.5px;} div.gallery_img > div:first-letter {font-size:1.25em;text-transform:uppercase;} @@ -129,15 +130,16 @@ div.gallery_img > div.articled{vertical-align:top;padding:8px 2px;} div.gallery_img > div.articled > span{color:#777;} div.gallery_img > p{position:absolute;top:50px;left:0;width:100%;text-align:center;font-size:1.3em;color:#333;letter-spacing:-1px;white-space:nowrap;} div.gallery_img > span{display:table-cell;vertical-align:bottom;} -div.gallery_img > span > p{line-height:20px;letter-spacing:-0.5px;} +div.gallery_img > span > p{background:#fff;line-height:20px;letter-spacing:-0.5px;} div.gallery_label{font-size:0.95em;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:2px 0;letter-spacing:-0.5px;line-height:1.6em;} div.gallery_label > a.launch_id{text-decoration:none;color:#c00;border-bottom:1px solid #c00;} div.gallery_label > a.launch_id:hover{color:#000;border-bottom:1px solid #000;} +div.pd_full{background:#f6f6f6;} a.resolve_ref{text-decoration:none;} a.resolve_ref.visited, a.resolve_ref:visited{color:#f00;border-bottom:1px solid #f00;} -th{text-align:center;} +th{text-align:center;background:#fafafa;} th.header{background:#fafafa url(ascdesc.gif) right center no-repeat;cursor:pointer;} th.headerSortUp{background:#fafafa url(asc.gif) right center no-repeat;cursor:pointer;} th.headerSortDown{background:#fafafa url(desc.gif) right center no-repeat;cursor:pointer;} @@ -194,7 +196,7 @@ div.context_msg{display:none;width:70%;margin:0 auto;padding-top:10px;color:#555 #plt_matrix > a{background:url(plots.gif) -205px 0 no-repeat;} #plt_cube > a{width:70px !important;background:url(plots.gif) -265px 0 no-repeat;} -#apihint{font-weight:normal;color:#000;font-size:1.15em;line-height:1.5em;margin-bottom:50px;padding:20px 5px 45px;overflow-wrap:break-word;} +#apihint{font-weight:normal;color:#000;font-size:1.15em;line-height:1.5em;margin-bottom:50px;padding:20px 5px 45px;background:#f6f6f6;overflow-wrap:break-word;} #apihint span{color:#c00;} #apihint a{text-decoration:none;color:#000;border-bottom:1px solid #000;} /* @@ -222,10 +224,10 @@ div.opened div.gallery_img:after{content:"";position:absolute;top:0;right:0;bott /* COLUMNS */ -div.col_title{width:100%;height:40px;font-size:0.9em;letter-spacing:1.5px;text-align:center;line-height:40px;margin-bottom:6px;color:#333;overflow:hidden;text-transform:uppercase;} +div.col_title{width:100%;height:40px;font-size:0.9em;letter-spacing:1.5px;text-align:center;line-height:40px;margin-bottom:6px;color:#333;background:#fafafa;overflow:hidden;text-transform:uppercase;} div.col_title a{text-decoration:none;color:#000;border-bottom:1px solid #000;} -#ctx_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:90%;z-index:56;border-top:1px solid #888;} +#ctx_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:90%;z-index:56;background:#fff;border-top:1px solid #888;} #ctx_col > ul{margin:0;padding:0;} #ctx_col > ul > li{list-style:none;width:80px;height:96px;margin:0 auto;display:block;} #ctx_col > ul > li > a{display:block;width:100%;height:100%;} @@ -247,13 +249,13 @@ div.col_title a{text-decoration:none;color:#000;border-bottom:1px solid #000;} #download_inp{background:url(icons.png) 0 -589px no-repeat;} #download_raw{background:url(icons.png) 0 -687px no-repeat;} -#visavis_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:90%;z-index:57;border-top:1px solid #888;} +#visavis_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:90%;z-index:57;background:#fff;border-top:1px solid #888;} #visavis_col li{display:block;cursor:pointer;user-select:none;text-align:left;list-style:none;color:#fff;border-bottom-right-radius:4px;letter-spacing:0.5px;} #visavis_col ul{margin:0;padding:0;} #visavis_col > ul > li{line-height:1.1em;margin-bottom:4px;padding:4px 0 4px 6px;background:#bfbfbf;} #visavis_col > ul > li.embodied{background:#FE9A2E;} #visavis_col > ul > li > a{display:block;outline:none;text-decoration:none;color:#fff;} -#ind_col{color: #555; display:none;position:fixed;top:62px;left:0;width:13.5%;height:90%;z-index:54;border-top:1px solid #888;text-align:center;line-height:2em;overflow:hidden;} +#ind_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:90%;z-index:54;background:#fff;border-top:1px solid #888;text-align:center;line-height:2em;overflow:hidden;} #ind_col a{text-decoration:none;color:#333;border-bottom:1px solid #333;letter-spacing:-0.5px;} #ind_col p{margin:15px 0;} #ind_col strong{font-size:80px;line-height:90px;} @@ -264,12 +266,13 @@ div.ctxpanel{display:none;border-top:1px solid #888;margin-top:4vh;} #ctxpanel_plots li.ss_y{background:#E36868;} #ctxpanel_plots li.ss_z{background:#3e3f95;} #ctxpanel_plots li.embodied{background:#FE9A2E;} -#ctxpanel_plots span.sops{display:inline-block;padding:2px;margin-left:2px;color:#000;font-size:0.8em;line-height:12px;letter-spacing:-0.5px;} +#ctxpanel_plots span.sops{display:inline-block;padding:2px;margin-left:2px;background:#fff;color:#000;font-size:0.8em;line-height:12px;letter-spacing:-0.5px;} #select_cmp_trigger{font-size:1.05em;text-align:center;width:90%;margin:15px 0 0 5%;} +#select_cmp_trigger > option{background:#fff;} #ctxpanel_discovery > ul{margin:0;padding:0;} #ctxpanel_discovery > ul > li.discovery_custom{display:none;background:#FE9A2E;} -#right_col{display:none;position:fixed;top:62px;right:0;width:13.5%;height:auto;z-index:55;border-top:1px solid #888;overflow:hidden;} +#right_col{display:none;position:fixed;top:62px;right:0;width:13.5%;height:auto;z-index:55;border-top:1px solid #888;overflow:hidden;background:#fff;} #interpret{clear:both;margin:16px 0 0 0;padding:0;} #interpret li{text-align:left;list-style:none;cursor:pointer;user-select:none;line-height:1.4em;color:#fff;font-size:1em;margin-bottom:4px;padding:2px 0 2px 3px;border-bottom-left-radius:4px;overflow:hidden;text-overflow:ellipsis;} #interpret li span{font-size:0.9em;letter-spacing:1px;} @@ -284,7 +287,7 @@ div.ctxpanel{display:none;border-top:1px solid #888;margin-top:4vh;} #history > ul > li{text-align:left;list-style:none;line-height:1.15em;margin:10px 0;} #history > ul > li > a{text-decoration:none;font-size:0.95em;} -#refine_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:auto;z-index:55;border-top:1px solid #888;overflow:hidden;} +#refine_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:auto;z-index:55;border-top:1px solid #888;overflow:hidden;background:#fff;} #refine_col > ul{margin:0 0 45px 0;padding:0;} #refine_col > ul > li{text-align:left;list-style:none;line-height:1.3em;margin:0 0 3px 0;padding:0 0 0 6px;border-bottom-right-radius:4px;} #refine_col > ul > li > a{display:block;width:100%;height:100%;text-decoration:none;color:#fff;} @@ -295,19 +298,22 @@ div.ctxpanel{display:none;border-top:1px solid #888;margin-top:4vh;} .fct_classes{background:#E36868;} .fct_props, .fct_numeric{background:#ff8400;} .fct_years, .fct_authors, .fct_codens, .fct_doi, .fct_geos, .fct_orgs, .fct_advsearch{background:#999;} +li.new_rfn_facet{background:#fff;} a.extd_refine, a.collapse_refine{letter-spacing:1px;font-size:0.75em;text-transform:uppercase;text-align:right;} li.extd_refine, li.collapse_refine{padding-right:6px;} -#sim_col{display:none;position:fixed;top:62px;right:0;width:13.5%;height:95%;z-index:56;border-top:1px solid #888;overflow:hidden;} -#sim_col > ul{color: #555; margin:0;padding:0;} +#sim_col{display:none;position:fixed;top:62px;right:0;width:13.5%;height:95%;z-index:56;border-top:1px solid #888;overflow:hidden;background:#fff;} +#sim_col > ul{color:#555;margin:0;padding:0;} #sim_col > ul > li{list-style:none;line-height:1.8em;background:#999;margin-bottom:3px;border-bottom-left-radius:4px;} #sim_col > ul > li > a{display:block;white-space:nowrap;width:100%;height:100%;text-decoration:none;color:#fff;padding-left:3px;} #sim_legend{text-align:center;margin:25px auto 8px;width:90%;font-size:1.05em;line-height:1.4em;color:#333;} #sim_trigger{display:block;width:125px;margin:30px auto 0;} #pd_legend{display:none;margin-top:50px;border-top:1px solid #888;} #pd_legend > ul{margin:0;padding:0;} -#pd_legend > ul > li{list-style:none;line-height:2.2em;} +#pd_legend > ul > li{list-style:none;line-height:2.2em;text-align:center;} +#pd_legend > ul > li span{color:#fff;padding:2px 10px;} +body.darkmode--activated #pd_legend > ul > li span{color:#000 !important;} #own_phase{margin-top:4vmin;text-align:center;} #own_phase a, #sim_legend a{text-decoration:none;} @@ -316,25 +322,26 @@ div.examples > ul{margin:0;padding:0;} div.examples > ul > li{text-align:center;list-style:none;line-height:1.25em;margin:15px 0;padding-left:4px;} div.examples > ul > li > a{text-decoration:none;letter-spacing:-0.5px;} -div.controlswitch{clear:both;width:100%;height:40px;color:#666;margin:5px auto 0;line-height:40px;border-bottom-left-radius:4px;overflow:hidden;white-space:nowrap;} +div.controlswitch{clear:both;width:100%;height:40px;color:#666;background:#eee;margin:5px auto 0;line-height:40px;border-bottom-left-radius:4px;overflow:hidden;white-space:nowrap;} div.controlswitch > div{display:none;float:left;cursor:pointer;user-select:none;text-align:center;font-size:1vmax;} div.controlswitch > div.active, div.controlswitch > div:hover{background:#bfbfbf;color:#fff;} #control_d{letter-spacing:-0.5px;} /* USER ACCOUNT */ -#userbox{position:fixed;top:0;right:0;height:34px;z-index:200;font-size:0.9em;border-bottom-left-radius:4px;line-height:33px;padding:0 8px 0 3px;border-bottom:1px solid #888;border-left:1px solid #888;cursor:pointer;box-shadow:8px 8px 4px -3px rgba(0,0,0,0.4);overflow:hidden;} +#userbox{position:fixed;top:0;right:0;height:34px;z-index:200;background:#fff;font-size:0.9em;color:#555;border-bottom-left-radius:4px;line-height:33px;padding:0 8px 0 3px;border-bottom:1px solid #888;border-left:1px solid #888;cursor:pointer;box-shadow:8px 8px 4px -3px rgba(0,0,0,0.4);overflow:hidden;} #userbox span{margin:0 3px;} -#userbox span.user_title{display:none;color:#555;} +#userbox span.user_title{display:none;} +#userbox > div.logged_out{background:#fff;} -#loginbox, #factorbox, #restorebox{-webkit-backdrop-filter: blur(1000px); display:none;margin-left:-200px;width:350px;padding:25px;text-align:center;} +#loginbox, #factorbox, #restorebox{display:none;margin-left:-200px;width:350px;padding:25px;background:#fff;text-align:center;} #loginbox{z-index:109;} #factorbox, #restorebox{z-index:110;} input.factor_form_resp {display:inline-block;font-family:Courier;font-weight:bold;width:20px !important;height:40px !important;font-size:30px !important;margin-right:5px;text-align:center;outline:none;border-top:none !important;border-left:none !important;border-right:none !important;border-bottom:2px solid #000 !important;} -#menubox{display:none;z-index:111;margin-left:-250px;width:450px;padding:25px;text-align:center;} -div.notice{color: #555; font-size:0.95em;line-height:2.5em;} +#menubox{display:none;z-index:111;margin-left:-250px;width:450px;padding:25px;background:#fff;text-align:center;} +div.notice{color:#555;font-size:0.95em;line-height:2.5em;} span.href, div.notice > a{cursor:pointer;text-decoration:none;color:#3e3f95;border-bottom:1px solid #3e3f95;letter-spacing:0.5px;} #account_holder_name{font-size:1.4em;text-align:center;margin-bottom:0.8em;} #account_holder_acclogin, #account_holder_accpass{line-height:2em;color:#3e3f95;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} @@ -343,13 +350,15 @@ span.href, div.notice > a{cursor:pointer;text-decoration:none;color:#3e3f95;bord #account_pass_hint{width:90%;height:auto;position:relative;margin:2vh auto;font-size:0.95em;line-height:2.5vh;background:#ffd;padding:15px;} #account_pass_hint:after{content:'';position:absolute;bottom:0;left:50%;width:0;height:0;border:22px solid transparent;border-top-color:#ffc;border-bottom:0;margin-left:-22px;margin-bottom:-22px;} -#tab_links{margin:-55px 0 0 0;padding:0;} +#tab_links{color:#333;margin:-55px 0 0 0;padding:0;} #tab_links:after{display:block;clear:both;content:'';} -#tab_links li{margin:0 2px;cursor:pointer;user-select:none;float:left;padding:5px 8px;list-style:none;line-height:20px;font-size:0.9em;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;} +#tab_links li{margin:0 2px;cursor:pointer;user-select:none;float:left;padding:5px 8px;list-style:none;line-height:20px;font-size:0.9em;background:#ddd;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;} +#tab_links li:hover{background:#fff;} +#tab_links li.working{background:#fff;} div.divider{width:100%;border-bottom:1px dotted #000;margin:15px 0;} div.user_dialogue input{width:98%;height:30px;font-size:1.25em;border:1px solid #888;padding:0 2px;text-align:center;} -label{color: #555; font-size:0.95em;line-height:30px;cursor:pointer;} +label{color:#555;font-size:0.95em;line-height:30px;cursor:pointer;} #usr_api_key strong{display:block;font-size:0.85em;line-height:3em;font-weight:normal;} #perms_view > ul{margin:0;padding:0;} @@ -358,7 +367,8 @@ label{color: #555; font-size:0.95em;line-height:30px;cursor:pointer;} #hintsbox{display:none;position:fixed;top:5%;left:2%;z-index:111;width:27%;height:auto;background:transparent;border-bottom:1px solid #ddd;} #hintsbox_logo{width:100%;height:175px;background:url(wm_logo_opt.png) center center no-repeat;background-size:32%;margin-bottom:10px;} -#hintsbox_msg{position:relative;width:92%;height:auto;padding:6% 4%;font-size:1.05em;line-height:1.8em;text-align:center;} +body.darkmode--activated #hintsbox_logo{filter:invert(100%);} +#hintsbox_msg{position:relative;width:92%;height:auto;background:#ffd;padding:6% 4%;font-size:1.05em;line-height:1.8em;text-align:center;} #hintsbox_msg a{text-decoration:none;color:#666;border-bottom:1px solid #666;} #hintsbox_msg:after{content:'';position:absolute;top:0;left:50%;width:0;height:0;border:22px solid transparent;border-bottom-color:#ffc;border-top:0;margin-left:-22px;margin-top:-22px;} #tagcloudbox{display:none;position:fixed;top:13vw;right:2%;z-index:110;width:30%;height:auto;background:transparent;text-align:center;} @@ -370,10 +380,12 @@ label{color: #555; font-size:0.95em;line-height:30px;cursor:pointer;} /* PROPS BOX */ -#hy_box{-webkit-backdrop-filter: blur(200px); display:none;z-index:104;position:absolute !important;top:5%;margin-left:-365px;width:680px;height:auto;padding:25px;margin-bottom:100px;} -#hy_options{margin:-55px 0 0 0;padding:0;} +#hy_box{display:none;z-index:104;position:absolute !important;top:5%;margin-left:-365px;width:680px;height:auto;padding:25px;background:#fff;margin-bottom:100px;} +#hy_options{color:#333;margin:-55px 0 0 0;padding:0;} #hy_options:after{display:block;clear:both;content:'';} -#hy_options li{color: #555; margin:0 2px;cursor:pointer;user-select:none;float:left;padding:5px 8px;list-style:none;line-height:20px;font-size:0.95em;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;} +#hy_options li{margin:0 2px;cursor:pointer;user-select:none;float:left;padding:5px 8px;list-style:none;line-height:20px;font-size:0.95em;background:#ddd;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;} +#hy_options li:hover{background:#fff;} +#hy_options li.working{background:#fff;} #hy_box > div > ul li{list-style:lower-greek inside;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:4.2vh;} #hy_box input{width:70%;margin-top:15px;font-size:0.95em;text-align:left;} #hy_box input::placeholder{color:#ccc;letter-spacing:1px;font-family:Exo2,Arial;} @@ -384,7 +396,7 @@ label{color: #555; font-size:0.95em;line-height:30px;cursor:pointer;} #hy_textual span{color:#555;border-bottom:1px dotted #555;} #hy_textual a{color:#333 !important;border-bottom:1px solid #333 !important;} #hy_box > div > ul > li > ul > li{padding-left:20px;font-size:0.9em;line-height:1.7em;margin-bottom:10px;} -#hy_box > div > ul > li{color: #555; padding-left:0;font-size:1.3em;line-height:4.2vh;} +#hy_box > div > ul > li{color:#555;padding-left:0;font-size:1.3em;line-height:4.2vh;} #hy_box > div > ul > li:last-child{margin-bottom:30px;} #hy_box strong.numeric{display:inline-block;float:right;font-size:0.85em;letter-spacing:0.5px;font-weight:normal;cursor:pointer;border-bottom:1px solid #fff;background:#ffd;} #hy_box strong.numeric:hover{border-bottom:1px solid #000;} @@ -392,16 +404,19 @@ label{color: #555; font-size:0.95em;line-height:30px;cursor:pointer;} /* NUMERIC AND OTHER BOXES */ -#discovery_custom_box{display:none;user-select:none;z-index:198;top:4%;margin-left:-275px;width:500px;height:auto;padding:25px;text-align:center;} +#discovery_custom_box{display:none;user-select:none;z-index:198;top:4%;margin-left:-275px;width:500px;height:auto;padding:25px;text-align:center;background:#fff;} #discovery_enabled, #discovery_disabled{text-align:left;width:90%;margin:0 auto;} #discovery_custom_box div.rearrange{user-select:none;display:inline-block;text-align:center;width:46%;color:#fff;background:#bfbfbf;line-height:28px;border:1px solid #bfbfbf;border-radius:4px;cursor:pointer;margin:4px;} #discovery_custom_box div.rearrange:hover{background:#FE9A2E;border-color:#FE9A2E;} #ml_data, #ab_data, #ab_promise, #pd3d_data{display:none;text-align:center;margin:0 0 15px 3px;color:#555;font-weight:normal;font-size:1.15em;line-height:2em;padding:6px 3px;} #ml_data span, #ab_data span, #ab_promise span, #pd3d_data span{display:block;font-size:0.8em;line-height:1.75em;margin-top:2em;} +#ml_data{background:#f8f7ff;} +#ab_data, #ab_promise{background:#f7fbff;} +#pd3d_data{background:#ffd;} #phases_ctx{user-select:none;} -#phases_ctx span{display:inline-block;text-align:center;color:#555;font-size:0.95em;line-height:2em;margin:1.5em 0 2em;padding:5px;} +#phases_ctx span{display:inline-block;background:#ffd;text-align:center;color:#555;font-size:0.95em;line-height:2em;margin:1.5em 0 2em;padding:5px;} -#ss_custom_box{display:none;z-index:198;top:4%;margin-left:-305px;width:560px;height:auto;padding:25px;text-align:center;overflow:visible;} +#ss_custom_box{display:none;z-index:198;top:4%;margin-left:-305px;width:560px;height:auto;padding:25px;text-align:center;background:#fff;overflow:visible;} div.ss_col, div.sops_col{float:left;} div.ss_col > ul, div.sops_col > ul{margin:0;padding:0;} div.ss_col > ul > li, div.sops_col > ul > li{display:block;list-style:none;user-select:none;text-align:center;color:#fff;background:#bfbfbf;line-height:27px;border-radius:4px;cursor:pointer;margin:8px 4px;} @@ -412,12 +427,12 @@ div.sops_col{letter-spacing:1px;} #all_polyhedra_box{display:none;position:absolute !important;z-index:103;top:4%;margin-left:-49%;margin-bottom:100px;width:98%;height:auto;background:#fff url(wm_logo_opt.png) 28% 3em no-repeat;background-size:3%;} #engines_box{display:none;z-index:198;top:30%;margin-left:-250px;width:450px;height:auto;padding:25px;text-align:center;background:#fff;padding-bottom:3em;} -#tooltip{display:none;position:fixed;z-index:202;width:200px;height:auto;text-align:center;padding:15px 10px;border-right:1px solid #ddd;border-bottom:1px solid #ddd;} +#tooltip{display:none;position:fixed;z-index:202;width:200px;height:auto;text-align:center;background:#ebffd6;padding:15px 10px;border-right:1px solid #ddd;border-bottom:1px solid #ddd;} #tooltip > div{position:relative;width:100%;height:100%;font-size:1em;line-height:2em;} #tooltip > div > span{cursor:pointer;color:#888;border-bottom:1px solid #888;} #tooltip > div:after{content:'';position:absolute;top:0;left:50%;width:0;height:0;border:36px solid transparent;border-bottom-color:#ebffd6;border-top:0;margin-left:-36px;margin-top:-36px;} -#numericbox{display:none;position:fixed;z-index:215;;height:auto;bottom:1%;left:50%;margin-left:-490px;width:950px;padding:0 15px 15px;border:1px solid #666;border-radius:4px;box-shadow:10px 10px 4px -3px rgba(0,0,0,0.4);} +#numericbox{display:none;position:fixed;z-index:215;background:#fff;height:auto;bottom:1%;left:50%;margin-left:-490px;width:950px;padding:0 15px 15px;border:1px solid #666;border-radius:4px;box-shadow:10px 10px 4px -3px rgba(0,0,0,0.4);} #numericbox > ul > li{display:block;list-style:none;clear:both;width:100%;height:60px;margin-bottom:10px;border:1px solid #fff;border-radius:4px;} #numericbox > ul > li:hover{border:1px solid #ddd;} #numericbox > ul > li > div.slider_title{width:35%;float:left;padding-top:22px;letter-spacing:0.5px;line-height:1;text-align:center;} @@ -427,16 +442,16 @@ div.sops_col{letter-spacing:1px;} /* PERIODIC TABLE */ -#ptable_holder{display:none;position:absolute;z-index:1;width:1050px;height:auto;top:280px;left:50%;margin-left:-525px;user-select:none;} +#ptable_holder{display:none;position:absolute;z-index:1;width:1050px;height:auto;top:280px;left:50%;margin-left:-525px;background:#fff;user-select:none;} #ptable_holder.resulted{top:80px;} #ptable_results{width:99%;margin:0 auto;} -#ptable_previews{color: #555; float:left;width:50%;text-align:left;padding-top:20px;} +#ptable_previews{float:left;width:50%;text-align:left;padding-top:20px;background:#fff;} #ptable_previews > p{text-align:center;letter-spacing:0.5px;line-height:60px;} #ptable_previews > div.subphases_trigger{width:50%;margin:30px auto;font-size:0.95em;} #ptable_previews > div.subphases_trigger > span{font-size:26px;} #ptable_previews.ptable_dtype_2 > div.gallery_item:hover, div.gallery_item.active, #ptable_previews.ptable_dtype_3 > div.gallery_item:hover, div.gallery_item.active{background:#cf9;} -#ptable_vis{float:right;width:50%;text-align:right;padding-top:20px;} +#ptable_vis{float:right;width:50%;text-align:right;padding-top:20px;background:#fff;} #ptable_vis.fixed{position:fixed;width:525px;top:30px;left:50%;} #ptable_vis > iframe{border:1px solid #bbb;margin-top:16px;} @@ -498,7 +513,7 @@ div.sops_col{letter-spacing:1px;} #ptable_area > ul li.type_2{background:#a8bffa;} #ptable_area > ul li.type_3{background:#F8B707;} #ptable_area > ul li.type_4{background:#f3f300;} -#ptable_area > ul li.type_5{background:#3bd93b;} +#ptable_area > ul li.type_5{background:#acc2b3;} #ptable_area > ul li.type_6{background:#dd9999;} #ptable_area > ul li.type_7{background:#fcc;} #ptable_area > ul li.cat_0{color:#222;} @@ -508,22 +523,23 @@ div.sops_col{letter-spacing:1px;} #ptable_area > ul li.cat_1:before, #ptable_area > ul li.cat_2:before{content:attr(data-pos);} -#ptable_dtypes_box{-webkit-backdrop-filter: blur(200px); display:none;position:fixed;z-index:2;width:460px;height:auto;top:294px;left:50%;margin-left:-297px;color:#5c5c5c;letter-spacing:0.3px;user-select:none;} +#ptable_dtypes_box{display:none;position:fixed;z-index:2;width:460px;height:auto;top:294px;left:50%;margin-left:-297px;color:#333;letter-spacing:0.3px;user-select:none;} #ptable_dtypes_box.resulted{display:block;top:94px;} -#ptable_dtypes_box > span{display:inline-block;font-size:0.9em;vertical-align:top;line-height:32px;} +#ptable_dtypes_box > span{display:inline-block;font-size:0.9em;background:#fbfbfb;vertical-align:top;line-height:32px;} #ptable_dtypes_box > span > span{font-size:26px;color:#ccc;} #ptable_dtypes_box > div{display:inline-block;padding-top:3px;line-height:32px;} -#ptable_dtypes_box > div > label{font-size:0.9em;} +#ptable_dtypes_box > div > label{font-size:0.9em;background:#fbfbfb;} /* AUTOCOMPLETE */ div.autocomplete-suggestions{ - text-align: left; cursor: default; border: 1px solid #ccc; border-top: 0; box-shadow: -1px 1px 3px rgba(0,0,0,0.1); + text-align: left; cursor: default; border: 1px solid #ccc; border-top: 0; background: #fff; box-shadow: -1px 1px 3px rgba(0,0,0,0.1); /* core styles should not be changed */ position: absolute; display: none; z-index: 250; min-height: 23px; height:auto !important; height:23px; overflow: visible; overflow-y: auto; box-sizing: border-box; } -div.autocomplete-suggestion{ position: relative; padding: 0 .6em; line-height: 23px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 1.02em; color: #5c5c5c; } +div.autocomplete-suggestion{ position: relative; padding: 0 .6em; line-height: 23px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 1.02em; color: #333; } div.autocomplete-suggestion b{ font-weight: normal; color: #ccc; } +div.autocomplete-suggestion.selected{ background: #f0f0f0; } div.facet_switch{width:300px;margin:3px auto;height:20px;text-align:center;color:#555;} div.facet_switch span{margin-right:5px;} div.facet_switch label{display:inline-block;margin:0 3px;cursor:pointer;} @@ -536,6 +552,7 @@ div.primary_term label, div.primary_term input{cursor:pointer;} position: relative; padding: 5px 8px; border-bottom: 1px solid #d0d0d0; + background: #f8f8f8; } .selectize-dropdown-header-close { position: absolute; @@ -592,6 +609,7 @@ div.primary_term label, div.primary_term input{cursor:pointer;} } .selectize-input, .selectize-control.single .selectize-input.input-active { + background: #fff; cursor: text; } .selectize-input { @@ -607,7 +625,9 @@ div.primary_term label, div.primary_term input{cursor:pointer;} .selectize-control.multi .selectize-input.has-items { padding: 5px 8px 2px; } - +.selectize-input.full { + background-color: #fff; +} .selectize-input.focus { box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15); } @@ -648,6 +668,7 @@ div.primary_term label, div.primary_term input{cursor:pointer;} content: ' '; display: block; position: absolute; + background: #f0f0f0; height: 1px; bottom: 0; left: 0; @@ -657,6 +678,7 @@ div.primary_term label, div.primary_term input{cursor:pointer;} position: absolute; z-index: 200; text-align:center; + background: #fff; } div.prolonged .selectize-dropdown { border: 1px solid #ccc; border-top: 0; box-shadow: -1px 1px 3px rgba(0,0,0,0.1); @@ -724,6 +746,7 @@ div.prolonged .selectize-dropdown { } .selectize-control.single .selectize-input { box-shadow: 0 1px 0 rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,0.8); + background-color: #f9f9f9; background-repeat: repeat-x; } .selectize-control.single .selectize-input, @@ -743,19 +766,24 @@ div.advs.advs_aetypes div.selectize-input{border:1px solid #3e3f95;} #preloader{z-index:201;position:fixed;left:0;top:0;width:100%;height:100%;text-align:center;overflow:hidden;background-color:rgba(255,255,255,0.4);} #preloader > div{position:absolute;top:50%;left:50%;width:80px;height:80px;margin:-40px 0 0 -40px;background:url(wm_logo_opt.png) center center no-repeat;background-size:85%;animation:spin 2s ease infinite;} -@keyframes spin { 100% { transform:rotate(360deg); } } +body.darkmode--activated #preloader > div{filter:invert(100%);} +@keyframes spin { + 100% {transform:rotate(360deg);} +} #rfn_preloader, #sim_preloader{display:none;margin:100px auto;width:125px;height:60px;font-size:10px;} -#rfn_preloader > div, #sim_preloader > div{height:100%;width:15px;display:inline-block;margin:0 5px;animation:stretchdelay 1.2s infinite ease-in-out;} +#rfn_preloader > div, #sim_preloader > div{height:100%;width:15px;background:#eee;display:inline-block;margin:0 5px;animation:stretchdelay 1.2s infinite ease-in-out;} #rfn_preloader > div.rect2, #sim_preloader > div.rect2{animation-delay:-1.1s;} #rfn_preloader > div.rect3, #sim_preloader > div.rect3{animation-delay:-1.0s;} #rfn_preloader > div.rect4, #sim_preloader > div.rect4{animation-delay:-0.9s;} #rfn_preloader > div.rect5, #sim_preloader > div.rect5{animation-delay:-0.8s;} @keyframes stretchdelay { -0%, 40%, 100% {transform:scaleY(0.4);} -20% {transform:scaleY(1.0);} + 0%, 40%, 100% {transform:scaleY(0.4);} + 20% {transform:scaleY(1.0);} } +div.darkmode-layer{z-index:9999;} + /*! nouislider - 14.0.3 - 10/10/2019 */ .noUi-target,.noUi-target *{touch-action:none;-ms-user-select:none;user-select:none;box-sizing:border-box}.noUi-target{position:relative;direction:ltr}.noUi-base,.noUi-connects{width:100%;height:100%;position:relative;z-index:1}.noUi-connects{overflow:hidden;z-index:0}.noUi-connect,.noUi-origin{will-change:transform;position:absolute;z-index:1;top:0;left:0;-ms-transform-origin:0 0;transform-origin:0 0;transform-style:flat}.noUi-connect{height:100%;width:100%}.noUi-origin{height:10%;width:10%}html:not([dir=rtl]) .noUi-horizontal .noUi-origin{left:auto;right:0}.noUi-vertical .noUi-origin{width:0}.noUi-horizontal .noUi-origin{height:0}.noUi-handle{backface-visibility:hidden;position:absolute}.noUi-touch-area{height:100%;width:100%}.noUi-state-tap .noUi-connect,.noUi-state-tap .noUi-origin{transition:transform .3s}.noUi-state-drag *{cursor:inherit!important}.noUi-horizontal{height:18px}.noUi-horizontal .noUi-handle{width:34px;height:28px;left:-17px;top:-6px}.noUi-vertical{width:18px}.noUi-vertical .noUi-handle{width:28px;height:34px;left:-6px;top:-17px}html:not([dir=rtl]) .noUi-horizontal .noUi-handle{right:-17px;left:auto}.noUi-target{background:#FAFAFA;border-radius:4px;border:1px solid #D3D3D3;box-shadow:inset 0 1px 1px #F0F0F0,0 3px 6px -5px #BBB}.noUi-connects{border-radius:3px}.noUi-connect{background:#FE9A2E}.noUi-draggable{cursor:ew-resize}.noUi-vertical .noUi-draggable{cursor:ns-resize}.noUi-handle{border:1px solid #D9D9D9;border-radius:3px;background:#FFF;cursor:default;box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #EBEBEB,0 3px 6px -3px #BBB}.noUi-active{box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #DDD,0 3px 6px -3px #BBB}.noUi-handle:after,.noUi-handle:before{content:"";display:block;position:absolute;height:14px;width:1px;background:#E8E7E6;left:14px;top:6px}.noUi-handle:after{left:17px}.noUi-vertical .noUi-handle:after,.noUi-vertical .noUi-handle:before{width:14px;height:1px;left:6px;top:14px}.noUi-vertical .noUi-handle:after{top:17px}[disabled] .noUi-connect{background:#B8B8B8}[disabled] .noUi-handle,[disabled].noUi-handle,[disabled].noUi-target{cursor:not-allowed}.noUi-pips,.noUi-pips *{box-sizing:border-box}.noUi-pips{position:absolute;color:#999}.noUi-value{position:absolute;white-space:nowrap;text-align:center}.noUi-value-sub{color:#ccc;font-size:10px}.noUi-marker{position:absolute;background:#CCC}.noUi-marker-sub{background:#AAA}.noUi-marker-large{background:#AAA}.noUi-pips-horizontal{padding:10px 0;height:80px;top:100%;left:0;width:100%}.noUi-value-horizontal{transform:translate(-50%,50%)}.noUi-rtl .noUi-value-horizontal{transform:translate(50%,50%)}.noUi-marker-horizontal.noUi-marker{margin-left:-1px;width:2px;height:5px}.noUi-marker-horizontal.noUi-marker-sub{height:10px}.noUi-marker-horizontal.noUi-marker-large{height:15px}.noUi-pips-vertical{padding:0 10px;height:100%;top:0;left:100%}.noUi-value-vertical{transform:translate(0,-50%);padding-left:25px}.noUi-rtl .noUi-value-vertical{transform:translate(0,50%)}.noUi-marker-vertical.noUi-marker{width:5px;height:2px;margin-top:-1px}.noUi-marker-vertical.noUi-marker-sub{width:10px}.noUi-marker-vertical.noUi-marker-large{width:15px}.noUi-tooltip{display:block;position:absolute;padding:1px;text-align:center;white-space:nowrap;font-size:0.85em;color:#c00;}.noUi-horizontal .noUi-tooltip{transform:translate(-50%,0);left:50%;bottom:95%}.noUi-vertical .noUi-tooltip{transform:translate(0,-50%);top:50%;right:120%}