up

web/src/components/WebSwitch.svelte

@@ -4,10 +4,7 @@
   export let status;
 
   $: relays = status?.relays || [];
-<<<<<<< HEAD
   $: connected = status?.connected || false;
-=======
->>>>>>> 4ab192418e21065c68d59777493ea03b76c061e7
 
   const relayNames = {
     1: 'Power Supply',
@@ -55,7 +52,6 @@
   }
 </script>
 
-<<<<<<< HEAD
 <div class="card">
   <div class="card-header">
     <h2>WebSwitch</h2>
@@ -99,40 +95,10 @@
         ALL OFF
       </button>
     </div>
-=======
-<div class="webswitch-card card">
-  <h2>
-    1216RH
-    <span class="status-indicator" class:status-online={relays.length > 0} class:status-offline={relays.length === 0}></span>
-  </h2>
-  
-  <div class="relays">
-    {#each [1, 2, 3, 4, 5] as relayNum}
-      {@const relay = relays.find(r => r.number === relayNum)}
-      {@const isOn = relay?.state || false}
-      <div class="relay-row">
-        <span class="relay-name">{relayNames[relayNum]}</span>
-        <button 
-          class="relay-toggle"
-          class:active={isOn}
-          disabled={loading[relayNum]}
-          on:click={() => toggleRelay(relayNum)}
-        >
-          <div class="toggle-icon"></div>
-        </button>
-      </div>
-    {/each}
-  </div>
-
-  <div class="controls">
-    <button class="btn btn-primary" on:click={allOn}>ALL ON</button>
-    <button class="btn btn-danger" on:click={allOff}>ALL OFF</button>
->>>>>>> 4ab192418e21065c68d59777493ea03b76c061e7
   </div>
 </div>
 
 <style>
-<<<<<<< HEAD
   .card {
     background: linear-gradient(135deg, #1a2332 0%, #0f1923 100%);
     border: 1px solid #2d3748;
@@ -335,73 +301,5 @@
 
   .all-off:hover {
     box-shadow: 0 6px 16px rgba(244, 67, 54, 0.5);
-=======
-  .webswitch-card {
-    min-width: 280px;
-  }
-
-  h2 {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    margin-bottom: 20px;
-    font-size: 18px;
-    font-weight: 500;
-    color: var(--accent-teal);
-  }
-
-  .relays {
-    display: flex;
-    flex-direction: column;
-    gap: 12px;
-    margin-bottom: 20px;
-  }
-
-  .relay-row {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-  }
-
-  .relay-name {
-    font-size: 14px;
-  }
-
-  .relay-toggle {
-    width: 60px;
-    height: 32px;
-    background: #555;
-    border-radius: 16px;
-    position: relative;
-    transition: background 0.3s ease;
-  }
-
-  .relay-toggle.active {
-    background: var(--accent-green);
-  }
-
-  .toggle-icon {
-    width: 24px;
-    height: 24px;
-    background: white;
-    border-radius: 50%;
-    position: absolute;
-    top: 4px;
-    left: 4px;
-    transition: transform 0.3s ease;
-  }
-
-  .relay-toggle.active .toggle-icon {
-    transform: translateX(28px);
-  }
-
-  .controls {
-    display: flex;
-    gap: 12px;
-  }
-
-  .controls button {
-    flex: 1;
->>>>>>> 4ab192418e21065c68d59777493ea03b76c061e7
   }
 </style>