Merge pull request #185 from simonredfern/develop

remove mouse over effects

Author: simonredfern

src/components/Content.vue

@@ -434,24 +434,13 @@ span {
   text-decoration: none;
 }
 
-.tag-link:hover {
-  background-color: var(--el-color-primary);
-  color: white;
-  border-color: var(--el-color-primary);
-}
-
 .tag-link-all {
   background-color: var(--el-color-success);
   border-color: var(--el-color-success-light-5);
   color: white;
   font-weight: 600;
 }
 
-.tag-link-all:hover {
-  background-color: #85ce61;
-  border-color: #85ce61;
-}
-
 .tag-link-active {
   background-color: var(--el-color-primary);
   color: white;
@@ -603,12 +592,6 @@ div {
   white-space: nowrap;
 }
 
-.pager-router-link:hover,
-.pager-left:hover,
-.pager-right:hover {
-  color: v-bind(summaryPagerLinksColor);
-}
-
 .favorite {
   cursor: pointer;
   line-height: 1;

src/components/JsonSchemaViewer.vue

@@ -285,12 +285,6 @@ const jsonElements = computed(() => {
   transition: all 0.2s ease;
 }
 
-.ref-link:hover {
-  color: #84c5ff;
-  text-decoration-style: solid;
-  background-color: rgba(97, 175, 239, 0.1);
-}
-
 /* Custom scrollbar */
 .schema-container::-webkit-scrollbar {
   width: 8px;

src/components/Menu.vue

@@ -134,10 +134,6 @@ a {
   text-decoration: none;
 }
 
-a:hover {
-  color: v-bind(searchLinksColor);
-}
-
 .host {
   font-size: 14px;
   font-family: 'Roboto';
@@ -181,11 +177,6 @@ a:hover {
   transition: color 0.2s ease;
 }
 
-.endpoint-tags :deep(.tag-link:hover) {
-  color: #66b1ff;
-  text-decoration: underline;
-}
-
 .api-host-label {
   font-size: 14px;
   font-family: 'Roboto';

src/components/Preview.vue

@@ -1061,9 +1061,6 @@ li:last-child {
   color: inherit;
   text-decoration: underline;
 }
-#resolved-request-url:hover {
-  color: var(--el-color-primary);
-}
 .divider {
   border-top: 1px var(--obp-panel-dark-raised) solid;
   margin-left: -25px;

src/views/AboutView.vue

@@ -154,11 +154,6 @@ const clearCacheStorage = () => {
   text-decoration: none;
 }
 
-.about-table a:hover {
-  color: #66b1ff;
-  text-decoration: underline;
-}
-
 .clear-cache-button {
   padding: 6px 16px;
   background-color: #32b9ce;

src/views/CollectionView.vue

@@ -172,7 +172,7 @@ onMounted(async () => {
             <el-collapse-item v-for="key in sortedKeys" :title="key" :key="key" :name="key">
               <div class="el-tabs--right">
                 <div v-for="(value, k) of sortLinks(groups[key])" :key="value" class="api-router-tab" @click="setActive">
-                  <RouterLink active-class="active-api-router-link" class="api-router-link" :id="value"
+                  <RouterLink active-class="active-api-router-link" class="api-router-link" :id="value" draggable="false"
                     :to="{ name: 'collection-api', params: { id: collectionId }, query: { operationid: value } }">{{ k }}</RouterLink>
                 </div>
               </div>
@@ -281,11 +281,9 @@ onMounted(async () => {
 .api-router-tab {
   border-left: 2px solid var(--el-menu-border-color);
 }
-.api-router-tab:hover,
 .active-api-router-tab {
   border-left: 2px solid v-bind(searchLinksColor);
 }
-.api-router-tab:hover .api-router-link,
 .active-api-router-link {
   color: v-bind(searchLinksColor);
 }

src/views/GlossaryView.vue

@@ -76,7 +76,7 @@ const safeDescriptions = computed(
         <el-backtop :right="100" :bottom="100" />
         <div v-for="(value, key) of glossary" :key="value">
           <span>
-            <a v-bind:href="`#${value.title}`" :id="value.title">
+            <a v-bind:href="`#${value.title}`" :id="value.title" draggable="false">
               {{ value.title }}
             </a>
           </span>
@@ -156,24 +156,19 @@ span > a {
   text-decoration: none;
   color: var(--obp-text-strong);
   display: block;
+  -webkit-user-drag: none;
   margin-top: 30px;
   padding-top: 10px;
 }
 span:first-child > a {
   margin-top: 0;
 }
+/* No hover effects on this page: they get in the way of selecting text to copy. */
 .content :deep(a) {
   text-decoration: underline;
   font-family: 'Roboto';
   font-size: 14px;
-  border-radius: 3px;
-  padding: 1px;
-}
-.content :deep(a):hover {
-  background-color: #a4b2ce;
-}
-:global(html.dark) .content :deep(a):hover {
-  background-color: #4c4d4f;
+  -webkit-user-drag: none;
 }
 
 /* Make Scala code blocks readable */

src/views/HelpView.vue

@@ -219,11 +219,6 @@ const hasContent = computed(() => helpContent.value !== null)
   padding: 1px;
 }
 
-.content :deep(a):hover {
-  background-color: var(--el-color-primary-light-9);
-  color: #66b1ff;
-}
-
 .content :deep(blockquote) {
   border-left: 4px solid var(--el-border-color);
   padding-left: 16px;

src/views/MessageDocsJsonSchemaListView.vue

@@ -102,11 +102,6 @@ h1 {
   display: block;
 }
 
-.message-doc-link:hover {
-  background-color: var(--el-color-primary-light-9);
-  color: var(--el-color-primary-dark-2);
-}
-
 .empty-message {
   color: var(--el-text-color-secondary);
   font-style: italic;

src/views/MessageDocsJsonSchemaView.vue

@@ -332,10 +332,6 @@ div {
   font-family: 'Roboto';
 }
 
-.content :deep(a):hover {
-  background-color: #39455f;
-}
-
 .message-docs-header {
   padding: 20px 0;
   border-bottom: 2px solid var(--el-border-color-light);
@@ -395,11 +391,6 @@ div {
   transition: all 0.2s ease;
 }
 
-.definition-item:hover {
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
-  border-color: var(--el-color-primary);
-}
-
 .definition-item h3 {
   color: var(--el-color-primary);
   margin-top: 0;
@@ -415,10 +406,6 @@ div {
   text-decoration: none;
 }
 
-.definition-item a:hover h3 {
-  text-decoration: underline;
-}
-
 .no-definitions {
   text-align: center;
   padding: 40px 20px;