<commit_before>/*
Application Settings Go Here
------------------------------------
This file acts as a bundler for all variables/mixins/themes, so they
can easily be swapped out without `core.scss` ever having to know.

For example:

@import './variables/colors';
@import './variables/components';
@import './themes/default';
*/

h1 {
  margin: 0;
}

.page-container, .view-container, #inferno-flex {
  height: 100%;
}

#header {
  background-color: red;
}

#main {
  background-color: green;
  display: -webkit-flex;
  display:         flex;
  -webkit-flex-flow: row;
          flex-flow: row;
  height: 100%;
}

#info {
  background-color: green;
  overflow-y: scroll;
  -webkit-flex: 1 1 30%;
          flex: 1 1 30%;

}

#main-column {
  -webkit-flex: 1 1 70%;
          flex: 1 1 70%;
  -webkit-order: 2;
          order: 2;
  height: 100%;
  display: -webkit-flex;
  display:         flex;
  -webkit-flex-flow: column;
          flex-flow: column;
  background-color: gray;
}

#elevation {
  background-color: yellow;
  -webkit-flex: 1 1 30%;
          flex: 1 1 30%;
}

#map {
  background-color: blue;
  -webkit-flex: 1 1 70%;
          flex: 1 1 70%
}

@media all and (max-width: 640px) {
  #main, #main-column, #info, #elevation, #map {
    display: block;
  }

  #main-column {
    height: auto;
  }
}
<commit_msg>Change style when vertical<commit_after>/*
Application Settings Go Here
------------------------------------
This file acts as a bundler for all variables/mixins/themes, so they
can easily be swapped out without `core.scss` ever having to know.

For example:

@import './variables/colors';
@import './variables/components';
@import './themes/default';
*/

h1 {
  margin: 0;
}

.page-container, .view-container, #inferno-flex {
  height: 100%;
}

#header {
  background-color: red;
}

#main {
  background-color: green;
  display: -webkit-flex;
  display:         flex;
  -webkit-flex-flow: row;
          flex-flow: row;
  height: 100%;
}

#info {
  background-color: green;
  overflow-y: scroll;
  -webkit-flex: 1 1 30%;
          flex: 1 1 30%;

}

#main-column {
  -webkit-flex: 1 1 70%;
          flex: 1 1 70%;
  -webkit-order: 2;
          order: 2;
  height: 100%;
  display: -webkit-flex;
  display:         flex;
  -webkit-flex-flow: column;
          flex-flow: column;
  background-color: gray;
}

#elevation {
  background-color: yellow;
  -webkit-flex: 1 1 30%;
          flex: 1 1 30%;
}

#map {
  background-color: blue;
  -webkit-flex: 1 1 70%;
          flex: 1 1 70%
}

@media all and (max-width: 640px) {
  #main, #main-column, #info, #elevation, #map {
    display: block;
  }

  #elevation {
    height: 300px;
  }

  #map {
    height: 500px;
  }

  #main-column {
    height: auto;
  }
}

{'fraction_non_alphanumeric': 0.16952868103763244, 'fraction_numerical': 0.037267080745341616, 'mean_word_length': 2.244075829383886, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2720161', 'n_tokens_mistral': 1094, 'n_tokens_neox': 960, 'n_words': 277}