More Testmerge fixes

code/game/machinery/computer/arcade.dm

@@ -136,3 +136,17 @@
 		empprize = pickweight(prizes)
 		new empprize(loc)
 	explosion(loc, -1, 0, 1+num_of_prizes, flame_range = 1+num_of_prizes)
+
+/obj/machinery/computer/arcade/attackby(obj/item/O, mob/user, params)
+	if(istype(O, /obj/item/stack/arcadeticket))
+		var/obj/item/stack/arcadeticket/T = O
+		var/amount = T.get_amount()
+		if(amount <2)
+			to_chat(user, "<span class='warning'>You need 2 tickets to claim a prize!</span>")
+			return
+		prizevend(user)
+		T.pay_tickets()
+		T.update_icon()
+		O = T
+		to_chat(user, "<span class='notice'>You turn in 2 tickets to the [src] and claim a prize!</span>")
+		return

tgui/packages/tgui/interfaces/ClockworkSlab.js

@@ -37,17 +37,16 @@ export const ClockworkSlab = (props, context) => {
   return (
     <Window theme="clockcult">
       <Window.Content scrollable>
-        <Fragment>
-          <Section>
-            <Button
-              content={recollection ? "Recital" : "Recollection"}
-              tooltip={"Tutorial"}
-              tooltipPosition={"right"}
-              onClick={() => act('toggle')}
-            />
-          </Section>
         {recollection ? ( // tutorial
-            <Section title="Recollection">
+          <Section
+            title="Recollection"
+            buttons={(
+              <Button
+                content="Recital"
+                icon="cog"
+                tooltipPosition={"left"}
+                onClick={() => act('toggle')} />
+            )}>
             <Box>
               {HONOR_RATVAR ? (
                 <Box
@@ -103,6 +102,7 @@ export const ClockworkSlab = (props, context) => {
                 </Fragment>
               );
             })}
+            <Divider />
             <Box>
               {data.rec_section}
               <Box
@@ -123,6 +123,7 @@ export const ClockworkSlab = (props, context) => {
               )}
             </Box>
             <br />
+            <Divider />
             <Box>
               <Box
                 as={'span'}
@@ -137,15 +138,12 @@ export const ClockworkSlab = (props, context) => {
               </Box>
               <br /><br />
               {rec_binds?.map(bind => (
-                  <Fragment key={bind.name}>
-                    A <b>Quickbind</b> slot ({data.rec_binds[bind]}),
-                    currently set to
-                    <Box
-                      as={'span'}
-                      textColor={bind ? bind.color : "#BE8700"}
-                      bold>
+                <Fragment key={bind.name ? bind.name : "none"}>
+                  A <b>Quickbind</b> slot ({rec_binds.indexOf(bind)+1}),
+                  currently set to&nbsp;
+                  <span style={`color:${bind ? bind.color : "#BE8700"}`}>
                     {bind?.name ? bind.name : "None"}
-                    </Box>
+                  </span>
                   .
                   <br />
                 </Fragment>
@@ -153,7 +151,16 @@ export const ClockworkSlab = (props, context) => {
             </Box>
           </Section>
         ) : (
-            <Section title="Power">
+          <Section
+            title="Power"
+            buttons={(
+              <Button
+                content="Recollection"
+                icon="book"
+                tooltip={"Tutorial"}
+                tooltipPosition={"left"}
+                onClick={() => act('toggle')} />
+            )}>
             <b>{power}</b> power is available for scripture
             and other consumers.
             <Section level={2}>
@@ -214,8 +221,10 @@ export const ClockworkSlab = (props, context) => {
                     <Table.Cell
                       italic={!!script.important}
                       color={script.fontcolor}>
+                      <b>
+                        {script.name}
+                      </b>
                       {`
-                          ${script.name}
                           ${script.descname}
                           ${script.invokers || ''}
                         `}
@@ -223,7 +232,6 @@ export const ClockworkSlab = (props, context) => {
                     <Table.Cell
                       collapsing
                       textAlign="right">
-                        <Fragment>
                       <Button
                         content={`Recite ${script.required}`}
                         disabled={
@@ -234,7 +242,12 @@ export const ClockworkSlab = (props, context) => {
                         onClick={() => act('recite', {
                           'script': script.type,
                         })} />
+                    </Table.Cell>
+                    <Table.Cell
+                      collapsing
+                      textAlign="center">
                       <Button
+                        fluid
                         content={script.bound ? (
                           `Unbind ${script.bound}`
                         ) : (
@@ -244,7 +257,6 @@ export const ClockworkSlab = (props, context) => {
                         onClick={() => act('bind', {
                           'script': script.type,
                         })} />
-                        </Fragment>
                     </Table.Cell>
                   </Table.Row>
                 ))}
@@ -252,7 +264,6 @@ export const ClockworkSlab = (props, context) => {
             </Section>
           </Section>
         )}
-        </Fragment>
       </Window.Content>
     </Window>
   );