Simon/romm
1
0
Fork 0
mirror of https://github.com/rommapp/romm.git synced 2026-06-28 14:56:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

a ton of other changes

Browse Source
This commit is contained in:
Georges-Antoine Assi
2025-01-07 22:53:56 -05:00
parent c48c27a096
commit 38e85c8182
107 changed files with 363 additions and 627 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/assets/logos/romm_logo_ps2_circle.svg
View File

@@ -1,27 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="1024" height="1024" viewBox="0 0 270.933 270.933">
<defs>
<clipPath clipPathUnits="userSpaceOnUse" id="main-clip">
<ellipse style="fill:none" cx="514.154" cy="512.52" rx="255.965" ry="255.986"/>
</clipPath>
<clipPath clipPathUnits="userSpaceOnUse" id="logo-clip">
<ellipse style="fill:none" cx="136.664" cy="135.457" rx="135.447" ry="135.458"/>
</clipPath>
<clipPath clipPathUnits="userSpaceOnUse" id="elements-clip">
<ellipse style="fill:none" cx="511.887" cy="512.519" rx="255.965" ry="255.986"/>
</clipPath>
</defs>
<g clip-path="url(#main-clip)" transform="translate(-136.606 -135.75)scale(.52916)">
<path class="background-light" style="fill:#ede5f8;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" d="M258.225 256.532h511.892v511.976H258.225z"/>
<path class="background-dark" style="fill:#bea4e1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" d="M770.12 256.537 258.227 768.43v.08H770.12z"/>
</g>
<g clip-path="url(#logo-clip)" style="display:inline" transform="translate(-1.2)">
<path class="logo-primary" style="fill:#553e98;fill-opacity:1;stroke-width:.529163" d="M107.995 57.13c1.73.01 3.364-.69 3.768-2.723.033-.168.954-4.76 1.828-10.335 2.114-13.496 2.258-14.034 4.357-16.33.93-1.018 2.158-2.311 2.873-2.581 21.252-8.012 44.259-6.475 59.865-2.615 1.044.258 2.348 1.17 3.004 1.697 1.594 1.281 3.859 4.39 4.502 6.182.664 1.845 2.552 10.261 3.783 16.855l.951 5.098c19.002 12.53 38.002 33.273 38.002 66.139 0 3.905.826 10.024 7.712 57.139 11.304 77.349 11.18 76.379 11.184 87.361-.16 5.897-.418 7.918-.43 7.918-5.057.002-91.488-.056-102.127 0-.95.005-16.078-27.841-20.79-36.368l-4.833-2.92c-3.032 3.51-6.39 6.308-11.03 9.19-9.117 5.663-18.838 8.35-28.642 7.916-5.063-.223-8.059-.79-13.195-2.496-15.15-5.031-27.413-16.434-31.838-29.605l-.953-2.835-34.751-.003s-.024-4.123-.002-156.684z"/>
<path class="logo-secondary" style="fill:#371f69;fill-opacity:1;stroke-width:.529163" d="M207.816 64.307 43.529 228.593c6.075 7.852 14.96 14.244 25.248 17.661 5.137 1.706 8.133 2.273 13.196 2.497 9.803.433 19.525-2.254 28.643-7.917 4.64-2.881 7.997-5.68 11.029-9.19l4.832 2.92c4.713 8.527 19.84 36.373 20.791 36.368 10.638-.055 97.07.001 102.127 0 .012 0 .269-2.02.43-7.918-.005-10.982.12-10.012-11.185-87.36-6.885-47.116-7.71-53.234-7.71-57.14 0-24.063-10.2-41.607-23.114-54.207"/>
</g>
<g clip-path="url(#elements-clip)" style="display:inline" transform="translate(-135.407 -135.75)scale(.52916)">
<circle class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="546.499" cy="406.565" r="31.529"/>
<circle class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="474.097" cy="477.116" r="31.529"/>
<circle class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="617.882" cy="477.435" r="31.529"/>
<circle class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="547.116" cy="552.273" r="31.529"/>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="1024" height="1024" viewBox="0 0 270.933 270.933"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><ellipse cx="514.154" cy="512.52" rx="255.965" ry="255.986" style="fill:none"/></clipPath><clipPath id="b" clipPathUnits="userSpaceOnUse"><ellipse cx="136.664" cy="135.457" rx="135.447" ry="135.458" style="fill:none"/></clipPath><clipPath id="c" clipPathUnits="userSpaceOnUse"><ellipse cx="511.887" cy="512.519" rx="255.965" ry="255.986" style="fill:none"/></clipPath></defs><g clip-path="url(#a)" transform="translate(-136.606 -135.75)scale(.52916)"><path d="M258.225 256.532h511.892v511.976H258.225z" class="background-light" style="fill:#ede5f8;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><path d="M770.12 256.537 258.227 768.43v.08H770.12z" class="background-dark" style="fill:#bea4e1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/></g><g clip-path="url(#b)" style="display:inline" transform="translate(-1.2)"><path d="M107.995 57.13c1.73.01 3.364-.69 3.768-2.723.033-.168.954-4.76 1.828-10.335 2.114-13.496 2.258-14.034 4.357-16.33.93-1.018 2.158-2.311 2.873-2.581 21.252-8.012 44.259-6.475 59.865-2.615 1.044.258 2.348 1.17 3.004 1.697 1.594 1.281 3.859 4.39 4.502 6.182.664 1.845 2.552 10.261 3.783 16.855l.951 5.098c19.002 12.53 38.002 33.273 38.002 66.139 0 3.905.826 10.024 7.712 57.139 11.304 77.349 11.18 76.379 11.184 87.361-.16 5.897-.418 7.918-.43 7.918-5.057.002-91.488-.056-102.127 0-.95.005-16.078-27.841-20.79-36.368l-4.833-2.92c-3.032 3.51-6.39 6.308-11.03 9.19-9.117 5.663-18.838 8.35-28.642 7.916-5.063-.223-8.059-.79-13.195-2.496-15.15-5.031-27.413-16.434-31.838-29.605l-.953-2.835-34.751-.003s-.024-4.123-.002-156.684z" class="logo-primary" style="fill:#553e98;fill-opacity:1;stroke-width:.529163"/><path d="M207.816 64.307 43.529 228.593c6.075 7.852 14.96 14.244 25.248 17.661 5.137 1.706 8.133 2.273 13.196 2.497 9.803.433 19.525-2.254 28.643-7.917 4.64-2.881 7.997-5.68 11.029-9.19l4.832 2.92c4.713 8.527 19.84 36.373 20.791 36.368 10.638-.055 97.07.001 102.127 0 .012 0 .269-2.02.43-7.918-.005-10.982.12-10.012-11.185-87.36-6.885-47.116-7.71-53.234-7.71-57.14 0-24.063-10.2-41.607-23.114-54.207" class="logo-secondary" style="fill:#371f69;fill-opacity:1;stroke-width:.529163"/></g><g clip-path="url(#c)" style="display:inline" transform="translate(-135.407 -135.75)scale(.52916)"><circle cx="546.499" cy="406.565" r="31.529" class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="474.097" cy="477.116" r="31.529" class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="617.882" cy="477.435" r="31.529" class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="547.116" cy="552.273" r="31.529" class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.2 KiB

After

Width:  |  Height:  |  Size: 3.0 KiB

17
frontend/assets/logos/romm_logo_ps2_square.svg
View File

@@ -1,16 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="1024" height="1024" viewBox="0 0 270.933 270.933">
<path class="background-light" style="fill:#ede5f8;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" transform="translate(-136.606 -135.75)scale(.52916)" d="M258.225 256.532h511.892v511.976H258.225z"/>
<path class="background-dark" style="fill:#bea4e1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" transform="translate(-136.606 -135.75)scale(.52916)" d="M770.12 256.537 258.227 768.43v.08H770.12z"/>
<g style="display:inline">
<path class="logo-primary" style="fill:#553e98;fill-opacity:1;stroke-width:.529163" transform="translate(-1.2)" d="M107.995 57.13c1.73.01 3.364-.69 3.768-2.723.033-.168.954-4.76 1.828-10.335 2.114-13.496 2.258-14.034 4.357-16.33.93-1.018 2.158-2.311 2.873-2.581 21.252-8.012 44.259-6.475 59.865-2.615 1.044.258 2.348 1.17 3.004 1.697 1.594 1.281 3.859 4.39 4.502 6.182.664 1.845 2.552 10.261 3.783 16.855l.951 5.098c19.002 12.53 38.002 33.273 38.002 66.139 0 3.905.826 10.024 7.712 57.139 11.304 77.349 11.18 76.379 11.184 87.361-.16 5.897-.418 7.918-.43 7.918-5.057.002-91.488-.056-102.127 0-.95.005-16.078-27.841-20.79-36.368l-4.833-2.92c-3.032 3.51-6.39 6.308-11.03 9.19-9.117 5.663-18.838 8.35-28.642 7.916-5.063-.223-8.059-.79-13.195-2.496-15.15-5.031-27.413-16.434-31.838-29.605l-.953-2.835-34.751-.003s-.024-4.123-.002-156.684z"/>
<path class="logo-secondary" style="fill:#371f69;fill-opacity:1;stroke-width:.529163" transform="translate(-1.2)" d="M207.816 64.307 43.529 228.593c6.075 7.852 14.96 14.244 25.248 17.661 5.137 1.706 8.133 2.273 13.196 2.497 9.803.433 19.525-2.254 28.643-7.917 4.64-2.881 7.997-5.68 11.029-9.19l4.832 2.92c4.713 8.527 19.84 36.373 20.791 36.368 10.638-.055 97.07.001 102.127 0 .012 0 .269-2.02.43-7.918-.005-10.982.12-10.012-11.185-87.36-6.885-47.116-7.71-53.234-7.71-57.14 0-24.063-10.2-41.607-23.114-54.207"/>
</g>
<g style="display:inline" transform="translate(-135.407 -135.75) scale(.52916)">
<circle class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="546.499" cy="406.565" r="31.529"/>
<circle class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="474.097" cy="477.116" r="31.529"/>
<circle class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="617.882" cy="477.435" r="31.529"/>
<circle class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="547.116" cy="552.273" r="31.529"/>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="1024" height="1024" viewBox="0 0 270.933 270.933"><path d="M258.225 256.532h511.892v511.976H258.225z" class="background-light" style="fill:#ede5f8;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" transform="translate(-136.606 -135.75)scale(.52916)"/><path d="M770.12 256.537 258.227 768.43v.08H770.12z" class="background-dark" style="fill:#bea4e1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" transform="translate(-136.606 -135.75)scale(.52916)"/><g style="display:inline"><path d="M107.995 57.13c1.73.01 3.364-.69 3.768-2.723.033-.168.954-4.76 1.828-10.335 2.114-13.496 2.258-14.034 4.357-16.33.93-1.018 2.158-2.311 2.873-2.581 21.252-8.012 44.259-6.475 59.865-2.615 1.044.258 2.348 1.17 3.004 1.697 1.594 1.281 3.859 4.39 4.502 6.182.664 1.845 2.552 10.261 3.783 16.855l.951 5.098c19.002 12.53 38.002 33.273 38.002 66.139 0 3.905.826 10.024 7.712 57.139 11.304 77.349 11.18 76.379 11.184 87.361-.16 5.897-.418 7.918-.43 7.918-5.057.002-91.488-.056-102.127 0-.95.005-16.078-27.841-20.79-36.368l-4.833-2.92c-3.032 3.51-6.39 6.308-11.03 9.19-9.117 5.663-18.838 8.35-28.642 7.916-5.063-.223-8.059-.79-13.195-2.496-15.15-5.031-27.413-16.434-31.838-29.605l-.953-2.835-34.751-.003s-.024-4.123-.002-156.684z" class="logo-primary" style="fill:#553e98;fill-opacity:1;stroke-width:.529163" transform="translate(-1.2)"/><path d="M207.816 64.307 43.529 228.593c6.075 7.852 14.96 14.244 25.248 17.661 5.137 1.706 8.133 2.273 13.196 2.497 9.803.433 19.525-2.254 28.643-7.917 4.64-2.881 7.997-5.68 11.029-9.19l4.832 2.92c4.713 8.527 19.84 36.373 20.791 36.368 10.638-.055 97.07.001 102.127 0 .012 0 .269-2.02.43-7.918-.005-10.982.12-10.012-11.185-87.36-6.885-47.116-7.71-53.234-7.71-57.14 0-24.063-10.2-41.607-23.114-54.207" class="logo-secondary" style="fill:#371f69;fill-opacity:1;stroke-width:.529163" transform="translate(-1.2)"/></g><g style="display:inline" transform="translate(-135.407 -135.75)scale(.52916)"><circle cx="546.499" cy="406.565" r="31.529" class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="474.097" cy="477.116" r="31.529" class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="617.882" cy="477.435" r="31.529" class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="547.116" cy="552.273" r="31.529" class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.7 KiB

After

Width:  |  Height:  |  Size: 2.6 KiB

30
frontend/assets/logos/romm_logo_snes_circle.svg
View File

@@ -1,29 +1 @@
<svg width="1024" height="1024" viewBox="0 0 270.933 270.933" xml:space="preserve" xmlns="http://www.w3.org/2000/svg">
<defs>
<clipPath clipPathUnits="userSpaceOnUse" id="main-clip">
<ellipse style="fill:none" cx="511.924" cy="511.984" rx="261.064" ry="261.108"/>
</clipPath>
<clipPath clipPathUnits="userSpaceOnUse" id="logo-clip">
<ellipse style="fill:none" cx="533.565" cy="525.18" rx="261.064" ry="261.108"/>
</clipPath>
<clipPath clipPathUnits="userSpaceOnUse" id="elements-clip">
<ellipse style="fill:none" cx="511.924" cy="511.984" rx="261.064" ry="261.108"/>
</clipPath>
</defs>
<g clip-path="url(#main-clip)" transform="translate(-130.058 -130.093) scale(.51871)">
<path class="background-light" style="fill:#ede5f8;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" d="M250.857 250.876h522.13v522.215h-522.13z"/>
<path class="background-dark" style="fill:#bea4e1;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" d="m772.988 302.397-522.13 418.762v51.934h522.13z"/>
</g>
<g transform="translate(-141.283 -136.938) scale(.51871)" clip-path="url(#logo-clip)">
<path class="logo-primary" style="fill:#553e98;fill-opacity:1;stroke-width:.51" d="M272.491 676.872s-2.115-.002 4.585-.002c157.422 0 132.045-.964 145.066 8.047 27.763 19.214 55.323 29.911 88.688 34.423 11.025 1.49 37.291 1.734 46.972.435 56.029-7.52 102.142-34.316 135.175-78.55 22.553-30.201 35.59-66.05 37.99-104.47.728-11.659.149-28.413-1.342-38.824-6.04-42.184-24.29-79.402-53.797-109.703-13.101-13.454-27.146-24.417-44.138-34.452-3.37-1.99-3.584-2.41-4.387-8.603l-.442-3.403-7.617-3.812c-12.234-6.12-25.671-10.872-39.699-14.038-16.254-3.669-16.983-3.706-78.698-4.022-31.914-.164-58.797-.104-59.741.133-1.163.292-2.15 1.442-3.06 3.566-.74 1.725-1.986 3.48-2.77 3.899-1.084.58-162.764.9-162.777.9-.008 0-.002 348.476-.002 348.476zm395.41-150.069c-417.055-275.927-417.055-275.927 0 0z"/>
<path class="logo-secondary" style="fill:#371f69;fill-opacity:1;stroke-width:.51" d="M687.6 401.41 344.145 676.841c73.36.061 67.776.935 78.065 8.056 27.763 19.214 55.323 29.911 88.689 34.423 11.024 1.49 37.29 1.734 46.971.435 56.03-7.52 102.143-34.316 135.176-78.551 22.553-30.2 35.588-66.05 37.989-104.47.728-11.658.15-28.412-1.341-38.824-5.192-36.26-19.465-68.818-42.096-96.502z"/>
</g>
<g transform="translate(-130.058 -130.093) scale(.51871)" clip-path="url(#elements-clip)">
<rect class="stripe-primary" style="fill:#371f69;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel" width="81.956" height="199.373" x="624.479" y="-171.248" ry="40.978" transform="rotate(51.642)"/>
<rect class="stripe-secondary" style="fill:#221342;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel" width="81.956" height="199.373" x="731.539" y="-197.079" ry="40.978" transform="rotate(51.642)"/>
<circle class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="511.714" cy="581.19" r="35.595"/>
<circle class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="600.951" cy="509.861" r="35.595"/>
<circle class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="513.278" cy="442.374" r="35.595"/>
<circle class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="424.748" cy="511.845" r="35.595"/>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="1024" height="1024" viewBox="0 0 270.933 270.933"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><ellipse cx="511.924" cy="511.984" rx="261.064" ry="261.108" style="fill:none"/></clipPath><clipPath id="b" clipPathUnits="userSpaceOnUse"><ellipse cx="533.565" cy="525.18" rx="261.064" ry="261.108" style="fill:none"/></clipPath><clipPath id="c" clipPathUnits="userSpaceOnUse"><ellipse cx="511.924" cy="511.984" rx="261.064" ry="261.108" style="fill:none"/></clipPath></defs><g clip-path="url(#a)" transform="translate(-130.058 -130.093)scale(.51871)"><path d="M250.857 250.876h522.13v522.215h-522.13z" class="background-light" style="fill:#ede5f8;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><path d="m772.988 302.397-522.13 418.762v51.934h522.13z" class="background-dark" style="fill:#bea4e1;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/></g><g clip-path="url(#b)" transform="translate(-141.283 -136.938)scale(.51871)"><path d="M272.491 676.872s-2.115-.002 4.585-.002c157.422 0 132.045-.964 145.066 8.047 27.763 19.214 55.323 29.911 88.688 34.423 11.025 1.49 37.291 1.734 46.972.435 56.029-7.52 102.142-34.316 135.175-78.55 22.553-30.201 35.59-66.05 37.99-104.47.728-11.659.149-28.413-1.342-38.824-6.04-42.184-24.29-79.402-53.797-109.703-13.101-13.454-27.146-24.417-44.138-34.452-3.37-1.99-3.584-2.41-4.387-8.603l-.442-3.403-7.617-3.812c-12.234-6.12-25.671-10.872-39.699-14.038-16.254-3.669-16.983-3.706-78.698-4.022-31.914-.164-58.797-.104-59.741.133-1.163.292-2.15 1.442-3.06 3.566-.74 1.725-1.986 3.48-2.77 3.899-1.084.58-162.764.9-162.777.9-.008 0-.002 348.476-.002 348.476zm395.41-150.069q-625.582-413.89 0 0" class="logo-primary" style="fill:#553e98;fill-opacity:1;stroke-width:.51"/><path d="M687.6 401.41 344.145 676.841c73.36.061 67.776.935 78.065 8.056 27.763 19.214 55.323 29.911 88.689 34.423 11.024 1.49 37.29 1.734 46.971.435 56.03-7.52 102.143-34.316 135.176-78.551 22.553-30.2 35.588-66.05 37.989-104.47.728-11.658.15-28.412-1.341-38.824-5.192-36.26-19.465-68.818-42.096-96.502z" class="logo-secondary" style="fill:#371f69;fill-opacity:1;stroke-width:.51"/></g><g clip-path="url(#c)" transform="translate(-130.058 -130.093)scale(.51871)"><rect width="81.956" height="199.373" x="624.479" y="-171.248" class="stripe-primary" ry="40.978" style="fill:#371f69;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel" transform="rotate(51.642)"/><rect width="81.956" height="199.373" x="731.539" y="-197.079" class="stripe-secondary" ry="40.978" style="fill:#221342;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel" transform="rotate(51.642)"/><circle cx="511.714" cy="581.19" r="35.595" class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="600.951" cy="509.861" r="35.595" class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="513.278" cy="442.374" r="35.595" class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="424.748" cy="511.845" r="35.595" class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.5 KiB

After

Width:  |  Height:  |  Size: 3.3 KiB

16
frontend/assets/logos/romm_logo_snes_square.svg
View File

@@ -1,15 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="1024" height="1024" viewBox="0 0 270.933 270.933">
<path class="background-light" style="fill:#ede5f8;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" transform="translate(-130.058 -130.093)scale(.51871)" d="M250.857 250.876h522.13v522.215h-522.13z"/>
<path class="background-dark" style="fill:#bea4e1;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" transform="translate(-130.058 -130.093)scale(.51871)" d="m772.988 302.397-522.13 418.762v51.934h522.13z"/>
<path class="logo-primary" style="fill:#553e98;fill-opacity:1;stroke-width:.51" transform="translate(-141.283 -136.938)scale(.51871)" d="M272.491 676.872s-2.115-.002 4.585-.002c157.422 0 132.045-.964 145.066 8.047 27.763 19.214 55.323 29.911 88.688 34.423 11.025 1.49 37.291 1.734 46.972.435 56.029-7.52 102.142-34.316 135.175-78.55 22.553-30.201 35.59-66.05 37.99-104.47.728-11.659.149-28.413-1.342-38.824-6.04-42.184-24.29-79.402-53.797-109.703-13.101-13.454-27.146-24.417-44.138-34.452-3.37-1.99-3.584-2.41-4.387-8.603l-.442-3.403-7.617-3.812c-12.234-6.12-25.671-10.872-39.699-14.038-16.254-3.669-16.983-3.706-78.698-4.022-31.914-.164-58.797-.104-59.741.133-1.163.292-2.15 1.442-3.06 3.566-.74 1.725-1.986 3.48-2.77 3.899-1.084.58-162.764.9-162.777.9-.008 0-.002 348.476-.002 348.476zm395.41-150.069q-625.582-413.89 0 0"/>
<path class="logo-secondary" style="fill:#371f69;fill-opacity:1;stroke-width:.51" transform="translate(-141.283 -136.938)scale(.51871)" d="M687.6 401.41 344.145 676.841c73.36.061 67.776.935 78.065 8.056 27.763 19.214 55.323 29.911 88.689 34.423 11.024 1.49 37.29 1.734 46.971.435 56.03-7.52 102.143-34.316 135.176-78.551 22.553-30.2 35.588-66.05 37.989-104.47.728-11.658.15-28.412-1.341-38.824-5.192-36.26-19.465-68.818-42.096-96.502z"/>
<g transform="translate(-130.058 -130.093) scale(.51871)">
<rect class="stripe-primary" width="81.956" height="199.373" x="624.479" y="-171.248" ry="40.978" style="fill:#371f69;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel" transform="rotate(51.642)"/>
<rect class="stripe-secondary" width="81.956" height="199.373" x="731.539" y="-197.079" ry="40.978" style="fill:#221342;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel" transform="rotate(51.642)"/>
<circle class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="513.278" cy="442.374" r="35.595"/>
<circle class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="424.748" cy="511.845" r="35.595"/>
<circle class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="511.714" cy="581.19" r="35.595"/>
<circle class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="600.951" cy="509.861" r="35.595"/>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="1024" height="1024" viewBox="0 0 270.933 270.933"><path d="M250.857 250.876h522.13v522.215h-522.13z" class="background-light" style="fill:#ede5f8;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" transform="translate(-130.058 -130.093)scale(.51871)"/><path d="m772.988 302.397-522.13 418.762v51.934h522.13z" class="background-dark" style="fill:#bea4e1;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" transform="translate(-130.058 -130.093)scale(.51871)"/><path d="M272.491 676.872s-2.115-.002 4.585-.002c157.422 0 132.045-.964 145.066 8.047 27.763 19.214 55.323 29.911 88.688 34.423 11.025 1.49 37.291 1.734 46.972.435 56.029-7.52 102.142-34.316 135.175-78.55 22.553-30.201 35.59-66.05 37.99-104.47.728-11.659.149-28.413-1.342-38.824-6.04-42.184-24.29-79.402-53.797-109.703-13.101-13.454-27.146-24.417-44.138-34.452-3.37-1.99-3.584-2.41-4.387-8.603l-.442-3.403-7.617-3.812c-12.234-6.12-25.671-10.872-39.699-14.038-16.254-3.669-16.983-3.706-78.698-4.022-31.914-.164-58.797-.104-59.741.133-1.163.292-2.15 1.442-3.06 3.566-.74 1.725-1.986 3.48-2.77 3.899-1.084.58-162.764.9-162.777.9-.008 0-.002 348.476-.002 348.476zm395.41-150.069q-625.582-413.89 0 0" class="logo-primary" style="fill:#553e98;fill-opacity:1;stroke-width:.51" transform="translate(-141.283 -136.938)scale(.51871)"/><path d="M687.6 401.41 344.145 676.841c73.36.061 67.776.935 78.065 8.056 27.763 19.214 55.323 29.911 88.689 34.423 11.024 1.49 37.29 1.734 46.971.435 56.03-7.52 102.143-34.316 135.176-78.551 22.553-30.2 35.588-66.05 37.989-104.47.728-11.658.15-28.412-1.341-38.824-5.192-36.26-19.465-68.818-42.096-96.502z" class="logo-secondary" style="fill:#371f69;fill-opacity:1;stroke-width:.51" transform="translate(-141.283 -136.938)scale(.51871)"/><g transform="translate(-130.058 -130.093)scale(.51871)"><rect width="81.956" height="199.373" x="624.479" y="-171.248" class="stripe-primary" ry="40.978" style="fill:#371f69;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel" transform="rotate(51.642)"/><rect width="81.956" height="199.373" x="731.539" y="-197.079" class="stripe-secondary" ry="40.978" style="fill:#221342;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel" transform="rotate(51.642)"/><circle cx="513.278" cy="442.374" r="35.595" class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="424.748" cy="511.845" r="35.595" class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="511.714" cy="581.19" r="35.595" class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="600.951" cy="509.861" r="35.595" class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.0 KiB

After

Width:  |  Height:  |  Size: 2.9 KiB

29
frontend/assets/logos/romm_logo_xbox_one_circle.svg
View File

@@ -1,28 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="1024" height="1024" viewBox="0 0 270.933 270.933">
<defs>
<clipPath id="main-clip" clipPathUnits="userSpaceOnUse">
<ellipse cx="511.875" cy="512.551" rx="255.946" ry="255.984" style="fill:none"/>
</clipPath>
<clipPath id="logo-clip" clipPathUnits="userSpaceOnUse">
<ellipse cx="135.457" cy="135.471" rx="135.436" ry="135.456" style="fill:none"/>
</clipPath>
<clipPath id="elements-clip" clipPathUnits="userSpaceOnUse">
<ellipse cx="511.875" cy="512.551" rx="255.946" ry="255.984" style="fill:none"/>
</clipPath>
</defs>
<path class="background-light" clip-path="url(#main-clip)" style="fill:#ede5f8;fill-opacity:1;stroke-width:0" transform="translate(-135.407 -135.75)scale(.52916)" d="M255.928 256.564H767.82V768.54H255.928Z"/>
<path class="background-dark" clip-path="url(#main-clip)" style="fill:#bea4e1;fill-opacity:1;stroke-width:0" transform="translate(-135.407 -135.75)scale(.52916)" d="m714.366 256.564-458.44 458.44v53.536H767.82V256.564Z"/>
<g clip-path="url(#logo-clip)" style="display:inline">
<path class="logo-secondary" style="fill:#371f69;fill-opacity:1;stroke-width:0;stroke-dasharray:none" transform="translate(-135.407 -135.75)scale(.52916)" d="M601.91 768.54c-2.735-.066-43.37-47.717-83.736-79.261-2.784-2.176-6.65-5.2-8.593-6.721-3.886-3.045-10.784-7.06-11.479-7.461-1.19-.687-2.393-1.272-6.665-3.15-4.524-1.99-13.567-4.542-18.772-5.298-8.498-1.236-33.84-1.639-96.251-1.582l-120.486.11c-.016-82.184-.01-236.036-.013-305.108l88.831.232c39.029.101 40.847-.189 47.144-3.008 13.443-6.019 68.906-76.53 83.114-82.973 7.254-3.29 16.603-4.702 23.918-3.202 1.581.324 6.626 1.157 11.212 1.852 10.895 1.65 18.218 2.754 35.434 7.376 28.676 7.697 56.638 19.386 58.66 20.31 11.937 5.453 25.411 12.472 29.43 16.271 1.59 1.504 3.282 3.542 4.083 4.852 3.524 5.765 11.034 19.845 11.756 22.333 9.175 22.007 17.356 44.381 25.733 66.7 3.979 11.415 8.336 22.57 12.276 33.945 3.358 9.785 10.614 30.128 11.045 30.968 5.604 15.717 10.419 31.655 15.204 47.643 2.989 9.93 6.674 22.862 10.253 36.626 5.39 18.118 10.909 36.205 14.226 54.889.718 3.96 3.264 19.802 3.445 21.053.437 3.026 3.277 25.867 3.851 31.073 2.626 23.81 2.15 68.545-17.678 101.54-.1.167-2.65.031-2.707.032-9.042.065-31.907-.03-39.664-.043-15.94-.029-83.501.005-83.508.005z"/>
<path class="logo-primary" d="M115.894 9.256c-7 3.173-37.415 41.18-43.992 44.125-3.331 1.492-4.294 1.645-24.947 1.591l-46.94-.189c0 36.55-.002 117.963.006 161.45l26.456-.023L204.26 38.36c-.75-1.387-1.84-3.095-2.388-3.99-.424-.694-1.18-1.633-2.021-2.428-2.126-2.01-9.256-5.725-15.573-8.61-10.144-4.633-20.204-7.68-31.041-10.748-9.11-2.446-17.249-3.626-18.752-3.903-2.413-.444-5.031-.84-5.932-.98-.641-.098-6.525-1.225-12.658 1.555Z" style="fill:#553e98;fill-opacity:1;stroke-width:0" />
</g>
<g clip-path="url(#elements-clip)" style="display:inline" transform="translate(-135.407 -135.75) scale(.52916)">
<circle class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="530.532" cy="381.817" r="31.529"/>
<circle class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="471.565" cy="440.348" r="31.529"/>
<circle class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="590.601" cy="439.252" r="31.529"/>
<circle class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="530.441" cy="499.948" r="31.529"/>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="1024" height="1024" viewBox="0 0 270.933 270.933"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><ellipse cx="511.875" cy="512.551" rx="255.946" ry="255.984" style="fill:none"/></clipPath><clipPath id="b" clipPathUnits="userSpaceOnUse"><ellipse cx="135.457" cy="135.471" rx="135.436" ry="135.456" style="fill:none"/></clipPath><clipPath id="c" clipPathUnits="userSpaceOnUse"><ellipse cx="511.875" cy="512.551" rx="255.946" ry="255.984" style="fill:none"/></clipPath></defs><path d="M255.928 256.564H767.82V768.54H255.928Z" class="background-light" clip-path="url(#a)" style="fill:#ede5f8;fill-opacity:1;stroke-width:0" transform="translate(-135.407 -135.75)scale(.52916)"/><path d="m714.366 256.564-458.44 458.44v53.536H767.82V256.564Z" class="background-dark" clip-path="url(#a)" style="fill:#bea4e1;fill-opacity:1;stroke-width:0" transform="translate(-135.407 -135.75)scale(.52916)"/><g clip-path="url(#b)" style="display:inline"><path d="M601.91 768.54c-2.735-.066-43.37-47.717-83.736-79.261-2.784-2.176-6.65-5.2-8.593-6.721-3.886-3.045-10.784-7.06-11.479-7.461-1.19-.687-2.393-1.272-6.665-3.15-4.524-1.99-13.567-4.542-18.772-5.298-8.498-1.236-33.84-1.639-96.251-1.582l-120.486.11c-.016-82.184-.01-236.036-.013-305.108l88.831.232c39.029.101 40.847-.189 47.144-3.008 13.443-6.019 68.906-76.53 83.114-82.973 7.254-3.29 16.603-4.702 23.918-3.202 1.581.324 6.626 1.157 11.212 1.852 10.895 1.65 18.218 2.754 35.434 7.376 28.676 7.697 56.638 19.386 58.66 20.31 11.937 5.453 25.411 12.472 29.43 16.271 1.59 1.504 3.282 3.542 4.083 4.852 3.524 5.765 11.034 19.845 11.756 22.333 9.175 22.007 17.356 44.381 25.733 66.7 3.979 11.415 8.336 22.57 12.276 33.945 3.358 9.785 10.614 30.128 11.045 30.968 5.604 15.717 10.419 31.655 15.204 47.643 2.989 9.93 6.674 22.862 10.253 36.626 5.39 18.118 10.909 36.205 14.226 54.889.718 3.96 3.264 19.802 3.445 21.053.437 3.026 3.277 25.867 3.851 31.073 2.626 23.81 2.15 68.545-17.678 101.54-.1.167-2.65.031-2.707.032-9.042.065-31.907-.03-39.664-.043-15.94-.029-83.501.005-83.508.005z" class="logo-secondary" style="fill:#371f69;fill-opacity:1;stroke-width:0;stroke-dasharray:none" transform="translate(-135.407 -135.75)scale(.52916)"/><path d="M115.894 9.256c-7 3.173-37.415 41.18-43.992 44.125-3.331 1.492-4.294 1.645-24.947 1.591l-46.94-.189c0 36.55-.002 117.963.006 161.45l26.456-.023L204.26 38.36c-.75-1.387-1.84-3.095-2.388-3.99-.424-.694-1.18-1.633-2.021-2.428-2.126-2.01-9.256-5.725-15.573-8.61-10.144-4.633-20.204-7.68-31.041-10.748-9.11-2.446-17.249-3.626-18.752-3.903-2.413-.444-5.031-.84-5.932-.98-.641-.098-6.525-1.225-12.658 1.555Z" class="logo-primary" style="fill:#553e98;fill-opacity:1;stroke-width:0"/></g><g clip-path="url(#c)" style="display:inline" transform="translate(-135.407 -135.75)scale(.52916)"><circle cx="530.532" cy="381.817" r="31.529" class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="471.565" cy="440.348" r="31.529" class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="590.601" cy="439.252" r="31.529" class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="530.441" cy="499.948" r="31.529" class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.6 KiB

After

Width:  |  Height:  |  Size: 3.4 KiB

17
frontend/assets/logos/romm_logo_xbox_one_square.svg
View File

@@ -1,16 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="1024" height="1024" viewBox="0 0 270.933 270.933">
<path class="background-light" style="fill:#ede5f8;fill-opacity:1;stroke-width:0" transform="translate(-135.407 -135.75)scale(.52916)" d="M255.928 256.564H767.82V768.54H255.928z"/>
<path class="background-dark" style="fill:#bea4e1;fill-opacity:1;stroke-width:0" transform="translate(-135.407 -135.75)scale(.52916)" d="m714.366 256.564-458.44 458.44v53.536H767.82V256.564Z"/>
<g style="display:inline">
<path class="logo-primary" style="fill:#553e98;fill-opacity:1;stroke-width:0;stroke-dasharray:none" transform="translate(-135.407 -135.75)scale(.52916)" d="M601.91 768.54c-2.735-.066-43.37-47.717-83.736-79.261-2.784-2.176-6.65-5.2-8.593-6.721-3.886-3.045-10.784-7.06-11.479-7.461-1.19-.687-2.393-1.272-6.665-3.15-4.524-1.99-13.567-4.542-18.772-5.298-8.498-1.236-33.84-1.639-96.251-1.582l-120.486.11c-.016-82.184-.01-236.036-.013-305.108l88.831.232c39.029.101 40.847-.189 47.144-3.008 13.443-6.019 68.906-76.53 83.114-82.973 7.254-3.29 16.603-4.702 23.918-3.202 1.581.324 6.626 1.157 11.212 1.852 10.895 1.65 18.218 2.754 35.434 7.376 28.676 7.697 56.638 19.386 58.66 20.31 11.937 5.453 25.411 12.472 29.43 16.271 1.59 1.504 3.282 3.542 4.083 4.852 3.524 5.765 11.034 19.845 11.756 22.333 9.175 22.007 17.356 44.381 25.733 66.7 3.979 11.415 8.336 22.57 12.276 33.945 3.358 9.785 10.614 30.128 11.045 30.968 5.604 15.717 10.419 31.655 15.204 47.643 2.989 9.93 6.674 22.862 10.253 36.626 5.39 18.118 10.909 36.205 14.226 54.889.718 3.96 3.264 19.802 3.445 21.053.437 3.026 3.277 25.867 3.851 31.073 2.626 23.81 2.15 68.545-17.678 101.54-.1.167-2.65.031-2.707.032-9.042.065-31.907-.03-39.664-.043-15.94-.029-83.501.005-83.508.005z"/>
<path class="logo-secondary" style="fill:#371f69;fill-opacity:1;stroke-width:0" transform="translate(-135.407 -135.75)scale(.52916)" d="M474.911 274.03c-13.227 5.997-70.704 77.822-83.133 83.387-6.296 2.82-8.115 3.11-47.143 3.008l-88.705-.358c.002 69.071-.004 222.924.012 305.107l49.995-.045 335.959-336.097c-1.417-2.623-3.478-5.85-4.512-7.543-.801-1.31-2.229-3.084-3.82-4.587-4.017-3.8-17.491-10.819-29.428-16.271-19.17-8.756-38.18-14.515-58.66-20.311-17.216-4.622-32.595-6.852-35.435-7.376-4.56-.84-9.508-1.589-11.211-1.851-1.211-.187-12.33-2.317-23.919 2.937"/>
</g>
<g style="display:inline" transform="translate(-135.407 -135.75)scale(.52916)">
<circle class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="530.532" cy="381.817" r="31.529"/>
<circle class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="471.565" cy="440.348" r="31.529"/>
<circle class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="590.601" cy="439.252" r="31.529"/>
<circle class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none" cx="530.441" cy="499.948" r="31.529"/>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="1024" height="1024" viewBox="0 0 270.933 270.933"><path d="M255.928 256.564H767.82V768.54H255.928z" class="background-light" style="fill:#ede5f8;fill-opacity:1;stroke-width:0" transform="translate(-135.407 -135.75)scale(.52916)"/><path d="m714.366 256.564-458.44 458.44v53.536H767.82V256.564Z" class="background-dark" style="fill:#bea4e1;fill-opacity:1;stroke-width:0" transform="translate(-135.407 -135.75)scale(.52916)"/><g style="display:inline"><path d="M601.91 768.54c-2.735-.066-43.37-47.717-83.736-79.261-2.784-2.176-6.65-5.2-8.593-6.721-3.886-3.045-10.784-7.06-11.479-7.461-1.19-.687-2.393-1.272-6.665-3.15-4.524-1.99-13.567-4.542-18.772-5.298-8.498-1.236-33.84-1.639-96.251-1.582l-120.486.11c-.016-82.184-.01-236.036-.013-305.108l88.831.232c39.029.101 40.847-.189 47.144-3.008 13.443-6.019 68.906-76.53 83.114-82.973 7.254-3.29 16.603-4.702 23.918-3.202 1.581.324 6.626 1.157 11.212 1.852 10.895 1.65 18.218 2.754 35.434 7.376 28.676 7.697 56.638 19.386 58.66 20.31 11.937 5.453 25.411 12.472 29.43 16.271 1.59 1.504 3.282 3.542 4.083 4.852 3.524 5.765 11.034 19.845 11.756 22.333 9.175 22.007 17.356 44.381 25.733 66.7 3.979 11.415 8.336 22.57 12.276 33.945 3.358 9.785 10.614 30.128 11.045 30.968 5.604 15.717 10.419 31.655 15.204 47.643 2.989 9.93 6.674 22.862 10.253 36.626 5.39 18.118 10.909 36.205 14.226 54.889.718 3.96 3.264 19.802 3.445 21.053.437 3.026 3.277 25.867 3.851 31.073 2.626 23.81 2.15 68.545-17.678 101.54-.1.167-2.65.031-2.707.032-9.042.065-31.907-.03-39.664-.043-15.94-.029-83.501.005-83.508.005z" class="logo-primary" style="fill:#553e98;fill-opacity:1;stroke-width:0;stroke-dasharray:none" transform="translate(-135.407 -135.75)scale(.52916)"/><path d="M474.911 274.03c-13.227 5.997-70.704 77.822-83.133 83.387-6.296 2.82-8.115 3.11-47.143 3.008l-88.705-.358c.002 69.071-.004 222.924.012 305.107l49.995-.045 335.959-336.097c-1.417-2.623-3.478-5.85-4.512-7.543-.801-1.31-2.229-3.084-3.82-4.587-4.017-3.8-17.491-10.819-29.428-16.271-19.17-8.756-38.18-14.515-58.66-20.311-17.216-4.622-32.595-6.852-35.435-7.376-4.56-.84-9.508-1.589-11.211-1.851-1.211-.187-12.33-2.317-23.919 2.937" class="logo-secondary" style="fill:#371f69;fill-opacity:1;stroke-width:0" transform="translate(-135.407 -135.75)scale(.52916)"/></g><g style="display:inline" transform="translate(-135.407 -135.75)scale(.52916)"><circle cx="530.532" cy="381.817" r="31.529" class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="471.565" cy="440.348" r="31.529" class="dot-light" style="fill:#e6c7a7;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="590.601" cy="439.252" r="31.529" class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/><circle cx="530.441" cy="499.948" r="31.529" class="dot-dark" style="fill:#e1a38d;fill-opacity:1;stroke-width:0;stroke-linejoin:bevel;stroke-dasharray:none"/></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 3.0 KiB

2
frontend/assets/logotipo.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="500" height="500" version="1.0" viewBox="0 0 375 375"><path fill="#553e98" d="M8.828 220.458h25.176c1.41 0 2.52-1.207 2.52-2.618v-23.566a2.49 2.49 0 0 1 2.515-2.516h15.105c1.41 0 2.52 1.106 2.52 2.516v23.664c0 1.41 1.105 2.52 2.516 2.52h25.175c1.41 0 2.52-1.207 2.52-2.618v-24.875c0-5.94-4.332-10.273-10.274-10.273h-.906a2.49 2.49 0 0 1-2.515-2.516c0-1.41 1.105-2.52 2.515-2.52h.906c5.942 0 10.274-4.327 10.274-10.269V156.31c0-9.465-6.95-16.414-16.414-16.414H8.828a2.49 2.49 0 0 0-2.516 2.516v75.527c0 1.41 1.106 2.52 2.516 2.52m30.21-51.864a2.49 2.49 0 0 1-2.515-2.515c0-1.41 1.106-2.52 2.516-2.52h15.105c1.41 0 2.52 1.11 2.52 2.52s-1.11 2.515-2.52 2.515Zm73.382 51.863h24.37c11.883 0 20.543-8.66 20.543-20.543v-39.477c0-11.883-8.66-20.543-20.543-20.543h-24.37c-11.883 0-20.544 8.66-20.544 20.543v39.477c0 11.883 8.66 20.543 20.543 20.543m12.183-23.16a2.493 2.493 0 0 1-2.516-2.52v-29.203c0-1.41 1.106-2.52 2.516-2.52s2.52 1.11 2.52 2.52v29.203c0 1.41-1.11 2.52-2.52 2.52m40.356 23.16h25.074c1.41 0 2.52-1.11 2.52-2.52v-44.812a2.49 2.49 0 0 1 2.515-2.516c1.41 0 2.52 1.105 2.52 2.516v45.015c0 1.309 1.207 2.317 2.516 2.317h25.175c1.309 0 2.52-1.008 2.52-2.317v-45.015a2.49 2.49 0 0 1 2.515-2.516c1.41 0 2.52 1.105 2.52 2.516v44.812c0 1.41 1.207 2.52 2.617 2.52h25.074c1.41 0 2.52-1.11 2.52-2.52v-75.527c0-1.41-1.211-2.516-2.617-2.516h-42.7c-1.41 0-2.519 1.207-2.519 2.617v14a2.49 2.49 0 0 1-2.516 2.516c-1.41 0-2.52-1.11-2.52-2.516v-14.101c0-1.41-1.206-2.516-2.616-2.516h-42.7a2.49 2.49 0 0 0-2.515 2.516v75.527c0 1.41 1.207 2.52 2.617 2.52m105.697 0h25.074c1.41 0 2.52-1.11 2.52-2.52v-44.812a2.49 2.49 0 0 1 2.515-2.516c1.41 0 2.52 1.105 2.52 2.516v45.015c0 1.309 1.207 2.317 2.515 2.317h25.176c1.309 0 2.52-1.008 2.52-2.317v-45.015a2.49 2.49 0 0 1 2.515-2.516c1.41 0 2.52 1.105 2.52 2.516v44.812c0 1.41 1.207 2.52 2.617 2.52h25.074c1.41 0 2.52-1.11 2.52-2.52v-75.527c0-1.41-1.211-2.516-2.618-2.516h-42.699c-1.41 0-2.52 1.207-2.52 2.617v14a2.49 2.49 0 0 1-2.515 2.516c-1.41 0-2.52-1.11-2.52-2.516v-14.101c0-1.41-1.206-2.516-2.617-2.516h-42.699a2.49 2.49 0 0 0-2.515 2.516v75.527c0 1.41 1.207 2.52 2.617 2.52m0 0"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="500" height="500" version="1.0" viewBox="0 0 375 375"><path fill="#553e98" d="M8.828 220.458h25.176c1.41 0 2.52-1.207 2.52-2.618v-23.566a2.49 2.49 0 0 1 2.515-2.516h15.105c1.41 0 2.52 1.106 2.52 2.516v23.664c0 1.41 1.105 2.52 2.516 2.52h25.175c1.41 0 2.52-1.207 2.52-2.618v-24.875c0-5.94-4.332-10.273-10.274-10.273h-.906a2.49 2.49 0 0 1-2.515-2.516c0-1.41 1.105-2.52 2.515-2.52h.906c5.942 0 10.274-4.327 10.274-10.269V156.31c0-9.465-6.95-16.414-16.414-16.414H8.828a2.49 2.49 0 0 0-2.516 2.516v75.527c0 1.41 1.106 2.52 2.516 2.52m30.21-51.864a2.49 2.49 0 0 1-2.515-2.515c0-1.41 1.106-2.52 2.516-2.52h15.105c1.41 0 2.52 1.11 2.52 2.52s-1.11 2.515-2.52 2.515Zm73.382 51.863h24.37c11.883 0 20.543-8.66 20.543-20.543v-39.477c0-11.883-8.66-20.543-20.543-20.543h-24.37c-11.883 0-20.544 8.66-20.544 20.543v39.477c0 11.883 8.66 20.543 20.543 20.543m12.183-23.16a2.493 2.493 0 0 1-2.516-2.52v-29.203c0-1.41 1.106-2.52 2.516-2.52s2.52 1.11 2.52 2.52v29.203c0 1.41-1.11 2.52-2.52 2.52m40.356 23.16h25.074c1.41 0 2.52-1.11 2.52-2.52v-44.812a2.49 2.49 0 0 1 2.515-2.516c1.41 0 2.52 1.105 2.52 2.516v45.015c0 1.309 1.207 2.317 2.516 2.317h25.175c1.309 0 2.52-1.008 2.52-2.317v-45.015a2.49 2.49 0 0 1 2.515-2.516c1.41 0 2.52 1.105 2.52 2.516v44.812c0 1.41 1.207 2.52 2.617 2.52h25.074c1.41 0 2.52-1.11 2.52-2.52v-75.527c0-1.41-1.211-2.516-2.617-2.516h-42.7c-1.41 0-2.519 1.207-2.519 2.617v14a2.49 2.49 0 0 1-2.516 2.516c-1.41 0-2.52-1.11-2.52-2.516v-14.101c0-1.41-1.206-2.516-2.616-2.516h-42.7a2.49 2.49 0 0 0-2.515 2.516v75.527c0 1.41 1.207 2.52 2.617 2.52m105.697 0h25.074c1.41 0 2.52-1.11 2.52-2.52v-44.812a2.49 2.49 0 0 1 2.515-2.516c1.41 0 2.52 1.105 2.52 2.516v45.015c0 1.309 1.207 2.317 2.515 2.317h25.176c1.309 0 2.52-1.008 2.52-2.317v-45.015a2.49 2.49 0 0 1 2.515-2.516c1.41 0 2.52 1.105 2.52 2.516v44.812c0 1.41 1.207 2.52 2.617 2.52h25.074c1.41 0 2.52-1.11 2.52-2.52v-75.527c0-1.41-1.211-2.516-2.618-2.516h-42.699c-1.41 0-2.52 1.207-2.52 2.617v14a2.49 2.49 0 0 1-2.515 2.516c-1.41 0-2.52-1.11-2.52-2.516v-14.101c0-1.41-1.206-2.516-2.617-2.516h-42.699a2.49 2.49 0 0 0-2.515 2.516v75.527c0 1.41 1.207 2.52 2.617 2.52m0 0"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.1 KiB

After

Width:  |  Height:  |  Size: 2.1 KiB

2
frontend/src/components/Details/ActionBar.vue
View File

@@ -55,7 +55,7 @@ async function copyDownloadLink(rom: DetailedRom) {
<template>
<div>
<v-btn-group divided density="compact" rounded="0" class="d-flex flex-row">
<v-btn-group divided density="compact" class="d-flex flex-row">
<v-btn
class="flex-grow-1"
:disabled="downloadStore.value.includes(rom.id)"

4
frontend/src/components/Details/BackgroundHeader.vue
View File

@@ -10,7 +10,7 @@ const { currentRom } = storeToRefs(romsStore);
</script>
<template>
<v-card :key="currentRom.updated_at" v-if="currentRom" rounded="0">
<v-card :key="currentRom.updated_at" v-if="currentRom">
<v-img
id="background-header"
:src="
@@ -31,7 +31,7 @@ const { currentRom } = storeToRefs(romsStore);
<v-progress-circular
:width="2"
:size="40"
color="romm-accent-1"
color="primary"
indeterminate
/>
</div>

6
frontend/src/components/Details/Info/FileInfo.vue
View File

@@ -58,12 +58,11 @@ watch(
<v-btn
v-bind="props"
variant="flat"
rounded="0"
size="small"
@click="toggleMainSibling"
><v-icon
:class="romUser.is_main_sibling ? '' : 'mr-1'"
:color="romUser.is_main_sibling ? 'romm-accent-1' : ''"
:color="romUser.is_main_sibling ? 'primary' : ''"
>{{
romUser.is_main_sibling
? "mdi-checkbox-outline"
@@ -94,7 +93,6 @@ watch(
:label="rom.file_name"
item-title="file_name"
:items="rom.files.map((f) => f.filename)"
rounded="0"
density="compact"
variant="outlined"
return-object
@@ -143,7 +141,7 @@ watch(
size="small"
class="mr-2"
label
color="romm-accent-1"
color="primary"
variant="tonal"
>
{{ tag }}

4
frontend/src/components/Details/Info/GameInfo.vue
View File

@@ -133,10 +133,10 @@ function onFilterClick(filter: FilterType, value: string) {
v-model="carousel"
hide-delimiter-background
delimiter-icon="mdi-square"
class="bg-primary"
class="bg-background"
show-arrows="hover"
hide-delimiters
progress="terciary"
progress="tertiary"
:height="xs ? '300' : '400'"
>
<template #prev="{ props }">

49
frontend/src/components/Details/Personal.vue
View File

@@ -62,8 +62,8 @@ watch(
</script>
<template>
<v-card rounded="0" class="mb-2">
<v-card-title class="bg-terciary">
<v-card class="mb-2">
<v-card-title class="bg-toplayer">
<v-list-item class="pl-2 pr-0">
<span class="text-h6">{{ t("rom.status") }}</span>
</v-list-item>
@@ -75,11 +75,7 @@ watch(
no-gutters
>
<v-col cols="12" md="5">
<v-checkbox
v-model="romUser.backlogged"
color="romm-accent-1"
hide-details
>
<v-checkbox v-model="romUser.backlogged" color="primary" hide-details>
<template #label
><span>{{ t("rom.backlogged") }}</span
><span class="ml-2">{{
@@ -89,7 +85,7 @@ watch(
</v-checkbox>
<v-checkbox
v-model="romUser.now_playing"
color="romm-accent-1"
color="primary"
hide-details
>
<template #label
@@ -99,11 +95,7 @@ watch(
}}</span></template
>
</v-checkbox>
<v-checkbox
v-model="romUser.hidden"
color="romm-accent-1"
hide-details
>
<v-checkbox v-model="romUser.hidden" color="primary" hide-details>
<template #label
><span>{{ t("rom.hidden") }}</span
><span class="ml-2">{{
@@ -133,7 +125,7 @@ watch(
romUser.rating =
typeof $event === 'number' ? $event : parseInt($event)
"
active-color="romm-accent-1"
active-color="primary"
/>
</v-col>
</v-row>
@@ -149,7 +141,7 @@ watch(
max="10"
step="1"
hide-details
track-fill-color="romm-accent-1"
track-fill-color="primary"
><template #append>
<v-label class="opacity-100">
{{
@@ -173,7 +165,7 @@ watch(
max="100"
step="1"
hide-details
track-fill-color="romm-accent-1"
track-fill-color="primary"
><template #append>
<v-label class="ml-2 opacity-100">
{{ romUser.completion }}%
@@ -189,7 +181,6 @@ watch(
hide-details
:label="t('rom.status')"
clearable
rounded="0"
variant="outlined"
density="compact"
class="mt-1"
@@ -201,11 +192,7 @@ watch(
}}</span>
</template>
<template #item="{ item }">
<v-list-item
link
rounded="0"
@click="onStatusItemClick(item.raw)"
>
<v-list-item link @click="onStatusItemClick(item.raw)">
<span>{{ getEmojiForStatus(item.raw as RomUserStatus) }}</span
><span class="ml-2">{{
getTextForStatus(item.raw as RomUserStatus)
@@ -219,8 +206,8 @@ watch(
</v-card-text>
</v-card>
<v-card rounded="0">
<v-card-title class="bg-terciary">
<v-card>
<v-card-title class="bg-toplayer">
<v-list-item class="pl-2 pr-0">
<span class="text-h6">{{ t("rom.my-notes") }}</span>
<template #append>
@@ -235,7 +222,7 @@ watch(
<v-btn
@click="romUser.note_is_public = !romUser.note_is_public"
v-bind="tooltipProps"
class="bg-terciary"
class="bg-toplayer"
>
<v-icon size="large">
{{ romUser.note_is_public ? "mdi-eye" : "mdi-eye-off" }}
@@ -253,7 +240,7 @@ watch(
<v-btn
@click="editNote"
v-bind="tooltipProps"
class="bg-terciary"
class="bg-toplayer"
>
<v-icon size="large">
{{ editingNote ? "mdi-check" : "mdi-pencil" }}
@@ -285,8 +272,8 @@ watch(
</v-card-text>
</v-card>
<v-card rounded="0" v-if="publicNotes && publicNotes.length > 0" class="mt-2">
<v-card-title class="bg-terciary">
<v-card v-if="publicNotes && publicNotes.length > 0" class="mt-2">
<v-card-title class="bg-toplayer">
<v-list-item class="pl-2 pr-0">
<span class="text-h6">{{ t("rom.public-notes") }}</span>
</v-list-item>
@@ -295,12 +282,12 @@ watch(
<v-divider />
<v-card-text class="pa-0">
<v-expansion-panels multiple flat rounded="0" variant="accordion">
<v-expansion-panels multiple flat variant="accordion">
<v-expansion-panel v-for="note in publicNotes">
<v-expansion-panel-title class="bg-terciary">
<v-expansion-panel-title class="bg-toplayer">
<span class="text-body-1">{{ note.username }}</span>
</v-expansion-panel-title>
<v-expansion-panel-text class="bg-secondary">
<v-expansion-panel-text class="bg-surface">
<MdPreview
:model-value="note.note_raw_markdown"
:theme="theme.name.value == 'dark' ? 'dark' : 'light'"

15
frontend/src/components/Details/Saves.vue
View File

@@ -85,7 +85,7 @@ onMounted(() => {
:items-per-page-options="PER_PAGE_OPTIONS"
:headers="HEADERS"
return-object
class="bg-secondary"
class="bg-surface"
v-model="selectedSaves"
v-model:page="page"
show-select
@@ -93,14 +93,14 @@ onMounted(() => {
<template #header.actions>
<v-btn-group divided density="compact">
<v-btn
class="bg-secondary"
class="bg-surface"
size="small"
@click="emitter?.emit('addSavesDialog', rom)"
>
<v-icon>mdi-upload</v-icon>
</v-btn>
<v-btn
class="bg-secondary"
class="bg-surface"
:disabled="!selectedSaves.length"
:variant="selectedSaves.length > 0 ? 'flat' : 'plain'"
size="small"
@@ -109,7 +109,7 @@ onMounted(() => {
<v-icon>mdi-download</v-icon>
</v-btn>
<v-btn
class="bg-secondary"
class="bg-surface"
:class="{
'text-romm-red': selectedSaves.length,
}"
@@ -151,7 +151,7 @@ onMounted(() => {
<template #item.actions="{ item }">
<v-btn-group divided density="compact">
<v-btn
class="bg-secondary"
class="bg-surface"
:href="item.download_path"
download
size="small"
@@ -159,7 +159,7 @@ onMounted(() => {
<v-icon> mdi-download </v-icon>
</v-btn>
<v-btn
class="bg-secondary"
class="bg-surface"
size="small"
@click="
emitter?.emit('showDeleteSavesDialog', {
@@ -179,8 +179,7 @@ onMounted(() => {
<v-pagination
:show-first-last-page="!xs"
v-model="page"
rounded="0"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>

15
frontend/src/components/Details/States.vue
View File

@@ -85,7 +85,7 @@ onMounted(() => {
:items-per-page="itemsPerPage"
:items-per-page-options="PER_PAGE_OPTIONS"
:headers="HEADERS"
class="bg-secondary"
class="bg-surface"
return-object
v-model="selectedStates"
v-model:page="page"
@@ -94,14 +94,14 @@ onMounted(() => {
<template #header.actions>
<v-btn-group divided density="compact">
<v-btn
class="bg-secondary"
class="bg-surface"
size="small"
@click="emitter?.emit('addStatesDialog', rom)"
>
<v-icon>mdi-upload</v-icon>
</v-btn>
<v-btn
class="bg-secondary"
class="bg-surface"
:disabled="!selectedStates.length"
:variant="selectedStates.length > 0 ? 'flat' : 'plain'"
size="small"
@@ -110,7 +110,7 @@ onMounted(() => {
<v-icon>mdi-download</v-icon>
</v-btn>
<v-btn
class="bg-secondary"
class="bg-surface"
:class="{
'text-romm-red': selectedStates.length,
}"
@@ -152,7 +152,7 @@ onMounted(() => {
<template #item.actions="{ item }">
<v-btn-group divided density="compact">
<v-btn
class="bg-secondary"
class="bg-surface"
:href="item.download_path"
download
size="small"
@@ -160,7 +160,7 @@ onMounted(() => {
<v-icon> mdi-download </v-icon>
</v-btn>
<v-btn
class="bg-secondary"
class="bg-surface"
size="small"
@click="
emitter?.emit('showDeleteStatesDialog', {
@@ -180,8 +180,7 @@ onMounted(() => {
<v-pagination
:show-first-last-page="!xs"
v-model="page"
rounded="0"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>

1
frontend/src/components/Details/VersionSwitcher.vue
View File

@@ -31,7 +31,6 @@ function updateVersion() {
v-model="version"
label="Version"
single-line
rounded="0"
variant="solo-filled"
density="compact"
max-width="fit-content"

18
frontend/src/components/Gallery/AppBar/Collection/CollectionInfoDrawer.vue
View File

@@ -152,13 +152,13 @@ async function updateCollection() {
<v-btn
v-if="!isEditable"
:loading="updating"
class="bg-terciary"
class="bg-toplayer"
@click="showEditable"
size="small"
>
<template #loader>
<v-progress-circular
color="romm-accent-1"
color="primary"
:width="2"
:size="20"
indeterminate
@@ -167,13 +167,13 @@ async function updateCollection() {
<v-icon>mdi-pencil</v-icon></v-btn
>
<template v-else>
<v-btn @click="closeEditable" size="small" class="bg-terciary"
<v-btn @click="closeEditable" size="small" class="bg-toplayer"
><v-icon color="romm-red">mdi-close</v-icon></v-btn
>
<v-btn
@click="updateCollection()"
size="small"
class="bg-terciary ml-1"
class="bg-toplayer ml-1"
><v-icon color="romm-green">mdi-check</v-icon></v-btn
>
</template>
@@ -187,7 +187,7 @@ async function updateCollection() {
:src="imagePreviewUrl"
>
<template v-if="isEditable" #append-inner>
<v-btn-group rounded="0" divided density="compact">
<v-btn-group divided density="compact">
<v-btn
title="Search for cover in SteamGridDB"
:disabled="
@@ -249,7 +249,7 @@ async function updateCollection() {
<v-chip
class="mt-4"
size="small"
:color="currentCollection.is_public ? 'romm-accent-1' : ''"
:color="currentCollection.is_public ? 'primary' : ''"
><v-icon class="mr-1">{{
currentCollection.is_public ? "mdi-lock-open" : "mdi-lock"
}}</v-icon
@@ -284,7 +284,7 @@ async function updateCollection() {
<v-switch
class="mt-2"
v-model="updatedCollection.is_public"
color="romm-accent-1"
color="primary"
false-icon="mdi-lock"
true-icon="mdi-lock-open"
inset
@@ -299,7 +299,7 @@ async function updateCollection() {
</div>
</v-col>
<v-col cols="12">
<v-card class="mt-4 bg-terciary fill-width" elevation="0">
<v-card class="mt-4 bg-toplayer fill-width" elevation="0">
<v-card-text class="pa-4">
<template
v-for="(field, index) in collectionInfoFields"
@@ -337,7 +337,7 @@ async function updateCollection() {
<template #content>
<div class="text-center">
<v-btn
class="text-romm-red bg-terciary ma-2"
class="text-romm-red bg-toplayer ma-2"
variant="flat"
@click="
emitter?.emit('showDeleteCollectionDialog', currentCollection)

4
frontend/src/components/Gallery/AppBar/Platform/Base.vue
View File

@@ -62,11 +62,11 @@ const { activePlatformInfoDrawer } = storeToRefs(navigationStore);
transition:
filter 0.15s ease-in-out,
transform 0.15s ease-in-out;
filter: drop-shadow(0px 0px 1px rgba(var(--v-theme-romm-accent-1)));
filter: drop-shadow(0px 0px 1px rgba(var(--v-theme-primary)));
}
.platform-icon:hover,
.platform-icon.active {
filter: drop-shadow(0px 0px 3px rgba(var(--v-theme-romm-accent-1)));
filter: drop-shadow(0px 0px 3px rgba(var(--v-theme-primary)));
transform: scale(1.1);
}
</style>

3
frontend/src/components/Gallery/AppBar/Platform/FirmwareBtn.vue
View File

@@ -21,10 +21,9 @@ const { activeFirmwareDrawer } = storeToRefs(galleryViewStore);
<v-btn
class="ml-0"
variant="text"
rounded="0"
v-bind="props"
icon="mdi-memory"
:color="activeFirmwareDrawer ? 'romm-accent-1' : ''"
:color="activeFirmwareDrawer ? 'primary' : ''"
@click="galleryViewStore.switchActiveFirmwareDrawer()" /></template
></v-tooltip>
</template>

3
frontend/src/components/Gallery/AppBar/Platform/FirmwareDrawer.vue
View File

@@ -201,8 +201,7 @@ onMounted(() => {
<v-pagination
:show-first-last-page="!xs"
v-model="page"
rounded="0"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>

24
frontend/src/components/Gallery/AppBar/Platform/PlatformInfoDrawer.vue
View File

@@ -186,13 +186,13 @@ watch(
<v-btn
v-if="!isEditable"
:loading="updating"
class="bg-terciary"
class="bg-toplayer"
@click="showEditable"
size="small"
>
<template #loader>
<v-progress-circular
color="romm-accent-1"
color="primary"
:width="2"
:size="20"
indeterminate
@@ -201,13 +201,13 @@ watch(
<v-icon>mdi-pencil</v-icon></v-btn
>
<template v-else>
<v-btn @click="closeEditable" size="small" class="bg-terciary"
<v-btn @click="closeEditable" size="small" class="bg-toplayer"
><v-icon color="romm-red">mdi-close</v-icon></v-btn
>
<v-btn
@click="updatePlatform()"
size="small"
class="bg-terciary ml-1"
class="bg-toplayer ml-1"
><v-icon color="romm-green">mdi-check</v-icon></v-btn
>
</template>
@@ -240,7 +240,7 @@ watch(
</div>
<div class="mt-6">
<v-btn
class="bg-terciary my-1"
class="bg-toplayer my-1"
@click="emitter?.emit('showUploadRomDialog', currentPlatform)"
>
<v-icon class="text-romm-green mr-2">mdi-upload</v-icon>
@@ -251,17 +251,17 @@ watch(
rounded="4"
:loading="scanning"
@click="scan"
class="ml-2 my-1 bg-terciary"
class="ml-2 my-1 bg-toplayer"
>
<template #prepend>
<v-icon :color="scanning ? '' : 'romm-accent-1'"
<v-icon :color="scanning ? '' : 'primary'"
>mdi-magnify-scan</v-icon
>
</template>
{{ t("scan.scan") }}
<template #loader>
<v-progress-circular
color="romm-accent-1"
color="primary"
:width="2"
:size="20"
indeterminate
@@ -295,7 +295,7 @@ watch(
<span>ID: {{ currentPlatform.moby_id }}</span>
</v-chip>
</div>
<v-card class="mt-4 bg-terciary fill-width" elevation="0">
<v-card class="mt-4 bg-toplayer fill-width" elevation="0">
<v-card-text class="pa-4">
<template
v-for="(field, index) in platformInfoFields"
@@ -347,7 +347,7 @@ watch(
<v-col class="pa-2" v-for="aspectRatio in aspectRatioOptions">
<v-item v-slot="{ isSelected, toggle }">
<v-card
:color="isSelected ? 'romm-accent-1' : 'romm-gray'"
:color="isSelected ? 'primary' : 'romm-gray'"
variant="outlined"
@click="toggle"
>
@@ -386,7 +386,7 @@ watch(
<template #content>
<div class="text-center">
<v-btn
class="text-romm-red bg-terciary ma-2"
class="text-romm-red bg-toplayer ma-2"
variant="flat"
@click="emitter?.emit('showDeletePlatformDialog', currentPlatform)"
>
@@ -407,7 +407,7 @@ watch(
z-index: 1;
}
.platform-icon {
filter: drop-shadow(0px 0px 1px rgba(var(--v-theme-romm-accent-1)));
filter: drop-shadow(0px 0px 1px rgba(var(--v-theme-primary)));
}
.greyscale {
filter: grayscale(100%);

3
frontend/src/components/Gallery/AppBar/Search/PlatformSelector.vue
View File

@@ -86,11 +86,10 @@ function clearFilter() {
:density="xs ? 'comfortable' : 'default'"
@click:clear="clearFilter"
:label="t('common.platform')"
class="bg-terciary"
class="bg-toplayer"
item-title="platform_name"
:disabled="filterPlatforms.length == 0 || searching"
hide-details
rounded="0"
clearable
single-line
return-object

3
frontend/src/components/Gallery/AppBar/Search/SearchBtn.vue
View File

@@ -69,8 +69,7 @@ function filterRoms() {
id="search-btn"
type="submit"
@click="fetchRoms"
class="bg-terciary"
rounded="0"
class="bg-toplayer"
variant="text"
icon="mdi-magnify"
:disabled="gettingRoms || !searchText"

3
frontend/src/components/Gallery/AppBar/Search/SearchTextField.vue
View File

@@ -106,7 +106,6 @@ function fetchRoms() {
<template>
<v-text-field
rounded="0"
:density="xs ? 'comfortable' : 'default'"
clearable
autofocus
@@ -115,6 +114,6 @@ function fetchRoms() {
:disabled="gettingRoms"
:label="t('common.search')"
hide-details
class="bg-terciary"
class="bg-toplayer"
/>
</template>

3
frontend/src/components/Gallery/AppBar/common/FilterBtn.vue
View File

@@ -21,10 +21,9 @@ const { activeFilterDrawer } = storeToRefs(galleryFilterStore);
<v-btn
class="ml-0"
variant="text"
rounded="0"
v-bind="props"
icon="mdi-filter-variant"
:color="activeFilterDrawer ? 'romm-accent-1' : ''"
:color="activeFilterDrawer ? 'primary' : ''"
@click="galleryFilterStore.switchActiveFilterDrawer()" /></template
></v-tooltip>
</template>

1
frontend/src/components/Gallery/AppBar/common/FilterDrawer/Base.vue
View File

@@ -123,7 +123,6 @@ function resetFilters() {
</v-list-item>
<v-list-item v-for="filter in filters">
<v-autocomplete
rounded="0"
v-model="filter.selected.value"
hide-details
clearable

7
frontend/src/components/Gallery/AppBar/common/FilterDrawer/FilterDuplicatesBtn.vue
View File

@@ -21,17 +21,16 @@ function setDuplicates() {
<v-btn
block
variant="tonal"
rounded="0"
:color="filterDuplicates ? 'romm-accent-1' : 'romm-gray'"
:color="filterDuplicates ? 'primary' : 'romm-gray'"
@click="setDuplicates()"
>
<v-icon :color="filterDuplicates ? 'romm-accent-1' : 'romm-white'"
<v-icon :color="filterDuplicates ? 'primary' : 'romm-white'"
>mdi-content-duplicate</v-icon
><span
class="ml-2"
:class="{
'text-romm-white': !filterDuplicates,
'text-romm-accent-1': filterDuplicates,
'text-primary': filterDuplicates,
}"
>{{ t("platform.show-duplicates") }}</span
></v-btn

7
frontend/src/components/Gallery/AppBar/common/FilterDrawer/FilterFavouritesBtn.vue
View File

@@ -21,17 +21,16 @@ function setFavourites() {
<v-btn
block
variant="tonal"
rounded="0"
:color="filterFavourites ? 'romm-accent-1' : 'romm-gray'"
:color="filterFavourites ? 'primary' : 'romm-gray'"
@click="setFavourites()"
>
<v-icon :color="filterFavourites ? 'romm-accent-1' : 'romm-white'"
<v-icon :color="filterFavourites ? 'primary' : 'romm-white'"
>mdi-star</v-icon
><span
class="ml-2"
:class="{
'text-romm-white': !filterFavourites,
'text-romm-accent-1': filterFavourites,
'text-primary': filterFavourites,
}"
>{{ t("platform.show-favourites") }}</span
></v-btn

7
frontend/src/components/Gallery/AppBar/common/FilterDrawer/FilterMatchedBtn.vue
View File

@@ -21,17 +21,16 @@ function setUnmatched() {
<v-btn
block
variant="tonal"
rounded="0"
:color="filterMatched ? 'romm-accent-1' : 'romm-gray'"
:color="filterMatched ? 'primary' : 'romm-gray'"
@click="setUnmatched()"
>
<v-icon :color="filterMatched ? 'romm-accent-1' : 'romm-white'"
<v-icon :color="filterMatched ? 'primary' : 'romm-white'"
>mdi-file-find</v-icon
><span
class="ml-2"
:class="{
'text-romm-white': !filterMatched,
'text-romm-accent-1': filterMatched,
'text-primary': filterMatched,
}"
>{{ t("platform.show-matched") }}</span
></v-btn

7
frontend/src/components/Gallery/AppBar/common/FilterDrawer/FilterUnmatchedBtn.vue
View File

@@ -21,17 +21,16 @@ function setUnmatched() {
<v-btn
block
variant="tonal"
rounded="0"
:color="filterUnmatched ? 'romm-accent-1' : 'romm-gray'"
:color="filterUnmatched ? 'primary' : 'romm-gray'"
@click="setUnmatched()"
>
<v-icon :color="filterUnmatched ? 'romm-accent-1' : 'romm-white'"
<v-icon :color="filterUnmatched ? 'primary' : 'romm-white'"
>mdi-file-find-outline</v-icon
><span
class="ml-2"
:class="{
'text-romm-white': !filterUnmatched,
'text-romm-accent-1': filterUnmatched,
'text-primary': filterUnmatched,
}"
>{{ t("platform.show-unmatched") }}</span
></v-btn

1
frontend/src/components/Gallery/AppBar/common/FilterTextField.vue
View File

@@ -27,7 +27,6 @@ function clear() {
v-model="filterText"
prepend-inner-icon="mdi-filter-outline"
:label="t('common.filter')"
rounded="0"
hide-details
clearable
@click:clear="clear"

1
frontend/src/components/Gallery/AppBar/common/GalleryViewBtn.vue
View File

@@ -18,7 +18,6 @@ const galleryView = storeGalleryView();
>
<template #activator="{ props }">
<v-btn
rounded="0"
variant="text"
v-bind="props"
class="mr-0"

3
frontend/src/components/Gallery/AppBar/common/SelectingBtn.vue
View File

@@ -17,8 +17,7 @@ const romsStore = storeRoms();
>
<template #activator="{ props }">
<v-btn
:color="romsStore.selecting ? 'romm-accent-1' : ''"
rounded="0"
:color="romsStore.selecting ? 'primary' : ''"
variant="text"
v-bind="props"
class="mr-0"

2
frontend/src/components/Gallery/AppBar/common/SortBar.vue
View File

@@ -53,7 +53,7 @@ function sort() {}
<v-divider
:thickness="2"
class="mx-2 mt-1 border-opacity-25"
color="romm-accent-1"
color="primary"
/>
</div>
</template>

3
frontend/src/components/Gallery/AppBar/common/SortBtn.vue
View File

@@ -24,10 +24,9 @@ function showSortBar() {
<v-btn
class="ml-0"
variant="text"
rounded="0"
icon="mdi-sort"
v-bind="props"
:color="isShowSortBar ? 'romm-accent-1' : ''"
:color="isShowSortBar ? 'primary' : ''"
@click="showSortBar" /></template
></v-tooltip>
</template>

24
frontend/src/components/Gallery/FabOverlay.vue
View File

@@ -45,7 +45,7 @@ async function onScan() {
emitter?.emit("snackbarShow", {
msg: `Scanning ${romCount} game${romCount > 1 ? "s" : ""}...`,
icon: "mdi-loading mdi-spin",
color: "romm-accent-1",
color: "primary",
});
if (!socket.connected) socket.connect();
@@ -142,12 +142,12 @@ function onDownload() {
<v-btn
icon
v-show="!scrolledToTop && currentView != 2"
class="border-romm-accent-1"
class="border-selected"
color="primary"
elevation="8"
size="large"
@click="scrollToTop()"
><v-icon color="romm-accent-1">mdi-chevron-up</v-icon></v-btn
><v-icon color="primary">mdi-chevron-up</v-icon></v-btn
>
</v-scroll-y-reverse-transition>
@@ -157,7 +157,7 @@ function onDownload() {
<v-btn
v-show="selectedRoms.length > 0"
class="ml-2"
color="romm-accent-1"
color="primary"
v-bind="menuProps"
elevation="8"
icon
@@ -170,7 +170,7 @@ function onDownload() {
<v-btn
key="1"
v-if="auth.scopes.includes('roms.write')"
color="terciary"
color="tertiary"
elevation="8"
icon
size="default"
@@ -181,7 +181,7 @@ function onDownload() {
<v-btn
key="2"
v-if="auth.scopes.includes('roms.write')"
color="terciary"
color="tertiary"
elevation="8"
icon="mdi-magnify-scan"
size="default"
@@ -189,7 +189,7 @@ function onDownload() {
/>
<v-btn
key="3"
color="terciary"
color="tertiary"
elevation="8"
icon="mdi-download"
size="default"
@@ -197,7 +197,7 @@ function onDownload() {
/>
<v-btn
key="4"
color="terciary"
color="tertiary"
elevation="8"
:icon="
$route.name == 'platform'
@@ -216,7 +216,7 @@ function onDownload() {
/>
<v-btn
key="5"
color="terciary"
color="tertiary"
elevation="8"
icon="mdi-star-outline"
size="default"
@@ -224,7 +224,7 @@ function onDownload() {
/>
<v-btn
key="6"
color="terciary"
color="tertiary"
elevation="8"
icon="mdi-star"
size="default"
@@ -232,7 +232,7 @@ function onDownload() {
/>
<v-btn
key="7"
color="terciary"
color="tertiary"
elevation="8"
icon="mdi-select-all"
size="default"
@@ -240,7 +240,7 @@ function onDownload() {
/>
<v-btn
key="8"
color="terciary"
color="tertiary"
elevation="8"
icon="mdi-select"
size="default"

2
frontend/src/components/Home/Stats.vue
View File

@@ -23,7 +23,7 @@ onBeforeMount(() => {
</script>
<template>
<v-divider />
<v-card rounded="0">
<v-card>
<v-card-text class="pa-1">
<v-row no-gutters class="flex-nowrap overflow-x-auto text-center">
<v-col>

4
frontend/src/components/Settings/Administration/TaskOption.vue
View File

@@ -14,13 +14,13 @@ withDefaults(
<v-list-item class="pa-0">
<v-list-item-title
class="font-weight-bold"
:class="{ 'text-romm-accent-1': enabled }"
:class="{ 'text-primary': enabled }"
>{{ title }}</v-list-item-title
>
<v-list-item-subtitle>{{ description }}</v-list-item-subtitle>
<template #prepend
><v-icon
:class="enabled ? 'text-romm-accent-1' : ''"
:class="enabled ? 'text-primary' : ''"
:icon="icon" /></template
></v-list-item>
</v-card>

2
frontend/src/components/Settings/Administration/Tasks.vue
View File

@@ -74,7 +74,7 @@ const runAllTasks = async () => {
:loading="runningTasks.value"
prepend-icon="mdi-play"
variant="outlined"
class="text-romm-accent-1"
class="text-primary"
@click="runAllTasks"
>
Run All

8
frontend/src/components/Settings/Administration/Users/Dialog/CreateUser.vue
View File

@@ -59,7 +59,6 @@ function closeDialog() {
<v-col>
<v-text-field
v-model="user.username"
rounded="0"
variant="outlined"
label="username"
required
@@ -72,7 +71,6 @@ function closeDialog() {
<v-col>
<v-text-field
v-model="user.password"
rounded="0"
variant="outlined"
label="Password"
required
@@ -85,7 +83,6 @@ function closeDialog() {
<v-col>
<v-text-field
v-model="user.email"
rounded="0"
variant="outlined"
label="email"
required
@@ -98,7 +95,6 @@ function closeDialog() {
<v-col>
<v-select
v-model="user.role"
rounded="0"
variant="outlined"
:items="['viewer', 'editor', 'admin']"
label="Role"
@@ -113,11 +109,11 @@ function closeDialog() {
<template #append>
<v-row class="justify-center mb-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog"> Cancel </v-btn>
<v-btn class="bg-toplayer" @click="closeDialog"> Cancel </v-btn>
<v-btn
:disabled="!user.username || !user.password"
:variant="!user.username || !user.password ? 'plain' : 'flat'"
class="text-romm-green bg-terciary"
class="text-romm-green bg-toplayer"
@click="createUser()"
>
Create

6
frontend/src/components/Settings/Administration/Users/Dialog/DeleteUser.vue
View File

@@ -72,15 +72,15 @@ function closeDialog() {
"
>
</v-img> </v-avatar
><span class="text-romm-accent-1 ml-1">{{ user.username }}</span
><span class="text-primary ml-1">{{ user.username }}</span
><span class="ml-1">user. Do you confirm?</span>
</v-row></template
>
<template #append>
<v-row class="justify-center mb-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog"> Cancel </v-btn>
<v-btn class="bg-terciary text-romm-red" @click="deleteUser()">
<v-btn class="bg-toplayer" @click="closeDialog"> Cancel </v-btn>
<v-btn class="bg-toplayer text-romm-red" @click="deleteUser()">
Confirm
</v-btn>
</v-btn-group>

8
frontend/src/components/Settings/Administration/Users/Dialog/EditUser.vue
View File

@@ -95,7 +95,6 @@ function closeDialog() {
<v-col>
<v-text-field
v-model="user.username"
rounded="0"
variant="outlined"
:label="t('settings.username')"
required
@@ -108,7 +107,6 @@ function closeDialog() {
<v-col>
<v-text-field
v-model="user.password"
rounded="0"
variant="outlined"
:label="t('settings.password')"
required
@@ -121,7 +119,6 @@ function closeDialog() {
<v-col>
<v-text-field
v-model="user.email"
rounded="0"
variant="outlined"
label="email"
required
@@ -134,7 +131,6 @@ function closeDialog() {
<v-col>
<v-select
v-model="user.role"
rounded="0"
variant="outlined"
:items="['viewer', 'editor', 'admin']"
:label="t('settings.role')"
@@ -186,13 +182,13 @@ function closeDialog() {
<template #append>
<v-row class="justify-center mb-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog">
<v-btn class="bg-toplayer" @click="closeDialog">
{{ t("common.cancel") }}
</v-btn>
<v-btn
:variant="!user.username ? 'plain' : 'flat'"
:disabled="!user.username"
class="text-romm-green bg-terciary"
class="text-romm-green bg-toplayer"
@click="editUser"
>
{{ t("common.apply") }}

10
frontend/src/components/Settings/Administration/Users/Table.vue
View File

@@ -96,12 +96,11 @@ onMounted(() => {
v-model="userSearch"
prepend-inner-icon="mdi-magnify"
label="Search"
rounded="0"
single-line
hide-details
clearable
density="comfortable"
class="bg-secondary"
class="bg-surface"
/>
<v-data-table
v-model:items-per-page="usersPerPage"
@@ -119,7 +118,7 @@ onMounted(() => {
<v-btn
prepend-icon="mdi-plus"
variant="outlined"
class="text-romm-accent-1"
class="text-primary"
@click="emitter?.emit('showCreateUserDialog', null)"
>
Add
@@ -143,7 +142,7 @@ onMounted(() => {
<v-switch
inset
v-model="item.enabled"
color="romm-accent-1"
color="primary"
:disabled="item.id == auth.user?.id"
hide-details
@change="disableUser(item)"
@@ -175,8 +174,7 @@ onMounted(() => {
<v-pagination
:show-first-last-page="!xs"
v-model="page"
rounded="0"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>

81
frontend/src/components/Settings/Footer.vue
View File

@@ -7,46 +7,43 @@ const { t } = useI18n();
const heartbeatStore = storeHeartbeat();
</script>
<template>
<v-bottom-navigation
:elevation="0"
height="36"
class="bg-terciary text-caption"
>
<v-row class="align-center justify-center" no-gutters>
<span class="text-romm-accent-1">RomM</span>
<span class="ml-1">{{ heartbeatStore.value.SYSTEM.VERSION }}</span>
<v-icon>mdi-circle-small</v-icon><v-icon>mdi-github</v-icon>
<v-hover v-slot="{ isHovering, props }">
<span class="ml-1"
><a
:class="{
'text-romm-accent-1': isHovering,
'text-white': !isHovering,
}"
v-bind="props"
style="text-decoration: none"
href="https://github.com/rommapp/romm"
target="_blank"
>Github</a
></span
>
</v-hover>
<v-icon>mdi-circle-small</v-icon>
<v-hover v-slot="{ isHovering, props }">
<span class="ml-1"
><a
:class="{
'text-romm-accent-1': isHovering,
'text-white': !isHovering,
}"
v-bind="props"
style="text-decoration: none"
href="https://discord.com/invite/P5HtHnhUDH"
target="_blank"
>{{ t("settings.join-discord") }}</a
></span
>
</v-hover>
</v-row>
</v-bottom-navigation>
<div class="position-fixed bottom-0 w-100">
<v-card class="bg-toplayer ma-2 pa-2">
<v-row class="align-center justify-center" no-gutters>
<span class="ml-1">{{ heartbeatStore.value.SYSTEM.VERSION }}</span>
<v-icon>mdi-circle-small</v-icon><v-icon>mdi-github</v-icon>
<v-hover v-slot="{ isHovering, props }">
<span class="ml-1"
><a
:class="{
'text-primary': isHovering,
'text-white': !isHovering,
}"
v-bind="props"
style="text-decoration: none"
href="https://github.com/rommapp/romm"
target="_blank"
>Github</a
></span
>
</v-hover>
<v-icon>mdi-circle-small</v-icon>
<v-hover v-slot="{ isHovering, props }">
<span class="ml-1"
><a
:class="{
'text-primary': isHovering,
'text-white': !isHovering,
}"
v-bind="props"
style="text-decoration: none"
href="https://discord.com/invite/P5HtHnhUDH"
target="_blank"
>{{ t("settings.join-discord") }}</a
></span
>
</v-hover>
</v-row>
</v-card>
</div>
</template>

3
frontend/src/components/Settings/LibraryManagement/AddBtn.vue
View File

@@ -16,11 +16,10 @@ const emit = defineEmits(["click"]);
<v-btn
v-if="enabled"
block
rounded="0"
size="large"
prepend-icon="mdi-plus"
variant="outlined"
class="text-romm-accent-1"
class="text-primary"
@click="$emit('click')"
>
{{ t("common.add") }}

4
frontend/src/components/Settings/LibraryManagement/Dialog/CreateExclusion.vue
View File

@@ -83,11 +83,11 @@ function closeDialog() {
<template #append>
<v-row class="justify-center mb-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog">
<v-btn class="bg-toplayer" @click="closeDialog">
{{ t("common.cancel") }}
</v-btn>
<v-btn
class="bg-terciary text-romm-green"
class="bg-toplayer text-romm-green"
:disabled="exclusionValue == ''"
:variant="exclusionValue == '' ? 'plain' : 'flat'"
@click="addExclusion"

12
frontend/src/components/Settings/LibraryManagement/Dialog/CreatePlatformBinding.vue
View File

@@ -92,7 +92,7 @@ function closeDialog() {
<v-col cols="10">
<v-icon icon="mdi-controller" class="ml-5" />
<v-icon icon="mdi-menu-right" class="ml-1 text-romm-gray" />
<v-icon icon="mdi-controller" class="ml-1 text-romm-accent-1" />
<v-icon icon="mdi-controller" class="ml-1 text-primary" />
</v-col>
</v-row>
</template>
@@ -115,11 +115,11 @@ function closeDialog() {
<v-col cols="6">
<v-autocomplete
v-model="selectedPlatform"
class="text-romm-accent-1"
class="text-primary"
:label="t('settings.romm-platform')"
:items="supportedPlatforms"
color="romm-accent-1"
base-color="romm-accent-1"
color="primary"
base-color="primary"
variant="outlined"
required
return-object
@@ -161,11 +161,11 @@ function closeDialog() {
<template #append>
<v-row class="justify-center mb-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog">
<v-btn class="bg-toplayer" @click="closeDialog">
{{ t("common.cancel") }}
</v-btn>
<v-btn
class="bg-terciary text-romm-green"
class="bg-toplayer text-romm-green"
:disabled="fsSlugToCreate == '' || selectedPlatform?.slug == ''"
:variant="
fsSlugToCreate == '' || selectedPlatform?.slug == ''

12
frontend/src/components/Settings/LibraryManagement/Dialog/CreatePlatformVersion.vue
View File

@@ -93,7 +93,7 @@ function closeDialog() {
<v-col cols="10">
<v-icon icon="mdi-gamepad-variant" class="ml-5" />
<v-icon icon="mdi-menu-right" class="ml-1 text-romm-gray" />
<v-icon icon="mdi-controller" class="ml-1 text-romm-accent-1" />
<v-icon icon="mdi-controller" class="ml-1 text-primary" />
</v-col>
</v-row>
</template>
@@ -116,11 +116,11 @@ function closeDialog() {
<v-col cols="6">
<v-autocomplete
v-model="selectedPlatform"
class="text-romm-accent-1"
class="text-primary"
:label="t('settings.main-platform')"
color="romm-accent-1"
color="primary"
:items="supportedPlatforms"
base-color="romm-accent-1"
base-color="primary"
variant="outlined"
required
return-object
@@ -162,11 +162,11 @@ function closeDialog() {
<template #append>
<v-row class="justify-center mb-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog">
<v-btn class="bg-toplayer" @click="closeDialog">
{{ t("common.cancel") }}
</v-btn>
<v-btn
class="bg-terciary text-romm-green"
class="bg-toplayer text-romm-green"
:disabled="fsSlugToCreate == '' || selectedPlatform?.slug == ''"
:variant="
fsSlugToCreate == '' || selectedPlatform?.slug == ''

10
frontend/src/components/Settings/LibraryManagement/Dialog/DeletePlatformBinding.vue
View File

@@ -58,13 +58,11 @@ function closeDialog() {
:slug="platformBindingSlugToDelete"
/>
<span>[</span>
<span class="text-romm-accent-1 ml-1">
<span class="text-primary ml-1">
{{ platformBindingFSSlugToDelete }}</span
>
<span class="mx-1">:</span>
<span class="text-romm-accent-1">{{
platformBindingSlugToDelete
}}</span>
<span class="text-primary">{{ platformBindingSlugToDelete }}</span>
<span class="ml-1">].</span>
<span class="ml-1">Do you confirm?</span>
</v-row>
@@ -72,8 +70,8 @@ function closeDialog() {
<template #append>
<v-row class="justify-center mb-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog"> Cancel </v-btn>
<v-btn class="bg-terciary text-romm-red" @click="deleteBindPlatform">
<v-btn class="bg-toplayer" @click="closeDialog"> Cancel </v-btn>
<v-btn class="bg-toplayer text-romm-red" @click="deleteBindPlatform">
Confirm
</v-btn>
</v-btn-group>

8
frontend/src/components/Settings/LibraryManagement/Dialog/DeletePlatformVersion.vue
View File

@@ -55,9 +55,9 @@ function closeDialog() {
<span class="mr-1">Deleting platform binding</span>
<platform-icon class="mx-2" :key="slugToDelete" :slug="slugToDelete" />
<span>[</span>
<span class="text-romm-accent-1 ml-1"> {{ fsSlugToDelete }}</span>
<span class="text-primary ml-1"> {{ fsSlugToDelete }}</span>
<span class="mx-1">:</span>
<span class="text-romm-accent-1">{{ slugToDelete }}</span>
<span class="text-primary">{{ slugToDelete }}</span>
<span class="ml-1">].</span>
<span class="ml-1">Do you confirm?</span>
</v-row>
@@ -65,9 +65,9 @@ function closeDialog() {
<template #append>
<v-row class="justify-center mb-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog"> Cancel </v-btn>
<v-btn class="bg-toplayer" @click="closeDialog"> Cancel </v-btn>
<v-btn
class="bg-terciary text-romm-red"
class="bg-toplayer text-romm-red"
@click="deleteVersionPlatform"
>
Confirm

3
frontend/src/components/Settings/LibraryManagement/Excluded.vue
View File

@@ -57,9 +57,8 @@ const editable = ref(false);
<v-btn
v-if="authStore.scopes.includes('platforms.write')"
class="ma-2"
rounded="0"
size="small"
:color="editable ? 'romm-accent-1' : ''"
:color="editable ? 'primary' : ''"
variant="text"
icon="mdi-cog"
@click="editable = !editable"

5
frontend/src/components/Settings/LibraryManagement/ExcludedCard.vue
View File

@@ -32,7 +32,7 @@ function removeExclusion(exclusionValue: string) {
}
</script>
<template>
<v-card rounded="0" color="terciary">
<v-card color="tertiary">
<v-card-title class="text-body-2 align-center justify-center"
><v-icon class="mr-2">{{ icon }}</v-icon
>{{ title }}</v-card-title
@@ -49,7 +49,6 @@ function removeExclusion(exclusionValue: string) {
<v-slide-x-reverse-transition>
<v-btn
v-if="editable"
rounded="0"
variant="text"
size="x-small"
icon="mdi-delete"
@@ -64,7 +63,7 @@ function removeExclusion(exclusionValue: string) {
rounded="1"
prepend-icon="mdi-plus"
variant="outlined"
class="text-romm-accent-1 ml-1"
class="text-primary ml-1"
@click="
emitter?.emit('showCreateExclusionDialog', {
type: type,

8
frontend/src/components/Settings/LibraryManagement/PlatformBindCard.vue
View File

@@ -14,19 +14,18 @@ defineProps<{
}>();
</script>
<template>
<v-card rounded="0" elevation="0">
<v-card elevation="0">
<v-card-text class="pa-1">
<v-list-item class="bg-terciary pa-1 text-truncate">
<v-list-item class="bg-toplayer pa-1 text-truncate">
<template #prepend>
<platform-icon class="mx-2" :key="slug" :slug="slug" />
</template>
<v-list-item class="bg-primary pr-2 pl-2">
<v-list-item class="bg-background pr-2 pl-2">
<span>{{ fsSlug }}</span>
<template #append>
<v-slide-x-reverse-transition>
<v-btn
v-if="editable"
rounded="0"
variant="text"
size="x-small"
icon="mdi-pencil"
@@ -37,7 +36,6 @@ defineProps<{
<v-slide-x-reverse-transition>
<v-btn
v-if="editable"
rounded="0"
variant="text"
size="x-small"
icon="mdi-delete"

3
frontend/src/components/Settings/LibraryManagement/PlatformBinding.vue
View File

@@ -27,9 +27,8 @@ const editable = ref(false);
<v-btn
v-if="authStore.scopes.includes('platforms.write')"
class="ma-2"
rounded="0"
size="small"
:color="editable ? 'romm-accent-1' : ''"
:color="editable ? 'primary' : ''"
variant="text"
icon="mdi-cog"
@click="editable = !editable"

3
frontend/src/components/Settings/LibraryManagement/PlatformVersions.vue
View File

@@ -30,9 +30,8 @@ const editable = ref(false);
<v-btn
v-if="authStore.scopes.includes('platforms.write')"
class="ma-2"
rounded="0"
size="small"
:color="editable ? 'romm-accent-1' : ''"
:color="editable ? 'primary' : ''"
variant="text"
icon="mdi-cog"
@click="editable = !editable"

8
frontend/src/components/Settings/UserInterface/InterfaceOption.vue
View File

@@ -17,12 +17,12 @@ const emit = defineEmits(["update:modelValue"]);
<v-card elevation="0">
<v-list-item class="pa-1"
><template #prepend
><v-icon :class="modelValue ? 'text-romm-accent-1' : ''" :icon="icon"
><v-icon :class="modelValue ? 'text-primary' : ''" :icon="icon"
/></template>
<v-list-item-title
class="font-weight-bold"
:class="{ 'text-romm-accent-1': modelValue }"
:class="{ 'text-primary': modelValue }"
>{{ title }}</v-list-item-title
>
<v-list-item-subtitle>{{ description }}</v-list-item-subtitle>
@@ -33,7 +33,7 @@ const emit = defineEmits(["update:modelValue"]);
:model-value="modelValue"
@update:model-value="(value) => emit('update:modelValue', value)"
:class="{ 'pr-16': !xs }"
color="romm-accent-1"
color="primary"
hide-details
/> </template
></v-list-item>
@@ -41,7 +41,7 @@ const emit = defineEmits(["update:modelValue"]);
</template>
<style scoped>
.text-romm-accent-1 {
.text-primary {
transition: color 0.3s ease-in-out;
}

2
frontend/src/components/Settings/UserInterface/ThemeOption.vue
View File

@@ -13,7 +13,7 @@ withDefaults(defineProps<{ text: string; icon: string }>(), {
<template>
<v-item v-slot="{ isSelected, toggle }">
<v-card
:color="isSelected ? 'romm-accent-1' : 'romm-gray'"
:color="isSelected ? 'primary' : 'romm-gray'"
class="d-flex align-center"
height="50"
variant="outlined"

6
frontend/src/components/common/Collection/Card.vue
View File

@@ -42,7 +42,7 @@ const galleryViewStore = storeGalleryView();
}"
:elevation="isHovering && transformScale ? 20 : 3"
>
<v-row v-if="showTitle" class="pa-1 justify-center bg-primary">
<v-row v-if="showTitle" class="pa-1 justify-center bg-background">
<div
:title="collection.name?.toString()"
class="py-4 px-6 text-truncate text-caption"
@@ -88,7 +88,7 @@ const galleryViewStore = storeGalleryView();
<v-progress-circular
:width="2"
:size="40"
color="romm-accent-1"
color="primary"
indeterminate
/>
</div>
@@ -96,7 +96,7 @@ const galleryViewStore = storeGalleryView();
</v-img>
<v-chip
v-if="showRomCount"
class="bg-chip position-absolute"
class="bg-background position-absolute"
size="x-small"
style="bottom: 0.5rem; right: 0.5rem"
label

9
frontend/src/components/common/Collection/Dialog/AddRoms.vue
View File

@@ -95,7 +95,7 @@ function closeDialog() {
<template #header>
<v-row no-gutters class="justify-center">
<span>{{ t("rom.adding-to-collection-part1") }}</span>
<span class="text-romm-accent-1 mx-1">{{ roms.length }}</span>
<span class="text-primary mx-1">{{ roms.length }}</span>
<span>{{ t("rom.adding-to-collection-part2") }}</span>
</v-row>
</template>
@@ -151,9 +151,8 @@ function closeDialog() {
<v-col class="px-6">
<v-pagination
v-model="page"
rounded="0"
:show-first-last-page="true"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>
@@ -175,11 +174,11 @@ function closeDialog() {
<template #append>
<v-row class="justify-center my-2">
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog" variant="flat">
<v-btn class="bg-toplayer" @click="closeDialog" variant="flat">
{{ t("common.cancel") }}
</v-btn>
<v-btn
class="bg-terciary text-romm-green"
class="bg-toplayer text-romm-green"
:disabled="!selectedCollection"
:variant="!selectedCollection ? 'plain' : 'flat'"
@click="addRomsToCollection"

6
frontend/src/components/common/Collection/Dialog/CreateCollection.vue
View File

@@ -152,7 +152,7 @@ function closeDialog() {
:src="imagePreviewUrl"
>
<template #append-inner>
<v-btn-group rounded="0" divided density="compact">
<v-btn-group divided density="compact">
<v-btn
:disabled="
!heartbeat.value.METADATA_SOURCES?.STEAMGRIDDB_ENABLED
@@ -203,11 +203,11 @@ function closeDialog() {
<template #append>
<v-row class="justify-center mt-4 mb-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog">
<v-btn class="bg-toplayer" @click="closeDialog">
{{ t("common.cancel") }}
</v-btn>
<v-btn
class="bg-terciary text-romm-green"
class="bg-toplayer text-romm-green"
:disabled="!collection.name"
:variant="!collection.name ? 'plain' : 'flat'"
@click="createCollection"

4
frontend/src/components/common/Collection/Dialog/DeleteCollection.vue
View File

@@ -88,10 +88,10 @@ function closeDialog() {
<template #append>
<v-row class="justify-center pa-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog">
<v-btn class="bg-toplayer" @click="closeDialog">
{{ t("common.cancel") }}
</v-btn>
<v-btn class="bg-terciary text-romm-red" @click="deleteCollection">
<v-btn class="bg-toplayer text-romm-red" @click="deleteCollection">
{{ t("common.confirm") }}
</v-btn>
</v-btn-group>

9
frontend/src/components/common/Collection/Dialog/RemoveRoms.vue
View File

@@ -100,7 +100,7 @@ function closeDialog() {
<template #header>
<v-row no-gutters class="justify-center">
<span>{{ t("rom.remove-from-collection-part1") }}</span>
<span class="text-romm-accent-1 mx-1">{{ roms.length }}</span>
<span class="text-primary mx-1">{{ roms.length }}</span>
<span>{{ t("rom.remove-from-collection-part2") }}</span>
</v-row>
</template>
@@ -124,9 +124,8 @@ function closeDialog() {
<v-col class="px-6">
<v-pagination
v-model="page"
rounded="0"
:show-first-last-page="true"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>
@@ -148,11 +147,11 @@ function closeDialog() {
<template #append>
<v-row class="justify-center my-2">
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog" variant="flat">
<v-btn class="bg-toplayer" @click="closeDialog" variant="flat">
{{ t("common.cancel") }}
</v-btn>
<v-btn
class="bg-terciary text-romm-red"
class="bg-toplayer text-romm-red"
variant="flat"
@click="removeRomsFromCollection"
>

2
frontend/src/components/common/Collection/RAvatar.vue
View File

@@ -9,7 +9,7 @@ const theme = useTheme();
</script>
<template>
<v-avatar :rounded="0" :size="size">
<v-avatar :size="size">
<v-img
:src="
collection.has_cover

2
frontend/src/components/common/Game/AdminMenu.vue
View File

@@ -89,7 +89,7 @@ async function switchFromFavourites() {
</script>
<template>
<v-list rounded="0" class="pa-0">
<v-list class="pa-0">
<template v-if="auth.scopes.includes('roms.write')">
<v-list-item
:disabled="!heartbeat.value.METADATA_SOURCES.ANY_SOURCE_ENABLED"

5
frontend/src/components/common/Game/Card/ActionBar.vue
View File

@@ -43,7 +43,6 @@ const is3DSRom = computed(() => {
size="x-small"
:disabled="downloadStore.value.includes(rom.id)"
icon="mdi-download"
rounded="0"
variant="text"
@click.prevent="romApi.downloadRom({ rom })"
/>
@@ -64,7 +63,6 @@ const is3DSRom = computed(() => {
})
"
icon="mdi-play"
rounded="0"
variant="text"
/>
<v-btn
@@ -79,7 +77,6 @@ const is3DSRom = computed(() => {
})
"
icon="mdi-play"
rounded="0"
variant="text"
/>
</v-col>
@@ -90,7 +87,6 @@ const is3DSRom = computed(() => {
size="x-small"
@click="emitter?.emit('showQRCodeDialog', rom)"
icon="mdi-qrcode"
rounded="0"
variant="text"
/>
</v-col>
@@ -103,7 +99,6 @@ const is3DSRom = computed(() => {
size="x-small"
v-bind="props"
icon="mdi-dots-vertical"
rounded="0"
variant="text"
/>
</template>

8
frontend/src/components/common/Game/Card/Base.vue
View File

@@ -96,7 +96,7 @@ const computedAspectRatio = computed(() => {
}"
:class="{
'on-hover': isHovering,
'border-romm-accent-1': withBorderRommAccent,
'border-selected': withBorderRommAccent,
'transform-scale': transformScale,
'with-border': withBorder,
}"
@@ -105,7 +105,7 @@ const computedAspectRatio = computed(() => {
<v-card-text class="pa-0">
<v-progress-linear
v-if="romsStore.isSimpleRom(rom)"
color="romm-accent-1"
color="primary"
:active="downloadStore.value.includes(rom.id)"
:indeterminate="true"
absolute
@@ -191,7 +191,7 @@ const computedAspectRatio = computed(() => {
class="label-fav"
rouded="0"
size="small"
color="romm-accent-1"
color="primary"
>
<v-icon class="icon-fav" size="x-small"
>{{
@@ -223,7 +223,7 @@ const computedAspectRatio = computed(() => {
<v-progress-circular
:width="2"
:size="40"
color="romm-accent-1"
color="primary"
indeterminate
/>
</div>

1
frontend/src/components/common/Game/Card/Related.vue
View File

@@ -34,7 +34,6 @@ const galleryViewStore = storeGalleryView();
><v-chip
class="px-2 position-absolute chip-type text-white translucent-dark"
density="compact"
rounded="0"
label
>
<span>

11
frontend/src/components/common/Game/Dialog/Asset/DeleteAssets.vue
View File

@@ -116,9 +116,9 @@ function closeDialog() {
<template #header>
<v-row no-gutters class="justify-center">
<span>Removing</span>
<span class="text-romm-accent-1 mx-1">{{ assets.length }}</span>
<span class="text-primary mx-1">{{ assets.length }}</span>
<span>{{ assetType.slice(5) }} of</span>
<span class="text-romm-accent-1 mx-1">{{ romRef?.name }}</span>
<span class="text-primary mx-1">{{ romRef?.name }}</span>
<span>from RomM</span>
</v-row>
</template>
@@ -204,9 +204,8 @@ function closeDialog() {
<v-col class="px-6">
<v-pagination
v-model="page"
rounded="0"
:show-first-last-page="true"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>
@@ -243,11 +242,11 @@ function closeDialog() {
</v-row>
<v-row class="justify-center my-2">
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog" variant="flat">
<v-btn class="bg-toplayer" @click="closeDialog" variant="flat">
Cancel
</v-btn>
<v-btn
class="text-romm-red bg-terciary"
class="text-romm-red bg-toplayer"
variant="flat"
@click="deleteAssets"
>

9
frontend/src/components/common/Game/Dialog/Asset/UploadSaves.vue
View File

@@ -55,7 +55,7 @@ async function uploadSaves() {
emitter?.emit("snackbarShow", {
msg: `Uploading ${filesToUpload.value.length} saves to ${rom.value?.name}...`,
icon: "mdi-loading mdi-spin",
color: "romm-accent-1",
color: "primary",
});
saveApi
@@ -169,9 +169,8 @@ watch(itemsPerPage, async () => {
<v-col class="px-6">
<v-pagination
v-model="page"
rounded="0"
:show-first-last-page="true"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>
@@ -195,9 +194,9 @@ watch(itemsPerPage, async () => {
<template #append>
<v-row class="justify-center my-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog"> Cancel </v-btn>
<v-btn class="bg-toplayer" @click="closeDialog"> Cancel </v-btn>
<v-btn
class="bg-terciary text-romm-green"
class="bg-toplayer text-romm-green"
:variant="
filesToUpload.length == 0 || rom == null ? 'plain' : 'flat'
"

9
frontend/src/components/common/Game/Dialog/Asset/UploadStates.vue
View File

@@ -55,7 +55,7 @@ function uploadStates() {
emitter?.emit("snackbarShow", {
msg: `Uploading ${filesToUpload.value.length} states to ${rom.value?.name}...`,
icon: "mdi-loading mdi-spin",
color: "romm-accent-1",
color: "primary",
});
stateApi
@@ -161,9 +161,8 @@ watch(itemsPerPage, async () => {
<v-col class="px-6">
<v-pagination
v-model="page"
rounded="0"
:show-first-last-page="true"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>
@@ -187,9 +186,9 @@ watch(itemsPerPage, async () => {
<template #append>
<v-row class="justify-center my-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog"> Cancel </v-btn>
<v-btn class="bg-toplayer" @click="closeDialog"> Cancel </v-btn>
<v-btn
class="bg-terciary text-romm-green"
class="bg-toplayer text-romm-green"
:variant="
filesToUpload.length == 0 || rom == null ? 'plain' : 'flat'
"

2
frontend/src/components/common/Game/Dialog/CopyDownloadLink.vue
View File

@@ -35,7 +35,7 @@ function closeDialog() {
<v-list-item>{{ t("rom.cant-copy-link") }}:</v-list-item>
</v-row>
<v-row class="justify-center text-center pa-2 mb-3" no-gutters>
<v-list-item class="bg-terciary">{{ link }}</v-list-item>
<v-list-item class="bg-toplayer">{{ link }}</v-list-item>
</v-row>
</template></r-dialog
>

9
frontend/src/components/common/Game/Dialog/DeleteRom.vue
View File

@@ -97,7 +97,7 @@ function closeDialog() {
<template #header>
<v-row no-gutters class="justify-center">
<span>Removing</span>
<span class="text-romm-accent-1 mx-1">{{ roms.length }}</span>
<span class="text-primary mx-1">{{ roms.length }}</span>
<span>games from RomM</span>
</v-row>
</template>
@@ -140,9 +140,8 @@ function closeDialog() {
<v-col class="px-6">
<v-pagination
v-model="page"
rounded="0"
:show-first-last-page="true"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>
@@ -178,11 +177,11 @@ function closeDialog() {
</v-row>
<v-row class="justify-center my-2">
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog" variant="flat">
<v-btn class="bg-toplayer" @click="closeDialog" variant="flat">
Cancel
</v-btn>
<v-btn
class="text-romm-red bg-terciary"
class="text-romm-red bg-toplayer"
variant="flat"
@click="deleteRoms"
>

10
frontend/src/components/common/Game/Dialog/EditRom.vue
View File

@@ -186,7 +186,7 @@ function closeDialog() {
>
<template #details>
<v-label class="text-caption text-wrap">
<v-icon size="small" class="mr-2 text-romm-accent-1">
<v-icon size="small" class="mr-2 text-primary">
mdi-folder-file-outline
</v-icon>
<span>
@@ -220,7 +220,7 @@ function closeDialog() {
<v-col style="max-width: 240px">
<game-card :rom="rom" :src="imagePreviewUrl">
<template #append-inner-right>
<v-btn-group rounded="0" divided density="compact">
<v-btn-group divided density="compact">
<v-btn
:disabled="
!heartbeat.value.METADATA_SOURCES?.STEAMGRIDDB_ENABLED
@@ -270,17 +270,17 @@ function closeDialog() {
<v-row class="justify-space-between px-4 py-2 mt-1" no-gutters>
<v-btn
:disabled="noMetadataMatch"
:class="` ${noMetadataMatch ? '' : 'bg-terciary text-romm-red'}`"
:class="` ${noMetadataMatch ? '' : 'bg-toplayer text-romm-red'}`"
variant="flat"
@click="unmatchRom"
>
{{ t("rom.unmatch-rom") }}
</v-btn>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog">
<v-btn class="bg-toplayer" @click="closeDialog">
{{ t("common.cancel") }}
</v-btn>
<v-btn class="text-romm-green bg-terciary" @click="updateRom">
<v-btn class="text-romm-green bg-toplayer" @click="updateRom">
{{ t("common.apply") }}
</v-btn>
</v-btn-group>

31
frontend/src/components/common/Game/Dialog/MatchRom.vue
View File

@@ -297,7 +297,7 @@ onBeforeUnmount(() => {
id="search-text-field"
@keyup.enter="searchRom()"
@click:clear="searchTerm = ''"
class="bg-terciary"
class="bg-toplayer"
v-model="searchTerm"
:disabled="searching"
:label="t('common.search')"
@@ -309,7 +309,7 @@ onBeforeUnmount(() => {
<v-select
:disabled="searching"
:label="t('rom.by')"
class="bg-terciary"
class="bg-toplayer"
:items="['ID', 'Name']"
v-model="searchBy"
hide-details
@@ -319,8 +319,7 @@ onBeforeUnmount(() => {
<v-btn
type="submit"
@click="searchRom()"
class="bg-terciary"
rounded="0"
class="bg-toplayer"
variant="text"
icon="mdi-search-web"
block
@@ -352,12 +351,11 @@ onBeforeUnmount(() => {
<template v-if="showSelectSource">
<v-row no-gutters>
<v-col cols="12">
<v-card class="mx-auto bg-terciary">
<v-card class="mx-auto bg-toplayer">
<v-card-title class="text-center">
<v-btn
color="terciary"
color="tertiary"
icon="mdi-arrow-left"
rounded="0"
variant="flat"
size="small"
@click="backToMatched"
@@ -389,8 +387,7 @@ onBeforeUnmount(() => {
class="transform-scale mx-2"
:class="{
'on-hover': isHovering,
'border-romm-accent-1':
selectedCover?.name == source.name,
'border-primary': selectedCover?.name == source.name,
}"
:elevation="isHovering ? 20 : 3"
@click="selectCover(source)"
@@ -410,7 +407,7 @@ onBeforeUnmount(() => {
class="d-flex align-center justify-center fill-height"
>
<v-progress-circular
color="romm-accent-1"
color="primary"
:width="2"
indeterminate
/>
@@ -433,7 +430,7 @@ onBeforeUnmount(() => {
<v-chip
@click="toggleRenameAsSource"
:variant="renameAsSource ? 'flat' : 'outlined'"
:color="renameAsSource ? 'romm-accent-1' : ''"
:color="renameAsSource ? 'primary' : ''"
:disabled="selectedCover == undefined"
><v-icon class="mr-1">{{
selectedCover && renameAsSource
@@ -448,14 +445,14 @@ onBeforeUnmount(() => {
<span>{{ t("rom.rename-file-part2") }}</span>
<br />
<span>{{ t("rom.rename-file-part3") }}</span
><span class="text-romm-accent-1 ml-1"
><span class="text-primary ml-1"
>{{ rom?.file_name_no_tags }}.{{
rom?.file_extension
}}</span
>
<br />
<span class="mx-1">{{ t("rom.rename-file-part4") }}</span
><span class="text-romm-accent-2"
><span class="text-primary"
>{{ selectedMatchRom?.name }}.{{
rom?.file_extension
}}</span
@@ -471,11 +468,11 @@ onBeforeUnmount(() => {
<v-col cols="12">
<v-row no-gutters class="my-4 justify-center">
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="backToMatched">
<v-btn class="bg-toplayer" @click="backToMatched">
{{ t("common.cancel") }}
</v-btn>
<v-btn
class="text-romm-green bg-terciary"
class="text-romm-green bg-toplayer"
:disabled="selectedCover == undefined"
:variant="selectedCover == undefined ? 'plain' : 'flat'"
@click="confirm"
@@ -493,7 +490,7 @@ onBeforeUnmount(() => {
<v-col>
<v-chip label class="pr-0" size="small"
>{{ t("rom.results-found") }}:<v-chip
color="romm-accent-1"
color="primary"
class="ml-2 px-2"
label
>{{ !searching ? matchedRoms.length : ""
@@ -501,7 +498,7 @@ onBeforeUnmount(() => {
v-if="searching"
:width="1"
:size="10"
color="romm-accent-1"
color="primary"
indeterminate
/></v-chip>
</v-chip>

7
frontend/src/components/common/Game/Dialog/SearchRom.vue
View File

@@ -120,14 +120,14 @@ onBeforeUnmount(() => {
:disabled="searching"
:label="t('common.search')"
hide-details
class="bg-terciary"
class="bg-toplayer"
/>
</v-col>
<v-col cols="5" lg="4">
<v-select
@click:clear="clearFilter"
:label="t('common.platform')"
class="bg-terciary"
class="bg-toplayer"
item-title="platform_name"
:disabled="platforms.length == 0 || searching"
hide-details
@@ -175,8 +175,7 @@ onBeforeUnmount(() => {
<v-btn
type="submit"
@click="searchRoms"
class="bg-terciary"
rounded="0"
class="bg-toplayer"
variant="text"
icon="mdi-magnify"
block

10
frontend/src/components/common/Game/Dialog/UploadRom.vue
View File

@@ -228,8 +228,7 @@ watch(itemsPerPage, async () => {
<v-btn
block
icon=""
class="text-romm-accent-1 bg-terciary"
rounded="0"
class="text-primary bg-toplayer"
variant="text"
@click="triggerFileInput"
>
@@ -293,9 +292,8 @@ watch(itemsPerPage, async () => {
<v-col class="px-6">
<v-pagination
v-model="page"
rounded="0"
:show-first-last-page="true"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>
@@ -317,11 +315,11 @@ watch(itemsPerPage, async () => {
<template #append>
<v-row class="justify-center mb-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog">{{
<v-btn class="bg-toplayer" @click="closeDialog">{{
t("common.cancel")
}}</v-btn>
<v-btn
class="bg-terciary text-romm-green"
class="bg-toplayer text-romm-green"
:disabled="filesToUpload.length == 0 || selectedPlatform == null"
:variant="
filesToUpload.length == 0 || selectedPlatform == null

2
frontend/src/components/common/Game/FavBtn.vue
View File

@@ -91,7 +91,7 @@ async function switchFromFavourites() {
size="x-small"
variant="text"
icon
><v-icon color="romm-accent-1">{{
><v-icon color="primary">{{
collectionsStore.isFav(rom) ? "mdi-star" : "mdi-star-outline"
}}</v-icon></v-btn
>

2
frontend/src/components/common/Game/ListItem.vue
View File

@@ -41,7 +41,7 @@ withDefaults(
><v-col>{{ rom.name }}</v-col></v-row
>
<v-row v-if="withFilename" no-gutters
><v-col class="text-romm-accent-1">{{ rom.file_name }}</v-col></v-row
><v-col class="text-primary">{{ rom.file_name }}</v-col></v-row
>
<slot name="append-body"></slot>
<template #append>

2
frontend/src/components/common/Game/RAvatar.vue
View File

@@ -7,7 +7,7 @@ const theme = useTheme();
</script>
<template>
<v-avatar :rounded="0" :size="size">
<v-avatar :size="size">
<v-img
:src="
!rom.igdb_id && !rom.moby_id && !rom.has_cover

7
frontend/src/components/common/Game/Table.vue
View File

@@ -178,9 +178,7 @@ onMounted(() => {
<v-col>{{ item.name }}</v-col></v-row
>
<v-row no-gutters
><v-col class="text-romm-accent-1">{{
item.file_name
}}</v-col></v-row
><v-col class="text-primary">{{ item.file_name }}</v-col></v-row
>
<template #append>
<v-chip
@@ -270,8 +268,7 @@ onMounted(() => {
:show-first-last-page="!xs"
v-model="page"
@update:model-value="updateUrlHash"
rounded="0"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>

5
frontend/src/components/common/Navigation/CollectionsBtn.vue
View File

@@ -19,12 +19,11 @@ const { activeCollectionsDrawer } = storeToRefs(navigationStore);
<template>
<v-btn
:block="block"
rounded="0"
variant="flat"
:color="activeCollectionsDrawer ? 'terciary' : ''"
:color="activeCollectionsDrawer ? 'tertiary' : ''"
icon
@click="navigationStore.switchActiveCollectionsDrawer"
><v-icon :color="$route.name == 'collection' ? 'romm-accent-1' : ''"
><v-icon :color="$route.name == 'collection' ? 'primary' : ''"
>mdi-bookmark-box-multiple</v-icon
></v-btn
>

8
frontend/src/components/common/Navigation/CollectionsDrawer.vue
View File

@@ -33,7 +33,7 @@ function clear() {
mobile
width="500"
v-model="activeCollectionsDrawer"
class="bg-terciary"
class="bg-toplayer"
>
<template #prepend>
<v-text-field
@@ -46,10 +46,9 @@ function clear() {
single-line
:label="t('collection.search-collection')"
variant="solo-filled"
rounded="0"
></v-text-field>
</template>
<v-list lines="two" rounded="0" class="pa-0">
<v-list lines="two" class="pa-0">
<collection-list-item
v-for="collection in filteredCollections"
:collection="collection"
@@ -60,10 +59,9 @@ function clear() {
<v-btn
@click="addCollection()"
variant="tonal"
color="romm-accent-1"
color="primary"
prepend-icon="mdi-plus"
size="large"
rounded="0"
block
>{{ t("collection.add-collection") }}</v-btn
>

2
frontend/src/components/common/Navigation/HomeBtn.vue
View File

@@ -21,6 +21,6 @@ const navigationStore = storeNavigation();
}
.v-avatar:hover,
.v-avatar.active {
filter: drop-shadow(0px 0px 2px rgba(var(--v-theme-romm-accent-1)));
filter: drop-shadow(0px 0px 2px rgba(var(--v-theme-primary)));
}
</style>

2
frontend/src/components/common/Navigation/MainAppBar.vue
View File

@@ -26,7 +26,7 @@ const { activePlatformsDrawer, activeCollectionsDrawer, activeSettingsDrawer } =
<v-app-bar
v-if="smAndDown"
elevation="0"
class="bg-primary justify-center px-1"
class="bg-background justify-center px-1"
mode="shift"
height="45"
app

5
frontend/src/components/common/Navigation/PlatformsBtn.vue
View File

@@ -16,12 +16,11 @@ const { activePlatformsDrawer } = storeToRefs(navigationStore);
<template>
<v-btn
:block="block"
rounded="0"
variant="flat"
:color="activePlatformsDrawer ? 'terciary' : ''"
:color="activePlatformsDrawer ? 'tertiary' : ''"
icon
@click="navigationStore.switchActivePlatformsDrawer"
><v-icon :color="$route.name == 'platform' ? 'romm-accent-1' : ''"
><v-icon :color="$route.name == 'platform' ? 'primary' : ''"
>mdi-controller</v-icon
></v-btn
>

5
frontend/src/components/common/Navigation/PlatformsDrawer.vue
View File

@@ -25,7 +25,7 @@ function clear() {
@update:model-value="clear"
width="500"
v-model="activePlatformsDrawer"
class="bg-terciary"
class="bg-toplayer"
>
<template #prepend>
<v-text-field
@@ -38,10 +38,9 @@ function clear() {
single-line
:label="t('platform.search-platform')"
variant="solo-filled"
rounded="0"
></v-text-field>
</template>
<v-list lines="two" rounded="0" class="pa-0">
<v-list lines="two" class="pa-0">
<platform-list-item
v-for="platform in filteredPlatforms"
:key="platform.slug"

6
frontend/src/components/common/Navigation/ScanBtn.vue
View File

@@ -106,20 +106,18 @@ onBeforeUnmount(() => {
<v-btn
v-if="auth.scopes.includes('platforms.write')"
:block="block"
rounded="0"
variant="flat"
color="primary"
icon
@click="navigationStore.goScan"
>
<v-progress-circular
v-if="scanning"
color="romm-accent-1"
color="primary"
:width="2"
:size="20"
indeterminate
/>
<v-icon v-else :color="$route.name == 'scan' ? 'romm-accent-1' : ''"
<v-icon v-else :color="$route.name == 'scan' ? 'primary' : ''"
>mdi-magnify-scan</v-icon
>
</v-btn>

4
frontend/src/components/common/Navigation/SearchBtn.vue
View File

@@ -6,8 +6,8 @@ import { inject } from "vue";
const emitter = inject<Emitter<Events>>("emitter");
</script>
<template>
<v-btn icon variant="flat" rounded="0" :to="{ name: 'search' }"
><v-icon :color="$route.name == 'search' ? 'romm-accent-1' : ''"
<v-btn icon variant="flat" :to="{ name: 'search' }"
><v-icon :color="$route.name == 'search' ? 'primary' : ''"
>mdi-magnify</v-icon
></v-btn
>

8
frontend/src/components/common/Navigation/SettingsDrawer.vue
View File

@@ -46,9 +46,9 @@ async function logout() {
mobile
width="500"
v-model="activeSettingsDrawer"
class="bg-terciary"
class="bg-toplayer"
>
<v-list rounded="0" class="pa-0">
<v-list class="pa-0">
<v-list-img>
<v-img
:src="
@@ -67,7 +67,7 @@ async function logout() {
>
</v-list-item>
</v-list>
<v-list rounded="0" class="pa-0">
<v-list class="pa-0">
<v-list-item
@click="emitter?.emit('showEditUserDialog', auth.user as UserSchema)"
append-icon="mdi-account"
@@ -96,7 +96,7 @@ async function logout() {
</template>
</v-list>
<template v-if="!smAndDown" #append>
<v-list rounded="0" class="pa-0">
<v-list class="pa-0">
<v-divider />
<v-list-item @click="logout" append-icon="mdi-location-exit">{{
t("common.logout")

1
frontend/src/components/common/Navigation/UploadBtn.vue
View File

@@ -13,7 +13,6 @@ const auth = storeAuth();
v-if="auth.scopes.includes('roms.write')"
icon="mdi-upload"
variant="flat"
rounded="0"
@click="emitter?.emit('showUploadRomDialog', null)"
/>
</template>

2
frontend/src/components/common/Navigation/UserBtn.vue
View File

@@ -31,6 +31,6 @@ const { user } = storeToRefs(auth);
}
.v-avatar:hover,
.v-avatar.active {
filter: drop-shadow(0px 0px 2px rgba(var(--v-theme-romm-accent-1)));
filter: drop-shadow(0px 0px 2px rgba(var(--v-theme-primary)));
}
</style>

5
frontend/src/components/common/NewVersionDialog.vue
View File

@@ -35,13 +35,12 @@ onMounted(async () => {
semver.gt(GITHUB_VERSION, VERSION) &&
!latestVersionDismissed
"
class="pa-1 border-romm-accent-1 mx-auto"
rounded="0"
class="pa-1 border-selected mx-auto"
max-width="250"
>
<v-card-text class="text-center py-2 px-4">
<span class="text-white text-shadow">New version available</span>
<span class="text-romm-accent-1 ml-1">v{{ GITHUB_VERSION }}</span>
<span class="text-primary ml-1">v{{ GITHUB_VERSION }}</span>
<v-row class="mt-1" no-gutters>
<v-col>
<span class="pointer text-grey" @click="dismissVersionBanner"

6
frontend/src/components/common/Notifications/UploadProgress.vue
View File

@@ -52,7 +52,7 @@ watch(files, (newList) => {
{{ file.filename }}
<v-icon
:icon="file.finished ? 'mdi-check' : 'mdi-loading mdi-spin'"
:color="file.finished ? 'green' : 'romm-accent-1'"
:color="file.finished ? 'green' : 'primary'"
class="mx-2"
/>
</v-list-item-title>
@@ -60,7 +60,7 @@ watch(files, (newList) => {
<v-progress-linear
v-model="file.progress"
height="4"
color="romm-accent-1"
color="primary"
class="mt-1"
/>
<div class="upload-speeds d-flex justify-space-between mt-1">
@@ -87,7 +87,7 @@ watch(files, (newList) => {
size="small"
variant="tonal"
class="my-2"
color="romm-accent-1"
color="primary"
:disabled="!files.some((f) => f.finished || f.failed)"
@click="clearFinished"
>

6
frontend/src/components/common/Platform/Card.vue
View File

@@ -9,13 +9,13 @@ defineProps<{ platform: Platform }>();
<v-hover v-slot="{ isHovering, props }">
<v-card
v-bind="props"
class="bg-terciary transform-scale"
class="bg-toplayer transform-scale"
:class="{ 'on-hover': isHovering }"
:elevation="isHovering ? 20 : 3"
:to="{ name: 'platform', params: { platform: platform.id } }"
>
<v-card-text>
<v-row class="pa-1 justify-center bg-primary">
<v-row class="pa-1 justify-center bg-background">
<div
:title="platform.display_name"
class="px-2 text-truncate text-caption"
@@ -32,7 +32,7 @@ defineProps<{ platform: Platform }>();
class="mt-2"
/>
<v-chip
class="bg-chip position-absolute"
class="bg-background position-absolute"
size="x-small"
style="bottom: 1rem; right: 1rem"
label

9
frontend/src/components/common/Platform/Dialog/DeleteFirmware.vue
View File

@@ -96,7 +96,7 @@ function closeDialog() {
<template #header>
<v-row no-gutters class="justify-center">
<span>Removing</span>
<span class="text-romm-accent-1 mx-1">{{ firmwares.length }}</span>
<span class="text-primary mx-1">{{ firmwares.length }}</span>
<span>firmware files from RomM</span>
</v-row>
</template>
@@ -181,9 +181,8 @@ function closeDialog() {
<v-col class="px-6">
<v-pagination
v-model="page"
rounded="0"
:show-first-last-page="true"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>
@@ -220,11 +219,11 @@ function closeDialog() {
</v-row>
<v-row class="justify-center my-2">
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog" variant="flat">
<v-btn class="bg-toplayer" @click="closeDialog" variant="flat">
Cancel
</v-btn>
<v-btn
class="text-romm-red bg-terciary"
class="text-romm-red bg-toplayer"
variant="flat"
@click="deleteFirmware"
>

6
frontend/src/components/common/Platform/Dialog/DeletePlatform.vue
View File

@@ -72,7 +72,7 @@ function closeDialog() {
<span class="mr-1">{{ t("platform.removing-platform-1") }}</span>
<platform-icon :slug="platform.slug" :name="platform.name" />
<span class="ml-1"
>{{ platform.name }} - [<span class="text-romm-accent-1">{{
>{{ platform.name }} - [<span class="text-primary">{{
platform.fs_slug
}}</span
>{{ t("platform.removing-platform-2") }}</span
@@ -82,10 +82,10 @@ function closeDialog() {
<template #append>
<v-row class="justify-center pa-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog">
<v-btn class="bg-toplayer" @click="closeDialog">
{{ t("common.cancel") }}
</v-btn>
<v-btn class="bg-terciary text-romm-red" @click="deletePlatform">
<v-btn class="bg-toplayer text-romm-red" @click="deletePlatform">
{{ t("common.confirm") }}
</v-btn>
</v-btn-group>

9
frontend/src/components/common/Platform/Dialog/UploadFirmware.vue
View File

@@ -55,7 +55,7 @@ function uploadFirmware() {
emitter?.emit("snackbarShow", {
msg: `Uploading ${filesToUpload.value.length} states to ${currentPlatform.value.name}...`,
icon: "mdi-loading mdi-spin",
color: "romm-accent-1",
color: "primary",
});
firmwareApi
@@ -163,9 +163,8 @@ watch(itemsPerPage, async () => {
<v-col class="px-6">
<v-pagination
v-model="page"
rounded="0"
:show-first-last-page="true"
active-color="romm-accent-1"
active-color="primary"
:length="pageCount"
/>
</v-col>
@@ -189,9 +188,9 @@ watch(itemsPerPage, async () => {
<template #append>
<v-row class="justify-center my-2" no-gutters>
<v-btn-group divided density="compact">
<v-btn class="bg-terciary" @click="closeDialog"> Cancel </v-btn>
<v-btn class="bg-toplayer" @click="closeDialog"> Cancel </v-btn>
<v-btn
class="bg-terciary text-romm-green"
class="bg-toplayer text-romm-green"
:disabled="filesToUpload.length == 0 || !currentPlatform"
:variant="
filesToUpload.length == 0 || !currentPlatform ? 'plain' : 'flat'

17
frontend/src/components/common/RDialog.vue
View File

@@ -62,24 +62,19 @@ onMounted(() => {
no-click-animation
persistent
>
<v-card rounded="0" :min-height="height" :max-height="height">
<v-toolbar density="compact" class="bg-terciary">
<v-card :min-height="height" :max-height="height">
<v-toolbar density="compact" class="bg-toplayer">
<v-icon v-if="icon" :icon="icon" class="ml-5" />
<r-isotipo :size="30" class="mx-4" v-if="showRommIcon" />
<slot name="header"></slot>
<template #append>
<v-btn
@click="closeDialog"
rounded="0"
variant="text"
icon="mdi-close"
/>
<v-btn @click="closeDialog" variant="text" icon="mdi-close" />
</template>
</v-toolbar>
<v-divider />
<v-toolbar v-if="hasToolbarSlot" density="compact" class="bg-terciary">
<v-toolbar v-if="hasToolbarSlot" density="compact" class="bg-toplayer">
<slot name="toolbar"></slot>
</v-toolbar>
<v-divider />
@@ -101,7 +96,7 @@ onMounted(() => {
<v-progress-circular
:width="2"
:size="40"
color="romm-accent-1"
color="primary"
indeterminate
/>
</v-row>
@@ -128,7 +123,7 @@ onMounted(() => {
<template v-if="hasFooterSlot">
<v-divider />
<v-toolbar class="bg-terciary" density="compact">
<v-toolbar class="bg-toplayer" density="compact">
<slot name="footer"></slot>
</v-toolbar>
</template>

4
frontend/src/components/common/RSection.vue
View File

@@ -9,8 +9,8 @@ withDefaults(
);
</script>
<template>
<v-card rounded="0">
<v-toolbar class="bg-terciary" density="compact">
<v-card>
<v-toolbar class="bg-toplayer" density="compact">
<v-toolbar-title class="text-button">
<v-icon :color="iconColor" class="mr-3">{{ icon }}</v-icon>
{{ title }}

10
frontend/src/components/common/SearchCover.vue
View File

@@ -128,7 +128,7 @@ onBeforeUnmount(() => {
id="search-text-field"
@keyup.enter="searchCovers()"
@click:clear="searchTerm = ''"
class="bg-terciary"
class="bg-toplayer"
v-model="searchTerm"
:disabled="searching"
label="Search"
@@ -150,8 +150,7 @@ onBeforeUnmount(() => {
<v-btn
type="submit"
@click="searchCovers()"
class="bg-terciary"
rounded="0"
class="bg-toplayer"
variant="text"
icon="mdi-search-web"
block
@@ -165,11 +164,10 @@ onBeforeUnmount(() => {
:model-value="panels"
multiple
flat
rounded="0"
variant="accordion"
>
<v-expansion-panel v-for="game in filteredCovers" :key="game.name">
<v-expansion-panel-title class="bg-terciary">
<v-expansion-panel-title class="bg-toplayer">
<v-row no-gutters class="justify-center">
<v-list-item class="pa-0">{{ game.name }}</v-list-item>
</v-row>
@@ -209,7 +207,7 @@ onBeforeUnmount(() => {
<v-progress-circular
:width="2"
:size="40"
color="romm-accent-1"
color="primary"
indeterminate
/>
</div>

7
frontend/src/components/common/ViewLoader.vue
View File

@@ -21,11 +21,6 @@ emitter?.on("showLoadingDialog", (args) => {
width="auto"
persistent
>
<v-progress-circular
:width="3"
:size="70"
color="romm-accent-1"
indeterminate
/>
<v-progress-circular :width="3" :size="70" color="primary" indeterminate />
</v-dialog>
</template>

Some files were not shown because too many files have changed in this diff Show More