fix(app/insights): display issues for small screen [skip ci]

This commit is contained in:
lowlighter
2022-08-28 11:36:48 -04:00
parent 28efd21417
commit cf4be44a3e
2 changed files with 12 additions and 2 deletions

View File

@@ -346,7 +346,7 @@
<div class="loading" v-if="!loaded.includes('calendar')">Fetching data</div> <div class="loading" v-if="!loaded.includes('calendar')">Fetching data</div>
<template v-else-if="(calendar)&&(calendar.years?.length > 1)"> <template v-else-if="(calendar)&&(calendar.years?.length > 1)">
<p> <p>
Below is the full commit history of <b>{{ user }}</b> between {{ calendar.years[0].year }} and {{ calendar.years[calendar.years.length-1].year }}. Below is the full commit history of <b>{{ user }}</b> between {{ calendar.years[calendar.years.length-1].year }} and {{ calendar.years[0].year }}.
<small class="footnote"> <small class="footnote">
Note that commits prior <b>{{ user }}</b>'s registration date on GitHub are not displayed. Note that commits prior <b>{{ user }}</b>'s registration date on GitHub are not displayed.
</small> </small>

View File

@@ -117,6 +117,9 @@
} }
/* Activity */ /* Activity */
.activity {
max-width: 90vw;
}
.activity > ul { .activity > ul {
padding: 0; padding: 0;
margin: 0; margin: 0;
@@ -317,6 +320,7 @@
.reactions { .reactions {
display: flex; display: flex;
justify-content: center; justify-content: center;
flex-wrap: wrap;
} }
.reactions > div { .reactions > div {
@@ -339,7 +343,7 @@
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
margin: .5rem; margin: .5rem;
max-width: 416px; max-width: 90vw;
border-radius: .25rem; border-radius: .25rem;
border: 1px solid var(--color-border-primary); border: 1px solid var(--color-border-primary);
padding: .5rem .5rem 0; padding: .5rem .5rem 0;
@@ -350,6 +354,9 @@
align-items: center; align-items: center;
margin-bottom: .5rem; margin-bottom: .5rem;
} }
.repository .field.infos {
flex-wrap: wrap;
}
.repository svg { .repository svg {
fill: currentColor; fill: currentColor;
} }
@@ -610,6 +617,9 @@
.search { .search {
width: 520px; width: 520px;
} }
.repository {
max-width: 416px;
}
} }
/* Loading bar */ /* Loading bar */