Bits of 24 ways

Syntax 

<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 | safe }}
 
{
  "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
    ]
  },
  "prism": true
}
  • 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.