Add hlphp & codeblock component
This commit is contained in:
parent
9a10c8db3a
commit
f82de3956b
8 changed files with 338 additions and 1 deletions
|
@ -11,6 +11,7 @@
|
|||
"laravel/framework": "^10.10",
|
||||
"laravel/sanctum": "^3.2",
|
||||
"laravel/tinker": "^2.8",
|
||||
"scrivo/highlight.php": "v9.18.1.10",
|
||||
"spatie/laravel-honeypot": "^4.3"
|
||||
},
|
||||
"require-dev": {
|
||||
|
|
80
composer.lock
generated
80
composer.lock
generated
|
@ -4,7 +4,7 @@
|
|||
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
|
||||
"This file is @generated automatically"
|
||||
],
|
||||
"content-hash": "b946004dacc886bc1ef1ae8e1e9644ac",
|
||||
"content-hash": "b9fa52d6299a2643f49a5191cf7b6cc8",
|
||||
"packages": [
|
||||
{
|
||||
"name": "auth0/auth0-php",
|
||||
|
@ -4063,6 +4063,84 @@
|
|||
],
|
||||
"time": "2023-04-15T23:01:58+00:00"
|
||||
},
|
||||
{
|
||||
"name": "scrivo/highlight.php",
|
||||
"version": "v9.18.1.10",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/scrivo/highlight.php.git",
|
||||
"reference": "850f4b44697a2552e892ffe71490ba2733c2fc6e"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/scrivo/highlight.php/zipball/850f4b44697a2552e892ffe71490ba2733c2fc6e",
|
||||
"reference": "850f4b44697a2552e892ffe71490ba2733c2fc6e",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
"ext-json": "*",
|
||||
"php": ">=5.4"
|
||||
},
|
||||
"require-dev": {
|
||||
"phpunit/phpunit": "^4.8|^5.7",
|
||||
"sabberworm/php-css-parser": "^8.3",
|
||||
"symfony/finder": "^2.8|^3.4|^5.4",
|
||||
"symfony/var-dumper": "^2.8|^3.4|^5.4"
|
||||
},
|
||||
"suggest": {
|
||||
"ext-mbstring": "Allows highlighting code with unicode characters and supports language with unicode keywords"
|
||||
},
|
||||
"type": "library",
|
||||
"autoload": {
|
||||
"files": [
|
||||
"HighlightUtilities/functions.php"
|
||||
],
|
||||
"psr-0": {
|
||||
"Highlight\\": "",
|
||||
"HighlightUtilities\\": ""
|
||||
}
|
||||
},
|
||||
"notification-url": "https://packagist.org/downloads/",
|
||||
"license": [
|
||||
"BSD-3-Clause"
|
||||
],
|
||||
"authors": [
|
||||
{
|
||||
"name": "Geert Bergman",
|
||||
"homepage": "http://www.scrivo.org/",
|
||||
"role": "Project Author"
|
||||
},
|
||||
{
|
||||
"name": "Vladimir Jimenez",
|
||||
"homepage": "https://allejo.io",
|
||||
"role": "Maintainer"
|
||||
},
|
||||
{
|
||||
"name": "Martin Folkers",
|
||||
"homepage": "https://twobrain.io",
|
||||
"role": "Contributor"
|
||||
}
|
||||
],
|
||||
"description": "Server side syntax highlighter that supports 185 languages. It's a PHP port of highlight.js",
|
||||
"keywords": [
|
||||
"code",
|
||||
"highlight",
|
||||
"highlight.js",
|
||||
"highlight.php",
|
||||
"syntax"
|
||||
],
|
||||
"support": {
|
||||
"issues": "https://github.com/scrivo/highlight.php/issues",
|
||||
"source": "https://github.com/scrivo/highlight.php"
|
||||
},
|
||||
"funding": [
|
||||
{
|
||||
"url": "https://github.com/allejo",
|
||||
"type": "github"
|
||||
}
|
||||
],
|
||||
"time": "2022-12-17T21:53:22+00:00"
|
||||
},
|
||||
{
|
||||
"name": "spatie/laravel-honeypot",
|
||||
"version": "4.3.2",
|
||||
|
|
10
public/css/highlight.js/github-dark.min.css
vendored
Normal file
10
public/css/highlight.js/github-dark.min.css
vendored
Normal file
|
@ -0,0 +1,10 @@
|
|||
pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
|
||||
Theme: GitHub Dark
|
||||
Description: Dark theme as seen on github.com
|
||||
Author: github.com
|
||||
Maintainer: @Hirse
|
||||
Updated: 2021-05-15
|
||||
|
||||
Outdated base version: https://github.com/primer/github-syntax-dark
|
||||
Current colors taken from GitHub's CSS
|
||||
*/.hljs{color:#c9d1d9;background:#0d1117}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ff7b72}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#79c0ff}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#a5d6ff}.hljs-built_in,.hljs-symbol{color:#ffa657}.hljs-code,.hljs-comment,.hljs-formula{color:#8b949e}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#7ee787}.hljs-subst{color:#c9d1d9}.hljs-section{color:#1f6feb;font-weight:700}.hljs-bullet{color:#f2cc60}.hljs-emphasis{color:#c9d1d9;font-style:italic}.hljs-strong{color:#c9d1d9;font-weight:700}.hljs-addition{color:#aff5b4;background-color:#033a16}.hljs-deletion{color:#ffdcd7;background-color:#67060c}
|
126
public/css/highlight.js/stackoverflow-dark.css
Normal file
126
public/css/highlight.js/stackoverflow-dark.css
Normal file
|
@ -0,0 +1,126 @@
|
|||
/*!
|
||||
Theme: StackOverflow Dark
|
||||
Description: Dark theme as used on stackoverflow.com
|
||||
Author: stackoverflow.com
|
||||
Maintainer: @Hirse
|
||||
Website: https://github.com/StackExchange/Stacks
|
||||
License: MIT
|
||||
Updated: 2021-05-15
|
||||
|
||||
Updated for @stackoverflow/stacks v0.64.0
|
||||
Code Blocks: /blob/v0.64.0/lib/css/components/_stacks-code-blocks.less
|
||||
Colors: /blob/v0.64.0/lib/css/exports/_stacks-constants-colors.less
|
||||
*/
|
||||
|
||||
.hljs {
|
||||
/* var(--highlight-color) */
|
||||
color: #ffffff;
|
||||
/* var(--highlight-bg) */
|
||||
background: #1c1b1b;
|
||||
}
|
||||
|
||||
.hljs-subst {
|
||||
/* var(--highlight-color) */
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.hljs-comment {
|
||||
/* var(--highlight-comment) */
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.hljs-keyword,
|
||||
.hljs-selector-tag,
|
||||
.hljs-meta .hljs-keyword,
|
||||
.hljs-doctag,
|
||||
.hljs-section {
|
||||
/* var(--highlight-keyword) */
|
||||
color: #88aece;
|
||||
}
|
||||
|
||||
.hljs-attr {
|
||||
/* var(--highlight-attribute); */
|
||||
color: #88aece;
|
||||
}
|
||||
|
||||
.hljs-attribute {
|
||||
/* var(--highlight-symbol) */
|
||||
color: #c59bc1;
|
||||
}
|
||||
|
||||
.hljs-name,
|
||||
.hljs-type,
|
||||
.hljs-number,
|
||||
.hljs-selector-id,
|
||||
.hljs-quote,
|
||||
.hljs-template-tag {
|
||||
/* var(--highlight-namespace) */
|
||||
color: #f08d49;
|
||||
}
|
||||
|
||||
.hljs-selector-class {
|
||||
/* var(--highlight-keyword) */
|
||||
color: #88aece;
|
||||
}
|
||||
|
||||
.hljs-string,
|
||||
.hljs-regexp,
|
||||
.hljs-symbol,
|
||||
.hljs-variable,
|
||||
.hljs-template-variable,
|
||||
.hljs-link,
|
||||
.hljs-selector-attr {
|
||||
/* var(--highlight-variable) */
|
||||
color: #b5bd68;
|
||||
}
|
||||
|
||||
.hljs-meta,
|
||||
.hljs-selector-pseudo {
|
||||
/* var(--highlight-keyword) */
|
||||
color: #88aece;
|
||||
}
|
||||
|
||||
.hljs-built_in,
|
||||
.hljs-title,
|
||||
.hljs-literal {
|
||||
/* var(--highlight-literal) */
|
||||
color: #f08d49;
|
||||
}
|
||||
|
||||
.hljs-bullet,
|
||||
.hljs-code {
|
||||
/* var(--highlight-punctuation) */
|
||||
color: #cccccc;
|
||||
}
|
||||
|
||||
.hljs-meta .hljs-string {
|
||||
/* var(--highlight-variable) */
|
||||
color: #b5bd68;
|
||||
}
|
||||
|
||||
.hljs-deletion {
|
||||
/* var(--highlight-deletion) */
|
||||
color: #de7176;
|
||||
}
|
||||
|
||||
.hljs-addition {
|
||||
/* var(--highlight-addition) */
|
||||
color: #76c490;
|
||||
}
|
||||
|
||||
.hljs-emphasis {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.hljs-strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.hljs-formula,
|
||||
.hljs-operator,
|
||||
.hljs-params,
|
||||
.hljs-property,
|
||||
.hljs-punctuation,
|
||||
.hljs-tag {
|
||||
/* purposely ignored */
|
||||
}
|
70
public/css/highlight.js/tomorrow-night-bright.css
Normal file
70
public/css/highlight.js/tomorrow-night-bright.css
Normal file
|
@ -0,0 +1,70 @@
|
|||
/* Tomorrow Night Bright Theme */
|
||||
/* Original theme - https://github.com/chriskempson/tomorrow-theme */
|
||||
/* http://jmblog.github.com/color-themes-for-google-code-highlightjs */
|
||||
|
||||
/* Tomorrow Comment */
|
||||
.hljs-comment,
|
||||
.hljs-quote {
|
||||
color: #969896;
|
||||
}
|
||||
|
||||
/* Tomorrow Red */
|
||||
.hljs-variable,
|
||||
.hljs-template-variable,
|
||||
.hljs-tag,
|
||||
.hljs-name,
|
||||
.hljs-selector-id,
|
||||
.hljs-selector-class,
|
||||
.hljs-regexp,
|
||||
.hljs-deletion {
|
||||
color: #d54e53;
|
||||
}
|
||||
|
||||
/* Tomorrow Orange */
|
||||
.hljs-number,
|
||||
.hljs-built_in,
|
||||
.hljs-literal,
|
||||
.hljs-type,
|
||||
.hljs-params,
|
||||
.hljs-meta,
|
||||
.hljs-link {
|
||||
color: #e78c45;
|
||||
}
|
||||
|
||||
/* Tomorrow Yellow */
|
||||
.hljs-attribute {
|
||||
color: #e7c547;
|
||||
}
|
||||
|
||||
/* Tomorrow Green */
|
||||
.hljs-string,
|
||||
.hljs-symbol,
|
||||
.hljs-bullet,
|
||||
.hljs-addition {
|
||||
color: #b9ca4a;
|
||||
}
|
||||
|
||||
/* Tomorrow Blue */
|
||||
.hljs-title,
|
||||
.hljs-section {
|
||||
color: #7aa6da;
|
||||
}
|
||||
|
||||
/* Tomorrow Purple */
|
||||
.hljs-keyword,
|
||||
.hljs-selector-tag {
|
||||
color: #c397d8;
|
||||
}
|
||||
|
||||
.hljs {
|
||||
background: black;
|
||||
color: #eaeaea;
|
||||
}
|
||||
|
||||
.hljs-emphasis {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.hljs-strong {
|
||||
font-weight: bold;
|
||||
}
|
14
resources/views/components/codeblock.blade.php
Normal file
14
resources/views/components/codeblock.blade.php
Normal file
|
@ -0,0 +1,14 @@
|
|||
@php
|
||||
$file_path = "code/".$file;
|
||||
$file_name = basename($file_path);
|
||||
|
||||
$hl = new \Highlight\Highlighter();
|
||||
|
||||
$highlighted = $hl->highlight($lang, Storage::disk('local')->get($file_path));
|
||||
$file_size = Storage::disk('local')->size($file_path);
|
||||
@endphp
|
||||
<div class="codeblock"><pre>
|
||||
<h1>{{ $file_name }} <small>{{ $file_size}} bytes</small></h1>
|
||||
<hr>
|
||||
<code class="hljs {{$highlighted->language}}">{!! $highlighted->value !!}</code>
|
||||
</pre></div>
|
15
resources/views/includes/head-hljs.blade.php
Normal file
15
resources/views/includes/head-hljs.blade.php
Normal file
|
@ -0,0 +1,15 @@
|
|||
<!-- Global -->
|
||||
<meta charset="utf-8">
|
||||
<meta property="og:type" content="website">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="theme-color" content="#333333">
|
||||
<link rel="stylesheet" href="{{ URL::asset ('css/master.css') }}"/>
|
||||
<link rel="stylesheet" href="{{ URL::asset ('css/highlight.js/tomorrow-night-bright.css') }}"/>
|
||||
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32"/>
|
||||
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16"/>
|
||||
|
||||
<!-- Page-specific -->
|
||||
<title>~floppydisk / @yield('title')</title>
|
||||
<meta property="og:title" content="~floppydisk / @yield('title')">
|
||||
<meta property="og:description" content="@yield('description')">
|
||||
<meta property="og:image" content="/favicon.png">
|
23
resources/views/layouts/default-hljs.blade.php
Normal file
23
resources/views/layouts/default-hljs.blade.php
Normal file
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html lang="en">
|
||||
<head>
|
||||
@include('includes.head-hljs')
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="page">
|
||||
<div class="header">
|
||||
@include('includes.header')
|
||||
</div> <!-- header -->
|
||||
|
||||
<div id="pagebody">
|
||||
<div id="content">
|
||||
@yield('content')
|
||||
</div> <!-- content -->
|
||||
<div id="footer" class="pagefooter">
|
||||
@include('includes.footer')
|
||||
</div> <!-- footer -->
|
||||
</div> <!-- pagebody -->
|
||||
</div> <!-- page -->
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in a new issue