compile scss on dockerfile

This commit is contained in:
FuzzyGrim
2023-08-29 23:09:48 +02:00
parent 6521fc0be9
commit 7aaabf0624
7 changed files with 7 additions and 276 deletions

View File

@@ -3,6 +3,8 @@ __pycache__
.env
.coverage
venv
src/static/css/main.css
src/static/css/main.css.map
src/db/db.sqlite3
src/media/*
!src/media/none.svg

2
.gitignore vendored
View File

@@ -3,6 +3,8 @@ __pycache__
.env
.coverage
venv
src/static/css/main.css
src/static/css/main.css.map
src/db/db.sqlite3
src/media/*
!src/media/none.svg

View File

@@ -31,6 +31,7 @@ RUN chmod +x /entrypoint.sh && \
# Django app
COPY src ./
RUN python manage.py compilescss
RUN python manage.py collectstatic --noinput --ignore=*.scss
CMD ["/entrypoint.sh"]

View File

@@ -2,9 +2,11 @@ aiofiles==23.1.0
aiohttp==3.8.4
crispy-bootstrap5==0.7
Django==4.2.3
django-compressor==4.3.1
django-crispy-forms==2.0
django_debug_toolbar==4.1.0
django-sass-processor==1.2.2
libsass==0.22.0
Pillow==9.5.0
psycopg-c==3.1.9
python-decouple==3.8

View File

@@ -1,7 +1,5 @@
black==23.3.0
coverage==7.2.7
django-compressor==4.3.1
libsass==0.22.0
ruff==0.0.285
-r requirements.txt

View File

@@ -1,251 +0,0 @@
/* roboto-300 - latin */
@font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: "Roboto"; font-style: normal; font-weight: 300; src: url("../fonts/roboto-v30-latin-300.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ }
/* roboto-regular - latin */
@font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: "Roboto"; font-style: normal; font-weight: 400; src: url("../fonts/roboto-v30-latin-regular.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ }
/* roboto-700 - latin */
@font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: "Roboto"; font-style: normal; font-weight: 700; src: url("../fonts/roboto-v30-latin-700.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ }
/* roboto-900 - latin */
@font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: "Roboto"; font-style: normal; font-weight: 900; src: url("../fonts/roboto-v30-latin-900.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ }
.header-text { color: #d1cdc7; font-size: 1.5rem; font-weight: 700; }
.no-fill-btn { border-width: 1px; border-style: solid; color: #adb5bd; border-color: #56595d; }
.no-fill-btn:hover { border-color: #999999; color: white; }
body { font-family: "Roboto", sans-serif; color: #d1cdc7; background-color: #181a1b; }
body img.lazyload:not([src]) { visibility: hidden; }
body main { height: 100dvh; width: 100%; overflow-y: auto; padding: 1em 2em; }
body main .search-bar { margin-bottom: 2em; }
body main .search-bar .btn { background-color: #212529; }
body main .search-bar .offcanvas-toggler { font-size: 1.25rem; line-height: 1; color: white; background-color: transparent; border: var(--bs-border-width) solid var(--bs-border-color); border-radius: 0.375rem; padding: 0.75rem; margin-right: 1rem; }
body main .search-bar .offcanvas-toggler:hover { background-color: #3a4047; }
body main .search-bar .input-group > .form-select { flex-grow: 0; width: auto; }
body main .no-content { display: flex; flex-direction: column; height: 75%; justify-content: center; align-items: center; }
#home .container { margin-bottom: 2rem; }
#home .container .title { text-align: center; margin-top: 0.5rem; margin-bottom: 1rem; }
#home .container .grid { display: grid; grid-gap: .5em; grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr)); }
#home .container .grid .card { width: 100%; margin-bottom: 1em; }
#home .container .grid .card .poster { width: 100%; aspect-ratio: 2/3; object-fit: cover; cursor: pointer; }
#home .container .grid .card .image-not-found { width: 100%; aspect-ratio: 2/3; object-fit: contain; object-position: center top; background-color: #2c3032; cursor: pointer; }
#home .container .grid .card .card-img-overlay { top: auto; padding: 0.5em; border-top-left-radius: 0px; border-top-right-radius: 0px; background-color: rgba(0, 0, 0, 0.692); }
#home .container .grid .card .card-img-overlay .card-title { margin-bottom: 0; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 0.9rem; }
#home .container .grid .card .card-img-overlay .card-text { font-size: 0.8rem; }
#home .container .grid .card .card-img-overlay .card-text .open-modal-button, #home .container .grid .card .card-img-overlay .card-text .progress-btn { padding: 0 0.5em; color: #adb5bd; }
#home .container .grid .card .card-img-overlay .card-text .open-modal-button:hover, #home .container .grid .card .card-img-overlay .card-text .progress-btn:hover { color: white; }
#home .container .grid .card .card-img-overlay .card-text .open-modal-button:disabled, #home .container .grid .card .card-img-overlay .card-text .progress-btn:disabled { color: transparent; }
#sidebar { width: 230px; }
#sidebar .nav-link.active { color: white; font-weight: 700; background-color: #2f3337; }
#sidebar .nav-link.active .bi { -webkit-text-stroke: .5px white; }
#sidebar .nav-link:not(.active) { color: #d9d9d9; }
#sidebar .nav-link:not(.active):hover { color: white; }
#medialist .dropdown-menu .text-end { float: right; }
#medialist .table-layout { background-color: #1a1d1e; border: 1px solid #383d3f; }
#medialist .table-layout .d-flex .image, #medialist .table-layout .d-flex .score, #medialist .table-layout .d-flex .status, #medialist .table-layout .d-flex ._progress, #medialist .table-layout .d-flex .edit { text-align: center; }
#medialist .table-layout .list-head { margin: 1em 0 0; }
#medialist .table-layout .list-head .filter, #medialist .table-layout .list-section .filter { margin-left: 1em !important; }
#medialist .table-layout .list-head .filter .filter-btn, #medialist .table-layout .list-section .filter .filter-btn { width: 3rem; height: 3rem; background-color: #1a1d1e; border: 0; color: #adb5bd; }
#medialist .table-layout .list-head .filter .filter-btn:hover, #medialist .table-layout .list-section .filter .filter-btn:hover { color: white; }
#medialist .table-layout .list-head .filter .filter-btn:after, #medialist .table-layout .list-section .filter .filter-btn:after { vertical-align: 0; }
#medialist .table-layout .list-head .image, #medialist .table-layout .list-section .image { margin-left: 1em !important; }
#medialist .table-layout .list-head .image img, #medialist .table-layout .list-section .image img { width: 3rem; height: 3rem; object-fit: cover; background-color: #383d3f; display: block; overflow: hidden; }
#medialist .table-layout .list-head .title, #medialist .table-layout .list-section .title { flex: 3; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; line-height: 2; }
#medialist .table-layout .list-head .title a, #medialist .table-layout .list-section .title a { color: #adb5bd; text-decoration: none; }
#medialist .table-layout .list-head .score, #medialist .table-layout .list-head .status, #medialist .table-layout .list-head ._progress, #medialist .table-layout .list-head .edit, #medialist .table-layout .list-section .score, #medialist .table-layout .list-section .status, #medialist .table-layout .list-section ._progress, #medialist .table-layout .list-section .edit { flex: 1; }
#medialist .table-layout .list-head .edit .open-modal-button, #medialist .table-layout .list-section .edit .open-modal-button { background-color: #1a1d1e; color: #adb5bd; border-width: 0; border-radius: 0; }
#medialist .table-layout .list-head .edit .open-modal-button:hover, #medialist .table-layout .list-section .edit .open-modal-button:hover { color: white; }
#medialist .table-layout .list-head .edit .modal, #medialist .table-layout .list-section .edit .modal { text-align: left; }
#medialist .grid-layout { display: grid; grid-gap: .5em; grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr)); }
#medialist .grid-layout .card { width: 100%; margin-bottom: 1em; }
#medialist .grid-layout .card .poster { width: 100%; aspect-ratio: 2/3; object-fit: cover; cursor: pointer; }
#medialist .grid-layout .card .image-not-found { width: 100%; aspect-ratio: 2/3; object-fit: contain; object-position: center top; background-color: #2c3032; cursor: pointer; }
#medialist .grid-layout .card .card-img-overlay { top: auto; padding: 0.5em; border-top-left-radius: 0px; border-top-right-radius: 0px; background-color: rgba(0, 0, 0, 0.692); }
#medialist .grid-layout .card .card-img-overlay .card-title { margin-bottom: 0; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 0.9rem; }
#medialist .grid-layout .card .card-img-overlay .card-text { font-size: 0.8rem; }
#medialist .grid-layout .card .card-img-overlay .card-text .open-modal-button, #medialist .grid-layout .card .card-img-overlay .card-text .progress-btn { padding: 0 0.5em; color: #adb5bd; }
#medialist .grid-layout .card .card-img-overlay .card-text .open-modal-button:hover, #medialist .grid-layout .card .card-img-overlay .card-text .progress-btn:hover { color: white; }
#medialist .grid-layout .card .card-img-overlay .card-text .open-modal-button:disabled, #medialist .grid-layout .card .card-img-overlay .card-text .progress-btn:disabled { color: transparent; }
#search .grid { display: grid; grid-gap: .5em; grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr)); }
#search .grid .card { width: 100%; margin-bottom: 1em; }
#search .grid .card .poster { width: 100%; aspect-ratio: 2/3; object-fit: cover; cursor: pointer; }
#search .grid .card .image-not-found { width: 100%; aspect-ratio: 2/3; object-fit: contain; object-position: center top; background-color: #2c3032; cursor: pointer; }
#search .grid .card .card-img-overlay { top: auto; padding: 0.5em; border-top-left-radius: 0px; border-top-right-radius: 0px; background-color: rgba(0, 0, 0, 0.692); }
#search .grid .card .card-img-overlay .card-title { margin-bottom: 0; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 0.9rem; }
#search .grid .card .card-img-overlay .card-text { font-size: 0.8rem; }
#search .grid .card .card-img-overlay .card-text .open-modal-button, #search .grid .card .card-img-overlay .card-text .progress-btn { padding: 0 0.5em; color: #adb5bd; }
#search .grid .card .card-img-overlay .card-text .open-modal-button:hover, #search .grid .card .card-img-overlay .card-text .progress-btn:hover { color: white; }
#search .grid .card .card-img-overlay .card-text .open-modal-button:disabled, #search .grid .card .card-img-overlay .card-text .progress-btn:disabled { color: transparent; }
#details { background-color: #1a1d1e; border: 1px solid #383d3f; padding: 1.5em; }
#details .header .poster { border-radius: 10px; width: 14rem; aspect-ratio: 2/3; object-fit: cover; }
#details .header .image-not-found { object-fit: contain; width: 14rem; aspect-ratio: 2/3; background-color: #2c3032; }
#details .header .content { margin-left: 1em; }
#details .header .content .show-title { margin-bottom: 0.5em; }
#details .header .content .show-title a { font-size: 1.1rem; color: #adb5bd; }
#details .header .content .synopsis { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; }
#details .header .content .buttons-group { margin-top: auto; }
#details .grid-title { margin-top: 1em; font-size: 1.2rem; margin-bottom: 0.5em; }
#details .grid { display: grid; grid-gap: .5em; grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr)); }
#details .grid .card { width: 100%; margin-bottom: 1em; }
#details .grid .card .poster { width: 100%; aspect-ratio: 2/3; object-fit: cover; cursor: pointer; }
#details .grid .card .image-not-found { width: 100%; aspect-ratio: 2/3; object-fit: contain; object-position: center top; background-color: #2c3032; cursor: pointer; }
#details .grid .card .card-img-overlay { top: auto; padding: 0.5em; border-top-left-radius: 0px; border-top-right-radius: 0px; background-color: rgba(0, 0, 0, 0.692); }
#details .grid .card .card-img-overlay .card-title { margin-bottom: 0; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 0.9rem; }
#details .grid .card .card-img-overlay .card-text { font-size: 0.8rem; }
#details .grid .card .card-img-overlay .card-text .open-modal-button, #details .grid .card .card-img-overlay .card-text .progress-btn { padding: 0 0.5em; color: #adb5bd; }
#details .grid .card .card-img-overlay .card-text .open-modal-button:hover, #details .grid .card .card-img-overlay .card-text .progress-btn:hover { color: white; }
#details .grid .card .card-img-overlay .card-text .open-modal-button:disabled, #details .grid .card .card-img-overlay .card-text .progress-btn:disabled { color: transparent; }
#details .episode-list { margin-top: 2em; margin-bottom: 0.5em; }
#details .episode-list .episode .check-div { flex-basis: 1em; flex-shrink: 0; }
#details .episode-list .episode .episode-number { flex-basis: 5em; flex-shrink: 0; text-align: center; }
#details .episode-list .episode .episode-name { flex-grow: 3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#details .episode-list .episode .episode-date { flex-basis: 10em; text-align: center; }
#details .episode-list .episode .watch-status { flex-basis: 64px; flex-shrink: 0; text-align: center; }
#details .episode-list .episode .watch-status .watch-btn { color: white; background-color: #6c757d; border-color: #6c757d; }
#details .episode-list .episode .watch-status .watch-btn:hover { color: white; background-color: #5c636a; border-color: #565e64; }
#details .episode-list .btn-group .btn-release-date { color: white; background-color: #6c757d; border-color: #6c757d; }
#details .episode-list .btn-group .btn-release-date:hover { color: white; background-color: #5c636a; border-color: #565e64; }
#details .episode-list .btn-group .date-btn-group .form-control { padding-right: 0; border-radius: 0; border-right: 0; }
#details .episode-list .btn-group .date-btn-group .btn { border-radius: 0; border-color: #495057; border-left: 0; color: #adb5bd; }
#details .episode-list .btn-group .date-btn-group .btn:hover { color: white; }
#profile .grid-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(20em, 1fr)); gap: 1em; }
#profile .grid-container form.grid-item { text-align: center; }
#profile .grid-container form.grid-item .form-title { font-size: 1.2rem; margin-bottom: 0.5em; text-align: center; }
#login { height: 100dvh; }
#login .form-signin { width: 330px; padding: 15px; margin-top: -5rem; }
#login .form-signin ul { margin-bottom: 0; }
#login .form-signin input[type="text"] { margin-bottom: -1px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; }
#login .form-signin input[type="password"] { margin-bottom: 10px; border-top-left-radius: 0; border-top-right-radius: 0; }
#login .form-signin .form-floating:focus-within { z-index: 2; }
#register { height: 100dvh; }
#register .form-signin { width: 330px; padding: 15px; margin-top: -5rem; }
#register .form-signin ul { margin-bottom: 0; }
#register .form-signin #id_username { margin-bottom: -1px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; }
#register .form-signin #id_password1 { margin-bottom: -1px; border-radius: 0; }
#register .form-signin #id_password2 { margin-bottom: 10px; border-top-left-radius: 0; border-top-right-radius: 0; }
#register .form-signin .form-floating:focus-within { z-index: 2; }
.media-form-modal form input { color-scheme: dark; }
.error-title { color: #d1cdc7; font-weight: 700; margin-bottom: 1rem; text-align: center; }
@media screen and (min-width: 1400px) { .container { max-width: 100%; } }
@media screen and (min-width: 992px) { body main .search-bar .input-group { width: 50%; margin: auto; } }
@media screen and (max-width: 991px) { body main { padding-top: 2em; } #profile .grid-container { grid-template-columns: 1fr; } #details .episode-date { display: none; } }
@media screen and (max-width: 575px) { #medialist .list-head ._progress, #medialist .list-section ._progress { display: none; } #details .header { flex-wrap: wrap; justify-content: center; } #details .header .image { margin-bottom: 1em; } #details .header .content .title { width: 100%; text-align: center; } #details .header .content .show-title { width: 100%; text-align: center; } #details .header .content .buttons-group { margin-top: 0.5em; } #details .btn-group .btn-release-date { border-radius: 0; } #details .btn-group .btn-danger { border-radius: 0; } }
/*# sourceMappingURL=main.css.map */

File diff suppressed because one or more lines are too long