github.com/choria-io/go-choria@v0.28.1-0.20240416190746-b3bf9c7d5a45/docs/themes/hugo-theme-relearn/static/css/theme-neon.css (about)

     1  /* this variant does not work well if we use fallback styles for IE11 so better
     2     ignore this variant in IE completely */
     3  @supports not (-ms-high-contrast:none) {
     4  
     5  :root {
     6      --PRIMARY-color: rgba( 243, 0, 178, 1 ); /* brand primary color */
     7      --SECONDARY-color: rgba( 28, 144, 243, 1 ); /* brand secondary color */
     8      --ACCENT-color: rgba( 255, 255, 0, 1 ); /* brand accent color, used for search highlights */
     9  
    10      --MAIN-TEXT-color: rgba( 224, 224, 224, 1 ); /* text color of content and h1 titles */
    11      --MAIN-LINK-HOVER-color: rgba( 76, 171, 255, 1 ); /* hovered link color of content */
    12      --MAIN-BG-color: rgba( 16, 16, 16, 1 ); /* background color of content */
    13  
    14      /* optional overwrites for specific headers */
    15      --MAIN-TITLES-TEXT-color: rgba( 243, 0, 178, 1 ); /* text color of h2-h6 titles and transparent box titles */
    16      --MAIN-TITLES-H3-color: rgba( 0, 243, 211, 1 ); /* text color of h3-h6 titles */
    17      --MAIN-TITLES-H4-color: rgba( 255, 255, 0, 1 ); /* text color of h4-h6 titles */
    18  
    19      --CODE-theme: neon; /* name of the chroma stylesheet file */
    20      --CODE-BLOCK-color: rgba( 248, 248, 242, 1 ); /* fallback text color of block code; should be adjusted to your selected chroma style */
    21      --CODE-BLOCK-BG-color: rgba( 0, 0, 0, 1 ); /* fallback background color of block code; should be adjusted to your selected chroma style */
    22      --CODE-INLINE-color: rgba( 130, 229, 80, 1 ); /* text color of inline code */
    23      --CODE-INLINE-BG-color: rgba( 40, 42, 54, 1 ); /* background color of inline code */
    24      --CODE-INLINE-BORDER-color: rgba( 70, 70, 70, 1 ); /* border color of inline code */
    25  
    26      --BROWSER-theme: dark; /* name of the theme for browser scrollbars of the main section */
    27      --MERMAID-theme: dark; /* name of the default Mermaid theme for this variant, can be overridden in hugo.toml */
    28      --OPENAPI-theme: dark; /* name of the default OpenAPI theme for this variant, can be overridden in hugo.toml */
    29      --OPENAPI-CODE-theme: tomorrow-night; /* name of the default OpenAPI code theme for this variant, can be overridden in hugo.toml */
    30  
    31      --MENU-HEADER-BG-color: rgba( 0, 0, 0, 0 ); /* background color of menu header */
    32  
    33      --MENU-HOME-LINK-color: rgba( 255, 255, 255, 1 ); /* home button color if configured */
    34      --MENU-HOME-LINK-HOVER-color: rgba( 208, 208, 208, 1 ); /* hovered home button color if configured */
    35  
    36      --MENU-SEARCH-color: rgba( 248, 248, 248, 1 ); /* text and icon color of search box */
    37      --MENU-SEARCH-BG-color: rgba( 16, 16, 16, .6 ); /* background color of search box */
    38      --MENU-SEARCH-BORDER-color: rgba( 232, 232, 232, 1 ); /* border color of search box */
    39  
    40      --MENU-SECTIONS-BG-color: linear-gradient( 165deg, rgba( 243, 0, 178, .825 ) 0%, rgba( 28, 144, 243, .7 ) 65%, rgba( 0, 227, 211, .7 ) 100% ); /* background of the menu; this is NOT just a color value but can be a complete CSS background definition including gradients, etc. */
    41      --MENU-SECTIONS-ACTIVE-BG-color: rgba( 0, 0, 0, .166 ); /* background color of the active menu section */
    42      --MENU-SECTIONS-LINK-color: rgba( 255, 255, 255, 1 ); /* link color of menu topics */
    43      --MENU-SECTIONS-LINK-HOVER-color: rgba( 208, 208, 208, 1 ); /* hovered link color of menu topics */
    44      --MENU-SECTION-ACTIVE-CATEGORY-color: rgba( 86, 255, 232, 1 ); /* text color of the displayed menu topic */
    45      --MENU-SECTION-SEPARATOR-color: rgba( 186, 186, 186, 1 ); /* separator color between menu sections and menu footer */
    46  
    47      --MENU-VISITED-color: rgba( 51, 161, 255, 1 ); /* icon color of visited menu topics if configured */
    48  
    49      /* base styling for boxes */
    50      --BOX-CAPTION-color: rgba( 240, 240, 240, 1 ); /* text color of colored box titles */
    51      --BOX-BG-color: rgba( 8, 8, 8, 1 ); /* background color of colored boxes */
    52      --BOX-TEXT-color: initial; /* text color of colored box content */
    53  
    54      /* optional base colors for colored boxes as in badges, buttons, notice, etc. shortcode */
    55      --BOX-BLUE-color: rgba( 48, 117, 229, 1 ); /* background color of blue boxes */
    56      --BOX-BLUE-TEXT-color: var( --BOX-BLUE-color ); /* text color of blue boxes */
    57      --BOX-GREEN-color: rgba( 42, 178, 24, 1 ); /* background color of green boxes */
    58      --BOX-GREEN-TEXT-color: var( --BOX-GREEN-color ); /* text color of green boxes */
    59      --BOX-GREY-color: rgba( 128, 128, 128, 1 ); /* background color of grey boxes */
    60      --BOX-GREY-TEXT-color: var( --BOX-GREY-color ); /* text color of grey boxes */
    61      --BOX-ORANGE-color: rgba( 237, 153, 9, 1 ); /* background color of orange boxes */
    62      --BOX-ORANGE-TEXT-color: var( --BOX-ORANGE-color ); /* text color of orange boxes */
    63      --BOX-RED-color: rgba( 224, 62, 62, 1 ); /* background color of red boxes */
    64      --BOX-RED-TEXT-color: var( --BOX-RED-color ); /* text color of red boxes */
    65  }
    66  
    67  body a#R-logo,
    68  body a#R-logo:hover,
    69  body #R-logo svg,
    70  body #R-logo svg * {
    71      color: var(--INTERNAL-MENU-SEARCH-BORDER-color);
    72      fill: var(--INTERNAL-MENU-SEARCH-BORDER-color) !important;
    73  }
    74  
    75  body a#R-logo{
    76      text-shadow:
    77          0 0  1px var(--INTERNAL-MENU-SEARCH-BORDER-color),
    78          0 0  2px var(--INTERNAL-MENU-SEARCH-BORDER-color),
    79          0 0  4px var(--INTERNAL-MENU-SEARCH-BORDER-color),
    80          0 0  8px rgba( 128, 128, 128, 1 ),
    81          0 0  4px var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color),
    82          0 0  8px var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color);
    83  }
    84  
    85  body h1 {
    86      color: rgba( 255, 255, 255, 1 );
    87      text-shadow:
    88          0 0  1px rgba( 255, 255, 255, 1 ),
    89          0 0  2px rgba( 255, 255, 255, 1 ),
    90          0 0  4px rgba( 255, 255, 255, 1 ),
    91          0 0  8px rgba( 255, 255, 255, 1 ),
    92          0 0  3px var(--INTERNAL-MAIN-TITLES-H1-color),
    93          0 0  6px var(--INTERNAL-MAIN-TITLES-H1-color),
    94          0 0  8px var(--INTERNAL-MAIN-TITLES-H1-color);
    95  }
    96  
    97  body h2 {
    98      color: rgba( 255, 255, 255, 1 );
    99      text-shadow:
   100          0 0  1px rgba( 255, 255, 255, 1 ),
   101          0 0  2px rgba( 255, 255, 255, 1 ),
   102          0 0  8px rgba( 128, 128, 128, 1 ),
   103          0 0  4px var(--INTERNAL-MAIN-TITLES-H2-color),
   104          0 0  8px var(--INTERNAL-MAIN-TITLES-H2-color),
   105          0 0 10px var(--INTERNAL-MAIN-TITLES-H2-color);
   106  }
   107  
   108  body h3, body .article-subheading {
   109      color: rgba( 255, 255, 255, 1 );
   110      text-shadow:
   111          0 0  1px rgba( 255, 255, 255, 1 ),
   112          0 0  2px rgba( 255, 255, 255, 1 ),
   113          0 0  8px rgba( 128, 128, 128, 1 ),
   114          0 0  4px var(--INTERNAL-MAIN-TITLES-H3-color),
   115          0 0  8px var(--INTERNAL-MAIN-TITLES-H3-color),
   116          0 0 10px var(--INTERNAL-MAIN-TITLES-H3-color);
   117  }
   118  
   119  body h4 {
   120      color: rgba( 255, 255, 255, 1 );
   121      text-shadow:
   122          0 0  1px rgba( 255, 255, 255, 1 ),
   123          0 0  2px rgba( 255, 255, 255, 1 ),
   124          0 0  8px rgba( 128, 128, 128, 1 ),
   125          0 0  4px var(--INTERNAL-MAIN-TITLES-H4-color),
   126          0 0  8px var(--INTERNAL-MAIN-TITLES-H4-color),
   127          0 0 10px var(--INTERNAL-MAIN-TITLES-H4-color);
   128  }
   129  
   130  body h5 {
   131      color: rgba( 255, 255, 255, 1 );
   132      text-shadow:
   133          0 0  1px rgba( 255, 255, 255, 1 ),
   134          0 0  3px rgba( 255, 255, 255, 1 ),
   135          0 0  6px rgba( 128, 128, 128, 1 ),
   136          0 0  4px var(--INTERNAL-MAIN-TITLES-H5-color),
   137          0 0  8px var(--INTERNAL-MAIN-TITLES-H5-color);
   138  }
   139  
   140  body h6 {
   141      color: rgba( 255, 255, 255, 1 );
   142      text-shadow:
   143          0 0  1px rgba( 255, 255, 255, 1 ),
   144          0 0  2px rgba( 255, 255, 255, 1 ),
   145          0 0  4px rgba( 128, 128, 128, 1 ),
   146          0 0  4px var(--INTERNAL-MAIN-TITLES-H6-color),
   147          0 0  8px var(--INTERNAL-MAIN-TITLES-H6-color);
   148  }
   149  
   150  .swagger-ui h4,
   151  .swagger-ui h5,
   152  .swagger-ui h6{
   153      color: rgba( 255, 255, 255, 1 ) !important;
   154  }
   155  
   156  body #R-sidebar .searchbox button:hover{
   157      color: rgba( 255, 255, 255, 1 );
   158      text-shadow:
   159          0 0  1px rgba( 255, 255, 255, 1 ),
   160          0 0  2px rgba( 255, 255, 255, 1 ),
   161          0 0  8px rgba( 128, 128, 128, 1 ),
   162          0 0  4px var(--INTERNAL-MENU-SEARCH-color),
   163          0 0  8px var(--INTERNAL-MENU-SEARCH-color);
   164  }
   165  
   166  body #R-sidebar select:hover,
   167  body #R-sidebar .collapsible-menu li:not(.active) > label:hover,
   168  body #R-sidebar .menu-control:hover,
   169  body #R-sidebar a:hover,
   170  body #R-prefooter button:hover {
   171      color: rgba( 255, 255, 255, 1 );
   172      text-shadow:
   173          0 0  1px rgba( 255, 255, 255, 1 ),
   174          0 0  2px rgba( 255, 255, 255, 1 ),
   175          0 0  8px rgba( 128, 128, 128, 1 ),
   176          0 0  4px var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color),
   177          0 0  8px var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color);
   178  }
   179  
   180  body #R-sidebar li.active > label,
   181  body #R-sidebar li.active > :is( a, span ) {
   182      color: rgba( 255, 255, 255, 1 );
   183      text-shadow:
   184          0 0  1px rgba( 255, 255, 255, 1 ),
   185          0 0  2px rgba( 255, 255, 255, 1 ),
   186          0 0  8px rgba( 128, 128, 128, 1 ),
   187          0 0  4px var(--INTERNAL-MENU-SECTION-ACTIVE-CATEGORY-color),
   188          0 0  8px var(--INTERNAL-MENU-SECTION-ACTIVE-CATEGORY-color);
   189  }
   190  
   191  body #R-homelinks a:hover {
   192      color: rgba( 255, 255, 255, 1 );
   193      text-shadow:
   194          0 0  1px rgba( 255, 255, 255, 1 ),
   195          0 0  2px rgba( 255, 255, 255, 1 ),
   196          0 0  8px rgba( 128, 128, 128, 1 ),
   197          0 0  4px var(--INTERNAL-MENU-HOME-LINK-HOVER-color),
   198          0 0  8px var(--INTERNAL-MENU-HOME-LINK-HOVER-color);
   199  }
   200  
   201  body h1 a,
   202  body h2 a,
   203  body h3 a,
   204  body h4 a,
   205  body h5 a,
   206  body h6 a,
   207  body .anchor {
   208      text-shadow: none;
   209  }
   210  
   211  body .badge,
   212  body .btn,
   213  body div.box {
   214      box-shadow:
   215          0 0  1px rgba( 255, 255, 255, 1 ),
   216          0 0  2px rgba( 255, 255, 255, 1 ),
   217          0 0  4px rgba( 128, 128, 128, 1 ),
   218          0 0  4px var(--VARIABLE-BOX-color);
   219  }
   220  
   221  body .badge > .badge-content,
   222  body .btn,
   223  body .btn > *,
   224  body div.box > .box-label {
   225      text-shadow:
   226          0 0  1px rgba( 255, 255, 255, 1 ),
   227          0 0  2px rgba( 255, 255, 255, 1 ),
   228          0 0  4px rgba( 128, 128, 128, 1 ),
   229          0 0  4px var(--VARIABLE-BOX-CAPTION-color);
   230  }
   231  
   232  body .tab-panel-cstyle:not(.transparent),
   233  body .badge.cstyle:not(.transparent),
   234  body .btn.cstyle {
   235      --VARIABLE-BOX-TEXT-color: var(--VARIABLE-BOX-CAPTION-color);
   236  }
   237  
   238  body .badge.cstyle.transparent,
   239  body .btn.cstyle.transparent {
   240      --VARIABLE-BOX-BG-color: var(--INTERNAL-BOX-BG-color);
   241  }
   242  
   243  body .btn.cstyle.transparent > * {
   244      border-color: var(--VARIABLE-BOX-color);
   245      color: var(--VARIABLE-BOX-CAPTION-color);
   246  }
   247  
   248  body .btn.cstyle.interactive.transparent > *:hover,
   249  body .btn.cstyle.interactive.transparent > *:active,
   250  body .btn.cstyle.interactive.transparent > *:focus {
   251      background-color: var(--INTERNAL-MAIN-TITLES-TEXT-color);
   252      color: var(--INTERNAL-MAIN-TEXT-color);
   253  }
   254  
   255  body .box.cstyle.transparent {
   256      box-shadow: none;
   257  }
   258  
   259  @media print {
   260      #R-body h1,
   261      #R-body h2,
   262      #R-body h3, #R-body .article-subheading,
   263      #R-body h4,
   264      #R-body h5,
   265      #R-body h6 {
   266          text-shadow: none;
   267      }
   268      #R-body .badge,
   269      #R-body .badge > .badge-content,
   270      #R-body .btn,
   271      #R-body .btn > *,
   272      #R-body div.box,
   273      #R-body div.box > .box-label {
   274          box-shadow: none;
   275          text-shadow: none;
   276      }
   277      #R-body .badge.cstyle:not(.transparent),
   278      #R-body .btn.cstyle {
   279          --VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color);
   280      }
   281  }
   282  
   283  /* if we are in print chapter preview our @media statement from
   284  above will not apply, so we have to repeat it here */
   285  .print #R-body h1,
   286  .print #R-body h2,
   287  .print #R-body h3, .print #R-body .article-subheading,
   288  .print #R-body h4,
   289  .print #R-body h5,
   290  .print #R-body h6 {
   291      text-shadow: none;
   292  }
   293  .print #R-body .badge,
   294  .print #R-body .badge > .badge-content,
   295  .print #R-body .btn,
   296  .print #R-body .btn > *,
   297  .print #R-body div.box,
   298  .print #R-body div.box > .box-label {
   299      box-shadow: none;
   300      text-shadow: none;
   301  }
   302  .print #R-body .badge.cstyle:not(.transparent),
   303  .print #R-body .btn.cstyle {
   304      --VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color);
   305  }
   306  
   307  #R-content-wrapper {
   308      --ps-thumb-color: rgba( 208, 208, 208, 1 );
   309      --ps-thumb-hover-color: rgba( 204, 204, 204, 1 );
   310  }
   311  
   312  }