diff --git a/build/webpack.config.js b/build/webpack.config.js index 8d72b4c..4dc6077 100644 --- a/build/webpack.config.js +++ b/build/webpack.config.js @@ -102,8 +102,7 @@ module.exports = (env, argv) => { new CopyWebpackPlugin({ patterns: [ { from: path.resolve(LIB, 'index.php'), to: 'index.php' }, - { from: path.resolve(SRC, 'images', 'logo_title.svg'), to: 'images' }, - { from: path.resolve(SRC, 'images', 'spot-logo-only.svg'), to: 'images' } + { from: path.resolve(SRC, 'images', 'logo_title.svg'), to: 'images' } ] }), new SymlinkWebpackPlugin([ diff --git a/src/components/projectSettings.vue b/src/components/projectSettings.vue index 5089c7b..61721fd 100644 --- a/src/components/projectSettings.vue +++ b/src/components/projectSettings.vue @@ -25,7 +25,7 @@ export default { }; }, emits: ['update:baseMap', 'update:projectCodeName', 'toggle'], - inject: ['api', 'lang', 'user', 'consts', 'isMobile'], + inject: ['api', 'lang', 'user', 'consts', 'isMobile', 'hash'], computed: { project() { return this.projects.find((project) => project.codename == this.projectCodeName); @@ -77,9 +77,10 @@ export default {
- -
-

{{ lang.get('feed.last_update')+' '+lastUpdate.relative_time }}

+ + +
+
diff --git a/src/components/spotIcon.vue b/src/components/spotIcon.vue index 4109411..f054d76 100644 --- a/src/components/spotIcon.vue +++ b/src/components/spotIcon.vue @@ -70,7 +70,7 @@ export default { .spot-icon-with-text { display: inline-flex; align-items: flex-start; - gap: var.$elem-spacing; + gap: var.$text-spacing; .spot-icon-symbol { flex: 0 0 auto; @@ -85,11 +85,11 @@ export default { .spot-icon { &.margin-right { - margin-right: var.$elem-spacing; + margin-right: var.$text-spacing; } &.margin-left { - margin-left: var.$elem-spacing; + margin-left: var.$text-spacing; } } \ No newline at end of file diff --git a/src/images/logo_title.svg b/src/images/logo_title.svg index 31a36f0..0e1de4e 100644 --- a/src/images/logo_title.svg +++ b/src/images/logo_title.svg @@ -1,62 +1,13 @@ - + LiveTrail - + - THERE AND BACK AGAIN + - Live - Trail - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + diff --git a/src/images/source/logo_icon_inkscape.svg b/src/images/source/logo_icon_inkscape.svg new file mode 100644 index 0000000..90ae56b --- /dev/null +++ b/src/images/source/logo_icon_inkscape.svg @@ -0,0 +1,293 @@ + + + LiveTrail + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + LiveTrail + + + Franzz + + + + + + + + + + + + + + diff --git a/src/images/source/logo_icon_waves_inkscape.svg b/src/images/source/logo_icon_waves_inkscape.svg new file mode 100644 index 0000000..8623f72 --- /dev/null +++ b/src/images/source/logo_icon_waves_inkscape.svg @@ -0,0 +1,318 @@ + + + LiveTrail + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + LiveTrail + + + Franzz + + + + + + + + + + + + + + diff --git a/src/images/source/logo_title_inkscape.svg b/src/images/source/logo_title_inkscape.svg index fa09ace..e38120e 100644 --- a/src/images/source/logo_title_inkscape.svg +++ b/src/images/source/logo_title_inkscape.svg @@ -1,7 +1,7 @@ + transform="translate(-417.7627,-414.44122)"> Trail - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/src/images/spot-logo-only.svg b/src/images/spot-logo-only.svg deleted file mode 100644 index 3be44bf..0000000 --- a/src/images/spot-logo-only.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/src/scripts/icons.js b/src/scripts/icons.js index 8a79665..e4414a4 100644 --- a/src/scripts/icons.js +++ b/src/scripts/icons.js @@ -69,6 +69,7 @@ const faCloudSnow = customIcon('cloud-snow', 512, 512, 'f742', 'M96 320c-53 0-96 const faClouds = customIcon('clouds', 576, 512, 'e47d', 'M112.4 276.4c-5.6 3.5-11 7.4-16 11.6l-.4 0c-53 0-96-43-96-96S43 96 96 96l1.1 0c7.8-54.3 54.4-96 110.9-96 47.9 0 88.8 30.1 104.8 72.4 12-5.4 25.2-8.4 39.2-8.4 53 0 96 43 96 96 0 1.3 0 2.7-.1 4-10.2-2.6-20.9-4-31.9-4-14 0-27.4 2.2-40 6.4-27.9-23.9-64.3-38.4-104-38.4-84.4 0-153.6 65.4-159.6 148.4zM184 480c-48.6 0-88-39.4-88-88 0-40.9 27.8-75.2 65.6-85.1-1-6.1-1.6-12.4-1.6-18.9 0-61.9 50.1-112 112-112 39 0 73.3 19.9 93.3 50.1 13.8-11.3 31.4-18.1 50.7-18.1 44.2 0 80 35.8 80 80 0 .4 0 .9 0 1.3 45.4 7.6 80 47.1 80 94.7 0 53-43 96-96 96l-296 0z'); const faCommentPen = customIcon('comment-pen', 512, 512, 'f4ae', 'M256 480c141.4 0 256-107.5 256-240S397.4 0 256 0 0 107.5 0 240c0 54.3 19.2 104.3 51.6 144.5L2.8 476.8c-4.8 9-3.3 20 3.6 27.5s17.8 9.8 27.1 5.8l118.4-50.7C183.7 472.6 218.9 480 256 480zM144.4 334.3l12.3-49.4c2.1-8.4 6.5-16.2 12.6-22.3L290.7 141.3c8.5-8.5 20-13.3 32-13.3 25 0 45.3 20.3 45.3 45.3 0 12-4.8 23.5-13.3 32L233.4 326.6c-6.2 6.2-13.9 10.5-22.3 12.6l-49.4 12.3c-1.1 .3-2.3 .4-3.5 .4-7.9 0-14.2-6.4-14.2-14.2 0-1.2 .1-2.3 .4-3.5z'); const faMoonStars = customIcon('moon-stars', 512, 512, 'f755', 'M439.8 89.8c1 3.6 4.4 6.2 8.2 6.2s7.1-2.5 8.2-6.2l11-38.6 38.6-11c3.6-1 6.2-4.4 6.2-8.2s-2.5-7.1-6.2-8.2l-38.6-11-11-38.6c-1-3.6-4.4-6.2-8.2-6.2s-7.1 2.5-8.2 6.2l-11 38.6-38.6 11c-3.6 1-6.2 4.4-6.2 8.2s2.5 7.1 6.2 8.2l38.6 11 11 38.6zM224 64C100.3 64 0 164.3 0 288S100.3 512 224 512c60.2 0 114.9-23.8 155.1-62.4 6.4-6.1 8.2-15.7 4.6-23.8s-12-13-20.8-12.3c-4.3 .3-8.6 .5-12.9 .5-88.9 0-161-72.1-161-161 0-63.1 36.3-117.8 89.3-144.2 7.9-4 12.6-12.5 11.5-21.3s-7.6-16-16.2-18C257.6 65.9 241 64 224 64zM355.2 268.8l16.6 58c1.6 5.5 6.6 9.2 12.2 9.2s10.7-3.8 12.2-9.2l16.6-58 58-16.6c5.5-1.6 9.2-6.6 9.2-12.2s-3.8-10.7-9.2-12.2l-58-16.6-16.6-58c-1.6-5.5-6.6-9.2-12.2-9.2s-10.7 3.8-12.2 9.2l-16.6 58-58 16.6c-5.5 1.6-9.2 6.6-9.2 12.2s3.8 10.7 9.2 12.2l58 16.6z'); +const findMeSpot = customIcon('find-me-spot', 406, 469, 'e900', 'M85.806 195.8c-1-0.8-1.3-2.3-0.6-3.4 11.1-18.2 56.5-85.8 117.3-85.8 49.6 0 90.4 33.4 110.3 53.3 1.2 1.2 2.9 1.9 4.6 1.9s3.4-0.7 4.6-1.9l16.4-16.3c1-1 1.1-2.5 0.2-3.5-5.1-6.1-15.3-17.2-29.8-28.2-31.7-24.1-67.5-36.3-106.3-36.3-79.4 0-129.8 75.4-142.3 96.5-0.8 1.4-2.6 1.7-3.8 0.7l-55.4-43.6c-1-0.8-1.3-2.2-0.7-3.3 5.9-10.8 23-39.4 48.5-63.7 42.8-40.7 95.1-62.2 151.4-62.2 56 0 109.2 18.9 153.9 54.8 27.3 21.9 45.5 43.2 51.3 50.4 0.8 1 0.7 2.5-0.2 3.5l-12.3 12.2c-1.1 1.1-2.9 1-3.8-0.2-7.3-8.9-26.2-30.5-49.7-49.2-41.1-32.7-88-49.2-139.2-49.2-50.9 0-96.5 18.6-135.4 55.4-20.9 19.7-30.4 34.1-35.6 42.3-0.7 1.1-0.5 2.6 0.6 3.5l16.7 13.2c1.2 0.9 2.6 1.4 4.1 1.4 2.2 0 4.2-1.1 5.4-2.9 7.4-10.7 15.9-20.6 26.8-31.1 34.3-33.1 75.7-50.6 119.9-50.6 92 0 151.2 70.7 165.3 89.4 0.8 1.1 0.7 2.5-0.3 3.4l-49.8 49.3c-1.1 1.1-2.8 1-3.8-0.1-15.9-18.1-63-66.5-111.4-66.5-23.6 0-46.6 11.3-68.4 33.5-7.2 7.3-13.9 15.6-19.9 24.4-0.8 1.1-0.5 2.7 0.6 3.6l93.1 73.2c1.1 0.9 1.3 2.5 0.4 3.7l-10.5 13.3c-0.9 1.1-2.5 1.3-3.7 0.4l-108.5-85.3z M205.91 468.9c-56 0-109.2-18.9-153.9-54.8-27.3-21.9-45.5-43.2-51.3-50.4-0.8-1-0.7-2.5 0.2-3.5l12.3-12.2c1.1-1.1 2.9-1 3.8 0.2 7.3 8.9 26.2 30.5 49.7 49.2 41.1 32.7 88 49.2 139.2 49.2 50.9 0 96.5-18.6 135.4-55.4 20.9-19.7 30.4-34.1 35.6-42.3 0.7-1.1 0.5-2.6-0.6-3.5l-16.7-13.2c-1.2-0.9-2.6-1.4-4.1-1.4-2.2 0-4.2 1.1-5.4 2.9-7.4 10.7-15.9 20.6-26.8 31.1-34.3 33.1-75.7 50.6-119.8 50.6-92 0-151.2-70.7-165.3-89.4-0.8-1.1-0.7-2.5 0.3-3.4l49.8-49.3c1.1-1.1 2.8-1 3.8 0.1 15.9 18.1 63 66.5 111.4 66.5 23.6 0 46.6-11.3 68.4-33.5 7.2-7.3 13.9-15.6 19.9-24.4 0.8-1.1 0.5-2.7-0.6-3.6l-93.1-73.2c-1.1-0.9-1.3-2.5-0.4-3.7l10.5-13.3c0.9-1.1 2.5-1.3 3.7-0.4l108.3 85.2c1 0.8 1.3 2.3 0.6 3.4-11.1 18.2-56.5 85.8-117.3 85.8-49.6 0-90.4-33.4-110.3-53.3-1.2-1.2-2.9-1.9-4.6-1.9s-3.4 0.7-4.6 1.9l-16.4 16.3c-1 1-1.1 2.5-0.2 3.5 5.1 6.1 15.3 17.2 29.8 28.2 31.7 24.1 67.5 36.3 106.3 36.3 79.4 0 129.8-75.4 142.3-96.5 0.8-1.4 2.6-1.7 3.8-0.7l55.4 43.6c1 0.8 1.3 2.2 0.7 3.3-5.9 10.8-23 39.4-48.5 63.7-42.6 40.8-95 62.3-151.3 62.3z'); const ICONS = { /* Navigation */ @@ -128,6 +129,7 @@ const ICONS = { 'image-shot': faCamera, link: faLink, copied: faCheck, + 'find-me-spot': findMeSpot, /* Feed - Poster */ poster: faCommentPen, diff --git a/src/styles/_color.scss b/src/styles/_color.scss index 09bee43..9a169ed 100644 --- a/src/styles/_color.scss +++ b/src/styles/_color.scss @@ -18,6 +18,7 @@ $main: #335918; $sub: #081B19; $flashy: #11DB6D; $night: #071E26; +$spot: #F18A00; //Feed colors $post-input-bg: #ffffff; diff --git a/src/styles/_page.project.panel.settings.scss b/src/styles/_page.project.panel.settings.scss index ac383af..863aebf 100644 --- a/src/styles/_page.project.panel.settings.scss +++ b/src/styles/_page.project.panel.settings.scss @@ -14,56 +14,35 @@ } .settings-header { - text-align: center; + display: flex; + flex-direction: column; + align-items: center; + gap: var.$elem-spacing; + padding: var.$block-spacing; + background: + radial-gradient( + circle farthest-side at center bottom, + color.$default-bg-light 40%, + sass-color.adjust(color.$default-bg-light, $alpha: -0.3) 100% + ), + url(../images/logo_bg.webp) + 50% 50%; - .logo { - display: block; - border-radius: var.$block-radius; - padding: var.$block-spacing; - background: - radial-gradient( - circle farthest-side at center bottom, - color.$default-bg-light 40%, - sass-color.adjust(color.$default-bg-light, $alpha: -0.3) 100% - ), - url(../images/logo_bg.webp) - 50% 50% - ; - - &:has(+ .last_update) { - padding-bottom: 3 * var.$block-spacing; - } - - img { - width: 65%; - } + .logo-icon { + width: 40%; + } + .logo-title { + width: 70%; } .last_update { - position: absolute; - margin-top: -3 * var.$block-spacing; - line-height: 3 * var.$block-spacing; - padding: 0 var.$block-spacing; - width: calc(100% - 2 * var.$block-spacing); + margin-top: var.$block-spacing - var.$elem-spacing; //Gap counts for 1 $elem-spacing + font-size: 0.8em; + color: color.$subtitle; - p { - font-size: 0.8em; - margin: 0; - color: color.$subtitle; - - span { - margin-right: var.$elem-spacing; - img { - width: 12px; - vertical-align: center; - animation: spin 20s infinite; - } - } - - abbr { - text-decoration: none; - vertical-align: center; - } + .find-me-spot { + color: color.$spot; + animation: spin 20s infinite; } } }