Skip to content

Commit 6d8220e

Browse files
mgolmgol
authored
jquery: Fix CSS to account for the newest highlight.js
Since for some time some sites will use an older version of `grunt-jquery-content` that includes an older highlight.js version, for now both types of CSS rules need to be present. The legacy ones have been marked with comments. The new version of highlight.js uses more generic class names, shared between languages. That means there's no 1-1 correspondence between the old & the new ones in all cases & some differences in syntax highlighting will be there. That's 9 years of highlight.js updates, though! Closes gh-430
1 parent cff497e commit 6d8220e

File tree

2 files changed

+147
-121
lines changed

2 files changed

+147
-121
lines changed

‎themes/jquery/css/base.css

Lines changed: 146 additions & 120 deletions
Original file line numberDiff line numberDiff line change
@@ -1317,11 +1317,9 @@ iframe {
13171317
float: right;
13181318
margin-right: -25px;
13191319
position: relative;
1320-
-webkit-border-image: -webkit-linear-gradient(#ffffff, #e7e7e7 15%, #e7e7e7 85%, #ffffff);
13211320
border-image: linear-gradient(#ffffff, #e7e7e7 15%, #e7e7e7 85%, #ffffff);
13221321
box-shadow: inset 15px 0 5px -16px #e7e7e7;
1323-
background-image: -webkit-radial-gradient(left, #f2f2f2, #ffffff 80%);
1324-
background-image: radial-gradient(left, #f2f2f2, #ffffff 80%);
1322+
background-image: radial-gradient(ellipse at left, #f2f2f2, #ffffff 80%);
13251323
border: 0;
13261324
border-left: 1px solid #efefef;
13271325
}
@@ -1333,11 +1331,9 @@ iframe {
13331331
border-left: 0;
13341332
border-right: 1px solid #e7e7e7;
13351333
margin: -20px 0 0 -25px;
1336-
-webkit-border-image: -webkit-linear-gradient(#ffffff, #e7e7e7 15%, #e7e7e7 85%, #ffffff);
13371334
border-image: linear-gradient(#ffffff, #e7e7e7 15%, #e7e7e7 85%, #ffffff);
13381335
box-shadow: inset 15px 0 5px -16px #e7e7e7;
1339-
background-image: -webkit-radial-gradient(right, #f2f2f2, #ffffff 80%);
1340-
background-image: radial-gradient(right, #f2f2f2, #ffffff 80%);
1336+
background-image: radial-gradient(ellipse at right, #f2f2f2, #ffffff 80%);
13411337
}
13421338

13431339
.entry-summary p {
@@ -1710,7 +1706,6 @@ nav#main {
17101706
border-right: 1px solid rgba(2, 2, 2, 0.28);
17111707
border-left: 1px solid rgba(2, 2, 2, 0.28);
17121708
border-top: 1px solid rgba(250, 250, 250, 0.27);
1713-
box-shadow: rgba(255,255,255,0.3) 0 1px 0, rgba(0,0,0,0.3) 0 -1px 0;
17141709
box-shadow: 0 0 5px rgba(1, 1, 1, 0.7);
17151710
}
17161711

@@ -1806,23 +1801,7 @@ nav#main .searchform input:focus {
18061801
color: #333;
18071802
}
18081803

1809-
/*
1810-
* 1. :-moz-placeholder has been deprecated in favor of ::-moz-placeholder.
1811-
* 2. Using :placeholder for completeness.
1812-
*/
1813-
nav#main .searchform input::-webkit-input-placeholder {
1814-
color: #fff;
1815-
}
1816-
nav#main .searchform input:-moz-placeholder { /* 1 */
1817-
color: #fff;
1818-
}
1819-
nav#main .searchform input::-moz-placeholder {
1820-
color: #fff;
1821-
}
1822-
nav#main .searchform input:-ms-input-placeholder {
1823-
color: #fff;
1824-
}
1825-
nav#main .searchform input:placeholder { /* 2 */
1804+
nav#main .searchform input::placeholder {
18261805
color: #fff;
18271806
}
18281807

@@ -2131,7 +2110,8 @@ p.author a {
21312110
padding: 2%;
21322111
padding-bottom: .5%;
21332112
margin-bottom: 20px;
2134-
font: 700 "klavika-web", "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
2113+
font-weight: 700;
2114+
font-family: "klavika-web", "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
21352115
color: #666;
21362116
background: url(../images-foundation/gauze.png) #f0f0f0;
21372117
text-shadow: 0 1px 0 #ffffff;
@@ -2308,7 +2288,8 @@ input[type="submit"].dark:hover {
23082288
========================================================================== */
23092289

23102290
#sidebar h3 {
2311-
font: 20px/18px;
2291+
font-size: 20px;
2292+
line-height: 18px;
23122293
background-image: -webkit-linear-gradient(left, #efefef, #f3f3f3);
23132294
background-image: linear-gradient(to right, #efefef, #f3f3f3);
23142295
margin-left: -20px;
@@ -3622,120 +3603,165 @@ pre code {
36223603
background: #f8f8ff
36233604
}
36243605

3625-
pre .comment,
3626-
pre .template_comment,
3627-
pre .diff .header,
3628-
pre .javadoc {
3629-
color: #998;
3630-
font-style: italic
3631-
}
3606+
/*
3607+
* Styles for highlight.js. Classes without the hljs prefix are legacy
3608+
* and can be removed once all pages update grunt-jquery-content to
3609+
* the latest version.
3610+
*/
36323611

3633-
pre .keyword,
3634-
pre .css .rule .keyword,
3635-
pre .winutils,
3636-
pre .javascript .title,
3637-
pre .nginx .title,
3638-
pre .subst,
3639-
pre .request,
3640-
pre .status {
3641-
color: #333;
3642-
font-weight: bold
3612+
pre .comment, /* legacy */
3613+
pre .hljs-comment,
3614+
pre .template_comment, /* legacy */
3615+
pre .diff .header, /* legacy */
3616+
pre .diff .hljs-meta,
3617+
pre .javadoc, /* legacy */
3618+
pre .hljs-doctag {
3619+
color: #998;
3620+
font-style: italic
3621+
}
3622+
3623+
pre .keyword, /* legacy */
3624+
pre .hljs-keyword,
3625+
pre .css .rule .keyword, /* legacy */
3626+
pre .css .hljs-keyword,
3627+
pre .winutils, /* ??? */
3628+
pre .javascript .title, /* legacy */
3629+
pre .javascript .hljs-name,
3630+
pre .nginx .title, /* legacy */
3631+
pre .nginx .hljs-name,
3632+
pre .subst, /* legacy */
3633+
pre .hljs-subst,
3634+
pre .request, /* ??? */
3635+
pre .status /* ??? */ {
3636+
color: #333;
3637+
font-weight: bold
36433638
}
36443639

3645-
pre .number,
3646-
pre .hexcolor,
3647-
pre .ruby .constant {
3648-
color: #099;
3640+
pre .number, /* legacy */
3641+
pre .hexcolor, /* legacy */
3642+
pre .hljs-number,
3643+
pre .ruby .constant /* legacy */ {
3644+
color: #099;
36493645
}
36503646

3651-
pre .string,
3652-
pre .tag .value,
3653-
pre .phpdoc,
3654-
pre .tex .formula {
3655-
color: #d14
3647+
pre .string, /* legacy */
3648+
pre .tag .value, /* legacy */
3649+
pre .hljs-string,
3650+
pre .phpdoc, /* legacy */
3651+
pre .tex .formula /* legacy */ {
3652+
color: #d14
36563653
}
36573654

3658-
pre .title,
3659-
pre .id {
3660-
color: #900;
3661-
font-weight: bold
3655+
pre .hljs-name,
3656+
pre .id, /* legacy */
3657+
pre .hljs-selector-id {
3658+
color: #900;
3659+
font-weight: bold
36623660
}
36633661

3664-
pre .javascript .title,
3665-
pre .lisp .title,
3666-
pre .clojure .title,
3667-
pre .subst {
3668-
font-weight: normal
3662+
pre .javascript .title, /* legacy */
3663+
pre .javascript .hljs-name,
3664+
pre .lisp .title, /* legacy */
3665+
pre .lisp .hljs-name,
3666+
pre .clojure .title, /* legacy */
3667+
pre .clojure .hljs-name,
3668+
pre .subst, /* legacy */
3669+
pre .hljs-subst {
3670+
font-weight: normal
36693671
}
36703672

3671-
pre .class .title,
3673+
pre .class .title, /* legacy */
3674+
pre .hljs-selector-class .hljs-name,
36723675
pre .haskell .type,
3673-
pre .vhdl .literal,
3674-
pre .tex .command {
3675-
color: #458;
3676-
font-weight: bold
3677-
}
3678-
3679-
pre .tag,
3680-
pre .tag .title,
3681-
pre .rules .property,
3682-
pre .django .tag .keyword {
3683-
color: #000080;
3684-
font-weight: normal
3685-
}
3686-
3687-
pre .attribute,
3688-
pre .variable,
3689-
pre .lisp .body {
3690-
color: #008080
3691-
}
3692-
3693-
pre .regexp {
3694-
color: #009926
3695-
}
3696-
3697-
pre .class {
3698-
color: #458;
3699-
font-weight: bold
3700-
}
3701-
3702-
pre .symbol,
3703-
pre .ruby .symbol .string,
3704-
pre .lisp .keyword,
3705-
pre .tex .special,
3706-
pre .prompt {
3707-
color: #990073
3708-
}
3709-
3710-
pre .built_in,
3711-
pre .lisp .title,
3712-
pre .clojure .built_in {
3713-
color: #0086b3
3714-
}
3715-
3716-
pre .preprocessor,
3717-
pre .pi,
3718-
pre .doctype,
3719-
pre .shebang,
3720-
pre .cdata {
3721-
color: #999;
3722-
font-weight: bold
3676+
pre .haskell .hljs-type,
3677+
pre .vhdl .literal, /* legacy */
3678+
pre .vhdl .hljs-string,
3679+
pre .tex .command, /* legacy */
3680+
pre .tex .hljs-keyword {
3681+
color: #458;
3682+
font-weight: bold
3683+
}
3684+
3685+
pre .tag, /* legacy */
3686+
pre .hljs-tag,
3687+
pre .tag .title, /* legacy */
3688+
pre .hljs-tag .hljs-name,
3689+
pre .rules .property, /* ??? */
3690+
pre .django .tag .keyword, /* legacy */
3691+
pre .django .hljs-tag .hljs-keyword {
3692+
color: #000080;
3693+
font-weight: normal
3694+
}
3695+
3696+
pre .attribute, /* legacy */
3697+
pre .hljs-attribute,
3698+
pre .hljs-attr,
3699+
pre .variable, /* legacy */
3700+
pre .hljs-variable,
3701+
pre .lisp .body, /* legacy */
3702+
pre .lisp .hljs-symbol {
3703+
color: #008080
3704+
}
3705+
3706+
pre .regexp, /* legacy */
3707+
pre .hljs-regexp {
3708+
color: #009926
3709+
}
3710+
3711+
pre .class, /* legacy */
3712+
pre .hljs-selector-class {
3713+
color: #458;
3714+
font-weight: bold
3715+
}
3716+
3717+
pre .symbol, /* legacy */
3718+
pre .hljs-symbol,
3719+
pre .ruby .symbol .string, /* legacy */
3720+
pre .ruby .hljs-symbol .hljs-string,
3721+
pre .lisp .keyword, /* legacy */
3722+
pre .lisp .hljs-keyword,
3723+
pre .tex .special, /* legacy */
3724+
pre .prompt /* legacy */ {
3725+
color: #990073
3726+
}
3727+
3728+
pre .built_in, /* legacy */
3729+
pre .hljs-built_in,
3730+
pre .lisp .title, /* legacy */
3731+
pre .lisp .hljs-name,
3732+
pre .clojure .built_in, /* legacy */
3733+
pre .clojure .hljs-built_in {
3734+
color: #0086b3
3735+
}
3736+
3737+
pre .preprocessor, /* legacy */
3738+
pre .pi, /* legacy */
3739+
pre .doctype, /* legacy */
3740+
pre .shebang, /* legacy */
3741+
pre .cdata, /* legacy */
3742+
pre .hljs-meta {
3743+
color: #999;
3744+
font-weight: bold
37233745
}
37243746

3725-
pre .deletion {
3726-
background: #fdd
3747+
pre .deletion, /* legacy */
3748+
pre .hljs-deletion {
3749+
background: #fdd
37273750
}
37283751

3729-
pre .addition {
3730-
background: #dfd
3752+
pre .addition, /* legacy */
3753+
pre .hljs-addition {
3754+
background: #dfd
37313755
}
37323756

3733-
pre .diff .change {
3734-
background: #0086b3
3757+
pre .diff .change, /* legacy */
3758+
pre .diff .hljs-meta {
3759+
background: #0086b3
37353760
}
37363761

3737-
pre .chunk {
3738-
color: #aaa
3762+
pre .chunk, /* legacy */
3763+
pre .diff .hljs-comment {
3764+
color: #aaa
37393765
}
37403766

37413767
.syntaxhighlighter a,

‎themes/jquery/header.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323

2424
<link rel="shortcut icon" href="<?php echo get_stylesheet_directory_uri(); ?>/i/favicon.ico">
2525

26-
<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/base.css?v=2">
26+
<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/base.css?v=3">
2727
<link rel="stylesheet" href="<?php bloginfo( 'stylesheet_url' ); ?>">
2828

2929
<script src="<?php echo get_template_directory_uri(); ?>/js/modernizr.custom.2.8.3.min.js"></script>

0 commit comments

Comments
 (0)