diff --git a/aircox/static/aircox/css/admin.css b/aircox/static/aircox/css/admin.css index c9d9a86..6551264 100644 --- a/aircox/static/aircox/css/admin.css +++ b/aircox/static/aircox/css/admin.css @@ -45,15 +45,14 @@ --a-playlist-title-pd: 0.6rem; --a-playlist-item-border: 1px var(--secondary-color) solid; --a-sound-bg: var(--main-color); - --a-sound-hv-bg: var(--main-color-light); - --a-sound-btn-hv-fg: var(--secondary-color); - --a-sound-playing-fg: var(--secondary-color-dark); + --a-sound-hv-bg: var(--main-color); --a-sound-hv-fg: var(--secondary-color); + --a-sound-playing-fg: var(--secondary-color-dark); --a-sound-text-sz: 1rem; --a-player-url-fg: var(--text-color); - --a-player-panel-bg: var(--hg-color); + --a-player-panel-bg: var(--main-color); --a-player-bar-height: var(--nav-primary-height); - --a-player-bar-bg: var(--hg-color); + --a-player-bar-bg: var(--main-color); --a-player-bar-title-alone-sz: 1.4rem; --a-player-bar-button-fg: var(--button-fg); --a-player-bar-button-fg: var(--button-bg); @@ -239,6 +238,8 @@ .list-item .subtitle { font-size: var(--preview-title-sz); text-align: right; +} +.list-item .subtitle:not(:empty) { min-width: 9rem; } .list-item .media-content { @@ -334,7 +335,8 @@ } .a-carousel .a-carousel-viewport { box-shadow: inset 0em 0em 20rem var(--a-carousel-bg); - padding: var(--a-carousel-p) 0; + padding: 0rem; + padding-top: var(--a-carousel-p); margin-top: calc(0rem - var(--a-carousel-p)); } @@ -352,6 +354,10 @@ } .a-carousel-bullets-container .bullet { margin: 0.2rem; + cursor: pointer; +} +.a-carousel-bullets-container .bullet:hover { + color: var(--link-fg); } .a-progress { @@ -437,7 +443,7 @@ font-size: var(--a-sound-text-sz); } .a-sound-item .button:hover { - color: var(--a-sound-btn-hv-fg) !important; + color: var(--a-sound-hv-fg) !important; background-color: unset; } diff --git a/aircox/static/aircox/css/chunk-common.css b/aircox/static/aircox/css/chunk-common.css index 85d1303..6c5a061 100644 --- a/aircox/static/aircox/css/chunk-common.css +++ b/aircox/static/aircox/css/chunk-common.css @@ -19,13 +19,17 @@ flex-shrink: 0; } .a-carousel-bullets-container[data-v-b79f173e] { - justify-content: center; flex-grow: 1; } .a-carousel-bullets-container .bullet[data-v-b79f173e] { cursor: pointer; } -.a-carousel-bullets-container .bullet-right[data-v-b79f173e] { +.a-carousel-bullets-container .left[data-v-b79f173e] { + min-width: 2rem; + margin-right: auto; +} +.a-carousel-bullets-container .right[data-v-b79f173e] { + min-width: 2rem; margin-left: auto; } .a-carousel-bullets-container[data-v-b79f173e] { @@ -7045,12 +7049,6 @@ body { --header-height: 20rem; } } -section > .toolbar { - background-color: rgba(0, 0, 0, 0.05); - padding: 1em; - margin-bottom: 1.5em; -} - h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle { font-family: var(--heading-font-family); } diff --git a/aircox/static/aircox/css/public.css b/aircox/static/aircox/css/public.css index 4bb6009..7cd5cc6 100644 --- a/aircox/static/aircox/css/public.css +++ b/aircox/static/aircox/css/public.css @@ -45,15 +45,14 @@ --a-playlist-title-pd: 0.6rem; --a-playlist-item-border: 1px var(--secondary-color) solid; --a-sound-bg: var(--main-color); - --a-sound-hv-bg: var(--main-color-light); - --a-sound-btn-hv-fg: var(--secondary-color); - --a-sound-playing-fg: var(--secondary-color-dark); + --a-sound-hv-bg: var(--main-color); --a-sound-hv-fg: var(--secondary-color); + --a-sound-playing-fg: var(--secondary-color-dark); --a-sound-text-sz: 1rem; --a-player-url-fg: var(--text-color); - --a-player-panel-bg: var(--hg-color); + --a-player-panel-bg: var(--main-color); --a-player-bar-height: var(--nav-primary-height); - --a-player-bar-bg: var(--hg-color); + --a-player-bar-bg: var(--main-color); --a-player-bar-title-alone-sz: 1.4rem; --a-player-bar-button-fg: var(--button-fg); --a-player-bar-button-fg: var(--button-bg); @@ -239,6 +238,8 @@ .list-item .subtitle { font-size: var(--preview-title-sz); text-align: right; +} +.list-item .subtitle:not(:empty) { min-width: 9rem; } .list-item .media-content { @@ -334,7 +335,8 @@ } .a-carousel .a-carousel-viewport { box-shadow: inset 0em 0em 20rem var(--a-carousel-bg); - padding: var(--a-carousel-p) 0; + padding: 0rem; + padding-top: var(--a-carousel-p); margin-top: calc(0rem - var(--a-carousel-p)); } @@ -352,6 +354,10 @@ } .a-carousel-bullets-container .bullet { margin: 0.2rem; + cursor: pointer; +} +.a-carousel-bullets-container .bullet:hover { + color: var(--link-fg); } .a-progress { @@ -437,7 +443,7 @@ font-size: var(--a-sound-text-sz); } .a-sound-item .button:hover { - color: var(--a-sound-btn-hv-fg) !important; + color: var(--a-sound-hv-fg) !important; background-color: unset; } @@ -7333,6 +7339,9 @@ a.tag:hover { clear: both; margin: 0.6rem 0; } +.page *[data-oembed-url] { + clear: both; +} .dropdown-item { font-size: unset !important; @@ -7351,6 +7360,8 @@ a.tag:hover { display: inline-block; margin: 0.6rem; margin-left: 0rem; + padding: 0.4rem; + border-bottom: 1px var(--main-color) solid; } .schedule .heading { padding: 0em; @@ -7680,19 +7691,37 @@ nav li a, nav li .button { position: relative; z-index: 1000; background-color: var(--body-bg); - height: var(--header-height); - max-width: calc(var(--header-height) * 2); margin: 0 0 1.2rem 1.2rem; } -.header-cover:not(:only-child) img { - width: 100%; - height: 100%; +.header-cover:not(:only-child) .cover { + max-width: calc(var(--header-height) * 2); + height: var(--header-height); } .header-cover:only-child { with: 100%; } +@media screen and (max-width: 600px) { + .container.header { + width: calc(100% - 0.4rem); + } + .container.header .headings { + width: 100%; + clear: both; + } + .container.header .header-cover { + float: none; + margin: 0; + text-align: center; + } + .container.header .cover { + margin-left: auto; + margin-right: auto; + max-height: calc(var(--cover-h) * 1); + max-width: calc(var(--cover-w) * 2); + } +} .page-content { margin-top: 2rem; } @@ -7734,19 +7763,4 @@ body { margin-left: 0.4rem; margin-right: 0.4rem; } - .container.header { - width: calc(100% - 0.4rem); - } - .container.header .headings { - width: 100%; - clear: both; - } - .container.header .header-cover { - float: none; - width: 100%; - max-width: unset; - height: unset; - margin-left: 0rem; - margin-right: 0rem; - } } diff --git a/aircox/static/aircox/js/chunk-common.js b/aircox/static/aircox/js/chunk-common.js index 952cc86..4abb345 100644 --- a/aircox/static/aircox/js/chunk-common.js +++ b/aircox/static/aircox/js/chunk-common.js @@ -35,7 +35,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _mod \*******************************************************************************************************************************************************************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! core-js/modules/es.array.push.js */ \"./node_modules/core-js/modules/es.array.push.js\");\n/* harmony import */ var core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.esm-bundler.js\");\n\n\nclass Offset {\n constructor(el, min = null, max = null) {\n this.el = el;\n this.rect = el.getBoundingClientRect();\n ({\n min,\n max\n } = this.minmax(min, max));\n this.min = min;\n this.max = max;\n this.size = max - min;\n }\n minmax(min = null, max = null) {\n min = min === null ? this.rect.left : min;\n max = max === null ? this.rect.right : max;\n return {\n min,\n max\n };\n }\n relative(to) {\n return new Offset(this.el, this.min - to.min, this.max - to.min);\n }\n}\nclass Card extends Offset {\n constructor(el, index) {\n super(el);\n this.index = index;\n }\n visible(viewportOffset) {\n return viewportOffset.min <= this.min && viewportOffset.max >= this.max;\n }\n}\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\n setup() {\n return {\n viewport: (0,vue__WEBPACK_IMPORTED_MODULE_1__.ref)(null),\n container: (0,vue__WEBPACK_IMPORTED_MODULE_1__.ref)(null)\n };\n },\n data() {\n return {\n cards: [],\n index: 0,\n refresh_: 0\n };\n },\n props: {\n cardSelector: {\n type: String,\n default: ''\n },\n containerClass: {\n type: String,\n default: ''\n },\n buttonClass: {\n type: String,\n default: 'button'\n },\n leftButtonIcon: {\n type: String,\n default: \"fas fa-chevron-left\"\n },\n rightButtonIcon: {\n type: String,\n default: \"fas fa-chevron-right\"\n }\n },\n computed: {\n card() {\n return this.cards()[this.index];\n },\n /*showPrevButton() {\n return this.index > 0\n },\n showNextButton() {\n if(!this.cards || this.cards.length <= 1)\n return false\n let { count } = this.visibility\n return (this.index + count) < this.cards.length\n },*/\n\n bullets() {\n if (!this.cards || !this.$refs.viewport) return [];\n let contOff = new Offset(this.$refs.container);\n let viewMax = new Offset(this.$refs.viewport).size;\n let bullets = [];\n let i = 0;\n let max = viewMax;\n bullets.push(i);\n while (i < this.cards.length) {\n // skip until next view\n for (; i < this.cards.length; i++) {\n let card = this.cards[i].relative(contOff);\n if (card.max > max) {\n max = card.min + viewMax;\n bullets.push(i);\n i++;\n break;\n }\n }\n }\n return bullets;\n }\n },\n methods: {\n getCards() {\n if (!this.$refs.container) return [];\n let nodes = !this.cardSelector ? [...this.$refs.container.children] : [...this.$refs.container.querySelectorAll(this.cardSelector)];\n return nodes.map((el, index) => new Card(el, index));\n },\n select(index, relative = false) {\n if (relative) index = this.index + index;\n index = Math.min(index, this.cards.length);\n index = Math.max(index, 0);\n let card = this.cards[index];\n if (!card) return null;\n card = new Card(card.el);\n const cont = new Offset(this.$refs.container);\n const rel = card.relative(cont);\n this.$refs.container.style.marginLeft = `-${rel.min}px`;\n this.index = index;\n return card.el;\n },\n refresh() {\n this.cards = this.getCards();\n this.select(this.index);\n this.refresh_++;\n }\n },\n mounted() {\n this.observers = [new MutationObserver(() => this.refresh()), new ResizeObserver(() => this.refresh())];\n this.observers[0].observe(this.$refs.container, {\n \"childList\": true\n });\n this.observers[1].observe(this.$refs.container);\n this.refresh();\n },\n unmounted() {\n for (var observer of this.observers) observer.disconnect();\n }\n});\n\n//# sourceURL=webpack://aircox-assets/./src/components/ACarousel.vue?./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use%5B0%5D!./node_modules/vue-loader/dist/index.js??ruleSet%5B0%5D.use%5B0%5D"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! core-js/modules/es.array.push.js */ \"./node_modules/core-js/modules/es.array.push.js\");\n/* harmony import */ var core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.esm-bundler.js\");\n\n\nclass Offset {\n constructor(el, min = null, max = null) {\n this.el = el;\n this.rect = el.getBoundingClientRect();\n ({\n min,\n max\n } = this.minmax(min, max));\n this.min = min;\n this.max = max;\n this.size = max - min;\n }\n minmax(min = null, max = null) {\n min = min === null ? this.rect.left : min;\n max = max === null ? this.rect.right : max;\n return {\n min,\n max\n };\n }\n relative(to) {\n return new Offset(this.el, this.min - to.min, this.max - to.min);\n }\n}\nclass Card extends Offset {\n constructor(el, index) {\n super(el);\n this.index = index;\n }\n visible(viewportOffset) {\n return viewportOffset.min <= this.min && viewportOffset.max >= this.max;\n }\n}\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\n setup() {\n return {\n viewport: (0,vue__WEBPACK_IMPORTED_MODULE_1__.ref)(null),\n container: (0,vue__WEBPACK_IMPORTED_MODULE_1__.ref)(null)\n };\n },\n data() {\n return {\n cards: [],\n index: 0,\n refresh_: 0\n };\n },\n props: {\n cardSelector: {\n type: String,\n default: ''\n },\n containerClass: {\n type: String,\n default: ''\n },\n buttonClass: {\n type: String,\n default: 'button'\n },\n leftButtonIcon: {\n type: String,\n default: \"fas fa-chevron-left\"\n },\n rightButtonIcon: {\n type: String,\n default: \"fas fa-chevron-right\"\n }\n },\n computed: {\n card() {\n return this.cards()[this.index];\n },\n showPrev() {\n return this.index > 0;\n },\n showNext() {\n if (!this.cards || this.cards.length <= 1) return false;\n let last = this.bullets[this.bullets.length - 1];\n return this.index != last;\n },\n bullets() {\n if (!this.cards || !this.$refs.viewport) return [];\n let contOff = new Offset(this.$refs.container);\n let viewMax = new Offset(this.$refs.viewport).size;\n let bullets = [];\n let i = 0;\n let max = viewMax;\n bullets.push(i);\n while (i < this.cards.length) {\n // skip until next view\n for (; i < this.cards.length; i++) {\n let card = this.cards[i].relative(contOff);\n if (card.max > max) {\n max = card.min + viewMax;\n bullets.push(i);\n i++;\n break;\n }\n }\n }\n return bullets;\n }\n },\n methods: {\n getCards() {\n if (!this.$refs.container) return [];\n let nodes = !this.cardSelector ? [...this.$refs.container.children] : [...this.$refs.container.querySelectorAll(this.cardSelector)];\n return nodes.map((el, index) => new Card(el, index));\n },\n select(index, relative = false) {\n if (relative) index = this.index + index;\n index = Math.min(index, this.cards.length);\n index = Math.max(index, 0);\n let card = this.cards[index];\n if (!card) return null;\n card = new Card(card.el);\n const cont = new Offset(this.$refs.container);\n const rel = card.relative(cont);\n this.$refs.container.style.marginLeft = `-${rel.min}px`;\n this.index = index;\n return card.el;\n },\n next() {\n let n = this.bullets.indexOf(this.index);\n let index = this.bullets[n + 1];\n this.select(index);\n },\n prev() {\n let n = this.bullets.indexOf(this.index);\n let index = this.bullets[n - 1];\n this.select(index);\n },\n refresh() {\n this.cards = this.getCards();\n this.select(this.index);\n this.refresh_++;\n }\n },\n mounted() {\n this.observers = [new MutationObserver(() => this.refresh()), new ResizeObserver(() => this.refresh())];\n this.observers[0].observe(this.$refs.container, {\n \"childList\": true\n });\n this.observers[1].observe(this.$refs.container);\n this.refresh();\n },\n unmounted() {\n for (var observer of this.observers) observer.disconnect();\n }\n});\n\n//# sourceURL=webpack://aircox-assets/./src/components/ACarousel.vue?./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use%5B0%5D!./node_modules/vue-loader/dist/index.js??ruleSet%5B0%5D.use%5B0%5D"); /***/ }), @@ -205,7 +205,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac \***********************************************************************************************************************************************************************************************************************************************************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ render: function() { return /* binding */ render; }\n/* harmony export */ });\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.esm-bundler.js\");\n\nconst _withScopeId = n => ((0,vue__WEBPACK_IMPORTED_MODULE_0__.pushScopeId)(\"data-v-b79f173e\"), n = n(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.popScopeId)(), n);\nconst _hoisted_1 = {\n class: \"a-carousel\"\n};\nconst _hoisted_2 = {\n ref: \"viewport\",\n class: \"a-carousel-viewport\"\n};\nconst _hoisted_3 = {\n class: \"a-carousel-bullets-container\"\n};\nconst _hoisted_4 = [\"onClick\"];\nconst _hoisted_5 = {\n key: 0,\n class: \"fa fa-circle\"\n};\nconst _hoisted_6 = {\n key: 1,\n class: \"far fa-circle\"\n};\nfunction render(_ctx, _cache, $props, $setup, $data, $options) {\n return (0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"section\", _hoisted_1, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"nav\", _hoisted_2, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"section\", {\n ref: \"container\",\n class: (0,vue__WEBPACK_IMPORTED_MODULE_0__.normalizeClass)(['a-carousel-container', $props.containerClass])\n }, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.renderSlot)(_ctx.$slots, \"default\", {}, undefined, true)], 2 /* CLASS */)], 512 /* NEED_PATCH */), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"nav\", _hoisted_3, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(\" \\n \\n \"), $options.bullets.length > 1 ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(true), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(vue__WEBPACK_IMPORTED_MODULE_0__.Fragment, {\n key: 0\n }, (0,vue__WEBPACK_IMPORTED_MODULE_0__.renderList)($options.bullets, bullet => {\n return (0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"span\", {\n class: \"icon bullet\",\n key: bullet,\n onClick: $event => $options.select(bullet)\n }, [bullet == $data.index ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"i\", _hoisted_5)) : ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"i\", _hoisted_6))], 8 /* PROPS */, _hoisted_4);\n }), 128 /* KEYED_FRAGMENT */)) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(\"v-if\", true), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(\" \\n \\n \"), (0,vue__WEBPACK_IMPORTED_MODULE_0__.renderSlot)(_ctx.$slots, \"bullets-right\", {\n vBind: this\n }, undefined, true)])]);\n}\n\n//# sourceURL=webpack://aircox-assets/./src/components/ACarousel.vue?./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use%5B0%5D!./node_modules/vue-loader/dist/templateLoader.js??ruleSet%5B1%5D.rules%5B3%5D!./node_modules/vue-loader/dist/index.js??ruleSet%5B0%5D.use%5B0%5D"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ render: function() { return /* binding */ render; }\n/* harmony export */ });\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.esm-bundler.js\");\n\nconst _withScopeId = n => ((0,vue__WEBPACK_IMPORTED_MODULE_0__.pushScopeId)(\"data-v-b79f173e\"), n = n(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.popScopeId)(), n);\nconst _hoisted_1 = {\n class: \"a-carousel\"\n};\nconst _hoisted_2 = {\n ref: \"viewport\",\n class: \"a-carousel-viewport\"\n};\nconst _hoisted_3 = {\n class: \"a-carousel-bullets-container\"\n};\nconst _hoisted_4 = {\n class: \"left\"\n};\nconst _hoisted_5 = [\"onClick\"];\nconst _hoisted_6 = {\n key: 0,\n class: \"fa fa-circle\"\n};\nconst _hoisted_7 = {\n key: 1,\n class: \"far fa-circle\"\n};\nconst _hoisted_8 = {\n class: \"right\"\n};\nfunction render(_ctx, _cache, $props, $setup, $data, $options) {\n return (0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"section\", _hoisted_1, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"nav\", _hoisted_2, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"section\", {\n ref: \"container\",\n class: (0,vue__WEBPACK_IMPORTED_MODULE_0__.normalizeClass)(['a-carousel-container', $props.containerClass])\n }, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.renderSlot)(_ctx.$slots, \"default\", {}, undefined, true)], 2 /* CLASS */)], 512 /* NEED_PATCH */), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"nav\", _hoisted_3, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", _hoisted_4, [$options.showPrev ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"span\", {\n key: 0,\n class: \"icon bullet\",\n onClick: _cache[0] || (_cache[0] = $event => $options.prev())\n }, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"i\", {\n class: (0,vue__WEBPACK_IMPORTED_MODULE_0__.normalizeClass)($props.leftButtonIcon)\n }, null, 2 /* CLASS */)])) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(\"v-if\", true)]), $options.bullets.length > 1 ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(true), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(vue__WEBPACK_IMPORTED_MODULE_0__.Fragment, {\n key: 0\n }, (0,vue__WEBPACK_IMPORTED_MODULE_0__.renderList)($options.bullets, bullet => {\n return (0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"span\", {\n class: \"icon bullet\",\n key: bullet,\n onClick: $event => $options.select(bullet)\n }, [bullet == $data.index ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"i\", _hoisted_6)) : ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"i\", _hoisted_7))], 8 /* PROPS */, _hoisted_5);\n }), 128 /* KEYED_FRAGMENT */)) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(\"v-if\", true), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", _hoisted_8, [$options.showNext ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"span\", {\n key: 0,\n class: \"icon bullet\",\n onClick: _cache[1] || (_cache[1] = $event => $options.next())\n }, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"i\", {\n class: (0,vue__WEBPACK_IMPORTED_MODULE_0__.normalizeClass)($props.rightButtonIcon)\n }, null, 2 /* CLASS */)])) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(\"v-if\", true)]), (0,vue__WEBPACK_IMPORTED_MODULE_0__.renderSlot)(_ctx.$slots, \"bullets-right\", {\n vBind: this\n }, undefined, true)])]);\n}\n\n//# sourceURL=webpack://aircox-assets/./src/components/ACarousel.vue?./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use%5B0%5D!./node_modules/vue-loader/dist/templateLoader.js??ruleSet%5B1%5D.rules%5B3%5D!./node_modules/vue-loader/dist/index.js??ruleSet%5B0%5D.use%5B0%5D"); /***/ }), diff --git a/aircox/templates/aircox/base.html b/aircox/templates/aircox/base.html index e9916ae..71bd1a7 100644 --- a/aircox/templates/aircox/base.html +++ b/aircox/templates/aircox/base.html @@ -95,9 +95,9 @@ Usefull context:
{% block header %} {% if cover %} -
- -
+
+ +
{% endif %}
{% block headings %} diff --git a/aircox/templates/aircox/page_detail.html b/aircox/templates/aircox/page_detail.html index c133f3f..ebd69f6 100644 --- a/aircox/templates/aircox/page_detail.html +++ b/aircox/templates/aircox/page_detail.html @@ -60,9 +60,7 @@ Context:

{% translate "Comments" %}

{% for object in comments %} -
- {% page_widget "item" object %} -
+ {% page_widget "item" object %} {% endfor %} {% endif %} diff --git a/aircox/templates/aircox/widgets/comment.html b/aircox/templates/aircox/widgets/comment.html index f28af67..7595708 100644 --- a/aircox/templates/aircox/widgets/comment.html +++ b/aircox/templates/aircox/widgets/comment.html @@ -2,17 +2,18 @@ {% load i18n humanize aircox %} {% block tag-class %}{{ block.super }} comment{% endblock %} +{% block tag-extra %} id="comment-{{ object.pk }}"{% endblock %} {% block outer %} +{% with url=object.get_absolute_url %} {% if with_title %} - {% with url=object.get_absolute_url %} {{ block.super }} {{ block.super }} - {% endwith %} {% else %} {{ block.super }} {{ block.super }} {% endif %} +{% endwith %} {% endblock %} diff --git a/assets/src/assets/common.scss b/assets/src/assets/common.scss index 4b67258..d419e6c 100644 --- a/assets/src/assets/common.scss +++ b/assets/src/assets/common.scss @@ -69,13 +69,6 @@ body { } } -section > .toolbar { - background-color: rgba(0,0,0,0.05); - padding: 1em; - margin-bottom: 1.5em; -} - - h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle { font-family: var(--heading-font-family); } diff --git a/assets/src/assets/components.scss b/assets/src/assets/components.scss index 75805a5..40d5368 100644 --- a/assets/src/assets/components.scss +++ b/assets/src/assets/components.scss @@ -53,16 +53,15 @@ --a-playlist-item-border: 1px var(--secondary-color) solid; --a-sound-bg: var(--main-color); - --a-sound-hv-bg: var(--main-color-light); - --a-sound-btn-hv-fg: var(--secondary-color); - --a-sound-playing-fg: var(--secondary-color-dark); + --a-sound-hv-bg: var(--main-color); --a-sound-hv-fg: var(--secondary-color); + --a-sound-playing-fg: var(--secondary-color-dark); --a-sound-text-sz: #{v.$text-size}; --a-player-url-fg: var(--text-color); - --a-player-panel-bg: var(--hg-color); + --a-player-panel-bg: var(--main-color); --a-player-bar-height: var(--nav-primary-height); - --a-player-bar-bg: var(--hg-color); + --a-player-bar-bg: var(--main-color); --a-player-bar-title-alone-sz: #{v.$text-size-medium}; --a-player-bar-button-fg: var(--button-fg); --a-player-bar-button-fg: var(--button-bg); @@ -348,7 +347,8 @@ font-size: var(--preview-title-sz); // background-color: var(--preview-heading-bg-color); text-align: right; - min-width: 9rem; + + &:not(:empty) { min-width: 9rem; } } .media-content { @@ -483,7 +483,8 @@ .a-carousel-viewport { box-shadow: inset 0em 0em 20rem var(--a-carousel-bg); // background-color: var(--a-carousel-bg); - padding: var(--a-carousel-p) 0; + padding: 0rem; + padding-top: var(--a-carousel-p); margin-top: calc( 0rem - var(--a-carousel-p) ); } } @@ -504,6 +505,9 @@ .bullet { margin: v.$mp-1; + cursor: pointer; + + &:hover { color: var(--link-fg); } } } @@ -618,7 +622,7 @@ font-size: var(--a-sound-text-sz); &:hover { - color: var(--a-sound-btn-hv-fg) !important; + color: var(--a-sound-hv-fg) !important; background-color: unset; } } diff --git a/assets/src/assets/public.scss b/assets/src/assets/public.scss index e5f5d11..a62da25 100644 --- a/assets/src/assets/public.scss +++ b/assets/src/assets/public.scss @@ -33,6 +33,10 @@ } } + + *[data-oembed-url] { + clear: both; + } } @@ -56,6 +60,8 @@ display: inline-block; margin: v.$mp-3; margin-left: 0rem; + padding: v.$mp-2; + border-bottom: 1px var(--main-color) solid; .heading { padding: 0em; @@ -389,17 +395,41 @@ nav li { position: relative; z-index: 1000; background-color: var(--body-bg); - - height: var(--header-height); - max-width: calc(var(--header-height) * 2); margin: 0 0 v.$mp-4 v.$mp-4; - img { width: 100%; height: 100%; } + .cover { + max-width: calc(var(--header-height) * 2); + height: var(--header-height); + } } .header-cover:only-child { with: 100%; } +@media screen and (max-width: v.$screen-small) { + .container.header { + width: calc( 100% - v.$mp-2 ); + + .headings { + width: 100%; + clear: both; + } + + .header-cover { + float: none; + margin: 0; + text-align: center; + } + + .cover { + margin-left: auto; + margin-right: auto; + max-height: calc(var(--cover-h) * 1); + max-width: calc(var(--cover-w) * 2); + } + } +} + // ---- ---- detail .page-content { @@ -456,22 +486,4 @@ body { font-size: 1.4em; } margin-right: v.$mp-2; } - .container.header { - width: calc( 100% - v.$mp-2 ); - - .headings { - width: 100%; - clear: both; - } - - .header-cover { - float: none; - width: 100%; - max-width: unset; - height: unset; - margin-left: 0rem; - margin-right: 0rem; - } - } - } diff --git a/assets/src/components/ACarousel.vue b/assets/src/components/ACarousel.vue index f588094..5ee0611 100644 --- a/assets/src/components/ACarousel.vue +++ b/assets/src/components/ACarousel.vue @@ -7,18 +7,22 @@ @@ -46,7 +50,6 @@ } .a-carousel-bullets-container { - justify-content: center; flex-grow: 1; } @@ -54,7 +57,13 @@ cursor: pointer; } -.a-carousel-bullets-container .bullet-right { +.a-carousel-bullets-container .left { + min-width: 2rem; + margin-right: auto; +} + +.a-carousel-bullets-container .right { + min-width: 2rem; margin-left: auto; } @@ -128,17 +137,17 @@ export default { computed: { card() { return this.cards()[this.index] }, - /*showPrevButton() { + showPrev() { return this.index > 0 }, - showNextButton() { + showNext() { if(!this.cards || this.cards.length <= 1) return false - let { count } = this.visibility - return (this.index + count) < this.cards.length - },*/ + let last = this.bullets[this.bullets.length-1] + return this.index != last + }, bullets() { if(!this.cards || !this.$refs.viewport) @@ -195,6 +204,18 @@ export default { return card.el }, + next() { + let n = this.bullets.indexOf(this.index) + let index = this.bullets[n+1] + this.select(index) + }, + + prev() { + let n = this.bullets.indexOf(this.index) + let index = this.bullets[n-1] + this.select(index) + }, + refresh() { this.cards = this.getCards() this.select(this.index)