☰

Goodreads Bookpage

This UserScript aims to bring a better experience to the new Goodreads Bookpage by resizing and repositioning the elements on the page. Based on tripu's Wider Goodreads.

当前为 2023-03-03 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name        Goodreads Bookpage
  3. // @description This UserScript aims to bring a better experience to the new Goodreads Bookpage by resizing and repositioning the elements on the page. Based on tripu's Wider Goodreads.
  4. // @namespace   https://greasyfork.org/en/scripts/453992-goodreads-bookpage
  5. // @version     0.6
  6. // @match       https://goodreads.com/*/book/*
  7. // @match       https://www.goodreads.com/*/book/*
  8. // @license     MIT
  9. // @supportURL  -
  10. // @author      Estherflails
  11. // ==/UserScript==
  12.  
  13. console.debug('[Goodreads Bookpage] Start');
  14.  
  15. (() => {
  16.     'use strict';
  17.     if (document && document.getElementsByTagName && document.createElement) {
  18.         var head = document.getElementsByTagName('head');
  19.         if (head && 1 === head.length) {
  20.             const style = document.createElement('style');
  21.             head = head[0];
  22.             style.innerText = `
  23. :root {
  24. --color-background-body-base: #e3dedd;
  25. }
  26. .BookPage__gridContainer {
  27.   margin-right: 2;
  28. }
  29.  
  30.  
  31. .BookPage__leftColumn {
  32.   transform:translate(-30%, 0%);
  33. }
  34. .Sticky {
  35.   top: 1rem !important;
  36.   position: relative !important;
  37. }
  38. .BookPage .BookPage__bookCover {
  39.   width: 70%;
  40. }
  41. .BookActions {
  42.   width: 70%;
  43. }
  44. .Button--medium {
  45.   height: 3rem;
  46.   font-size: 90%;
  47. }
  48.  
  49.  
  50. .BookPage__rightColumn {
  51.   position: relative;
  52.   overflow: visible;
  53.   margin-left: 0;
  54.   transform:translate(-10%, 0%);
  55. }
  56. .BookPage__mainContent {
  57.   width:55%;
  58. }
  59. .Text__title1 {
  60.   font-size: 2rem;
  61.   line-height: 3rem;
  62. }
  63. .Text__title3 {
  64.   font-size: 1.7rem;
  65.   line-height: 2.8rem;
  66. }
  67. .BookPageMetadataSection__contributor {
  68.   margin: 0rem 0;
  69. }
  70. .RatingStars {
  71.   width: 90%;
  72.   transform:translate(0%, 6%);
  73. }
  74. .TruncatedContent__text--large {
  75.   width: 130%;
  76. }
  77. .BookPageMetadataSection__ratingStats {
  78.   margin-bottom: 0rem;
  79. }
  80. .RatingStatistics__rating {
  81.   font-size: 2rem;
  82. }
  83. .Divider--largeMargin {
  84.   margin: 1rem 0;
  85. }
  86.  
  87.  
  88. .BookPage__reviewsSection {
  89.   transform:translate(-34%, 0%);
  90.   width:80%;
  91. }
  92. .ReviewsSection__header {
  93.   transform:translate(+34%, 0%);
  94. }
  95.  
  96. .Text__title2 {
  97.   font-size: 1.7rem;
  98. }
  99. .MyReviewCardCarousel__header {
  100.   margin-bottom: 1rem;
  101. }
  102. .MyReviewCard__content {
  103.   padding-bottom: 0rem;
  104. }
  105. .MyReviewCardCarousel {
  106.   margin-top: 0rem;
  107. }
  108. .WriteReviewCTA__hero {
  109.   width: 70%;
  110.   margin-bottom: 0rem;
  111. }
  112. .WriteReviewCTA__message--leftAligned {
  113.   font-size:1.6rem;
  114. }
  115. .MyReviewCard__row {
  116.   justify-content: left;
  117. }
  118. .Button--large {
  119.   height: 3rem;
  120.   padding: 0 3.2rem;
  121.   font-size: 1.7rem;
  122. }
  123. .MyReviewCard__tags {
  124.   padding-bottom: 0rem;
  125. }
  126.  
  127. .WriteReviewCTA {
  128.   padding: 0rem 0;
  129. }
  130. .WriteReviewCTA__message {
  131.   font-size: 1.6rem;
  132. }
  133.  
  134.  
  135. .ReviewsSection__listHeader {
  136.   margin: 1rem 0;
  137. }
  138. .ReviewsList__listHeader {
  139.   margin: 1rem 0;
  140. }
  141. .Alert--informational {
  142.   padding: 10px;
  143.   width: 130%;
  144. }
  145. .ReviewsSectionStatistics__histogram {
  146.   width: 50%;
  147. }
  148. .RatingsHistogram__container {
  149.   border-radius: 1rem;
  150.   padding: 1rem 1rem;
  151. }
  152. .ReviewFilters__filterControl {
  153.   width: 100%;
  154. }
  155.  
  156.  
  157. .ReviewsList {
  158.   width: 80%
  159. }
  160. .TruncatedContent__gradientOverlay {
  161.   width: 130%;
  162. }
  163.  
  164.  
  165. .BookPage__relatedTopContent {
  166.   width: 45%;
  167.   position: absolute;
  168.   top: 1rem;
  169.   left: 63%;
  170. }
  171. .DynamicCarousel__innerContainer {
  172.   width: 100% !important;
  173. }
  174. .BookCard__title {
  175.   font-size: 1.3rem;
  176. }
  177. .BookCard__authorName {
  178.   font-size: 1.3rem;
  179. }
  180. .AverageRating__ratingsCount {
  181.   transform:translate(-100%, 80%);
  182. }
  183. .DynamicCarousel__itemsArea {
  184.   padding: 1rem 0 1rem 1.2rem;
  185.   margin-bottom: 1rem;
  186.   margin-left: -1.2rem;
  187. }
  188. .DynamicCarousel__item {
  189.   margin-right: 2rem;
  190.   max-width:8rem;
  191. }
  192.  
  193.  
  194. .BookDetails {
  195.   width: 33%;
  196.   position: absolute;
  197.   top: 150rem;
  198.   left: 63%;
  199. }
  200. .MoreInformation__statistics {
  201.   margin: 1rem 0;
  202. }
  203.  
  204.  
  205. .BookDiscussions__list {
  206.   padding-top: 1rem;
  207.   width:60%;
  208. }
  209. .DiscussionCard__icon {
  210.   width: clamp(3rem, 6vw, 6rem);
  211.   height: clamp(3rem, 6vw, 6rem);
  212. }
  213. .DiscussionCard__stats {
  214.   font-size: clamp(2rem, 2vw, 2rem);
  215. }
  216.  
  217.  
  218. .BookPage__relatedBottomContent {
  219.   width: 35%;
  220.   position: absolute;
  221.   top: 50rem;
  222.   left: 65%;
  223. }
  224. .CollectionCard__card {
  225.   height: 10rem;
  226. }
  227. .Text__h3 {
  228.   font-size: 1.2rem;
  229. }
  230. .CollectionCard__bookCover {
  231.   min-width: 2.2rem;
  232.   margin-right: 0.5rem;
  233. }
  234.             `;
  235.             head.appendChild(style);
  236.             console.debug('[Goodreads Bookpage] ✓ Done');
  237.         } else {
  238.             console.debug('[Goodreads Bookpage] ✗ No head');
  239.         }
  240.     } else {
  241.         console.debug('[Goodreads Bookpage] ✗ No document');
  242.     }
  243. })();
  244.  
  245. console.debug('[Goodreads Bookpage] End');