<commit_before>@charset "UTF-8";

/* ============================= Global styles ============================= */

body, div, a, header, input, label, li, nav, p, section, span, ul, figure, figcaption, img {
    box-sizing: border-box;
    font-size: 100%;
    font-weight: inherit;
    text-size-adjust: 100%;
    vertical-align: baseline;
    -webkit-touch-callout: none;
    margin: 0;
    padding: 0;
    border: 0;
}

li { list-style: none }
a  { text-decoration: none; background: transparent }
:focus, a:active, a:hover { outline: none }
button, input { font-family: inherit; font-size: 100%; margin: none; line-height: normal; border: none }
button, input, select, textarea { font-family: inherit; font-size: 100%; margin: 0 }
button, input { line-height: normal }

::-moz-focus-inner { border: none; padding: none; outline: none }
::-moz-focus-outer { border: none }

::-webkit-scrollbar, ::-webkit-scrollbar-track { background: transparent }
::-webkit-scrollbar-thumb      { background: #888 }
::-webkit-scrollbar:horizontal { height: 4px }
::-webkit-scrollbar:vertical   { width:  4px }

::selection      { background: #16b; color: #fff }
::-moz-selection { background: #16b; color: #fff }

input::-moz-placeholder          { color: #999; opacity: 1 }
input:-ms-input-placeholder      { color: #999 }
input::-webkit-input-placeholder { color: #999 }

/* =============================== Animations ============================== */

@keyframes nodeInserted {
    50% { opacity: 0.99 }
}
@keyframes jump {
   0%,100% { transform: translateY(-3px) }
   50%     { transform: translateY(3px)  }
}
@keyframes shake {
   0%,50%,100% { transform: translateX(-5px) }
   25%, 75%    { transform: translateX(5px)  }
}
@keyframes spin {
   from { transform: rotate(0deg)   }
   to   { transform: rotate(359deg) }
}
@keyframes zoom {
   0%,100%  { transform: scale(1.3) }
   50%      { transform: scale(0.9) }
}

/* ============================ Main Page Layout =========================== */

#flex-container {
    position: absolute;
    left: 0; right: 0; top: 0; bottom: 0;
    display: flex;
    flex-direction: column;
}

#navigation {
    background: #181818;
    text-align: center;
    order: 1;
    flex: 0 0 1.5rem;
    z-index: 2;
    transition: transform .3s ease;
    transform: translateY(-100%);
    display: flex;
    white-space: nowrap;
    user-select: none;
}
#navigation.in { transform: none; visibility: visible !important }
@media (min-width: 1024px) { #navigation { font-size: 1.1em } }

/* ============================= Header Buttons ============================ */

.button {
    color: #888;
    line-height: 1.5rem;
    cursor: pointer;
    flex: 1;
}
.button:not(.disabled):hover { color: #fff }

@media (min-width: 1024px) { .button { font-size: .7em } }
@media (max-width: 1023px) { .button { font-size: .7em } }
@media (max-width:  750px) { .button span { display: none } }

.button svg {
    fill: #888;
    height: .8rem;
    width: .8rem;
    margin-right: .2rem;
    position: relative;
    top: .15rem;
}
@media (max-width:  750px) { .button svg { margin-right: 0 } }

#upload-file-button:hover   { background: rgba(102, 166, 255, .15) }
#upload-folder-button:hover { background: rgba(255, 102, 252, .15) }
#create-file-button:hover   { background: rgba(102, 255, 235, .15) }
#create-folder-button:hover { background: rgba(102, 255, 125, .15) }
#about-button:hover         { background: rgba(148, 102, 255, .15) }
#prefs-button:hover         { background: rgba(255, 212, 102, .15) }
#logout-button:hover        { background: rgba(255, 102, 102, .15) }
#split-button:hover         { background: rgba(255,  82, 255, .15) }

#upload-file-button:hover svg        { fill: rgba(102, 166, 255, 1) }
#upload-folder-button:hover svg      { fill: rgba(255, 102, 252, 1) }
#create-file-button:hover svg        { fill: rgba(102, 255, 235, 1) }
#create-folder-button:hover svg      { fill: rgba(102, 255, 125, 1) }
#about-button:hover svg              { fill: rgba(148, 102, 255, 1) }
#prefs-button:hover svg              { fill: rgba(255, 212, 102, 1) }
#logout-button:hover svg             { fill: rgba(255,  82,  82, 1) }
#split-button:hover svg.split .left  { fill: rgba(255,  82,  82, 1) }
#split-button:hover svg.split .right { fill: rgba(102, 166, 255, 1) }

.button.disabled       { color: #444 !important; cursor: not-allowed !important }
.button.disabled:hover { color: #444 !important; background: transparent !important;  }
.button.disabled svg   { fill:  #444 !important }

#view-container {
    flex: 1 1;
    order: 2;
    overflow-y: auto;
}

/* ================================== View ================================= */
.view {
    position: absolute;
    bottom: 0; left:0; right:0; top:1.5rem;
    display: flex;
    flex-direction: column;
    transition: left .2s ease, right .2s ease;
}

.content-container {
    overflow-x: hidden;
    top: 1.5rem;
    position: relative;
    flex: 1;
    order: 2;
}

.view.left  { left:0; right:50% }
.view.right { left:50%; right:0 }
.view.left .content.directory { border-right: 1px solid #ccc }

.content {
    left: 0;
    width: 100%;
    transition: transform .175s ease-in;
    position: absolute;
}

@media (min-width: 1024px) { .content { font-size:  1em } }
@media (max-width: 1023px) { .content { font-size: .9em } }
@media (max-width:  639px) { .content { font-size: .8em; top: 1.25rem; max-heigth: calc(100% - 1.25rem) } }

.content.directory {
    background: #eee;
    display: flex;
    padding: .25em 0;
    flex-direction: column;
}

.content.image, .content.video, .content.document {
    padding: 0;
    height: calc(100% - 1.5rem);
}
@media (max-width:  639px) {
    .content.image, .content.video, .content.document { height: calc(100% - 1.25rem) }
}

.content.back    { transform: translateX(-100%) }
.content.forward { transform: translateX(100%)  }
<commit_msg>Fix content spacing on small resolutions<commit_after>@charset "UTF-8";

/* ============================= Global styles ============================= */

body, div, a, header, input, label, li, nav, p, section, span, ul, figure, figcaption, img {
    box-sizing: border-box;
    font-size: 100%;
    font-weight: inherit;
    text-size-adjust: 100%;
    vertical-align: baseline;
    -webkit-touch-callout: none;
    margin: 0;
    padding: 0;
    border: 0;
}

li { list-style: none }
a  { text-decoration: none; background: transparent }
:focus, a:active, a:hover { outline: none }
button, input { font-family: inherit; font-size: 100%; margin: none; line-height: normal; border: none }
button, input, select, textarea { font-family: inherit; font-size: 100%; margin: 0 }
button, input { line-height: normal }

::-moz-focus-inner { border: none; padding: none; outline: none }
::-moz-focus-outer { border: none }

::-webkit-scrollbar, ::-webkit-scrollbar-track { background: transparent }
::-webkit-scrollbar-thumb      { background: #888 }
::-webkit-scrollbar:horizontal { height: 4px }
::-webkit-scrollbar:vertical   { width:  4px }

::selection      { background: #16b; color: #fff }
::-moz-selection { background: #16b; color: #fff }

input::-moz-placeholder          { color: #999; opacity: 1 }
input:-ms-input-placeholder      { color: #999 }
input::-webkit-input-placeholder { color: #999 }

/* =============================== Animations ============================== */

@keyframes nodeInserted {
    50% { opacity: 0.99 }
}
@keyframes jump {
   0%,100% { transform: translateY(-3px) }
   50%     { transform: translateY(3px)  }
}
@keyframes shake {
   0%,50%,100% { transform: translateX(-5px) }
   25%, 75%    { transform: translateX(5px)  }
}
@keyframes spin {
   from { transform: rotate(0deg)   }
   to   { transform: rotate(359deg) }
}
@keyframes zoom {
   0%,100%  { transform: scale(1.3) }
   50%      { transform: scale(0.9) }
}

/* ============================ Main Page Layout =========================== */

#flex-container {
    position: absolute;
    left: 0; right: 0; top: 0; bottom: 0;
    display: flex;
    flex-direction: column;
}

#navigation {
    background: #181818;
    text-align: center;
    order: 1;
    flex: 0 0 1.5rem;
    z-index: 2;
    transition: transform .3s ease;
    transform: translateY(-100%);
    display: flex;
    white-space: nowrap;
    user-select: none;
}
#navigation.in { transform: none; visibility: visible !important }
@media (min-width: 1024px) { #navigation { font-size: 1.1em } }

/* ============================= Header Buttons ============================ */

.button {
    color: #888;
    line-height: 1.5rem;
    cursor: pointer;
    flex: 1;
}
.button:not(.disabled):hover { color: #fff }

@media (min-width: 1024px) { .button { font-size: .7em } }
@media (max-width: 1023px) { .button { font-size: .7em } }
@media (max-width:  750px) { .button span { display: none } }

.button svg {
    fill: #888;
    height: .8rem;
    width: .8rem;
    margin-right: .2rem;
    position: relative;
    top: .15rem;
}
@media (max-width:  750px) { .button svg { margin-right: 0 } }

#upload-file-button:hover   { background: rgba(102, 166, 255, .15) }
#upload-folder-button:hover { background: rgba(255, 102, 252, .15) }
#create-file-button:hover   { background: rgba(102, 255, 235, .15) }
#create-folder-button:hover { background: rgba(102, 255, 125, .15) }
#about-button:hover         { background: rgba(148, 102, 255, .15) }
#prefs-button:hover         { background: rgba(255, 212, 102, .15) }
#logout-button:hover        { background: rgba(255, 102, 102, .15) }
#split-button:hover         { background: rgba(255,  82, 255, .15) }

#upload-file-button:hover svg        { fill: rgba(102, 166, 255, 1) }
#upload-folder-button:hover svg      { fill: rgba(255, 102, 252, 1) }
#create-file-button:hover svg        { fill: rgba(102, 255, 235, 1) }
#create-folder-button:hover svg      { fill: rgba(102, 255, 125, 1) }
#about-button:hover svg              { fill: rgba(148, 102, 255, 1) }
#prefs-button:hover svg              { fill: rgba(255, 212, 102, 1) }
#logout-button:hover svg             { fill: rgba(255,  82,  82, 1) }
#split-button:hover svg.split .left  { fill: rgba(255,  82,  82, 1) }
#split-button:hover svg.split .right { fill: rgba(102, 166, 255, 1) }

.button.disabled       { color: #444 !important; cursor: not-allowed !important }
.button.disabled:hover { color: #444 !important; background: transparent !important;  }
.button.disabled svg   { fill:  #444 !important }

#view-container {
    flex: 1 1;
    order: 2;
    overflow-y: auto;
}

/* ================================== View ================================= */
.view {
    position: absolute;
    bottom: 0; left:0; right:0; top:1.5rem;
    display: flex;
    flex-direction: column;
    transition: left .2s ease, right .2s ease;
}

.content-container {
    overflow-x: hidden;
    top: 1.5rem;
    position: relative;
    flex: 1;
    order: 2;
}
@media (max-width: 639px) { .content-container { top: 1.25rem } }

.view.left  { left:0; right:50% }
.view.right { left:50%; right:0 }
.view.left .content.directory { border-right: 1px solid #ccc }

.content {
    left: 0;
    width: 100%;
    transition: transform .175s ease-in;
    position: absolute;
}

@media (min-width: 1024px) { .content { font-size:  1em } }
@media (max-width: 1023px) { .content { font-size: .9em } }
@media (max-width:  639px) { .content { font-size: .8em } }

.content.directory {
    background: #eee;
    display: flex;
    padding: .25em 0;
    flex-direction: column;
}

.content.image, .content.video, .content.document {
    padding: 0;
    height: calc(100% - 1.5rem);
}
@media (max-width:  639px) {
    .content.image, .content.video, .content.document { height: calc(100% - 1.25rem) }
}

.content.back    { transform: translateX(-100%) }
.content.forward { transform: translateX(100%)  }

{'fraction_non_alphanumeric': 0.20832979896513698, 'fraction_numerical': 0.06573924845194673, 'mean_word_length': 3.268645908761767, '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': '605913', 'n_tokens_mistral': 4716, 'n_tokens_neox': 4045, 'n_words': 1042}