Language changes background color of editor Fix #46

This commit is contained in:
Ruben van de Ven 2019-05-10 13:27:32 +02:00
parent 7f93efc6fd
commit 0b6963359d
3 changed files with 28 additions and 9 deletions

View file

@ -124,7 +124,13 @@ img.icon {
#story {
position: relative;
width: calc(100% - 430px); }
width: calc(100% - 380px); }
#story.en-GB {
background: #02547e; }
#story.fr-FR {
background: #5a434d; }
#story.de-DE {
background: slategray; }
#story #controls {
position: absolute;
top: 5px;
@ -260,12 +266,12 @@ img.icon {
background-repeat: no-repeat;
position: relative;
display: inline-block;
width: 1.33333em;
line-height: 1em; }
width: 2.66667em;
line-height: 2em; }
.flag-icon:before {
content: '\00a0'; }
.flag-icon.flag-icon-squared {
width: 1em; }
width: 2em; }
.flag-icon.en-GB {
background-image: url("/images/gb.svg"); }
.flag-icon.de-DE {

View file

@ -1700,6 +1700,9 @@ class Graph {
document.getElementById('current_lang').appendChild(crel('span', {
'class': 'flag-icon ' + this.language_code
}));
let storyEl = document.getElementById('story');
storyEl.classList.remove(... panopticon.languages.map((l) => l['code']))
storyEl.classList.add(this.language_code);
if(typeof skipDistances == 'undefined' || !skipDistances) {
this.distances = this.calculateDistancesFromStart();

View file

@ -1,4 +1,4 @@
$status_width: 430px;
$status_width: 380px;
$status_width_open: 860px;
body{
@ -78,7 +78,7 @@ img.icon{
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: 380px;
width: $status_width;
height: 100%;
overflow-y: scroll;
@ -203,6 +203,16 @@ img.icon{
position: relative;
width: calc(100% - #{$status_width});
&.en-GB{
background:#02547e;
}
&.fr-FR{
background:#5a434d;
}
&.de-DE{
background:slategray;
}
#controls{
position:absolute;
top: 5px;
@ -422,13 +432,13 @@ img.icon{
background-repeat: no-repeat;
position: relative;
display: inline-block;
width: (4 / 3) * 1em;
line-height: 1em;
width: (4 / 3) * 2em;
line-height: 2em;
&:before {
content: '\00a0';
}
&.flag-icon-squared {
width: 1em;
width: 2em;
}
&.en-GB {