| @@ -0,0 +1,26 @@ | |||
| <?php | |||
| namespace App\Http\Controllers; | |||
| use Illuminate\Http\Request; | |||
| use PDF; | |||
| class PDFController extends Controller | |||
| { | |||
| public function index() | |||
| { | |||
| // https://wkhtmltopdf.org/usage/wkhtmltopdf.txt | |||
| // $pdf = PDF::loadHTML('<h1>Hello World 岩渕</h1>'); | |||
| $pdf = PDF::loadView('pdf'); | |||
| // はがきサイズを指定 | |||
| $pdf->setOption('page-height', 148) | |||
| ->setOption('page-width', 100) | |||
| ->setOption('encoding', 'utf-8'); | |||
| return $pdf->inline(); | |||
| } | |||
| } | |||
| @@ -6,7 +6,9 @@ | |||
| "license": "MIT", | |||
| "require": { | |||
| "php": "^8.1", | |||
| "barryvdh/laravel-snappy": "^1.0", | |||
| "guzzlehttp/guzzle": "^7.2", | |||
| "h4cc/wkhtmltopdf-amd64": "0.12.x", | |||
| "laravel/framework": "^10.0", | |||
| "laravel/sanctum": "^3.2", | |||
| "laravel/tinker": "^2.8" | |||
| @@ -4,8 +4,86 @@ | |||
| "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies", | |||
| "This file is @generated automatically" | |||
| ], | |||
| "content-hash": "cb22994d94a6864d29dfd969ac17cbdd", | |||
| "content-hash": "830b2086d431430c84cff2228ec2809a", | |||
| "packages": [ | |||
| { | |||
| "name": "barryvdh/laravel-snappy", | |||
| "version": "v1.0.1", | |||
| "source": { | |||
| "type": "git", | |||
| "url": "https://github.com/barryvdh/laravel-snappy.git", | |||
| "reference": "283d9c908e4d63b328edea0ed841bc492b3b73fa" | |||
| }, | |||
| "dist": { | |||
| "type": "zip", | |||
| "url": "https://api.github.com/repos/barryvdh/laravel-snappy/zipball/283d9c908e4d63b328edea0ed841bc492b3b73fa", | |||
| "reference": "283d9c908e4d63b328edea0ed841bc492b3b73fa", | |||
| "shasum": "" | |||
| }, | |||
| "require": { | |||
| "illuminate/filesystem": "^9|^10", | |||
| "illuminate/support": "^9|^10", | |||
| "knplabs/knp-snappy": "^1.4", | |||
| "php": ">=7.2" | |||
| }, | |||
| "require-dev": { | |||
| "orchestra/testbench": "^7|^8" | |||
| }, | |||
| "type": "library", | |||
| "extra": { | |||
| "branch-alias": { | |||
| "dev-master": "1.0-dev" | |||
| }, | |||
| "laravel": { | |||
| "providers": [ | |||
| "Barryvdh\\Snappy\\ServiceProvider" | |||
| ], | |||
| "aliases": { | |||
| "PDF": "Barryvdh\\Snappy\\Facades\\SnappyPdf", | |||
| "SnappyImage": "Barryvdh\\Snappy\\Facades\\SnappyImage" | |||
| } | |||
| } | |||
| }, | |||
| "autoload": { | |||
| "psr-4": { | |||
| "Barryvdh\\Snappy\\": "src/" | |||
| } | |||
| }, | |||
| "notification-url": "https://packagist.org/downloads/", | |||
| "license": [ | |||
| "MIT" | |||
| ], | |||
| "authors": [ | |||
| { | |||
| "name": "Barry vd. Heuvel", | |||
| "email": "barryvdh@gmail.com" | |||
| } | |||
| ], | |||
| "description": "Snappy PDF/Image for Laravel", | |||
| "keywords": [ | |||
| "image", | |||
| "laravel", | |||
| "pdf", | |||
| "snappy", | |||
| "wkhtmltoimage", | |||
| "wkhtmltopdf" | |||
| ], | |||
| "support": { | |||
| "issues": "https://github.com/barryvdh/laravel-snappy/issues", | |||
| "source": "https://github.com/barryvdh/laravel-snappy/tree/v1.0.1" | |||
| }, | |||
| "funding": [ | |||
| { | |||
| "url": "https://fruitcake.nl", | |||
| "type": "custom" | |||
| }, | |||
| { | |||
| "url": "https://github.com/barryvdh", | |||
| "type": "github" | |||
| } | |||
| ], | |||
| "time": "2023-02-05T15:10:01+00:00" | |||
| }, | |||
| { | |||
| "name": "brick/math", | |||
| "version": "0.10.2", | |||
| @@ -981,6 +1059,129 @@ | |||
| ], | |||
| "time": "2021-10-07T12:57:01+00:00" | |||
| }, | |||
| { | |||
| "name": "h4cc/wkhtmltopdf-amd64", | |||
| "version": "0.12.4", | |||
| "source": { | |||
| "type": "git", | |||
| "url": "https://github.com/h4cc/wkhtmltopdf-amd64.git", | |||
| "reference": "4e2ab2d032a5d7fbe2a741de8b10b8989523c95b" | |||
| }, | |||
| "dist": { | |||
| "type": "zip", | |||
| "url": "https://api.github.com/repos/h4cc/wkhtmltopdf-amd64/zipball/4e2ab2d032a5d7fbe2a741de8b10b8989523c95b", | |||
| "reference": "4e2ab2d032a5d7fbe2a741de8b10b8989523c95b", | |||
| "shasum": "" | |||
| }, | |||
| "bin": [ | |||
| "bin/wkhtmltopdf-amd64" | |||
| ], | |||
| "type": "library", | |||
| "autoload": { | |||
| "psr-4": { | |||
| "h4cc\\WKHTMLToPDF\\": "" | |||
| } | |||
| }, | |||
| "notification-url": "https://packagist.org/downloads/", | |||
| "license": [ | |||
| "LGPL Version 3" | |||
| ], | |||
| "authors": [ | |||
| { | |||
| "name": "Julius Beckmann", | |||
| "email": "github@h4cc.de" | |||
| } | |||
| ], | |||
| "description": "Convert html to pdf using webkit (qtwebkit). Static linked linux binary for amd64 systems.", | |||
| "homepage": "http://wkhtmltopdf.org/", | |||
| "keywords": [ | |||
| "binary", | |||
| "convert", | |||
| "pdf", | |||
| "snapshot", | |||
| "thumbnail", | |||
| "wkhtmltopdf" | |||
| ], | |||
| "support": { | |||
| "issues": "https://github.com/h4cc/wkhtmltopdf-amd64/issues", | |||
| "source": "https://github.com/h4cc/wkhtmltopdf-amd64/tree/master" | |||
| }, | |||
| "time": "2018-01-15T06:57:33+00:00" | |||
| }, | |||
| { | |||
| "name": "knplabs/knp-snappy", | |||
| "version": "v1.4.2", | |||
| "source": { | |||
| "type": "git", | |||
| "url": "https://github.com/KnpLabs/snappy.git", | |||
| "reference": "b66f79334421c26d9c244427963fa2d92980b5d3" | |||
| }, | |||
| "dist": { | |||
| "type": "zip", | |||
| "url": "https://api.github.com/repos/KnpLabs/snappy/zipball/b66f79334421c26d9c244427963fa2d92980b5d3", | |||
| "reference": "b66f79334421c26d9c244427963fa2d92980b5d3", | |||
| "shasum": "" | |||
| }, | |||
| "require": { | |||
| "php": ">=7.1", | |||
| "psr/log": "^1.0||^2.0||^3.0", | |||
| "symfony/process": "~3.4||~4.3||~5.0||~6.0" | |||
| }, | |||
| "require-dev": { | |||
| "friendsofphp/php-cs-fixer": "^2.16||^3.0", | |||
| "pedrotroller/php-cs-custom-fixer": "^2.19", | |||
| "phpstan/phpstan": "^0.12.7", | |||
| "phpstan/phpstan-phpunit": "^0.12.6", | |||
| "phpunit/phpunit": "~7.4||~8.5" | |||
| }, | |||
| "suggest": { | |||
| "h4cc/wkhtmltoimage-amd64": "Provides wkhtmltoimage-amd64 binary for Linux-compatible machines, use version `~0.12` as dependency", | |||
| "h4cc/wkhtmltoimage-i386": "Provides wkhtmltoimage-i386 binary for Linux-compatible machines, use version `~0.12` as dependency", | |||
| "h4cc/wkhtmltopdf-amd64": "Provides wkhtmltopdf-amd64 binary for Linux-compatible machines, use version `~0.12` as dependency", | |||
| "h4cc/wkhtmltopdf-i386": "Provides wkhtmltopdf-i386 binary for Linux-compatible machines, use version `~0.12` as dependency", | |||
| "wemersonjanuario/wkhtmltopdf-windows": "Provides wkhtmltopdf executable for Windows, use version `~0.12` as dependency" | |||
| }, | |||
| "type": "library", | |||
| "extra": { | |||
| "branch-alias": { | |||
| "dev-master": "1.x-dev" | |||
| } | |||
| }, | |||
| "autoload": { | |||
| "psr-4": { | |||
| "Knp\\Snappy\\": "src/Knp/Snappy" | |||
| } | |||
| }, | |||
| "notification-url": "https://packagist.org/downloads/", | |||
| "license": [ | |||
| "MIT" | |||
| ], | |||
| "authors": [ | |||
| { | |||
| "name": "KNP Labs Team", | |||
| "homepage": "http://knplabs.com" | |||
| }, | |||
| { | |||
| "name": "Symfony Community", | |||
| "homepage": "http://github.com/KnpLabs/snappy/contributors" | |||
| } | |||
| ], | |||
| "description": "PHP library allowing thumbnail, snapshot or PDF generation from a url or a html page. Wrapper for wkhtmltopdf/wkhtmltoimage.", | |||
| "homepage": "http://github.com/KnpLabs/snappy", | |||
| "keywords": [ | |||
| "knp", | |||
| "knplabs", | |||
| "pdf", | |||
| "snapshot", | |||
| "thumbnail", | |||
| "wkhtmltopdf" | |||
| ], | |||
| "support": { | |||
| "issues": "https://github.com/KnpLabs/snappy/issues", | |||
| "source": "https://github.com/KnpLabs/snappy/tree/v1.4.2" | |||
| }, | |||
| "time": "2023-03-17T14:47:54+00:00" | |||
| }, | |||
| { | |||
| "name": "laravel/framework", | |||
| "version": "v10.7.1", | |||
| @@ -195,6 +195,8 @@ return [ | |||
| App\Providers\EventServiceProvider::class, | |||
| App\Providers\RouteServiceProvider::class, | |||
| Barryvdh\Snappy\ServiceProvider::class, | |||
| ], | |||
| /* | |||
| @@ -210,6 +212,7 @@ return [ | |||
| 'aliases' => Facade::defaultAliases()->merge([ | |||
| // 'ExampleClass' => App\Example\ExampleClass::class, | |||
| 'SnappyImage' => Barryvdh\Snappy\Facades\SnappyImage::class, | |||
| ])->toArray(), | |||
| ]; | |||
| @@ -0,0 +1,52 @@ | |||
| <?php | |||
| return [ | |||
| /* | |||
| |-------------------------------------------------------------------------- | |||
| | Snappy PDF / Image Configuration | |||
| |-------------------------------------------------------------------------- | |||
| | | |||
| | This option contains settings for PDF generation. | |||
| | | |||
| | Enabled: | |||
| | | |||
| | Whether to load PDF / Image generation. | |||
| | | |||
| | Binary: | |||
| | | |||
| | The file path of the wkhtmltopdf / wkhtmltoimage executable. | |||
| | | |||
| | Timout: | |||
| | | |||
| | The amount of time to wait (in seconds) before PDF / Image generation is stopped. | |||
| | Setting this to false disables the timeout (unlimited processing time). | |||
| | | |||
| | Options: | |||
| | | |||
| | The wkhtmltopdf command options. These are passed directly to wkhtmltopdf. | |||
| | See https://wkhtmltopdf.org/usage/wkhtmltopdf.txt for all options. | |||
| | | |||
| | Env: | |||
| | | |||
| | The environment variables to set while running the wkhtmltopdf process. | |||
| | | |||
| */ | |||
| 'pdf' => [ | |||
| 'enabled' => true, | |||
| 'binary' => env('WKHTML_PDF_BINARY', base_path('vendor/h4cc/wkhtmltopdf-amd64/bin/wkhtmltopdf-amd64')), | |||
| 'timeout' => false, | |||
| 'options' => [], | |||
| 'env' => [], | |||
| ], | |||
| 'image' => [ | |||
| 'enabled' => true, | |||
| 'binary' => env('WKHTML_IMG_BINARY', '/usr/local/bin/wkhtmltoimage'), | |||
| 'timeout' => false, | |||
| 'options' => [], | |||
| 'env' => [], | |||
| ], | |||
| ]; | |||
| @@ -2,7 +2,7 @@ version: '3' | |||
| services: | |||
| laravel.test: | |||
| build: | |||
| context: ./vendor/laravel/sail/runtimes/8.2 | |||
| context: ./docker/8.2 | |||
| dockerfile: Dockerfile | |||
| args: | |||
| WWWGROUP: '${WWWGROUP}' | |||
| @@ -0,0 +1,62 @@ | |||
| FROM ubuntu:22.04 | |||
| LABEL maintainer="Taylor Otwell" | |||
| ARG WWWGROUP | |||
| ARG NODE_VERSION=18 | |||
| ARG POSTGRES_VERSION=15 | |||
| WORKDIR /var/www/html | |||
| ENV DEBIAN_FRONTEND noninteractive | |||
| ENV TZ=UTC | |||
| RUN ln -snf /usr/share/zoneinfo/$TZ /etc/localtime && echo $TZ > /etc/timezone | |||
| RUN apt-get update \ | |||
| && apt-get install -y gnupg gosu curl ca-certificates zip unzip git supervisor sqlite3 libcap2-bin libpng-dev python2 dnsutils \ | |||
| && curl -sS 'https://keyserver.ubuntu.com/pks/lookup?op=get&search=0x14aa40ec0831756756d7f66c4f4ea0aae5267a6c' | gpg --dearmor | tee /etc/apt/keyrings/ppa_ondrej_php.gpg > /dev/null \ | |||
| && echo "deb [signed-by=/etc/apt/keyrings/ppa_ondrej_php.gpg] https://ppa.launchpadcontent.net/ondrej/php/ubuntu jammy main" > /etc/apt/sources.list.d/ppa_ondrej_php.list \ | |||
| && apt-get update \ | |||
| && apt-get install -y php8.2-cli php8.2-dev \ | |||
| php8.2-pgsql php8.2-sqlite3 php8.2-gd php8.2-imagick \ | |||
| php8.2-curl \ | |||
| php8.2-imap php8.2-mysql php8.2-mbstring \ | |||
| php8.2-xml php8.2-zip php8.2-bcmath php8.2-soap \ | |||
| php8.2-intl php8.2-readline \ | |||
| php8.2-ldap \ | |||
| php8.2-msgpack php8.2-igbinary php8.2-redis php8.2-swoole \ | |||
| php8.2-memcached php8.2-pcov php8.2-xdebug \ | |||
| libxrender-dev \ | |||
| fontconfig \ | |||
| fonts-ipafont \ | |||
| fonts-ipaexfont \ | |||
| && curl -sLS https://getcomposer.org/installer | php -- --install-dir=/usr/bin/ --filename=composer \ | |||
| && curl -sLS https://deb.nodesource.com/setup_$NODE_VERSION.x | bash - \ | |||
| && apt-get install -y nodejs \ | |||
| && npm install -g npm \ | |||
| && curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | gpg --dearmor | tee /etc/apt/keyrings/yarn.gpg >/dev/null \ | |||
| && echo "deb [signed-by=/etc/apt/keyrings/yarn.gpg] https://dl.yarnpkg.com/debian/ stable main" > /etc/apt/sources.list.d/yarn.list \ | |||
| && curl -sS https://www.postgresql.org/media/keys/ACCC4CF8.asc | gpg --dearmor | tee /etc/apt/keyrings/pgdg.gpg >/dev/null \ | |||
| && echo "deb [signed-by=/etc/apt/keyrings/pgdg.gpg] http://apt.postgresql.org/pub/repos/apt jammy-pgdg main" > /etc/apt/sources.list.d/pgdg.list \ | |||
| && apt-get update \ | |||
| && apt-get install -y yarn \ | |||
| && apt-get install -y mysql-client \ | |||
| && apt-get install -y postgresql-client-$POSTGRES_VERSION \ | |||
| && apt-get -y autoremove \ | |||
| && apt-get clean \ | |||
| && rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/* | |||
| RUN setcap "cap_net_bind_service=+ep" /usr/bin/php8.2 | |||
| RUN groupadd --force -g $WWWGROUP sail | |||
| RUN useradd -ms /bin/bash --no-user-group -g $WWWGROUP -u 1337 sail | |||
| COPY start-container /usr/local/bin/start-container | |||
| COPY supervisord.conf /etc/supervisor/conf.d/supervisord.conf | |||
| COPY php.ini /etc/php/8.2/cli/conf.d/99-sail.ini | |||
| RUN chmod +x /usr/local/bin/start-container | |||
| EXPOSE 8000 | |||
| ENTRYPOINT ["start-container"] | |||
| @@ -0,0 +1,7 @@ | |||
| [PHP] | |||
| post_max_size = 100M | |||
| upload_max_filesize = 100M | |||
| variables_order = EGPCS | |||
| [opcache] | |||
| opcache.enable_cli=1 | |||
| @@ -0,0 +1,17 @@ | |||
| #!/usr/bin/env bash | |||
| if [ ! -z "$WWWUSER" ]; then | |||
| usermod -u $WWWUSER sail | |||
| fi | |||
| if [ ! -d /.composer ]; then | |||
| mkdir /.composer | |||
| fi | |||
| chmod -R ugo+rw /.composer | |||
| if [ $# -gt 0 ]; then | |||
| exec gosu $WWWUSER "$@" | |||
| else | |||
| exec /usr/bin/supervisord -c /etc/supervisor/conf.d/supervisord.conf | |||
| fi | |||
| @@ -0,0 +1,14 @@ | |||
| [supervisord] | |||
| nodaemon=true | |||
| user=root | |||
| logfile=/var/log/supervisor/supervisord.log | |||
| pidfile=/var/run/supervisord.pid | |||
| [program:php] | |||
| command=/usr/bin/php -d variables_order=EGPCS /var/www/html/artisan serve --host=0.0.0.0 --port=80 | |||
| user=sail | |||
| environment=LARAVEL_SAIL="1" | |||
| stdout_logfile=/dev/stdout | |||
| stdout_logfile_maxbytes=0 | |||
| stderr_logfile=/dev/stderr | |||
| stderr_logfile_maxbytes=0 | |||
| @@ -0,0 +1,4 @@ | |||
| p.aaa { | |||
| font-size: 40px; | |||
| font-family: "IPAPMincho"; | |||
| } | |||
| @@ -0,0 +1,597 @@ | |||
| /*! Spectre.css Icons v0.5.9 | MIT License | github.com/picturepan2/spectre */ | |||
| .icon { | |||
| box-sizing: border-box; | |||
| display: inline-block; | |||
| font-size: inherit; | |||
| font-style: normal; | |||
| height: 1em; | |||
| position: relative; | |||
| text-indent: -9999px; | |||
| vertical-align: middle; | |||
| width: 1em; | |||
| } | |||
| .icon::before, | |||
| .icon::after { | |||
| content: ""; | |||
| display: block; | |||
| left: 50%; | |||
| position: absolute; | |||
| top: 50%; | |||
| transform: translate(-50%, -50%); | |||
| } | |||
| .icon.icon-2x { | |||
| font-size: 1.6rem; | |||
| } | |||
| .icon.icon-3x { | |||
| font-size: 2.4rem; | |||
| } | |||
| .icon.icon-4x { | |||
| font-size: 3.2rem; | |||
| } | |||
| .accordion .icon, | |||
| .btn .icon, | |||
| .toast .icon, | |||
| .menu .icon { | |||
| vertical-align: -10%; | |||
| } | |||
| .btn-lg .icon { | |||
| vertical-align: -15%; | |||
| } | |||
| .icon-arrow-down::before, | |||
| .icon-arrow-left::before, | |||
| .icon-arrow-right::before, | |||
| .icon-arrow-up::before, | |||
| .icon-downward::before, | |||
| .icon-back::before, | |||
| .icon-forward::before, | |||
| .icon-upward::before { | |||
| border: .1rem solid currentColor; | |||
| border-bottom: 0; | |||
| border-right: 0; | |||
| height: .65em; | |||
| width: .65em; | |||
| } | |||
| .icon-arrow-down::before { | |||
| transform: translate(-50%, -75%) rotate(225deg); | |||
| } | |||
| .icon-arrow-left::before { | |||
| transform: translate(-25%, -50%) rotate(-45deg); | |||
| } | |||
| .icon-arrow-right::before { | |||
| transform: translate(-75%, -50%) rotate(135deg); | |||
| } | |||
| .icon-arrow-up::before { | |||
| transform: translate(-50%, -25%) rotate(45deg); | |||
| } | |||
| .icon-back::after, | |||
| .icon-forward::after { | |||
| background: currentColor; | |||
| height: .1rem; | |||
| width: .8em; | |||
| } | |||
| .icon-downward::after, | |||
| .icon-upward::after { | |||
| background: currentColor; | |||
| height: .8em; | |||
| width: .1rem; | |||
| } | |||
| .icon-back::after { | |||
| left: 55%; | |||
| } | |||
| .icon-back::before { | |||
| transform: translate(-50%, -50%) rotate(-45deg); | |||
| } | |||
| .icon-downward::after { | |||
| top: 45%; | |||
| } | |||
| .icon-downward::before { | |||
| transform: translate(-50%, -50%) rotate(-135deg); | |||
| } | |||
| .icon-forward::after { | |||
| left: 45%; | |||
| } | |||
| .icon-forward::before { | |||
| transform: translate(-50%, -50%) rotate(135deg); | |||
| } | |||
| .icon-upward::after { | |||
| top: 55%; | |||
| } | |||
| .icon-upward::before { | |||
| transform: translate(-50%, -50%) rotate(45deg); | |||
| } | |||
| .icon-caret::before { | |||
| border-left: .3em solid transparent; | |||
| border-right: .3em solid transparent; | |||
| border-top: .3em solid currentColor; | |||
| height: 0; | |||
| transform: translate(-50%, -25%); | |||
| width: 0; | |||
| } | |||
| .icon-menu::before { | |||
| background: currentColor; | |||
| box-shadow: 0 -.35em, 0 .35em; | |||
| height: .1rem; | |||
| width: 100%; | |||
| } | |||
| .icon-apps::before { | |||
| background: currentColor; | |||
| box-shadow: -.35em -.35em, -.35em 0, -.35em .35em, 0 -.35em, 0 .35em, .35em -.35em, .35em 0, .35em .35em; | |||
| height: 3px; | |||
| width: 3px; | |||
| } | |||
| .icon-resize-horiz::before, | |||
| .icon-resize-horiz::after, | |||
| .icon-resize-vert::before, | |||
| .icon-resize-vert::after { | |||
| border: .1rem solid currentColor; | |||
| border-bottom: 0; | |||
| border-right: 0; | |||
| height: .45em; | |||
| width: .45em; | |||
| } | |||
| .icon-resize-horiz::before, | |||
| .icon-resize-vert::before { | |||
| transform: translate(-50%, -90%) rotate(45deg); | |||
| } | |||
| .icon-resize-horiz::after, | |||
| .icon-resize-vert::after { | |||
| transform: translate(-50%, -10%) rotate(225deg); | |||
| } | |||
| .icon-resize-horiz::before { | |||
| transform: translate(-90%, -50%) rotate(-45deg); | |||
| } | |||
| .icon-resize-horiz::after { | |||
| transform: translate(-10%, -50%) rotate(135deg); | |||
| } | |||
| .icon-more-horiz::before, | |||
| .icon-more-vert::before { | |||
| background: currentColor; | |||
| border-radius: 50%; | |||
| box-shadow: -.4em 0, .4em 0; | |||
| height: 3px; | |||
| width: 3px; | |||
| } | |||
| .icon-more-vert::before { | |||
| box-shadow: 0 -.4em, 0 .4em; | |||
| } | |||
| .icon-plus::before, | |||
| .icon-minus::before, | |||
| .icon-cross::before { | |||
| background: currentColor; | |||
| height: .1rem; | |||
| width: 100%; | |||
| } | |||
| .icon-plus::after, | |||
| .icon-cross::after { | |||
| background: currentColor; | |||
| height: 100%; | |||
| width: .1rem; | |||
| } | |||
| .icon-cross::before { | |||
| width: 100%; | |||
| } | |||
| .icon-cross::after { | |||
| height: 100%; | |||
| } | |||
| .icon-cross::before, | |||
| .icon-cross::after { | |||
| transform: translate(-50%, -50%) rotate(45deg); | |||
| } | |||
| .icon-check::before { | |||
| border: .1rem solid currentColor; | |||
| border-right: 0; | |||
| border-top: 0; | |||
| height: .5em; | |||
| transform: translate(-50%, -75%) rotate(-45deg); | |||
| width: .9em; | |||
| } | |||
| .icon-stop { | |||
| border: .1rem solid currentColor; | |||
| border-radius: 50%; | |||
| } | |||
| .icon-stop::before { | |||
| background: currentColor; | |||
| height: .1rem; | |||
| transform: translate(-50%, -50%) rotate(45deg); | |||
| width: 1em; | |||
| } | |||
| .icon-shutdown { | |||
| border: .1rem solid currentColor; | |||
| border-radius: 50%; | |||
| border-top-color: transparent; | |||
| } | |||
| .icon-shutdown::before { | |||
| background: currentColor; | |||
| content: ""; | |||
| height: .5em; | |||
| top: .1em; | |||
| width: .1rem; | |||
| } | |||
| .icon-refresh::before { | |||
| border: .1rem solid currentColor; | |||
| border-radius: 50%; | |||
| border-right-color: transparent; | |||
| height: 1em; | |||
| width: 1em; | |||
| } | |||
| .icon-refresh::after { | |||
| border: .2em solid currentColor; | |||
| border-left-color: transparent; | |||
| border-top-color: transparent; | |||
| height: 0; | |||
| left: 80%; | |||
| top: 20%; | |||
| width: 0; | |||
| } | |||
| .icon-search::before { | |||
| border: .1rem solid currentColor; | |||
| border-radius: 50%; | |||
| height: .75em; | |||
| left: 5%; | |||
| top: 5%; | |||
| transform: translate(0, 0) rotate(45deg); | |||
| width: .75em; | |||
| } | |||
| .icon-search::after { | |||
| background: currentColor; | |||
| height: .1rem; | |||
| left: 80%; | |||
| top: 80%; | |||
| transform: translate(-50%, -50%) rotate(45deg); | |||
| width: .4em; | |||
| } | |||
| .icon-edit::before { | |||
| border: .1rem solid currentColor; | |||
| height: .4em; | |||
| transform: translate(-40%, -60%) rotate(-45deg); | |||
| width: .85em; | |||
| } | |||
| .icon-edit::after { | |||
| border: .15em solid currentColor; | |||
| border-right-color: transparent; | |||
| border-top-color: transparent; | |||
| height: 0; | |||
| left: 5%; | |||
| top: 95%; | |||
| transform: translate(0, -100%); | |||
| width: 0; | |||
| } | |||
| .icon-delete::before { | |||
| border: .1rem solid currentColor; | |||
| border-bottom-left-radius: .1rem; | |||
| border-bottom-right-radius: .1rem; | |||
| border-top: 0; | |||
| height: .75em; | |||
| top: 60%; | |||
| width: .75em; | |||
| } | |||
| .icon-delete::after { | |||
| background: currentColor; | |||
| box-shadow: -.25em .2em, .25em .2em; | |||
| height: .1rem; | |||
| top: .05rem; | |||
| width: .5em; | |||
| } | |||
| .icon-share { | |||
| border: .1rem solid currentColor; | |||
| border-radius: .1rem; | |||
| border-right: 0; | |||
| border-top: 0; | |||
| } | |||
| .icon-share::before { | |||
| border: .1rem solid currentColor; | |||
| border-left: 0; | |||
| border-top: 0; | |||
| height: .4em; | |||
| left: 100%; | |||
| top: .25em; | |||
| transform: translate(-125%, -50%) rotate(-45deg); | |||
| width: .4em; | |||
| } | |||
| .icon-share::after { | |||
| border: .1rem solid currentColor; | |||
| border-bottom: 0; | |||
| border-radius: 75% 0; | |||
| border-right: 0; | |||
| height: .5em; | |||
| width: .6em; | |||
| } | |||
| .icon-flag::before { | |||
| background: currentColor; | |||
| height: 1em; | |||
| left: 15%; | |||
| width: .1rem; | |||
| } | |||
| .icon-flag::after { | |||
| border: .1rem solid currentColor; | |||
| border-bottom-right-radius: .1rem; | |||
| border-left: 0; | |||
| border-top-right-radius: .1rem; | |||
| height: .65em; | |||
| left: 60%; | |||
| top: 35%; | |||
| width: .8em; | |||
| } | |||
| .icon-bookmark::before { | |||
| border: .1rem solid currentColor; | |||
| border-bottom: 0; | |||
| border-top-left-radius: .1rem; | |||
| border-top-right-radius: .1rem; | |||
| height: .9em; | |||
| width: .8em; | |||
| } | |||
| .icon-bookmark::after { | |||
| border: .1rem solid currentColor; | |||
| border-bottom: 0; | |||
| border-left: 0; | |||
| border-radius: .1rem; | |||
| height: .5em; | |||
| transform: translate(-50%, 35%) rotate(-45deg) skew(15deg, 15deg); | |||
| width: .5em; | |||
| } | |||
| .icon-download, | |||
| .icon-upload { | |||
| border-bottom: .1rem solid currentColor; | |||
| } | |||
| .icon-download::before, | |||
| .icon-upload::before { | |||
| border: .1rem solid currentColor; | |||
| border-bottom: 0; | |||
| border-right: 0; | |||
| height: .5em; | |||
| transform: translate(-50%, -60%) rotate(-135deg); | |||
| width: .5em; | |||
| } | |||
| .icon-download::after, | |||
| .icon-upload::after { | |||
| background: currentColor; | |||
| height: .6em; | |||
| top: 40%; | |||
| width: .1rem; | |||
| } | |||
| .icon-upload::before { | |||
| transform: translate(-50%, -60%) rotate(45deg); | |||
| } | |||
| .icon-upload::after { | |||
| top: 50%; | |||
| } | |||
| .icon-copy::before { | |||
| border: .1rem solid currentColor; | |||
| border-bottom: 0; | |||
| border-radius: .1rem; | |||
| border-right: 0; | |||
| height: .8em; | |||
| left: 40%; | |||
| top: 35%; | |||
| width: .8em; | |||
| } | |||
| .icon-copy::after { | |||
| border: .1rem solid currentColor; | |||
| border-radius: .1rem; | |||
| height: .8em; | |||
| left: 60%; | |||
| top: 60%; | |||
| width: .8em; | |||
| } | |||
| .icon-time { | |||
| border: .1rem solid currentColor; | |||
| border-radius: 50%; | |||
| } | |||
| .icon-time::before { | |||
| background: currentColor; | |||
| height: .4em; | |||
| transform: translate(-50%, -75%); | |||
| width: .1rem; | |||
| } | |||
| .icon-time::after { | |||
| background: currentColor; | |||
| height: .3em; | |||
| transform: translate(-50%, -75%) rotate(90deg); | |||
| transform-origin: 50% 90%; | |||
| width: .1rem; | |||
| } | |||
| .icon-mail::before { | |||
| border: .1rem solid currentColor; | |||
| border-radius: .1rem; | |||
| height: .8em; | |||
| width: 1em; | |||
| } | |||
| .icon-mail::after { | |||
| border: .1rem solid currentColor; | |||
| border-right: 0; | |||
| border-top: 0; | |||
| height: .5em; | |||
| transform: translate(-50%, -90%) rotate(-45deg) skew(10deg, 10deg); | |||
| width: .5em; | |||
| } | |||
| .icon-people::before { | |||
| border: .1rem solid currentColor; | |||
| border-radius: 50%; | |||
| height: .45em; | |||
| top: 25%; | |||
| width: .45em; | |||
| } | |||
| .icon-people::after { | |||
| border: .1rem solid currentColor; | |||
| border-radius: 50% 50% 0 0; | |||
| height: .4em; | |||
| top: 75%; | |||
| width: .9em; | |||
| } | |||
| .icon-message { | |||
| border: .1rem solid currentColor; | |||
| border-bottom: 0; | |||
| border-radius: .1rem; | |||
| border-right: 0; | |||
| } | |||
| .icon-message::before { | |||
| border: .1rem solid currentColor; | |||
| border-bottom-right-radius: .1rem; | |||
| border-left: 0; | |||
| border-top: 0; | |||
| height: .8em; | |||
| left: 65%; | |||
| top: 40%; | |||
| width: .7em; | |||
| } | |||
| .icon-message::after { | |||
| background: currentColor; | |||
| border-radius: .1rem; | |||
| height: .3em; | |||
| left: 10%; | |||
| top: 100%; | |||
| transform: translate(0, -90%) rotate(45deg); | |||
| width: .1rem; | |||
| } | |||
| .icon-photo { | |||
| border: .1rem solid currentColor; | |||
| border-radius: .1rem; | |||
| } | |||
| .icon-photo::before { | |||
| border: .1rem solid currentColor; | |||
| border-radius: 50%; | |||
| height: .25em; | |||
| left: 35%; | |||
| top: 35%; | |||
| width: .25em; | |||
| } | |||
| .icon-photo::after { | |||
| border: .1rem solid currentColor; | |||
| border-bottom: 0; | |||
| border-left: 0; | |||
| height: .5em; | |||
| left: 60%; | |||
| transform: translate(-50%, 25%) rotate(-45deg); | |||
| width: .5em; | |||
| } | |||
| .icon-link::before, | |||
| .icon-link::after { | |||
| border: .1rem solid currentColor; | |||
| border-radius: 5em 0 0 5em; | |||
| border-right: 0; | |||
| height: .5em; | |||
| width: .75em; | |||
| } | |||
| .icon-link::before { | |||
| transform: translate(-70%, -45%) rotate(-45deg); | |||
| } | |||
| .icon-link::after { | |||
| transform: translate(-30%, -55%) rotate(135deg); | |||
| } | |||
| .icon-location::before { | |||
| border: .1rem solid currentColor; | |||
| border-radius: 50% 50% 50% 0; | |||
| height: .8em; | |||
| transform: translate(-50%, -60%) rotate(-45deg); | |||
| width: .8em; | |||
| } | |||
| .icon-location::after { | |||
| border: .1rem solid currentColor; | |||
| border-radius: 50%; | |||
| height: .2em; | |||
| transform: translate(-50%, -80%); | |||
| width: .2em; | |||
| } | |||
| .icon-emoji { | |||
| border: .1rem solid currentColor; | |||
| border-radius: 50%; | |||
| } | |||
| .icon-emoji::before { | |||
| border-radius: 50%; | |||
| box-shadow: -.17em -.1em, .17em -.1em; | |||
| height: .15em; | |||
| width: .15em; | |||
| } | |||
| .icon-emoji::after { | |||
| border: .1rem solid currentColor; | |||
| border-bottom-color: transparent; | |||
| border-radius: 50%; | |||
| border-right-color: transparent; | |||
| height: .5em; | |||
| transform: translate(-50%, -40%) rotate(-135deg); | |||
| width: .5em; | |||
| } | |||
| @@ -0,0 +1,38 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="ja"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <title>サイトタイトル</title> | |||
| <link rel="stylesheet" href="{{ resource_path('css/pdf.css') }}"> | |||
| <link rel="stylesheet" href="{{ resource_path('css/spectre.min.css') }}"> | |||
| <link rel="stylesheet" href="{{ resource_path('css/spectre-exp.min.css') }}"> | |||
| <link rel="stylesheet" href="{{ resource_path('css/spectre-icons.min.css') }}"> | |||
| </head> | |||
| <body> | |||
| <header>領収証</header> | |||
| <nav>ナビ</nav> | |||
| <article> | |||
| <h1>タイトル</h1> | |||
| <section> | |||
| <h2>タイトル</h2> | |||
| <p>コンテンツの内容</p> | |||
| </section> | |||
| </article> | |||
| <!----- メインコンテンツ END -----> | |||
| <!----- フッター -----> | |||
| <footer>フッター</footer> | |||
| <p class="aaa"> | |||
| あかさたな | |||
| </p> | |||
| <p class="bbb"> | |||
| あかさたな | |||
| </p> | |||
| <!----- フッター END -----> | |||
| <span class="label label-primary">primary label</span> | |||
| <span class="label label-rounded label-primary">primary label</span> | |||
| </body> | |||
| </html> | |||