Merge pull request #117 from dappforce/deploy/fixes

Fix Minor UI Issues

src/components/domains/index.tsx

@@ -22,7 +22,7 @@ import { MyDomainsCard } from './MyDomains'
 import { DomainDetails, UnamesLearnMoreLink } from './utils'
 
 const tabs = ['register', 'manage'] as const
-type TabKey = typeof tabs[number]
+type TabKey = (typeof tabs)[number]
 const getTabKey = (tab: TabKey) => tab
 
 const DomainMarketSection = ({ promoCode }: DomainServerProps) => {
@@ -160,13 +160,14 @@ export const DomainRegisterPage = ({ promoCode }: DomainServerProps) => {
         image: '/images/dotsama-domains-preview.jpg',
       }}
       rightPanel={
-        <div style={{ width: '380px' }} className='d-flex flex-column align-items-stretch'>
+        <div style={{ width: '380px' }} className='d-flex flex-column align-items-stretch mt-3'>
           {rightPanelContent}
         </div>
       }
     >
       <CardWithContent
         title='Subsocial Usernames'
+        className='mt-3'
         subtitle={
           <span>
             Here you can register a .sub or .polka username. Your username will be function as a

src/components/domains/utils.tsx

@@ -82,7 +82,7 @@ export const UnamesLearnMoreLink = ({ className, ...props }: HTMLProps<HTMLAncho
       target='_blank'
       rel='noreferrer'
     >
-      <span>Learn More</span>
+      <span style={{ whiteSpace: 'nowrap' }}>Learn More</span>
     </a>
   )
 }

src/styles/antd.css

@@ -3405,13 +3405,19 @@ html {
 .ant-select-rtl.ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
   padding: 0 11px;
 }
-.ant-select-rtl.ant-select-single.ant-select-sm:not(.ant-select-customize-input).ant-select-show-arrow
+.ant-select-rtl.ant-select-single.ant-select-sm:not(
+    .ant-select-customize-input
+  ).ant-select-show-arrow
   .ant-select-selection-search {
   right: 0;
 }
-.ant-select-rtl.ant-select-single.ant-select-sm:not(.ant-select-customize-input).ant-select-show-arrow
+.ant-select-rtl.ant-select-single.ant-select-sm:not(
+    .ant-select-customize-input
+  ).ant-select-show-arrow
   .ant-select-selection-item,
-.ant-select-rtl.ant-select-single.ant-select-sm:not(.ant-select-customize-input).ant-select-show-arrow
+.ant-select-rtl.ant-select-single.ant-select-sm:not(
+    .ant-select-customize-input
+  ).ant-select-show-arrow
   .ant-select-selection-placeholder {
   padding-right: 0;
   padding-left: 21px;
@@ -9304,15 +9310,19 @@ span.ant-radio + * {
   border-right-width: 0;
   border-left-width: 1px;
 }
-.ant-radio-button-wrapper.ant-radio-button-wrapper-rtl.ant-radio-button-wrapper:not(:first-child)::before {
+.ant-radio-button-wrapper.ant-radio-button-wrapper-rtl.ant-radio-button-wrapper:not(
+    :first-child
+  )::before {
   right: -1px;
   left: 0;
 }
 .ant-radio-button-wrapper.ant-radio-button-wrapper-rtl.ant-radio-button-wrapper:first-child {
   border-right: 1px solid #d9d9d9;
   border-radius: 0 2px 2px 0;
 }
-.ant-radio-button-wrapper-checked:not([class*=' ant-radio-button-wrapper-disabled']).ant-radio-button-wrapper:first-child {
+.ant-radio-button-wrapper-checked:not(
+    [class*=' ant-radio-button-wrapper-disabled']
+  ).ant-radio-button-wrapper:first-child {
   border-right-color: #f759ab;
 }
 .ant-radio-button-wrapper.ant-radio-button-wrapper-rtl.ant-radio-button-wrapper:last-child {
@@ -9547,7 +9557,9 @@ span.ant-radio + * {
   transition: background 0.3s, border 0.3s;
 }
 .ant-picker-cell:hover:not(.ant-picker-cell-in-view) .ant-picker-cell-inner,
-.ant-picker-cell:hover:not(.ant-picker-cell-selected):not(.ant-picker-cell-range-start):not(.ant-picker-cell-range-end):not(.ant-picker-cell-range-hover-start):not(.ant-picker-cell-range-hover-end)
+.ant-picker-cell:hover:not(.ant-picker-cell-selected):not(.ant-picker-cell-range-start):not(
+    .ant-picker-cell-range-end
+  ):not(.ant-picker-cell-range-hover-start):not(.ant-picker-cell-range-hover-end)
   .ant-picker-cell-inner {
   background: #f5f5f5;
 }
@@ -9574,7 +9586,9 @@ span.ant-radio + * {
   color: #fff;
   background: #eb2f96;
 }
-.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single)::before,
+.ant-picker-cell-in-view.ant-picker-cell-range-start:not(
+    .ant-picker-cell-range-start-single
+  )::before,
 .ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single)::before {
   background: #fff0f6;
 }
@@ -9584,8 +9598,12 @@ span.ant-radio + * {
 .ant-picker-cell-in-view.ant-picker-cell-range-end::before {
   right: 50%;
 }
-.ant-picker-cell-in-view.ant-picker-cell-range-hover-start:not(.ant-picker-cell-in-range):not(.ant-picker-cell-range-start):not(.ant-picker-cell-range-end)::after,
-.ant-picker-cell-in-view.ant-picker-cell-range-hover-end:not(.ant-picker-cell-in-range):not(.ant-picker-cell-range-start):not(.ant-picker-cell-range-end)::after,
+.ant-picker-cell-in-view.ant-picker-cell-range-hover-start:not(.ant-picker-cell-in-range):not(
+    .ant-picker-cell-range-start
+  ):not(.ant-picker-cell-range-end)::after,
+.ant-picker-cell-in-view.ant-picker-cell-range-hover-end:not(.ant-picker-cell-in-range):not(
+    .ant-picker-cell-range-start
+  ):not(.ant-picker-cell-range-end)::after,
 .ant-picker-cell-in-view.ant-picker-cell-range-hover-start.ant-picker-cell-range-start-single::after,
 .ant-picker-cell-in-view.ant-picker-cell-range-hover-end.ant-picker-cell-range-end-single::after,
 .ant-picker-cell-in-view.ant-picker-cell-range-hover:not(.ant-picker-cell-in-range)::after {
@@ -9608,8 +9626,12 @@ span.ant-radio + * {
 .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover::before,
 .ant-picker-cell-in-view.ant-picker-cell-range-start.ant-picker-cell-range-hover::before,
 .ant-picker-cell-in-view.ant-picker-cell-range-end.ant-picker-cell-range-hover::before,
-.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single).ant-picker-cell-range-hover-start::before,
-.ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single).ant-picker-cell-range-hover-end::before,
+.ant-picker-cell-in-view.ant-picker-cell-range-start:not(
+    .ant-picker-cell-range-start-single
+  ).ant-picker-cell-range-hover-start::before,
+.ant-picker-cell-in-view.ant-picker-cell-range-end:not(
+    .ant-picker-cell-range-end-single
+  ).ant-picker-cell-range-hover-end::before,
 .ant-picker-panel
   > :not(.ant-picker-date-panel)
   .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-start::before,
@@ -9618,11 +9640,15 @@ span.ant-radio + * {
   .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-end::before {
   background: #fbd2e8;
 }
-.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single):not(.ant-picker-cell-range-end)
+.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single):not(
+    .ant-picker-cell-range-end
+  )
   .ant-picker-cell-inner {
   border-radius: 5px 0 0 2px;
 }
-.ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single):not(.ant-picker-cell-range-start)
+.ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single):not(
+    .ant-picker-cell-range-start
+  )
   .ant-picker-cell-inner {
   border-radius: 0 2px 2px 0;
 }
@@ -9659,7 +9685,9 @@ span.ant-radio + * {
 }
 tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover:first-child::after,
 tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-end:first-child::after,
-.ant-picker-cell-in-view.ant-picker-cell-range-hover-edge-start:not(.ant-picker-cell-range-hover-edge-start-near-range)::after,
+.ant-picker-cell-in-view.ant-picker-cell-range-hover-edge-start:not(
+    .ant-picker-cell-range-hover-edge-start-near-range
+  )::after,
 .ant-picker-cell-in-view.ant-picker-cell-range-hover-start::after {
   left: 6px;
   border-left: 1px dashed #f48cc5;
@@ -9668,7 +9696,9 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-end:first-child::after
 }
 tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover:last-child::after,
 tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::after,
-.ant-picker-cell-in-view.ant-picker-cell-range-hover-edge-end:not(.ant-picker-cell-range-hover-edge-end-near-range)::after,
+.ant-picker-cell-in-view.ant-picker-cell-range-hover-edge-end:not(
+    .ant-picker-cell-range-hover-edge-end-near-range
+  )::after,
 .ant-picker-cell-in-view.ant-picker-cell-range-hover-end::after {
   right: 6px;
   border-right: 1px dashed #f48cc5;
@@ -10421,12 +10451,16 @@ textarea.ant-picker-input > input {
   left: 0;
 }
 .ant-picker-panel-rtl
-  .ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single):not(.ant-picker-cell-range-end)
+  .ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single):not(
+    .ant-picker-cell-range-end
+  )
   .ant-picker-cell-inner {
   border-radius: 0 2px 2px 0;
 }
 .ant-picker-panel-rtl
-  .ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single):not(.ant-picker-cell-range-start)
+  .ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single):not(
+    .ant-picker-cell-range-start
+  )
   .ant-picker-cell-inner {
   border-radius: 5px 0 0 2px;
 }
@@ -10435,7 +10469,9 @@ textarea.ant-picker-input > input {
   tr
   > .ant-picker-cell-in-view.ant-picker-cell-range-hover-end:first-child::after,
 .ant-picker-panel-rtl
-  .ant-picker-cell-in-view.ant-picker-cell-range-hover-edge-start:not(.ant-picker-cell-range-hover-edge-start-near-range)::after,
+  .ant-picker-cell-in-view.ant-picker-cell-range-hover-edge-start:not(
+    .ant-picker-cell-range-hover-edge-start-near-range
+  )::after,
 .ant-picker-panel-rtl .ant-picker-cell-in-view.ant-picker-cell-range-hover-start::after {
   right: 6px;
   left: 0;
@@ -10451,7 +10487,9 @@ textarea.ant-picker-input > input {
   tr
   > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::after,
 .ant-picker-panel-rtl
-  .ant-picker-cell-in-view.ant-picker-cell-range-hover-edge-end:not(.ant-picker-cell-range-hover-edge-end-near-range)::after,
+  .ant-picker-cell-in-view.ant-picker-cell-range-hover-edge-end:not(
+    .ant-picker-cell-range-hover-edge-end-near-range
+  )::after,
 .ant-picker-panel-rtl .ant-picker-cell-in-view.ant-picker-cell-range-hover-end::after {
   right: 0;
   left: 6px;
@@ -18340,9 +18378,9 @@ textarea.ant-picker-input > input {
   line-height: 12px;
 }
 .ant-cascader-picker-label:hover
-  + .ant-cascader-input:not(.ant-cascader-picker-disabled
-    .ant-cascader-picker-label:hover
-    + .ant-cascader-input) {
+  + .ant-cascader-input:not(
+    .ant-cascader-picker-disabled .ant-cascader-picker-label:hover + .ant-cascader-input
+  ) {
   border-color: #f759ab;
   border-right-width: 1px !important;
 }
@@ -22107,7 +22145,6 @@ textarea.ant-input {
   -webkit-overflow-scrolling: touch;
 }
 .ant-input {
-  background-color: #fafafa;
   border-radius: 8px;
 }
 .ant-input-number {
@@ -29529,7 +29566,9 @@ span.ant-transfer-list-search-action {
   background-color: #f5f5f5;
   cursor: pointer;
 }
-.ant-transfer-list-content-item:not(.ant-transfer-list-content-item-disabled).ant-transfer-list-content-item-checked:hover {
+.ant-transfer-list-content-item:not(
+    .ant-transfer-list-content-item-disabled
+  ).ant-transfer-list-content-item-checked:hover {
   background-color: #ffe6f0;
 }
 .ant-transfer-list-content-show-remove
@@ -30136,10 +30175,14 @@ span.ant-transfer-list-search-action {
   display: none;
 }
 .ant-select-tree-show-line
-  .ant-select-tree-treenode-motion:not(.ant-motion-collapse-leave):not(.ant-motion-collapse-appear-active)
+  .ant-select-tree-treenode-motion:not(.ant-motion-collapse-leave):not(
+    .ant-motion-collapse-appear-active
+  )
   .ant-select-tree-indent-unit::after,
 .ant-select-tree-show-line
-  .ant-select-tree-treenode-motion:not(.ant-motion-collapse-leave):not(.ant-motion-collapse-appear-active)
+  .ant-select-tree-treenode-motion:not(.ant-motion-collapse-leave):not(
+    .ant-motion-collapse-appear-active
+  )
   .ant-select-tree-indent-unit::before {
   display: none;
 }