Better UIs (#9355)

Improved the UIs of: Memories/Notes, cult tomes, autolathes, biogenerators, chem heaters, wizard spellbooks, cryopods, soulstones, space heaters.

code/controllers/subsystems/cult.dm

@@ -23,8 +23,10 @@
 	for(var/rune in subtypesof(/datum/rune))
 		var/datum/rune/R = new rune
 		runes_by_name[R.name] = rune
-		tome_data += "<b>[R.name]</b>: <i>[R.desc]</i>"
-		tome_data += "This rune [R.can_be_talisman() ? "<b><i>can</i></b>" : "<b><i>cannot</i></b>"] be turned into a talisman.<br>"
+		tome_data += "<div class='rune-block'>"
+		tome_data += "<b>[capitalize_first_letters(R.name)]</b>: <i>[R.desc]</i><br>"
+		tome_data += "This rune <b><i>[R.can_be_talisman() ? "can" : "cannot"]</i></b> be turned into a talisman.<br><hr>"
+		tome_data += "</div>"
 
 /datum/controller/subsystem/cult/proc/add_rune(var/datum/rune/R)
 	if(check_rune_limit())

code/datums/mind.dm

@@ -137,7 +137,9 @@
 			output += "<B>Objective #[obj_count]</B>: [objective.explanation_text]"
 			obj_count++
 
-	recipient << browse(output,"window=memory")
+	var/datum/browser/memory_win = new(recipient, "memory")
+	memory_win.set_content(output)
+	memory_win.open()
 
 /datum/mind/proc/edit_memory()
 	if(!ROUND_IS_STARTED)

code/game/gamemodes/cult/items/tome.dm

@@ -56,18 +56,21 @@
 			to_chat(scribe, SPAN_WARNING("You are unable to write a rune here."))
 			return
 
-		// This counts how many runes exist in the game, for some sort of arbitrary rune limit. I trust the old devs had their reasons. - Geeves
-		if(SScult.check_rune_limit())
-			to_chat(scribe, SPAN_WARNING("The cloth of reality can't take that much of a strain. Remove some runes first!"))
-			return
-		else
-			switch(alert("What shall you do with the tome?", "Tome of Nar'sie", "Read it", "Scribe a rune", "Cancel"))
-				if("Cancel")
+		switch(alert("What shall you do with the tome?", "Tome of Nar'sie", "Read it", "Scribe a rune", "Cancel"))
+			if("Cancel")
+				return
+			if("Read it")
+				if(use_check_and_message(user))
 					return
-				if("Read it")
-					if(use_check_and_message(user))
-						return
-					user << browse("[SScult.tome_data]", "window=Arcane Tome")
+				var/datum/browser/tome_win = new(user, "Arcane Tome", "Nar'Sie's Runes")
+				tome_win.set_content(SScult.tome_data)
+				tome_win.add_stylesheet("cult", 'html/browser/cult.css')
+				tome_win.open()
+				return
+			if("Scribe a rune")
+				// This counts how many runes exist in the game, for some sort of arbitrary rune limit. I trust the old devs had their reasons. - Geeves
+				if(SScult.check_rune_limit())
+					to_chat(scribe, SPAN_WARNING("The cloth of reality can't take that much of a strain. Remove some runes first!"))
 					return
 
 		//only check if they want to scribe a rune, so they can still read if standing on a rune

code/game/machinery/autolathe.dm

@@ -51,8 +51,7 @@
 	print_loc = src
 
 /obj/machinery/autolathe/Destroy()
-	qdel(wires)
-	wires = null
+	QDEL_NULL(wires)
 	return ..()
 
 /obj/machinery/autolathe/proc/update_recipe_list()
@@ -69,7 +68,7 @@
 	if(shocked)
 		shock(user, 50)
 
-	var/dat = "<center><h1>Autolathe Control Panel</h1><hr/>"
+	var/dat = "<center>"
 
 	if(!disabled)
 		dat += "<table width = '100%'>"
@@ -77,14 +76,15 @@
 		var/material_bottom = "<tr>"
 
 		for(var/material in stored_material)
-			material_top += "<td width = '25%' align = center><b>[material]</b></td>"
+			material_top += "<td width = '25%' align = center><b>[capitalize_first_letters(material)]</b></td>"
 			material_bottom += "<td width = '25%' align = center>[stored_material[material]]<b>/[storage_capacity[material]]</b></td>"
 
 		dat += "[material_top]</tr>[material_bottom]</tr></table><hr>"
-		dat += "<h2>Printable Designs</h2><h3>Showing: <a href='?src=\ref[src];change_category=1'>[show_category]</a>.</h3></center><table width = '100%'>"
+		dat += "<h2>Printable Designs</h2><h3>Showing: <a href='?src=\ref[src];change_category=1'>[show_category]</a></h3></center><table width = '100%'>"
 
 		var/index = 0
-		for(var/datum/autolathe/recipe/R in machine_recipes)
+		for(var/recipe in machine_recipes)
+			var/datum/autolathe/recipe/R = recipe
 			index++
 			if(R.hidden && !hacked || (show_category != "All" && show_category != R.category))
 				continue
@@ -108,7 +108,7 @@
 					else
 						material_string += ", "
 					material_string += "[round(R.resources[material] * mat_efficiency)] [material]"
-				material_string += ".<br></td>"
+				material_string += "<br></td>"
 				//Build list of multipliers for sheets.
 				if(R.is_stack)
 					if(max_sheets)
@@ -119,12 +119,13 @@
 							multiplier_string += "<a href='?src=\ref[src];make=[index];multiplier=[i]'>\[x[i]\]</a>"
 						multiplier_string += "<a href='?src=\ref[src];make=[index];multiplier=[max_sheets]'>\[x[max_sheets]\]</a>"
 
-			dat += "<tr><td width = 180>[R.hidden ? "<font color = 'red'>*</font>" : ""]<b>[can_make ? "<a href='?src=\ref[src];make=[index];multiplier=1'>" : ""][R.name][can_make ? "</a>" : ""]</b>[R.hidden ? "<font color = 'red'>*</font>" : ""][multiplier_string]</td><td align = right>[material_string]</tr>"
-
+			dat += "<tr class='build'><td width = 40%>[R.hidden ? "<font color = 'red'>*</font>" : ""]<b>[can_make ? "<a href='?src=\ref[src];make=[index];multiplier=1'>" : "<div class='no-build'>"][R.name][can_make ? "</a>" : "</div>"]</b>[R.hidden ? "<font color = 'red'>*</font>" : ""][multiplier_string]</td><td align = right>[material_string]</tr>"
 		dat += "</table><hr>"
 
-	user << browse(dat, "window=autolathe")
-	onclose(user, "autolathe")
+	var/datum/browser/autolathe_win = new(user, "autolathe", "<center>Autolathe Control Panel</center>")
+	autolathe_win.set_content(dat)
+	autolathe_win.add_stylesheet("misc", 'html/browser/misc.css')
+	autolathe_win.open()
 
 /obj/machinery/autolathe/attackby(obj/item/O, mob/user)
 	if(busy)

code/game/machinery/biogenerator.dm

@@ -422,10 +422,10 @@
 		switch(menustat)
 			if("menu")
 				if (beaker)
-					dat += "<table><tr><td colspan=7><H2>Commands</H2></td></tr>"
-					dat += "<tr><td><A href='?src=\ref[src];action=activate'>Activate Biogenerator</A></td></tr>"
-					dat += "<tr><td><A href='?src=\ref[src];action=detach'>Detach Container</A><BR></td></tr>"
-					dat += "<tr><td>Name</td><td>Cost</td><td colspan=5>Production Amount</td></tr>"
+					dat += "<table style='width:100%'><tr><td colspan='6'><H2>Commands</H2></td></tr>"
+					dat += "<tr><td colspan='2'><A href='?src=\ref[src];action=activate'>Activate Biogenerator</A></td></tr>"
+					dat += "<tr><td colspan='2'><A href='?src=\ref[src];action=detach'>Detach Container</A><BR></td></tr>"
+					dat += "<tr><td colspan='2'>Name</td><td colspan='2'>Cost</td><td colspan='4'>Production Amount</td></tr>"
 					var/lastclass = "Commands"
 
 					for (var/k in biorecipies)
@@ -439,19 +439,19 @@
 
 						if(emag == 0 || emagged == 1)
 							if(lastclass != class)
-								dat += "<tr><td colspan=7><H2>[class]</H2><td></tr>"
+								dat += "<tr><td colspan='6'><H2>[class]</H2></td></tr>"
 								lastclass = class
-							dat += "<tr><td>[name]<td>[round(cost/build_eff)]</td>"
+							dat += "<tr class='build'><td colspan='2'>[name]</td><td colspan='2'>[round(cost/build_eff)]</td>"
+							dat += "<td colspan='4'>"
 							for(var/num in listamount)
-								dat += "<td>"
 								var/fakenum = ""
 								if(num <= 9)
 									fakenum = "0"
 								if(num*round(cost/build_eff) > points)
-									dat += "([fakenum][num])"
+									dat += "<div class='no-build inline'>([fakenum][num])</div>"
 								else
 									dat += "<A href='?src=\ref[src];action=create;itemid=[id];count=[num]'>([fakenum][num])</A>"
-								dat += "</td>"
+							dat += "</td>"
 							dat += "</tr>"
 
 					dat += "</table>"
@@ -459,19 +459,20 @@
 				else
 					dat += "<BR><FONT COLOR=red>No beaker inside. Please insert a beaker.</FONT><BR>"
 			if("nopoints")
-				dat += "You do not have biomass to create products.<BR>Please, put growns into reactor and activate it.<BR>"
+				dat += "You do not have biomass to create products.<BR>Please put growns into the reactor and activate it.<BR>"
 				dat += "<A href='?src=\ref[src];action=menu'>Return to menu</A>"
 			if("complete")
 				dat += "Operation complete.<BR>"
 				dat += "<A href='?src=\ref[src];action=menu'>Return to menu</A>"
 			if("void")
-				dat += "<FONT COLOR=red>Error: No growns inside.</FONT><BR>Please, put growns into reactor.<BR>"
+				dat += "<FONT COLOR=red>Error: No growns inside.</FONT><BR>Please put growns into the reactor.<BR>"
 				dat += "<A href='?src=\ref[src];action=menu'>Return to menu</A>"
-	dat += "</body><html>"
+	dat += "</body></html>"
 
-	user << browse(dat, "window=biogenerator")
-	onclose(user, "biogenerator")
-	return
+	var/datum/browser/biogen_win = new(user, "biogenerator", "Biogenerator", 450, 500)
+	biogen_win.set_content(dat)
+	biogen_win.add_stylesheet("misc", 'html/browser/misc.css')
+	biogen_win.open()
 
 /obj/machinery/biogenerator/attack_hand(mob/user as mob)
 	interact(user)
@@ -556,6 +557,7 @@
 		if("detach")
 			if(beaker)
 				beaker.forceMove(src.loc)
+				usr.put_in_hands(beaker)
 				beaker = null
 				update_icon()
 		if("create")

code/game/machinery/chem_heater.dm

@@ -52,33 +52,33 @@
 	if(stat & BROKEN)
 		return
 	user.set_machine(src)
-	var/dat ="<html>"
-	dat += "<head><TITLE>Chem Heater MKI</TITLE><style>body{font-family:Garamond}</style></head>"
-	dat += "<body><H1>Chem Heater MKI</H1>"
+	var/dat = "<html>"
 
-	dat += "<p>Power: <a href='?src=\ref[src];action=togglepower'>[use_power ? "On" : "Off"]</a></p>"
-	dat += "<p>Target Temp: [round(target_temperature)]K / [round(target_temperature - T0C,0.1)]C<br> "
+	dat += "Power: <a href='?src=\ref[src];action=togglepower'>[use_power ? "On" : "Off"]</a>"
 
-	dat += "("
-	dat += "<a href='?src=\ref[src];action=adjusttemp;power=-100'>----</a>|"
-	dat += "<a href='?src=\ref[src];action=adjusttemp;power=-25'>---</a>|"
-	dat += "<a href='?src=\ref[src];action=adjusttemp;power=-5'>--</a>|"
-	dat += "<a href='?src=\ref[src];action=adjusttemp;power=-1'>-</a>|"
-	dat += "<a href='?src=\ref[src];action=adjusttemp;power=1'>+</a>|"
-	dat += "<a href='?src=\ref[src];action=adjusttemp;power=5'>++</a>|"
-	dat += "<a href='?src=\ref[src];action=adjusttemp;power=25'>+++</a>|"
+	dat += "<p>Target Temp: [round(target_temperature)]K / [round(target_temperature - T0C,0.1)]C<br>"
+
+	dat += "| "
+	dat += "<a href='?src=\ref[src];action=adjusttemp;power=-100'>----</a>"
+	dat += "<a href='?src=\ref[src];action=adjusttemp;power=-25'>---</a>"
+	dat += "<a href='?src=\ref[src];action=adjusttemp;power=-5'>--</a>"
+	dat += "<a href='?src=\ref[src];action=adjusttemp;power=-1'>-</a>"
+	dat += "<a href='?src=\ref[src];action=adjusttemp;power=1'>+</a>"
+	dat += "<a href='?src=\ref[src];action=adjusttemp;power=5'>++</a>"
+	dat += "<a href='?src=\ref[src];action=adjusttemp;power=25'>+++</a>"
 	dat += "<a href='?src=\ref[src];action=adjusttemp;power=100'>++++</a>"
-	dat += ")</p>"
+	dat += "| </p>"
 
 	if(container)
-		dat += "<p>Beaker Temp: [round(container.get_temperature(),0.01)]K / [round(container.get_temperature() - T0C,0.1)]C (<a href='?src=\ref[src];action=removebeaker'>Remove</a>)</p>"
+		dat += "<p>Beaker Temp: [round(container.get_temperature(),0.01)]K / [round(container.get_temperature() - T0C,0.1)]C <a href='?src=\ref[src];action=removebeaker'>Remove</a></p>"
 	else
 		dat += "<p>No container loaded!</p>"
 
-	dat += "</body><html>"
+	dat += "</html>"
 
-	user << browse(dat, "window=chem_heater")
-	onclose(user, "chem_heater")
+	var/datum/browser/chem_win = new(user, "chem_heater", "Chem Heater MKI")
+	chem_win.set_content(dat)
+	chem_win.open()
 
 /obj/machinery/chem_heater/Topic(href, href_list)
 	if(stat & BROKEN) return

code/game/machinery/cryopod.dm

@@ -59,16 +59,17 @@ var/global/list/frozen_crew = list()
 	if(!(ROUND_IS_STARTED))
 		return
 
-	dat += "<hr/><br/><b>[storage_name]</b><br/>"
-	dat += "<i>Welcome, [user.real_name].</i><br/><br/><hr/>"
-	dat += "<a href='?src=\ref[src];log=1'>View Storage Log</a>.<br>"
+	dat += "<hr><b>[storage_name]</b><br>"
+	dat += "<i>Welcome, [user.real_name].</i><br><hr><br>"
+	dat += "<a href='?src=\ref[src];log=1'>View Storage Log</a><br>"
 	if(allow_items)
-		dat += "<a href='?src=\ref[src];view=1'>View Objects</a>.<br>"
-		dat += "<a href='?src=\ref[src];item=1'>Recover Object</a>.<br>"
-		dat += "<a href='?src=\ref[src];allitems=1'>Recover All Objects</a>.<br>"
+		dat += "<a href='?src=\ref[src];view=1'>View Objects</a><br>"
+		dat += "<a href='?src=\ref[src];item=1'>Recover Object</a><br>"
+		dat += "<a href='?src=\ref[src];allitems=1'>Recover All Objects</a><br>"
 
-	user << browse(dat, "window=cryopod_console")
-	onclose(user, "cryopod_console")
+	var/datum/browser/cryocon_win = new(user, "cryopod_console", "Cryogenic Oversight Console")
+	cryocon_win.set_content(dat)
+	cryocon_win.open()
 
 /obj/machinery/computer/cryopod/Topic(href, href_list)
 	if(..())
@@ -82,12 +83,14 @@ var/global/list/frozen_crew = list()
 		if(!length(frozen_crew))
 			to_chat(user, SPAN_WARNING("Nothing has been stored recently."))
 			return
-		var/dat = "<center><b>Recently Stored [storage_type]</b></center><br/><hr/>"
+		var/dat = "<center><b>Recently Stored [storage_type]</b></center><hr>"
 		for(var/person in frozen_crew)
-			dat += " - [person]<br/>"
-		dat += "<hr/>"
+			dat += " - [person]<br>"
+		dat += "<hr>"
 
-		user << browse(dat, "window=cryolog")
+		var/datum/browser/cryolog_win = new(user, "cryolog", "Cryogenic Storage Log")
+		cryolog_win.set_content(dat)
+		cryolog_win.open()
 
 	if(href_list["view"])
 		if(!allow_items)
@@ -96,19 +99,21 @@ var/global/list/frozen_crew = list()
 			to_chat(user, SPAN_WARNING("There are no stored objects."))
 			return
 
-		var/dat = "<center><b>Recently Stored Objects</b></center><br/><hr/>"
+		var/dat = "<center><b>Recently Stored Objects</b></center><br><hr>"
 		for(var/obj/item/I in frozen_items)
-			dat += " - [I.name]<br/>"
-		dat += "<hr/>"
+			dat += " - [I.name]<br>"
+		dat += "<hr>"
 
-		user << browse(dat, "window=cryoitems")
+		var/datum/browser/cryoitems_win = new(user, "cryoitems", "Cryogenic Storage Log")
+		cryoitems_win.set_content(dat)
+		cryoitems_win.open()
 
 	else if(href_list["item"])
 		if(!allow_items)
 			return
 
 		if(frozen_items.len <= 0)
-			to_chat(user, SPAN_NOTICE("There is nothing to recover from storage."))
+			to_chat(user, SPAN_WARNING("There is nothing to recover from storage."))
 			return
 
 		var/obj/item/I = input(user, "Please choose which object to retrieve.", "Object recovery", null) as null|anything in frozen_items
@@ -116,12 +121,14 @@ var/global/list/frozen_crew = list()
 			return
 
 		if(!(I in frozen_items))
-			to_chat(user, SPAN_NOTICE("\The [I] is no longer in storage."))
+			to_chat(user, SPAN_WARNING("\The [I] is no longer in storage."))
 			return
 
 		visible_message(SPAN_NOTICE("The console beeps happily as it disgorges \the [I]."), range = 3)
 
 		I.forceMove(get_turf(src))
+		if(Adjacent(user))
+			user.put_in_hands(I)
 		frozen_items -= I
 		log_and_message_admins("has retrieved \an [I] from \the [src]", user, get_turf(src))
 
@@ -130,7 +137,7 @@ var/global/list/frozen_crew = list()
 			return
 
 		if(frozen_items.len <= 0)
-			to_chat(user, SPAN_NOTICE("There is nothing to recover from storage."))
+			to_chat(user, SPAN_WARNING("There is nothing to recover from storage."))
 			return
 
 		visible_message(SPAN_NOTICE("The console beeps happily as it disgorges the desired objects."), range = 3)

code/game/machinery/spaceheater.dm

@@ -109,35 +109,28 @@
 		interact(user)
 
 /obj/machinery/space_heater/interact(mob/user)
-
-
-	var/dat
-	dat = "Power cell: "
+	var/dat = "Power cell: "
 	if(cell)
-		dat += "Detected<BR>"
+		dat += "Detected<br>"
 	else
-		dat += "Not Detected<BR>"
+		dat += "Not Detected<br>"
 	dat += "Power: "
 	if(on)
-		dat += "<A href='?src=\ref[src];op=off'>On</A><BR>"
+		dat += "<A href='?src=\ref[src];op=off'>On</A><br>"
 	else
-		dat += "<A href='?src=\ref[src];op=on'>Off</A><BR>"
+		dat += "<A href='?src=\ref[src];op=on'>Off</A><br>"
 
-	dat += "Power Level: [cell ? round(cell.percent(),1) : 0]%<BR><BR>"
+	dat += "Power Level: [cell ? round(cell.percent(),1) : 0]%<br><br>"
 
 	dat += "Set Temperature: "
-
 	dat += "<A href='?src=\ref[src];op=temp;val=-5'>-</A>"
-
-	dat += " [set_temperature]K ([set_temperature-T0C]&deg;C)"
-	dat += "<A href='?src=\ref[src];op=temp;val=5'>+</A><BR>"
+	dat += " [set_temperature]K ([set_temperature-T0C]&deg;C) "
+	dat += "<A href='?src=\ref[src];op=temp;val=5'>+</A><br>"
 
 	user.set_machine(src)
-	user << browse("<HEAD><TITLE>Space Heater Control Panel</TITLE></HEAD><TT>[dat]</TT>", "window=spaceheater")
-	onclose(user, "spaceheater")
-	return // needed?
-
-
+	var/datum/browser/heater_win = new(user, "spaceheater", "Space Heater Control Panel")
+	heater_win.set_content(dat)
+	heater_win.open()
 
 /obj/machinery/space_heater/Topic(href, href_list)
 	if (usr.stat)

code/modules/mob/living/simple_animal/constructs/soulstone.dm

@@ -37,26 +37,26 @@
 ///////////////////Options for using captured souls///////////////////////////////////////
 
 /obj/item/device/soulstone/attack_self(mob/user)
-	if (!in_range(src, user))
+	if(!in_range(src, user))
 		return
 	user.set_machine(src)
-	var/dat = "<TT><B>Soul Stone</B><BR>"
+
+	var/dat = ""
 	for(var/mob/living/simple_animal/shade/A in src)
-		dat += "Captured Soul: [A.name]<br>"
-		dat += {"<A href='byond://?src=\ref[src];choice=Summon'>Summon Shade</A>"}
-		dat += "<br>"
-		dat += {"<a href='byond://?src=\ref[src];choice=Close'> Close</a>"}
-	user << browse(dat, "window=aicard")
-	onclose(user, "aicard")
-	return
-
-
-
+		dat += "Captured Soul: [A.name]<hr>"
+		dat += "<A href='byond://?src=\ref[src];choice=Summon'>Summon Shade</A><br>"
+		dat += "<i>This will summon the spirit of [A.name] in a pure energy form. Be cautious, for they will be weak without a protective construct to house them.</i><hr>"
+	dat += "<a href='byond://?src=\ref[src];choice=Close'>Close</a>"
+	
+	var/datum/browser/soulstone_win = new(user, "soulstone", capitalize_first_letters(name))
+	soulstone_win.set_content(dat)
+	soulstone_win.add_stylesheet("cult", 'html/browser/cult.css')
+	soulstone_win.open()
 
 /obj/item/device/soulstone/Topic(href, href_list)
 	var/mob/U = usr
 	if (!in_range(src, U)||U.machine!=src)
-		U << browse(null, "window=aicard")
+		U << browse(null, "window=soulstone")
 		U.unset_machine()
 		return
 
@@ -65,7 +65,7 @@
 
 	switch(href_list["choice"])//Now we switch based on choice.
 		if ("Close")
-			U << browse(null, "window=aicard")
+			U << browse(null, "window=soulstone")
 			U.unset_machine()
 			return
 

code/modules/spell_system/spellbook/spellbook.dm

@@ -78,14 +78,15 @@ var/list/artefact_feedback = list(/obj/structure/closet/wizard/armor = 		"HS",
 			var/name = "" //name of target
 			var/desc = "" //description of target
 			var/info = "" //additional information
+			dat += "<div class='spell-block'>"
 			if(ispath(spellbook.spells[i],/datum/spellbook))
 				var/datum/spellbook/S = spellbook.spells[i]
-				name = initial(S.name)
+				name = html_decode(capitalize_first_letters(initial(S.name)))
 				desc = initial(S.book_desc)
 				info = "<font color='#ff33cc'>[initial(S.max_uses)] Spell Slots</font>"
 			else if(ispath(spellbook.spells[i],/obj))
 				var/obj/O = spellbook.spells[i]
-				name = "Artefact: [capitalize(initial(O.name))]" //because 99.99% of objects dont have capitals in them and it makes it look weird.
+				name = "Artefact: [capitalize_first_letters(initial(O.name))]" //because 99.99% of objects dont have capitals in them and it makes it look weird.
 				desc = initial(O.desc)
 			else if(ispath(spellbook.spells[i],/spell))
 				var/spell/S = spellbook.spells[i]
@@ -110,9 +111,14 @@ var/list/artefact_feedback = list(/obj/structure/closet/wizard/armor = 		"HS",
 			if(spellbook.book_flags & CAN_MAKE_CONTRACTS)
 				dat += " <A href='byond://?src=\ref[src];path=[spellbook.spells[i]];contract=1;'>Make Contract</a>"
 			dat += "<br><i>[desc]</i><br>"
+			dat += "</div>"
 		dat += "<center><A href='byond://?src=\ref[src];reset=1'>Re-memorize your spellbook.</a></center>"
 		dat += "<center><A href='byond://?src=\ref[src];lock=1'>[spellbook.book_flags & LOCKED ? "Unlock" : "Lock"] the spellbook.</a></center>"
-	user << browse(dat,"window=spellbook")
+
+	var/datum/browser/spellbook_win = new(user, "spellbook", spellbook.title)
+	spellbook_win.set_content(dat)
+	spellbook_win.add_stylesheet("spellbook", 'html/browser/spellbook.css')
+	spellbook_win.open()
 
 /obj/item/spellbook/Topic(href,href_list)
 	..()
@@ -233,7 +239,7 @@ var/list/artefact_feedback = list(/obj/structure/closet/wizard/armor = 		"HS",
 	return "You learn the spell [S]"
 
 /datum/spellbook
-	var/name = "\improper book of tomes"
+	var/name = "book of tomes"
 	var/desc = "The legendary book of spells of the wizard."
 	var/book_desc = "Holds information on the various tomes available to a wizard"
 	var/feedback = "" //doesn't need one.

code/modules/spell_system/spellbook/variants/battlemage.dm

@@ -3,7 +3,7 @@
 
 
 /datum/spellbook/battlemage
-	name = "\improper battlemage's bible"
+	name = "battlemage's bible"
 	feedback = "BM"
 	desc = "A treatise on the use of magic in combat situation."
 	book_desc = "Mix physical with the mystical in head to head combat."

code/modules/spell_system/spellbook/variants/cleric.dm

@@ -2,7 +2,7 @@
 	spellbook_type = /datum/spellbook/cleric
 
 /datum/spellbook/cleric
-	name = "\improper cleric's tome"
+	name = "cleric's tome"
 	feedback = "CR"
 	desc = "For those who do not harm, or at least feel sorry about it."
 	book_desc = "All about healing and control. Mobility and offense comes at a higher price but not impossible."

code/modules/spell_system/spellbook/variants/druid.dm

@@ -2,7 +2,7 @@
 	spellbook_type = /datum/spellbook/druid
 
 /datum/spellbook/druid
-	name = "\improper druid's leaflet"
+	name = "druid's leaflet"
 	feedback = "DL"
 	desc = "It smells like an air freshener."
 	book_desc = "Summons, nature, and a bit o' healin."

code/modules/spell_system/spellbook/variants/necromancer.dm

@@ -3,7 +3,7 @@
 
 
 /datum/spellbook/necromancer
-	name = "\improper necromancer's grimoire"
+	name = "necromancer's grimoire"
 	feedback = "NG"
 	desc = "A grimoire full of spells dealing with the death and the afterlife."
 	book_desc = "A spellbook full of dark magic dealing mostly with the afterlife."

code/modules/spell_system/spellbook/variants/spatial.dm

@@ -2,7 +2,7 @@
 	spellbook_type = /datum/spellbook/spatial
 
 /datum/spellbook/spatial
-	name = "\improper spatial manual"
+	name = "spatial manual"
 	feedback = "SP"
 	desc = "You feel like this might disappear from out of under you."
 	book_desc = "Movement and teleportation. Run from your problems!"

code/modules/spell_system/spellbook/variants/standard.dm

@@ -2,7 +2,7 @@
 	spellbook_type = /datum/spellbook/standard
 
 /datum/spellbook/standard
-	name = "\improper standard spellbook"
+	name = "standard spellbook"
 	feedback = "SB"
 	title = "Book of Spells and Artefacts"
 	title_desc = "Buy spells using your available spell slots. Artefacts may also be bought however their cost is permanent."

code/modules/spell_system/spellbook/variants/student.dm

@@ -9,7 +9,7 @@
 	..()
 
 /datum/spellbook/student
-	name = "\improper student's spellbook"
+	name = "student's spellbook"
 	feedback = "ST"
 	desc = "This spell book has a sticker on it that says, 'certified for children 5 and older'."
 	book_desc = "This spellbook is dedicated to teaching neophytes in the ways of magic."

html/browser/cult.css

@@ -0,0 +1,42 @@
+.uiTitle,
+head,
+header {
+	background-color: #4b1b1b;
+	color: #e02b2b;
+}
+
+body {
+	background-color: #3a1515;
+	color: #ec2d2d;
+}
+
+hr {
+	background-color: #581f1f;
+}
+
+a,
+a:link,
+a:visited,
+a:active,
+.linkOn,
+.linkOff {
+	background: #5a2222;
+	color: #ff6868;
+	transition: background 0.2s, color 0.2s;
+}
+
+a:hover {
+	background: #ff6868;
+	color: #5a2222;
+}
+
+.rune-block {
+	background-color: #3a1515;
+	color: #ec2d2d;
+	transition: background-color 0.2s, color 0.2s;
+}
+
+.rune-block:hover {
+	background-color: #240d0d;
+	color: #ff1616;
+}

html/browser/misc.css

@@ -0,0 +1,39 @@
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	padding: 8px 0 4px 0;
+	color: #5c87a8;
+}
+
+table {
+	border-collapse: collapse;
+}
+
+tr.build {
+	border-bottom: 1px solid transparent;
+	transition: background-color 0.2s, color 0.2s, border 0.2s;
+}
+
+tr.build:hover {
+	border-bottom: 1px solid #5c87a8;
+	background-color: #1d1d1d;
+	color: #99c2c9;
+}
+
+.no-build {
+	display: inline-block;
+	color: #141414;
+	text-decoration: none;
+	background-color: #7c7c7c;
+	border: 1px solid #161616;
+	padding: 1px 4px 1px 4px;
+	margin: 0 2px 0 0;
+	cursor: default;
+}
+
+.inline {
+	display: inline;
+}

html/browser/spellbook.css

@@ -0,0 +1,39 @@
+.uiTitle,
+head,
+header {
+	background-color: #371146;
+	color: #cb6df0;
+}
+
+
+body {
+	background: #3e144e;
+	color: #d486f3;
+}
+
+a,
+a:link,
+a:visited,
+a:active,
+.linkOn,
+.linkOff {
+	background: #591b72;
+	color: #ce7dee;
+	transition: background 0.2s, color 0.2s;
+}
+
+a:hover {
+	background: #ce7dee;
+	color: #591b72;
+}
+
+.spell-block {
+	background-color: #3e144e;
+	color: #d486f3;
+	transition: background-color 0.2s, color 0.2s;
+}
+
+.spell-block:hover {
+	background-color: #280c33;
+	color: #e39bff;
+}

html/changelogs/geeves-better_uis.yml

@@ -0,0 +1,6 @@
+author: Geeves
+
+delete-after: True
+
+changes: 
+  - rscadd: "Improved the UIs of, Memories/Notes, cult tomes, autolathes, biogenerators, chem heaters, wizard spellbooks, cryopods, soulstones, space heaters."