uhhh css is important

toolbox-team · Oct 18, 2024 · c0ecc21 · c0ecc21
1 parent 6e6a9ad
commit c0ecc21
Show file tree

Hide file tree

Showing 3 changed files with 48 additions and 50 deletions.
diff --git a/extension/data/styles/modbar.css b/extension/data/styles/modbar.css
@@ -380,43 +380,3 @@ a[href*="#?tbsettings"]:not(.tb-no-gustavobc):after {
     max-width: 59em;
     font-family: Monaco, Menlo, "Ubuntu Mono", Consolas, source-code-pro, monospace;
 }
-
-
-/* not really sure if it belongs here, but about tab styling */
-.mod-toolbox-rd  .tb-window-tab.about .tb-window-content {
-    text-align: center;
-    line-height: normal;
-}
-
-.mod-toolbox-rd  table.tb-about-credits {
-
-    border-collapse: separate;
-    border-spacing: 10px;
-    display: inline-block;
-}
-
-.mod-toolbox-rd  table.tb-about-credits td {
-    border-bottom: solid 1px #F3F3F3;
-    width: 33.3%;
-    min-width: 140px;
-    text-align: center;
-    padding: 2px;
-}
-
-.mod-toolbox-rd .tb-window-tab.about h1#tb-random-about-quote {
-    font-style: italic;
-    font-family: Serif;
-    font-size: 25px;
-    line-height: normal;
-    margin: 10px 0;
-}
-
-.mod-toolbox-rd .tb-window-tab.about h3 {
-    margin-top: 10px;
-    margin-bottom: 4px;
-    border-top: solid 1px #DCDCDC;
-    padding-top: 5px;
-    line-height: normal;
-    font-size: 110%;
-    font-weight: bold;
-}
diff --git a/extension/data/tbmodule.jsx b/extension/data/tbmodule.jsx
@@ -9,6 +9,8 @@ import TBLog from './tblog.ts';
 import * as TBStorage from './tbstorage.js';
 import * as TBui from './tbui.js';
 
+import css from './tbmodule.module.css';
+
 const logger = TBLog('TBModule');
 
 const TBModule = {
@@ -208,9 +210,9 @@ const TBModule = {
                 help_page: 'about',
                 id: 'about',
                 content: (
-                    <>
-                        <h1 id='tb-random-about-quote'>{'"'}{TBCore.RandomQuote}{'"'}</h1>
-                        <h3>About:</h3>{' '}
+                    <div className={css.aboutContent}>
+                        <h1>&ldquo;{TBCore.RandomQuote}&rdquo;</h1>
+                        <h3>About:</h3>
                         <a
                             href={TBCore.link('/r/toolbox')}
                             target='_blank'
@@ -228,7 +230,7 @@ const TBModule = {
                             found on this wiki page
                         </a>.
                         <h3>made and maintained by:</h3>
-                        <table className='tb-about-credits'>
+                        <table>
                             <tbody>
                                 <tr>
                                     <td>
@@ -288,7 +290,7 @@ const TBModule = {
                             </tbody>
                         </table>
                         <h3>Documentation by:</h3>
-                        <table className='tb-about-credits'>
+                        <table>
                             <tbody>
                                 <tr>
                                     <td>
@@ -315,7 +317,7 @@ const TBModule = {
                             </tbody>
                         </table>
                         <h3>Special thanks to:</h3>
-                        <a href='https://www.reddit.com/user/andytuba'>/u/andytuba</a> &{' '}
+                        <a href='https://www.reddit.com/user/therealadyjewel'>/u/therealadyjewel</a> &{' '}
                         <a href='https://www.reddit.com/user/erikdesjardins'>/u/erikdesjardins</a>
                         <br />for all their amazing help and support of the TB team in resolving complex issues (and
                         really simple ones)<br />
@@ -352,25 +354,25 @@ const TBModule = {
                         <br />
                         <h3>License:</h3>
                         <span>© 2013-2020 toolbox development team.</span>
-                        <p className='tb-settings-p'>
+                        <p>
                             Licensed under the Apache License, Version 2.0 (the {'"'}License{'"'});
                             <br /> you may not use this file except in compliance with the License.
                             <br /> You may obtain a copy of the License at
                         </p>
-                        <p className='tb-settings-p'>
+                        <p>
                             <a href='http://www.apache.org/licenses/LICENSE-2.0'>
                                 http://www.apache.org/licenses/LICENSE-2.0
                             </a>
                         </p>
-                        <p className='tb-settings-p'>
+                        <p>
                             Unless required by applicable law or agreed to in writing, software distributed under the
                             License is distributed on an {'"'}AS IS{'"'}{' '}
                             BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
                             <br />
                             See the License for the specific language governing permissions and limitations under the
                             License.
                         </p>
-                    </>
+                    </div>
                 ),
             },
         ];

diff --git a/extension/data/tbmodule.module.css b/extension/data/tbmodule.module.css
@@ -0,0 +1,36 @@
+.aboutContent {
+    text-align: center;
+    line-height: normal;
+}
+
+.aboutContent table {
+    border-collapse: separate;
+    border-spacing: 10px;
+    display: inline-block;
+}
+
+.aboutContent td {
+    border-bottom: solid 1px #F3F3F3;
+    width: 33.3%;
+    min-width: 140px;
+    text-align: center;
+    padding: 2px;
+}
+
+.aboutContent h1 {
+    font-style: italic;
+    font-family: Serif;
+    font-size: 25px;
+    line-height: normal;
+    margin: 10px 0;
+}
+
+.aboutContent h3 {
+    margin-top: 10px;
+    margin-bottom: 4px;
+    border-top: solid 1px #DCDCDC;
+    padding-top: 5px;
+    line-height: normal;
+    font-size: 110%;
+    font-weight: bold;
+}