feat(frontend): better frontend style

GBCLStudio · Jul 2, 2023 · c8009a0 · c8009a0
1 parent 7eb9645
commit c8009a0
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 8 deletions.
diff --git a/js/src/forum/components/GeoIpToolBar.tsx b/js/src/forum/components/GeoIpToolBar.tsx
@@ -21,8 +21,11 @@ export default class GeoIpToolBar<CustomAttrs extends GeoIpBarAttrs = GeoIpBarAt
  let {code, region, isp} = this.attrs;
  return (
  <div className="userIp-container">
- <div className="ip-locate" id="info">
- {`${region}, ${code} | ${isp}`}
+ <div className="ip-locate" id="info-country">
+ {`${region}, ${code}`}
+ </div>
+ <div className="ip-locate" id="info-isp">
+ {`${isp}`}
  </div>
  </div>
  )

diff --git a/resources/less/forum.less b/resources/less/forum.less
@@ -8,6 +8,12 @@
  */
 
 
+body when (@config-dark-mode = true) {
+ .ip-locate {
+ border: 1px solid #1b2028;
+ }
+}
+
 button.Button.Button--primary.ip-locate {
  margin-top: 8px;
  padding: 7px;
@@ -18,14 +24,16 @@ button.Button.Button--primary.ip-locate {
  display: flex;
 }
 .ip-locate {
- margin-left: 10px;
  margin-bottom: 6px;
  padding: 2px 5px 2px 5px;
  border: 1px solid #cad0db;
- border-radius: 6px;
 }
-body when (@config-dark-mode = true) {
- .ip-locate {
- border: 1px solid #1b2028;
- }
+
+.userIp-container .ip-locate:first-of-type {
+ margin-left: 10px;
+ border-radius: 6px 0 0 6px;
+}
+
+.userIp-container .ip-locate:last-of-type {
+ border-radius: 0 6px 6px 0;
 }