handle edge cases

This commit is contained in:
Mutasem 2021-07-08 12:48:35 +02:00
parent dcf15800ca
commit af7ba07280

View file

@ -1,6 +1,5 @@
<template> <template>
<Modal <Modal
v-if="currentVersion"
:name="modalName" :name="modalName"
:drawer="true" :drawer="true"
:visible="visible" :visible="visible"
@ -12,7 +11,7 @@
</template> </template>
<template slot="content"> <template slot="content">
<section :class="$style['description']"> <section :class="$style['description']">
<p>Youre on {{ currentVersion.name }}, which was released <strong>{{currentReleaseDate}}</strong> and is {{ nextVersions.length }} version{{nextVersions.length > 1 ? 's' : ''}} behind the latest and greatest n8n</p> <p v-if="currentVersion">Youre on {{ currentVersion.name }}, which was released <strong>{{currentReleaseDate}}</strong> and is {{ nextVersions.length }} version{{nextVersions.length > 1 ? 's' : ''}} behind the latest and greatest n8n</p>
<a :class="$style.update" :href="infoUrl" v-if="infoUrl" target="_blank"> <a :class="$style.update" :href="infoUrl" v-if="infoUrl" target="_blank">
<font-awesome-icon icon="info-circle"></font-awesome-icon> <font-awesome-icon icon="info-circle"></font-awesome-icon>
@ -60,22 +59,6 @@ export default Vue.extend({
</script> </script>
<style module lang="scss"> <style module lang="scss">
.description {
padding: 0px 30px;
margin-bottom: 30px;
p {
font-size: 16px;
line-height: 22px;
color: $--updates-panel-description-text-color;
font-weight: 400;
}
div {
padding-top: 20px;
}
}
.title { .title {
margin: 0; margin: 0;
font-size: 24px; font-size: 24px;
@ -84,6 +67,24 @@ export default Vue.extend({
font-weight: 400; font-weight: 400;
} }
.description {
padding: 0px 30px;
margin-block-start: 30px;
margin-block-end: 30px;
p {
font-size: 16px;
line-height: 22px;
color: $--updates-panel-description-text-color;
font-weight: 400;
margin: 0 0 30px 0;
}
div {
padding-top: 20px;
}
}
.content { .content {
overflow: hidden; overflow: hidden;
} }
@ -98,7 +99,7 @@ export default Vue.extend({
} }
.versions-card { .versions-card {
margin-bottom: 15px; margin-block-end: 15px;
} }
.update { .update {