From 0f2a4c6890b538b9b9f8f2c7afdab7df8dc71eb2 Mon Sep 17 00:00:00 2001
From: koehr <n@koehr.in>
Date: Thu, 6 Jan 2022 14:08:41 +0100
Subject: [PATCH] object settings tips

---
 src/app.css                       | 8 +++++++-
 src/components/ObjectSettings.vue | 6 ++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/app.css b/src/app.css
index 7aebf82..f32d86f 100644
--- a/src/app.css
+++ b/src/app.css
@@ -65,7 +65,7 @@ button.settings, button.delete, button.add, button.less, button.close, button.mo
   background-size: 32px;
   background-repeat: no-repeat;
   background-position: center;
-  cursor: pointer;
+  vertical-align: middle;
 }
 button.settings { background-image: url(./assets/change.png); }
 button.delete { background-image: url(./assets/delete.png); }
@@ -74,6 +74,12 @@ button.less { background-image: url(./assets/less.png); }
 button.close { background-image: url(./assets/close.png); }
 button.move { background-image: url(./assets/move.png); }
 
+button.small {
+  width: 24px;
+  height: 24px;
+  background-size: 24px;
+}
+
 .tip {
   width: calc(100% - 4em);
   margin-left: -1em;
diff --git a/src/components/ObjectSettings.vue b/src/components/ObjectSettings.vue
index 73b8773..9ed7226 100644
--- a/src/components/ObjectSettings.vue
+++ b/src/components/ObjectSettings.vue
@@ -1,5 +1,10 @@
 <template>
   <div id="object-settings">
+    <Tips>
+      <li>You can use the scrollwheel together with the ALT key to resize a planet.</li>
+      <li>Drag the <button class="move small" /> button to rearrange satellites.</li>
+      <li>Only moons can have a size, station sizes are static.</li>
+    </Tips>
     <section class="main">
       <div>
         <input type="text" class="big"
@@ -42,6 +47,7 @@
 
 <script setup>
 import { ref, computed } from 'vue'
+import Tips from './Tips.vue'
 import SatelliteSettings from './SatelliteSettings.vue'
 
 import {