diff --git a/client/src/components/SetupGuide/Guide.css b/client/src/components/SetupGuide/Guide.css index 821f1798..86d3070b 100644 --- a/client/src/components/SetupGuide/Guide.css +++ b/client/src/components/SetupGuide/Guide.css @@ -13,3 +13,17 @@ margin-bottom: 20px; font-size: 15px; } + +.guide__address { + display: block; + margin-bottom: 7px; + font-size: 13px; + font-weight: 700; +} + +@media screen and (min-width: 768px) { + .guide__address { + display: list-item; + font-size: 15px; + } +} diff --git a/client/src/components/SetupGuide/index.js b/client/src/components/SetupGuide/index.js index c6d9c47d..4de6dd2c 100644 --- a/client/src/components/SetupGuide/index.js +++ b/client/src/components/SetupGuide/index.js @@ -24,8 +24,8 @@ const SetupGuide = ({
install_devices_address:
-
- {dnsAddresses.map((ip) =>
  • {ip}
  • )} +
    + {dnsAddresses.map((ip) =>
  • {ip}
  • )}
    diff --git a/client/src/components/ui/Tabs.css b/client/src/components/ui/Tabs.css index 871f399a..837cf3d8 100644 --- a/client/src/components/ui/Tabs.css +++ b/client/src/components/ui/Tabs.css @@ -2,8 +2,16 @@ display: flex; justify-content: space-between; margin-bottom: 15px; - padding: 15px 0; + padding: 10px 0; border-bottom: 1px solid #e8e8e8; + overflow: auto; +} + +@media screen and (min-width: 768px) { + .tabs__controls { + padding: 15px 0; + overflow: initial; + } } .tabs__controls--form { @@ -26,11 +34,18 @@ align-items: center; min-width: 70px; font-size: 13px; + white-space: nowrap; color: #555555; cursor: pointer; opacity: 0.6; } +@media screen and (min-width: 768px) { + .tab__control { + white-space: normal; + } +} + .tab__control:hover, .tab__control:focus { opacity: 1;