@gdquest/gd-exercise-react/dist/assets/GdExercise-6ef49038.css

React project for GDExercise.

@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200";.container{overflow:hidden;box-sizing:border-box;margin:var(--gd-exercise-container-margin);padding:var(--gd-exercise-container-padding)}.cm-editor{width:100%;height:100%;outline:none!important}.gd-main{width:100%;height:100%;position:relative;overflow:hidden;background-color:var(--gd-exercise-bg-color)}.gd-splash{width:100vw;height:100vh;background-color:var(--gd-exercise-bg-color)}.gd-layout,.gd-layout--with-code-and-player,.gd-layout--with-player-only,.gd-layout--with-code-only{width:100%;height:100%;overflow:hidden;display:grid;grid-template-areas:"footer footer";grid-template-columns:1fr 1fr;grid-template-rows:1fr}.gd-layout--with-code-and-player,.gd-layout--with-player-only,.gd-layout--with-code-only{grid-template-areas:"code player" "footer footer";grid-template-columns:1fr 1fr;grid-template-rows:3fr minmax(200px,1fr)}@media (max-width: 991.98px){.gd-layout--with-code-and-player,.gd-layout--with-player-only,.gd-layout--with-code-only{grid-template-areas:"collapsed-menu" "active" "footer";grid-template-columns:auto;grid-template-rows:min-content 3fr minmax(200px,1fr)}}.gd-layout--with-code-only{grid-template-areas:"code code" "footer footer"}@media (max-width: 991.98px){.gd-layout--with-code-only{grid-template-areas:"collapsed-menu" "active" "footer";grid-template-columns:auto;grid-template-rows:min-content 3fr minmax(200px,1fr)}}.gd-layout--with-player-only{grid-template-areas:"player player" "footer footer"}@media (max-width: 991.98px){.gd-layout--with-player-only{grid-template-areas:"collapsed-menu" "active" "footer";grid-template-columns:auto;grid-template-rows:min-content 3fr minmax(200px,1fr)}}.gd-collapsed-menu{grid-area:collapsed-menu;padding-bottom:0}@media (min-width: 992px){.gd-collapsed-menu .gd-menu{display:none}}.gd-collapsed-menu .layout-tabs{width:100%;height:100%;overflow-x:auto;overflow-y:hidden;display:none}@media (max-width: 991.98px){.gd-collapsed-menu .layout-tabs{display:block}.gd-collapsed-menu .layout-tabs.container{padding-bottom:0;margin-bottom:0}}@media (min-width: 992px){.gd-collapsed-menu{display:none}}.gd-player{grid-area:player;display:grid;grid-template-areas:"menu" "player-container";grid-template-columns:auto;grid-template-rows:auto 1fr}@media (max-width: 991.98px){.gd-player{padding-top:0}.gd-player.active{grid-area:active}.gd-player:not(.active){position:absolute;left:-99999px}}.gd-player-container{grid-area:player-container;position:relative}.gd-player-loading{position:absolute;width:100%;height:100%;background-color:var(--gd-exercise-bg-color-inactive);z-index:1;display:flex;justify-content:center;align-items:center}.gd-player-loading-progress{width:80%;height:2em;padding:.25em;background-color:var(--gd-exercise-bg-color)}.gd-player-loading-progress-bar{width:100%;height:100%;background-color:var(--gd-exercise-bg-color-inactive);transform-origin:0 50%;transform:scaleX(calc(var(--download-current) / var(--download-total)))}.gd-player-menu{grid-area:menu}.gd-player-player{position:absolute;width:100%;height:100%;overflow:hidden}.gd-player-player .canvas{width:100%;height:100%;border-radius:var(--gd-exercise-app-border-radius)}.gd-code{grid-area:code;overflow:hidden;display:grid;grid-template-areas:"files" "code" "menu";grid-template-columns:auto;grid-template-rows:auto 1fr auto;width:100%;height:100%}@media (max-width: 991.98px){.gd-code{padding-top:0;grid-template-areas:"code" "menu";grid-template-rows:1fr auto}.gd-code.active{grid-area:active}.gd-code:not(.active){position:absolute;visibility:hidden}.gd-code.container{padding-top:0;margin-top:0}}.gd-code-files{grid-area:files;overflow-y:auto}.gd-code-code{grid-area:code;display:flex;overflow:auto}.gd-code-menu{grid-area:menu;padding-top:var(--gd-exercise-app-padding-dimensions);display:grid;grid-template-areas:"revert . save";grid-template-columns:auto 1fr auto}.gd-code-menu-button{display:flex;position:relative;align-items:center;justify-content:center;gap:var(--gd-exercise-app-padding-dimensions);font-family:var(--gd-exercise-font-family);font-size:var(--gd-exercise-app-button-font-size);border-radius:var(--gd-exercise-app-border-radius);border:none;padding:var(--gd-exercise-app-padding-dimensions);color:var(--gd-exercise-text-color);background-color:transparent;cursor:pointer}.gd-code-menu-button .material-symbols-outlined{position:relative;margin-top:-2em;top:1em}.gd-code-menu-button :disabled{cursor:normal}.gd-code-menu-button--save{grid-area:save}.gd-code-menu-button--revert{grid-area:revert}.gd-code-menu-button--cta{color:var(--gd-exercise-button-cta-text-color);font-weight:var(--gd-exercise-button-cta-font-weight);background-color:var(--gd-exercise-button-cta-bg-color);box-shadow:var(--gd-exercise-button-cta-box-shadow);text-transform:var(--gd-exercise-button-cta-text-transform)}.gd-code-menu-button--cta:disabled{background-color:var(--gd-exercise-button-cta-bg-color-disabled);box-shadow:var(--gd-exercise-button-cta-box-shadow-disabled);cursor:default}.gd-code-menu-button--cta:enabled:active{top:var(--gd-exercise-button-cta-pseudo-height);box-shadow:none}.gd-layout-footer,.gd-layout-footer--has-test{grid-area:footer;width:100%;height:100%;overflow:hidden;display:grid;grid-template-areas:"console";grid-template-columns:auto;grid-template-areas:auto}.gd-layout-footer--has-test{display:grid;grid-template-areas:"test console";grid-template-columns:1fr 1fr;grid-template-areas:auto}.gd-layout-footer--has-test .gd-test{display:block}.gd-console{grid-area:console;overflow:hidden;display:grid;grid-template-areas:"console-tab" "console";grid-template-columns:auto;grid-template-rows:min-content auto}.gd-console-tab{grid-area:console-tab}.gd-console-console{grid-area:console;overflow:hidden}.gd-test{display:none;grid-area:test;overflow:hidden;grid-template-areas:"test-tab" "test"}.gd-test-tab{grid-area:test-tab}.gd-test-test{grid-area:test}.gd-menu{display:grid;height:var(--gd-exercise-menu-height);grid-template-areas:"fscreen cscheme . play";padding-bottom:var(--gd-exercise-container-padding);gap:var(--gd-exercise-menu-gap)}.gd-menu .gd-menu-button{position:relative;display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:var(--gd-exercise-menu-font-size);border:0;background-color:transparent;border-radius:var(--gd-exercise-app-border-radius);padding:var(--gd-exercise-container-padding);font-family:var(--gd-exercise-font-family);font-weight:var(--gd-exercise-menu-font-weight);gap:var(--gd-exercise-menu-button-gap);-webkit-user-select:none;user-select:none;cursor:pointer;color:var(--gd-exercise-text-color)}.gd-menu .gd-menu-button .material-symbols-outlined{position:relative;margin-top:-2em;top:1em}.gd-menu .gd-menu-button--cta{color:var(--gd-exercise-button-cta-text-color);font-weight:var(--gd-exercise-button-cta-font-weight);background-color:var(--gd-exercise-button-cta-bg-color);box-shadow:var(--gd-exercise-button-cta-box-shadow);text-transform:var(--gd-exercise-button-cta-text-transform)}.gd-menu .gd-menu-button--cta:disabled{background-color:var(--gd-exercise-button-cta-bg-color-disabled);box-shadow:var(--gd-exercise-button-cta-box-shadow-disabled);cursor:default}.gd-menu .gd-menu-button--cta:enabled:active{top:var(--gd-exercise-button-cta-pseudo-height);box-shadow:none}.gd-menu .gd-menu-button--fullscreen{grid-area:fscreen}.gd-menu .gd-menu-button--colorschemeswitch{grid-area:cscheme}.gd-menu .gd-menu-button--play{grid-area:play}:root,body,.gd-app{width:100%;height:100%;overflow:hidden;font-family:var(--gd-exercise-font-family);margin:0;padding:0;background-color:transparent;border-radius:var(--gd-exercise-app-border-radius)}.gd-app{background-color:var(--gd-exercise-bg-color)}.gd-tabs{display:flex;flex-direction:row;height:var(--gd-exercise-tabs-height);width:min-content;background-color:var(--gd-exercise-bg-color);padding:0;margin:0;gap:var(--gd-exercise-tab-gap);background-color:var(--gd-exercise-tabs-bg-color);border-top-left-radius:var(--gd-exercise-app-border-radius);border-top-right-radius:var(--gd-exercise-app-border-radius)}.gd-tabs .gd-tab,.gd-tabs .gd-tab--active{display:flex;justify-content:center;align-items:center;width:min-content;margin:var(--gd-exercise-tab-margin);padding:var(--gd-exercise-tab-padding);background-color:var(--gd-exercise-bg-color-inactive);color:var(--gd-exercise-tab-color-inactive);border-radius:var(--gd-exercise-tab-border-radius);font-weight:var(--gd-exercise-tab-font-weight);text-transform:var(--gd-exercise-tab-text-transform);position:relative;cursor:pointer}.gd-tabs .gd-tab:first-child,.gd-tabs .gd-tab--active:first-child{border-top-left-radius:var(--gd-exercise-app-border-radius)}.gd-tabs .gd-tab:last-child,.gd-tabs .gd-tab--active:last-child{border-top-right-radius:var(--gd-exercise-app-border-radius)}.gd-tabs .gd-tab--active{background-color:var(--gd-exercise-bg-color-active);color:var(--gd-exercise-tab-color-active)}.gd-tabs .gd-tab--disabled{cursor:default}.gd-tabs .gd-tab:last-child .gd-label,.gd-tabs .gd-tab--active:last-child .gd-label{text-shadow:var(--gd-exercise-tab-text-shadow)}:root.test{--gd-exercise-bg-color: #c6e188;--gd-exercise-bg-color-inactive: #8fa346;--gd-exercise-bg-color-active: #547833}:root.test.dark{--gd-exercise-bg-color: #391e77;--gd-exercise-bg-color-inactive: #705cb9;--gd-exercise-bg-color-active: #ab87cc}:root{--gd-exercise-font-family: Montserrat, sans-serif;--gd-exercise-font-size: 1rem;--gd-exercise-app-border-radius: 8px;--gd-exercise-app-padding-dimensions: 8px;--gd-exercise-app-button-font-size: 12px;--gd-exercise-scrollbar-dimension: 8px;--gd-exercise-scrollbar-thumb-border-radius: 16px;--gd-exercise-container-margin: 0;--gd-exercise-container-padding: 8px;--gd-exercise-tabs-height: 33px;--gd-exercise-tab-margin: 0;--gd-exercise-tab-padding: 8px 12px;--gd-exercise-tab-font-style: normal;--gd-exercise-tab-font-weight: bold;--gd-exercise-tab-text-transform: uppercase;--gd-exercise-tab-border-radius: 0 0 0 0;--gd-exercise-tab-gap: 1px;--gd-exercise-button-font-size: 12px;--gd-exercise-button-cta-box-shadow-dimensions: 0px 2px 0px 0px;--gd-exercise-button-cta-pseudo-height: 2px;--gd-exercise-button-cta-font-weight: 800;--gd-exercise-button-cta-text-transform: uppercase;--gd-exercise-menu-font-size: 12px;--gd-exercise-menu-font-weight: normal;--gd-exercise-menu-height: 33px;--gd-exercise-menu-gap: 12px;--gd-exercise-menu-button-gap: 12px;--gd-exercise-text-color: black;--gd-exercise-scrollbar-thumb-bg-color: #8b8ba8;--gd-exercise-scrollbar-track-bg-color: #e3e5eb;--gd-exercise-bg-color: #b5b5cf;--gd-exercise-bg-color-inactive: #cfcfea;--gd-exercise-bg-color-active: #ced3df;--gd-exercise-tabs-bg-color: white;--gd-exercise-tab-color-active: black;--gd-exercise-tab-color-inactive: #404065;--gd-exercise-tab-text-shadow: 0px 2px 0px rgba(255, 255, 255, .25);--gd-exercise-tab-accent-color: #b5b5cf;--gd-exercise-button-cta-bg-color: #ffd500;--gd-exercise-button-cta-text-color: #403500;--gd-exercise-button-cta-box-shadow-color: #806b00;--gd-exercise-button-cta-box-shadow: 0px 2px 0px 0px #806b00;--gd-exercise-button-cta-bg-color-disabled: #ccbb66;--gd-exercise-button-cta-box-shadow-color-disabled: #86772d;--gd-exercise-button-cta-box-shadow-disabled: 0px 2px 0px 0px #86772d}:root.dark{--gd-exercise-text-color: #ffffff;--gd-exercise-scrollbar-thumb-bg-color: #575774;--gd-exercise-scrollbar-track-bg-color: #14161c;--gd-exercise-bg-color: #30304a;--gd-exercise-bg-color-inactive: #151530;--gd-exercise-bg-color-active: #202531;--gd-exercise-tabs-bg-color: #000000;--gd-exercise-tab-color-active: #ffffff;--gd-exercise-tab-color-inactive: #9a9abf;--gd-exercise-tab-text-shadow: 0px 2px 0px rgba(0, 0, 0, .25);--gd-exercise-tab-accent-color: #30304a;--gd-exercise-button-cta-bg-color: #ffd500;--gd-exercise-button-cta-text-color: #403500;--gd-exercise-button-cta-box-shadow-color: #806b00;--gd-exercise-button-cta-box-shadow: 0px 2px 0px 0px #806b00;--gd-exercise-button-cta-bg-color-disabled: #ccbb66;--gd-exercise-button-cta-box-shadow-color-disabled: #86772d;--gd-exercise-button-cta-box-shadow-disabled: 0px 2px 0px 0px #86772d}.material-symbols-outlined{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24}