<pre><code class="language-html">&lt;video src=&quot;mycat.webm&quot; controls&gt;no fallback coz i is lame, innit.&lt;/video&gt;
</code></pre>
<pre><code class="language-css">selector {
  property: value;
}
</code></pre>
<pre><code class="language-js">import express from 'express';
import http from 'http';

const app = express();

app.use(express.static('public'));

app.set('view engine', 'ejs');

app.get('*', (req, res) =&gt; {
  res.render('index');
});

const server = http.createServer(app);

server.listen(3003);
server.on('listening', () =&gt; {
  console.log('Listening on 3003');
});
</code></pre>
{% set syntax %}
```html
<video src="mycat.webm" controls>no fallback coz i is lame, innit.</video>
```

```css
selector {
  property: value;
}
```

```js
import express from 'express';
import http from 'http';

const app = express();

app.use(express.static('public'));

app.set('view engine', 'ejs');

app.get('*', (req, res) => {
  res.render('index');
});

const server = http.createServer(app);

server.listen(3003);
server.on('listening', () => {
  console.log('Listening on 3003');
});
```
{% endset %}
{{ syntax | markdown }}
{
  "site": {
    "title": "24 ways",
    "handle": "24ways",
    "description": "24 ways is the advent calendar for web geeks. Each day throughout December we publish a daily dose of web design and development goodness to bring you all a little Christmas cheer.",
    "url": "https://24ways.org",
    "feed": "https://feeds.feedburner.com/24ways",
    "theme_color": "#f04"
  },
  "theme": {
    "year": [
      348,
      344,
      340,
      336,
      332,
      328,
      324,
      320,
      316,
      312,
      308,
      304,
      300,
      296,
      292,
      288
    ],
    "day": [
      360,
      353,
      346,
      339,
      332,
      325,
      318,
      311,
      304,
      297,
      290,
      283,
      276,
      269,
      262,
      255,
      248,
      241,
      234,
      227,
      220,
      213,
      206,
      199
    ]
  }
}
  • Content:
    pre[class*=language-] {
      text-align: left;
      direction: ltr;
      padding: map(spaces, medium);
    
      code {
        background-color: transparent;
      }
    }
    
    .token.cdata,
    .token.comment,
    .token.doctype,
    .token.namespace,
    .token.operator,
    .token.prolog,
    .token.punctuation {
      color: map(colors, neutral, dark);
    }
    
    .token.comment {
      opacity: 0.9;
      font-style: italic;
    }
    
    .token.string,
    .token.attr-value {
      color: #e3116c;
    }
    
    .token.entity,
    .token.url,
    .token.symbol,
    .token.number,
    .token.boolean,
    .token.variable,
    .token.constant,
    .token.property,
    .token.regex,
    .token.inserted {
      color: #066;
    }
    
    .token.atrule,
    .token.keyword,
    .token.attr-name {
      color: #069;
    }
    
    .token.function,
    .token.deleted {
      color: #900;
    }
    
    .token.tag,
    .token.selector {
      color: #009;
    }
    
    .token.important,
    .token.function,
    .token.bold {
      font-weight: bold;
    }
    
    .token.italic {
      font-style: italic;
    }
    
  • URL: /components/raw/syntax/syntax.css
  • Filesystem Path: src/components/scopes/syntax/syntax.css
  • Size: 872 Bytes

There are no notes for this item.