Add hlphp & codeblock component

This commit is contained in:
floppydiskette 2023-07-28 23:45:33 +01:00 committed by Frankie B
parent 9a10c8db3a
commit f82de3956b
8 changed files with 338 additions and 1 deletions

View file

@ -11,6 +11,7 @@
"laravel/framework": "^10.10", "laravel/framework": "^10.10",
"laravel/sanctum": "^3.2", "laravel/sanctum": "^3.2",
"laravel/tinker": "^2.8", "laravel/tinker": "^2.8",
"scrivo/highlight.php": "v9.18.1.10",
"spatie/laravel-honeypot": "^4.3" "spatie/laravel-honeypot": "^4.3"
}, },
"require-dev": { "require-dev": {

80
composer.lock generated
View file

@ -4,7 +4,7 @@
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies", "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
"This file is @generated automatically" "This file is @generated automatically"
], ],
"content-hash": "b946004dacc886bc1ef1ae8e1e9644ac", "content-hash": "b9fa52d6299a2643f49a5191cf7b6cc8",
"packages": [ "packages": [
{ {
"name": "auth0/auth0-php", "name": "auth0/auth0-php",
@ -4063,6 +4063,84 @@
], ],
"time": "2023-04-15T23:01:58+00:00" "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", "name": "spatie/laravel-honeypot",
"version": "4.3.2", "version": "4.3.2",

View 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}

View 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 */
}

View 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;
}

View 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>

View 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">

View 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>