deadcxap/liberama
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Используем css-классы quasar

Browse Source
This commit is contained in:
Book Pauk
2020-01-30 18:53:01 +07:00
parent ae40a9ead9
commit 089ac70cd3
1 changed files with 10 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
client/components/Reader/LoaderPage/LoaderPage.vue
View File

@@ -1,31 +1,30 @@
<template>
<div ref="main" class="main">
<div ref="main" class="fit column no-wrap" style="min-height: 480px">
<GithubCorner url="https://github.com/bookpauk/liberama" cornerColor="#1B695F" gitColor="EBE2C9"></GithubCorner>
<div class="part top">
<span class="greeting bold-font">{{ title }}</span>
<div class="space"></div>
<div class="col column justify-center items-center no-wrap" style="min-height: 150px">
<span class="greeting"><b>{{ title }}</b></span>
<div class="q-my-md"></div>
<span class="greeting">Добро пожаловать!</span>
<span class="greeting">Поддерживаются форматы: <b>fb2, html, txt</b> и сжатие: <b>zip, bz2, gz</b></span>
<span v-if="isExternalConverter" class="greeting">...а также форматы: <b>rtf, doc, docx, pdf, epub, mobi</b></span>
</div>
<div class="part center">
<div class="col column justify-start items-center" style="min-height: 250px">
<el-input ref="input" placeholder="URL книги" v-model="bookUrl">
<el-button slot="append" icon="el-icon-check" @click="submitUrl"></el-button>
</el-input>
<div class="space"></div>
<div class="q-my-sm"></div>
<input type="file" id="file" ref="file" @change="loadFile" style='display: none;'/>
<el-button size="mini" @click="loadFileClick">
Загрузить файл с диска
</el-button>
<div class="space"></div>
<div class="q-my-sm"></div>
<el-button size="mini" @click="loadBufferClick">
Из буфера обмена
</el-button>
<div class="space"></div>
<div class="space"></div>
<div class="q-my-md"></div>
<div v-if="mode == 'omnireader'">
<div ref="yaShare2" class="ya-share2"
data-services="collections,vkontakte,facebook,odnoklassniki,twitter,telegram"
@@ -34,12 +33,12 @@
data-url="https://omnireader.ru">
</div>
</div>
<div class="space"></div>
<div class="q-my-sm"></div>
<span v-if="mode == 'omnireader'" class="bottom-span clickable" @click="openComments">Отзывы о читалке</span>
<span v-if="mode == 'omnireader'" class="bottom-span clickable" @click="openOldVersion">Старая версия</span>
</div>
<div class="part bottom">
<div class="col column justify-end items-center">
<span class="bottom-span clickable" @click="openHelp">Справка</span>
<span class="bottom-span clickable" @click="openDonate">Помочь проекту</span>
@@ -188,50 +187,17 @@ class LoaderPage extends Vue {
//-----------------------------------------------------------------------------
</script>
<style scoped>
.main {
flex: 1;
display: flex;
flex-direction: column;
min-height: 480px;
}
.part {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.greeting {
font-size: 120%;
line-height: 160%;
}
.bold-font {
font-weight: bold;
}
.clickable {
color: blue;
text-decoration: underline;
cursor: pointer;
}
.top {
min-height: 120px;
}
.center {
justify-content: flex-start;
padding: 0 10px 0 10px;
min-height: 250px;
}
.bottom {
justify-content: flex-end;
}
.bottom-span {
font-size: 70%;
margin-bottom: 10px;
@@ -240,8 +206,4 @@ class LoaderPage extends Vue {
.el-input {
max-width: 700px;
}
.space {
height: 20px;
}
</style>