Skip to content

日本語環境向けの Google ドメイン専門スタイル (ja-JP) by MaruniUmebachi

Homepage Write a review Install Get Stylus

Details

AuthorMaruniUmebachi

LicenseCC 0

Categorygoogle

Created

Updated

Size76 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Roboto フォントを機能させるとか。私の用意した var スタイルとの併用を前提としています。

Notes

Userstyle doesn't have notes.

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link. 
/* ==UserStyle==
@name         2.1. Google *
@version      20241207.13.05
@namespace    https://userstyles.world/user/MaruniUmebachi
@description  Roboto フォントを機能させるなど。
@homepage     https://userstyles.world/user/MaruniUmebachi
@author       MaruniUmebachi
@license      CC 0
==/UserStyle== */

@-moz-document domain("google.com"), domain("google.co.jp"), domain("youtube.com") {
/* all */
:root {
    --Stylus-CSS: "Google *";
    &,
    body {
        --Stylus-CSS: "Google *";
        --Stylus-CSS: "YouTube";
        --font-variant-east-asian-Stylus: proportional-width;
        --font-feature-settings-Stylus: "palt";
        --font-kerning-Stylus: auto;
        --font-optical-sizing: var(--font-optical-sizing-Stylus);
        --font-optical-sizing-Stylus: inherit;
        --spacing-Stylus: calc(1em / 16);
        --letter-spacing-Stylus: calc(1em / 8);
        --word-spacing-Stylus: calc(1em / 16);
        --hyphens-Stylus: auto;
    }

    svg {
        --Stylus-CSS: "Google *";
        &,
        *,
        text {
            --Stylus-CSS: "Google *";
            --font-feature-settings-Stylus: initial;
            --font-variant-east-asian-Stylus: normal;
            --spacing-Stylus: 0;
            --letter-spacing-Stylus: var(--spacing-Stylus);
            --word-spacing-Stylus: var(--spacing-Stylus);
        }
    }
}
}

@-moz-document domain("google.com"), domain("google.co.jp"), regexp("(android|https)?://(www\\.)?goolge\\.co\\.\\w+/.*") {
/* [Google] font */
:root {
    --Stylus-CSS: "Google *";
    &,
    body {
        --Stylus-CSS: "Google *";
        --Last-Font: var(--Noto-Font), Helvetica, Arial;
        --Roboto-Font: Roboto, RobotoDraft;
        --Source-Font: "Source Han Sans VF", "Source Han Sans";
        --Noto-CJK: "Noto Sans JP", "Noto Sans CJK";
        --Noto-Sans: "Noto", "Noto Sans";
        --Base-Font: var(--Roboto-Font), var(--Noto-Font);
        --Han-Font: var(--Noto-CJK), var(--Source-Font);
        --FontFamily: var(--font-family-Stylus);
        --font-family-Stylus: var(--Base-Font), var(--Han-Font), var(--Last-Font);
    }

    * {
        --Stylus-CSS: "Google *";
        --font-family-Stylus: var(--Base-Font), var(--Han-Font), var(--Last-Font);
    }
}
}

@-moz-document domain("google.com"), domain("google.co.jp"), domain("lens.google.com") {
@import url('https://fonts.googleapis.com/css2?family=Google+Sans:wght@400;500&display=swap');
:root {
    --Stylus-CSS: "Google *";
    &,
    body {
        --Stylus-CSS: "Google *";
        font-variant-east-asian: var(--font-variant-east-asian-Stylus);
        font-feature-settings: var(--font-feature-settings-Stylus);
    }
}
}

@-moz-document domain("youtube.com") {
/* YouTube */
:root {
    --Stylus-CSS: "Google *";
    --Stylus-CSS: "YouTube *";
    --color-Stylus-YouTube-oklch-hue: 29.23;
    --color-Stylus-YouTube-link: oklch(0.71 0.16 var(--color-Stylus-YouTube-oklch-hue));
    &,
    body {
        --Stylus-CSS: "Google *";
        --Stylus-CSS: "YouTube *";
        --font-variant-east-asian-Stylus: jis04, proportional-width;
        font-family: Roboto, "Source Han Sans VF", "Noto Sans CJK", "Noto Sans JP", sans-serif;
        font-feature-settings: var(--font-feature-settings-Stylus-YouTube);
        font-variant-east-asian: var(--font-variant-east-asian-Stylus);
    }

    * {
        --Stylus-CSS: "Google *";
        --Stylus-CSS: "YouTube *";
        --font-feature-settings-Stylus-YouTube: var(--font-feature-settings-Stylus);
    }
}
}

@-moz-document domain("www.youtube.com") {
:root {
    --Stylus-CSS: "Google *";
    --Stylus-CSS: "YouTube";
    #description-inline-expander > yt-attributed-string > span {
        --Stylus-CSS: "Google *";
        --Stylus-CSS: "YouTube";
        line-height: var(--line-height-Stylus);
        letter-spacing: var(--letter-spacing-Stylus);
        word-spacing: var(--word-spacing-Stylus);
        word-break: var(--word-break-Stylus);
        text-wrap: var(--text-wrap-Stylus);
    }

    ytd-searchbox[has-focus] #container.ytd-searchbox {
        --Stylus-CSS: "Google *";
        --Stylus-CSS: "YouTube";
        border-color: oklch(0.5 0.15 var(--color-Stylus-YouTube-oklch-hue));
    }

    :where([style*="color: rgb(62, 166, 255);"]) {
        --Stylus-CSS: "Google *";
        --Stylus-CSS: "YouTube";
        color: var(--color-Stylus-YouTube-link) !important;
    }

    .yt-channel-external-link-view-model-wiz__link {
        --Stylus-CSS: "Google *";
        --Stylus-CSS: "YouTube";
        color: var(--color-Stylus-YouTube-link);
    }

    .yt-core-attributed-string__link--call-to-action-color {
        --Stylus-CSS: "Google *";
        --Stylus-CSS: "YouTube";
        color: var(--color-Stylus-YouTube-link);
    }

    .yt-core-attributed-string--link-inherit-color .yt-core-attributed-string__link--call-to-action-color {
        --Stylus-CSS: "Google *";
        --Stylus-CSS: "YouTube";
        color: inherit;
        &:hover {
            --Stylus-CSS: "Google *";
            --Stylus-CSS: "YouTube";
        }
    }

    .yt-spec-button-shape-next--call-to-action.yt-spec-button-shape-next--outline {
        --Stylus-CSS: "Google *";
        --Stylus-CSS: "YouTube";
        color: var(--color-Stylus-YouTube-link);
        &:hover {
            --Stylus-CSS: "Google *";
            --Stylus-CSS: "YouTube";
            background: var(--yt-spec-suggested-action);
        }
    }

    /* Color */
    &[dark],
    [dark] {
        --Stylus-CSS: "Google *";
        --Stylus-CSS: "YouTube";
        --yt-spec-base-background: #0f0f0f;
        --yt-spec-raised-background: #212121;
        --yt-spec-menu-background: #282828;
        --yt-spec-inverted-background: #f1f1f1;
        --yt-spec-additive-background: rgba(255, 255, 255, 0.1);
        --yt-spec-outline: rgba(255, 255, 255, 0.2);
        --yt-spec-outline-inverse: rgba(0, 0, 0, 0.1);
        --yt-spec-outline-inverse-medium: rgba(0, 0, 0, 0.3);
        --yt-spec-shadow: rgba(0, 0, 0, 0.25);
        --yt-spec-text-primary: #fff;
        --yt-spec-text-secondary: #aaa;
        --yt-spec-text-disabled: #717171;
        --yt-spec-text-primary-inverse: #030303;
        --yt-spec-call-to-action: var(--color-Stylus-YouTube-link);
        --yt-spec-call-to-action-inverse: oklch(0.51 0.2 var(--color-Stylus-YouTube-oklch-hue));
        --yt-spec-suggested-action: oklch(0.34 0.05 var(--color-Stylus-YouTube-oklch-hue));
        --yt-spec-suggested-action-inverse: oklch(0.95 0.03 var(--color-Stylus-YouTube-oklch-hue));
        --yt-spec-icon-active-other: #fff;
        --yt-spec-icon-inactive: #909090;
        --yt-spec-icon-disabled: #606060;
        --yt-spec-button-chip-background-hover: rgba(255, 255, 255, 0.2);
        --yt-spec-touch-response: #fff;
        --yt-spec-touch-response-inverse: #000;
        --yt-spec-brand-icon-active: #fff;
        --yt-spec-brand-icon-inactive: #909090;
        --yt-spec-red-indicator: #e1002d;
        --yt-spec-wordmark-text: #fff;
        --yt-spec-error-indicator: #ff8983;
        --yt-spec-error-background-red: rgba(255, 85, 119, 0.2);
        --yt-spec-themed-blue: var(--color-Stylus-YouTube-link);
        --yt-spec-themed-green: #2ba640;
        --yt-spec-ad-indicator: #00aaa7;
        --yt-spec-themed-overlay-background: rgba(0, 0, 0, 0.8);
        --yt-spec-commerce-badge-background: #002d08;
        --yt-spec-static-white-background: #fff;
        --yt-spec-static-black: #0f0f0f;
        --yt-spec-static-brand-red: #f00;
        --yt-spec-static-brand-white: #fff;
        --yt-spec-static-brand-black: #212121;
        --yt-spec-static-clear-color: rgba(255, 255, 255, 0);
        --yt-spec-static-clear-black: rgba(0, 0, 0, 0);
        --yt-spec-static-ad-yellow: #fbc02d;
        --yt-spec-static-grey: #606060;
        --yt-spec-brand-red-contrast: #f57;
        --yt-spec-static-overlay-additive-background: rgba(40, 40, 40, 0.6);
        --yt-spec-static-overlay-background-solid: #000;
        --yt-spec-static-overlay-background-heavy: rgba(0, 0, 0, 0.8);
        --yt-spec-static-overlay-background-medium: rgba(0, 0, 0, 0.6);
        --yt-spec-static-overlay-background-medium-light: rgba(0, 0, 0, 0.3);
        --yt-spec-static-overlay-background-light: rgba(0, 0, 0, 0.1);
        --yt-spec-static-overlay-text-primary: #fff;
        --yt-spec-static-overlay-text-primary-inverse: #030303;
        --yt-spec-static-overlay-text-secondary: rgba(255, 255, 255, 0.7);
        --yt-spec-static-overlay-text-disabled: rgba(255, 255, 255, 0.3);
        --yt-spec-static-overlay-call-to-action: var(--yt-spec-suggested-action);
        --yt-spec-static-overlay-call-to-action-hover: oklch(0.76 0.13 var(--color-Stylus-YouTube-oklch-hue));
        --yt-spec-static-overlay-icon-active-other: #fff;
        --yt-spec-static-overlay-icon-inactive: rgba(255, 255, 255, 0.7);
        --yt-spec-static-overlay-icon-disabled: rgba(255, 255, 255, 0.3);
        --yt-spec-static-overlay-button-primary: rgba(255, 255, 255, 0.3);
        --yt-spec-static-overlay-button-secondary: rgba(255, 255, 255, 0.1);
        --yt-spec-static-overlay-touch-response: #fff;
        --yt-spec-static-overlay-touch-response-inverse: #000;
        --yt-spec-static-overlay-background-brand: rgba(204, 0, 0, 0.9);
        --yt-spec-assistive-feed-themed-gradient-1: #005446;
        --yt-spec-assistive-feed-themed-gradient-2: #39003f;
        --yt-spec-assistive-feed-themed-gradient-3: #590000;
        --yt-spec-gen-ai-gradient-1: #007a65;
        --yt-spec-gen-ai-gradient-2: #7f0e7f;
        --yt-spec-gen-ai-gradient-3: #aa09aa;
        --yt-spec-gen-ai-gradient-4: #ff4e45;
        --yt-spec-gen-ai-additive-gradient-1: rgba(0, 122, 101, 0.3);
        --yt-spec-gen-ai-additive-gradient-2: rgba(127, 14, 127, 0.3);
        --yt-spec-gen-ai-additive-gradient-3: rgba(170, 9, 170, 0.3);
        --yt-spec-gen-ai-additive-gradient-4: rgba(255, 78, 69, 0.3);
        --yt-spec-discover-red: #ff4e45;
        --yt-spec-discover-green: #a4ffa4;
        --yt-spec-d...

Reviews

No reviews yet.