diff --git a/.gitignore b/.gitignore index 84c7219..3c43f44 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1 @@ -globalStyles.css \ No newline at end of file +globalStyle.css \ No newline at end of file diff --git a/manifest.json b/manifest.json index a880282..522bcf2 100644 --- a/manifest.json +++ b/manifest.json @@ -2,8 +2,8 @@ "manifest_version": 3, "name": "ServiceHub Plus", - "version": "0.1.1", - "description": "Improvements for TRG Service Hub techs", + "version": "0.1.2", + "description": "Improvements to Service Hub for TRG techs", "content_scripts": [ { diff --git a/style.css b/style.css index 2baf957..c9696b1 100644 --- a/style.css +++ b/style.css @@ -1,23 +1,46 @@ /* - Dark Gray: #544343 - Light Gray: #999799 - Blue: #086788 - Green: #9FCC2E + + TODO float buttons on bottom of RO + TODO float location entry on RO (sidebar?) + TODO style individual buttons + TODO options page + - move parts list buttons top or bottom + - color themes? + BUG close button on photo pages is styled along with the btnCancel + HACK display tiny images next to parts list? + TODO shrink navbar/header/location on scroll + TODO fancy button animations */ +@import url("https://fonts.googleapis.com/css2?family=Roboto&display=swap"); + +:root { + --white: #f4f4f9; + --darkgray: #696969; + --lightgray: #857f74; + --darkblue: #0f2137; + --lightblue: #0ebbfe; + --green: #c1d830; + --darkgreen: #103900; + --black: #000; +} + +/* Buttons */ + input[type="button"] { - background-color: #696969; - color: white; - border-radius: 3px; - padding: 1.5px 5px; + font-family: Roboto, sans-serif; + background-color: var(--darkgray); + color: var(--white); + border-radius: 5px; + padding: 0.55em 1.25em; text-decoration: none; cursor: pointer; border: none; - transition: background-color 250ms ease-in-out; + transition: all 250ms ease-in; } input[type="button"]:hover { - background-color: #999799; + background-color: var(--lightgray); } input[type="button"]:disabled { @@ -26,14 +49,47 @@ input[type="button"]:disabled { input[name="btnCancel"] + input[name="btnSave"] { position: fixed; - top: 20px; + bottom: 20px; right: 20px; } input[name="btnCancel"] { background-color: lightcoral; - color: white; + color: var(--white); position: fixed; - top: 20px; + bottom: 20px; right: 80px; } + +input[id="btnSubmitForApproval"]:hover { + background-color: var(--darkblue); + color: var(--lightblue); +} + +input[value="Mark Complete"]:hover { + background-color: var(--green); + color: var(--darkgray); + font-weight: bolder; +} + +input[name="btnParts"] { + margin: 0; + padding: 0 1em; +} + +input[name="btnExpandRepairHistory"] { + padding: 0.25em 0; + /* margin: 0; */ +} + +input[name="btnRepairCodes"] { + padding: 0.5em 0; +} + +img[id="Img1"], +img[id="Img2"] { + position: absolute; + content: url("https://upload.wikimedia.org/wikipedia/commons/thumb/9/9e/Plus_symbol.svg/500px-Plus_symbol.svg.png"); + width: 20px; + height: 20px; +}