ajurna/cbwebreader
1
0
Fork 0
mirror of https://github.com/ajurna/cbwebreader.git synced 2025-12-06 06:17:17 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix for columns alignment and title readability.

Browse Source
This commit is contained in:
Peter Dwyer
2022-08-29 15:27:49 +01:00
parent 5ca3c396ea
commit b191c332b9
7 changed files with 80 additions and 129 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
cbreader/settings/base.py
View File

@@ -59,7 +59,7 @@ MIDDLEWARE = [
"django.contrib.messages.middleware.MessageMiddleware", "django.contrib.messages.middleware.MessageMiddleware",
"django.middleware.clickjacking.XFrameOptionsMiddleware", "django.middleware.clickjacking.XFrameOptionsMiddleware",
# 'silk.middleware.SilkyMiddleware', # 'silk.middleware.SilkyMiddleware',
'csp.middleware.CSPMiddleware', # 'csp.middleware.CSPMiddleware',
] ]
ROOT_URLCONF = "cbreader.urls" ROOT_URLCONF = "cbreader.urls"
@@ -147,6 +147,7 @@ CSP_CONNECT_SRC = ("'self'",)
CSP_INCLUDE_NONCE_IN = ['script-src'] CSP_INCLUDE_NONCE_IN = ['script-src']
CSP_SCRIPT_SRC_ATTR = ("'self'",)# "'unsafe-inline'") CSP_SCRIPT_SRC_ATTR = ("'self'",)# "'unsafe-inline'")
PERMISSIONS_POLICY = { PERMISSIONS_POLICY = {
"accelerometer": [], "accelerometer": [],
"ambient-light-sensor": [], "ambient-light-sensor": [],
@@ -208,7 +209,7 @@ WEBPACK_LOADER = {
'CACHE': not DEBUG, 'CACHE': not DEBUG,
'BUNDLE_DIR_NAME': '/bundles/', # must end with slash 'BUNDLE_DIR_NAME': '/bundles/', # must end with slash
'STATS_FILE': os.path.join(FRONTEND_DIR, 'webpack-stats.json'), 'STATS_FILE': os.path.join(FRONTEND_DIR, 'webpack-stats.json'),
'INTEGRITY': True, 'INTEGRITY': not DEBUG,
} }
} }

125
frontend/src/components/ComicCard.vue
View File

@@ -1,59 +1,61 @@
<template> <template>
<CCard class="col-xl-2 col-lg-2 col-md-3 col-sm-4 p-0 m-1 "> <CCol>
<CCardImage orientation="top" :src="thumbnail"/> <CCard class="">
<CCardBody class="pb-0 pt-0 pl-1 pr-1 card-img-overlay d-flex"> <CCardImage orientation="top" :src="thumbnail"/>
<span class="badge rounded-pill bg-primary unread-badge" v-if="this.unread > 0 && data.type === 'Directory'">{{ this.unread }}</span> <CCardBody class="pb-0 pt-0 pl-1 pr-1 card-img-overlay d-flex" @click="$router.push((data.type === 'Directory' ? {'name': 'browse', params: { selector: data.selector }} : {'name': 'read', params: { selector: data.selector }}))">
<span class="badge rounded-pill bg-warning classification-badge" v-if="card_type === 'Directory'" >{{ this.$store.state.classifications.find(i => i.value === classification).label }}</span> <span class="badge rounded-pill bg-primary unread-badge" v-if="this.unread > 0 && data.type === 'Directory'">{{ this.unread }}</span>
<CCardTitle class="align-self-end pb-5 mb-4 text-break" style=""> <span class="badge rounded-pill bg-warning classification-badge" v-if="card_type === 'Directory'" >{{ this.$store.state.classifications.find(i => i.value === classification).label }}</span>
<router-link :to="(data.type === 'Directory' ? {'name': 'browse', params: { selector: data.selector }} : {'name': 'read', params: { selector: data.selector }})">{{ data.title }}</router-link> <CCardTitle class="align-self-end text-break" style="">
</CCardTitle> <router-link :to="(data.type === 'Directory' ? {'name': 'browse', params: { selector: data.selector }} : {'name': 'read', params: { selector: data.selector }})">{{ data.title }}</router-link>
</CCardBody> </CCardTitle>
<CCardFooter class="pl-0 pr-0 pt-0"> </CCardBody>
<CProgress class="mb-1 position-relative" > <CCardFooter class="pl-0 pr-0 pt-0">
<CProgressBar :value="progressPercentCalc" /> <CProgress class="mb-1 position-relative" >
<small class="justify-content-center d-flex position-absolute w-100 h-100" style="line-height: normal">{{ progressCalc }} / {{data.total}}</small> <CProgressBar :value="progressPercentCalc" />
</CProgress> <small class="justify-content-center d-flex position-absolute w-100 h-100" style="line-height: normal">{{ progressCalc }} / {{data.total}}</small>
<CButtonGroup class="w-100"> </CProgress>
<CButton color="primary" @click="updateComic('mark_unread')" ><font-awesome-icon icon='book' /></CButton> <CButtonGroup class="w-100">
<CButton color="primary" @click="updateComic('mark_read')" ><font-awesome-icon icon='book-open' /></CButton> <CButton color="primary" @click="updateComic('mark_unread')" ><font-awesome-icon icon='book' /></CButton>
<CDropdown variant="btn-group"> <CButton color="primary" @click="updateComic('mark_read')" ><font-awesome-icon icon='book-open' /></CButton>
<CDropdownToggle color="primary"><font-awesome-icon icon='edit' /></CDropdownToggle> <CDropdown variant="btn-group">
<CDropdownMenu> <CDropdownToggle color="primary"><font-awesome-icon icon='edit' /></CDropdownToggle>
<CDropdownItem @click="updateComic('mark_unread')"><font-awesome-icon icon='book' />Mark Un-read</CDropdownItem> <CDropdownMenu>
<CDropdownItem @click="updateComic('mark_read')"><font-awesome-icon icon='book-open' />Mark read</CDropdownItem> <CDropdownItem @click="updateComic('mark_unread')"><font-awesome-icon icon='book' />Mark Un-read</CDropdownItem>
<CDropdownItem v-if="data.type === 'ComicBook'" @click="$emit('markPreviousRead', data.selector)"><font-awesome-icon icon='book' /><font-awesome-icon icon='turn-up' />Mark previous comics read</CDropdownItem> <CDropdownItem @click="updateComic('mark_read')"><font-awesome-icon icon='book-open' />Mark read</CDropdownItem>
<CDropdownItem v-if="data.type === 'Directory'" @click="editDirectoryVisible = true"><font-awesome-icon icon='edit' />Edit comic</CDropdownItem> <CDropdownItem v-if="data.type === 'ComicBook'" @click="$emit('markPreviousRead', data.selector)"><font-awesome-icon icon='book' /><font-awesome-icon icon='turn-up' />Mark previous comics read</CDropdownItem>
</CDropdownMenu> <CDropdownItem v-if="data.type === 'Directory'" @click="editDirectoryVisible = true"><font-awesome-icon icon='edit' />Edit comic</CDropdownItem>
</CDropdown> </CDropdownMenu>
</CButtonGroup> </CDropdown>
</CCardFooter> </CButtonGroup>
</CCard> </CCardFooter>
<CModal :visible="editDirectoryVisible" @close="editDirectoryVisible = false"> </CCard>
<CModalHeader> <CModal :visible="editDirectoryVisible" @close="editDirectoryVisible = false">
<CModalTitle>{{ data.title }}</CModalTitle> <CModalHeader>
</CModalHeader> <CModalTitle>{{ data.title }}</CModalTitle>
<CForm @submit="updateDirectory"> </CModalHeader>
<CModalBody> <CForm @submit="updateDirectory">
<CFormSelect <CModalBody>
label="Classification" <CFormSelect
aria-label="Set Classification" label="Classification"
v-model="new_classification" aria-label="Set Classification"
:options="[...this.$store.state.classifications]"> v-model="new_classification"
</CFormSelect> :options="[...this.$store.state.classifications]">
<CFormCheck </CFormSelect>
label="Recursive" <CFormCheck
class="mt-2" label="Recursive"
v-model="recursive" class="mt-2"
/> v-model="recursive"
</CModalBody> />
<CModalFooter> </CModalBody>
<CButton color="secondary" @click="editDirectoryVisible = false "> <CModalFooter>
Close <CButton color="secondary" @click="editDirectoryVisible = false ">
</CButton> Close
<CButton color="primary" type="submit">Save changes</CButton> </CButton>
</CModalFooter> <CButton color="primary" type="submit">Save changes</CButton>
</CForm> </CModalFooter>
</CModal> </CForm>
</CModal>
</CCol>
</template> </template>
<script> <script>
@@ -154,10 +156,21 @@ export default {
</script> </script>
<style scoped> <style scoped>
.card-title a { .card-title a {
color: white; color: white;
text-shadow: .2rem .2rem .3rem black ; text-shadow: .2rem .2rem .3rem black ;
} }
h5.card-title {
margin-bottom: 75px;
background: linear-gradient(to top, rgba(0, 0, 0, 0.85), transparent);
}
h5.card-title::before {
filter: blur(12px);
}
.card .unread-badge { .card .unread-badge {
position: absolute; position: absolute;
top: 10px; top: 10px;

6
frontend/src/components/TheComicList.vue
View File

@@ -1,5 +1,5 @@
<template> <template>
<CContainer> <CContainer fluid>
<CRow> <CRow>
<CInputGroup> <CInputGroup>
<CFormInput placeholder="Search" aria-label="Filter comics by name" v-model="this.filters.search_string"/> <CFormInput placeholder="Search" aria-label="Filter comics by name" v-model="this.filters.search_string"/>
@@ -15,7 +15,7 @@
</CDropdown> </CDropdown>
</CInputGroup> </CInputGroup>
</CRow> </CRow>
<CRow> <div class="row row-cols-2 row-cols-sm-3 row-cols-md-4 row-cols-lg-6 row-cols-xl-auto" >
<template v-if="loading"> <template v-if="loading">
<CCol> <CCol>
<CProgress class="mt-3" > <CProgress class="mt-3" >
@@ -28,7 +28,7 @@
<comic-card :data="comic" @updateComicList="updateComicList" @markPreviousRead="markPreviousRead" @updateThumbnail="updateThumbnail" /> <comic-card :data="comic" @updateComicList="updateComicList" @markPreviousRead="markPreviousRead" @updateThumbnail="updateThumbnail" />
</template> </template>
</template> </template>
</CRow> </div>
</CContainer> </CContainer>
</template> </template>

2
frontend/src/components/TheNavbar.vue
View File

@@ -43,7 +43,7 @@ export default {
}, },
data() { data() {
return { return {
visible: true visible: false
} }
}, },
methods: { methods: {

6
poetry.lock generated
View File

@@ -411,7 +411,7 @@ validation = ["swagger-spec-validator (>=2.1.0)"]
[[package]] [[package]]
name = "executing" name = "executing"
version = "0.10.0" version = "1.0.0"
description = "Get the currently executing AST node of a frame, and other information" description = "Get the currently executing AST node of a frame, and other information"
category = "dev" category = "dev"
optional = false optional = false
@@ -875,7 +875,7 @@ python-versions = ">=3.5"
[[package]] [[package]]
name = "stack-data" name = "stack-data"
version = "0.4.0" version = "0.5.0"
description = "Extract data from python stack frames and tracebacks for informative displays" description = "Extract data from python stack frames and tracebacks for informative displays"
category = "dev" category = "dev"
optional = false optional = false
@@ -934,7 +934,7 @@ python-versions = ">=2"
[[package]] [[package]]
name = "ua-parser" name = "ua-parser"
version = "0.16.0" version = "0.16.1"
description = "Python port of Browserscope's user agent parser" description = "Python port of Browserscope's user agent parser"
category = "main" category = "main"
optional = false optional = false

2
pyproject.toml
View File

@@ -3,7 +3,7 @@ line_length = 119
[tool.poetry] [tool.poetry]
name = "cbwebreader" name = "cbwebreader"
version = "1.0.2" version = "1.0.3"
description = "CBR/Z Web Reader" description = "CBR/Z Web Reader"
authors = ["ajurna <ajurna@gmail.com>"] authors = ["ajurna <ajurna@gmail.com>"]
license = "Creative Commons Attribution-ShareAlike 4.0 International License" license = "Creative Commons Attribution-ShareAlike 4.0 International License"

63
requirements.txt
View File

@@ -1,63 +0,0 @@
asgiref==3.5.2; python_version >= "3.8"
autopep8==1.7.0; python_version >= "3.7"
beautifulsoup4==4.11.1; python_full_version >= "3.6.0" and python_version >= "3.7"
certifi==2022.6.15; python_version >= "3.7" and python_version < "4"
charset-normalizer==2.1.1; python_version >= "3.7" and python_version < "4" and python_full_version >= "3.6.0"
colorama==0.4.5; python_version >= "3.5" and python_full_version < "3.0.0" and sys_platform == "win32" or sys_platform == "win32" and python_version >= "3.5" and python_full_version >= "3.5.0"
coreapi==2.3.3; python_version >= "3.6"
coreschema==0.0.4; python_version >= "3.6"
coverage==6.4.4; python_version >= "3.7"
dj-database-url==1.0.0
django-appconf==1.0.5; python_version >= "3.6"
django-boost==2.0
django-bootstrap4==22.2; python_version >= "3.7"
django-cors-headers==3.13.0; python_version >= "3.7"
django-csp==3.7
django-extensions==3.2.0; python_version >= "3.6"
django-filter==22.1; python_version >= "3.7"
django-imagekit==4.1.0
django-node-assets==0.9.11
django-permissions-policy==4.13.0; python_version >= "3.7"
django-silk==5.0.1; python_version >= "3.7"
django-sri==0.4.0; python_version >= "3.8"
django-webpack-loader==1.6.0
django==4.0.7; python_version >= "3.8"
djangorestframework-simplejwt==5.2.0; python_version >= "3.7"
djangorestframework==3.13.1; python_version >= "3.6"
drf-extensions==0.7.1
drf-yasg==1.21.3; python_version >= "3.6"
gprof2dot==2022.7.29; python_version >= "3.7"
gunicorn==20.1.0; python_version >= "3.5"
idna==3.3; python_version >= "3.7" and python_version < "4"
inflection==0.5.1; python_version >= "3.6"
itypes==1.2.0; python_version >= "3.6"
jinja2==3.1.2; python_version >= "3.7"
loguru==0.6.0; python_version >= "3.5"
markdown==3.4.1; python_version >= "3.7"
markupsafe==2.1.1; python_version >= "3.7"
mysqlclient==2.1.1; python_version >= "3.5"
packaging==21.3; python_version >= "3.6"
pilkit==2.0
pillow==9.2.0; python_version >= "3.7"
psycopg2==2.9.3; python_version >= "3.6"
pycodestyle==2.9.1; python_version >= "3.7"
pyjwt==2.4.0; python_version >= "3.7"
pymupdf==1.18.19
pyparsing==3.0.9; python_full_version >= "3.6.8" and python_version >= "3.6"
python-dateutil==2.8.2; python_version >= "3.7" and python_full_version < "3.0.0" or python_full_version >= "3.3.0" and python_version >= "3.7"
python-dotenv==0.20.0; python_version >= "3.5"
pytz==2022.2.1; python_version >= "3.7"
rarfile==4.0
requests==2.28.1; python_version >= "3.7" and python_version < "4"
ruamel.yaml.clib==0.2.6; platform_python_implementation == "CPython" and python_version < "3.11" and python_version >= "3.6"
ruamel.yaml==0.17.21; python_version >= "3.6"
six==1.16.0; python_version >= "3.7" and python_full_version < "3.0.0" or python_full_version >= "3.3.0" and python_version >= "3.7"
soupsieve==2.3.2.post1; python_full_version >= "3.6.0" and python_version >= "3.7"
sqlparse==0.4.2; python_version >= "3.8"
toml==0.10.2; python_version >= "3.7" and python_full_version < "3.0.0" or python_full_version >= "3.3.0" and python_version >= "3.7"
tzdata==2022.2; sys_platform == "win32" and python_version >= "3.8"
ua-parser==0.16.0
uritemplate==4.1.1; python_version >= "3.6"
urllib3==1.26.12; python_version >= "3.7" and python_full_version < "3.0.0" and python_version < "4" or python_full_version >= "3.6.0" and python_version < "4" and python_version >= "3.7"
user-agents==2.2.0
win32-setctime==1.1.0; sys_platform == "win32" and python_version >= "3.5"