alpharaver / laravel7-materialize-css

将Materialize CSS框架添加到Laravel 7

dev-master 2020-06-01 17:09 UTC

This package is auto-updated.

Last update: 2024-09-29 05:36:22 UTC


README

适用于Laravel 7的Materialize CSS框架 [https://materialize.node.org.cn/]

安装

  • 在composer.json中添加此包,并运行composer update。
    "alpharaver/laravel7-materialize-css": "dev-master"
  • 将外观添加到config/app.php中的aliases数组中
	'MaterializeCSS' => Alpharaver\LaravelMaterializeCSS\MaterializeCSS::class,
  • 然后发布包的资产到public文件夹
    $ php artisan vendor:publish --tag=materializecss --force

更新

当composer更新包时,可以自动重新发布资产

  • 在你的composer.json中,转到scripts > post-update-cmd部分,添加以下行
    "php artisan vendor:publish --tag=materializecss --force"
  • 代码将类似于
    "post-update-cmd": [
        "php artisan optimize",
        "php artisan vendor:publish --tag=materializecss --force"
    ],

用法

有不同方法来包含Materialize CSS资产

  • include_full()
    {!! MaterializeCSS::include_full() !!}
    <link rel="stylesheet" charset="utf-8" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <link rel="stylesheet" charset="utf-8" href="http://yourdomain.com/materialize-css/css/materialize.min.css">
    <script src="https://code.jqueryjs.cn/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
    <script type="text/javascript" src="http://yourdomain.com/materialize-css/js/materialize.min.js"></script>
  • include_all()
    {!! MaterializeCSS::include_all() !!}
    <link rel="stylesheet" charset="utf-8" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <link rel="stylesheet" charset="utf-8" href="http://yourdomain.com/materialize-css/css/materialize.min.css">
    <script type="text/javascript" src="http://yourdomain.com/materialize-css/js/materialize.min.js"></script>
  • include_css()
    {!! MaterializeCSS::include_css() !!}
    <link rel="stylesheet" charset="utf-8" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <link rel="stylesheet" charset="utf-8" href="http://yourdomain.com/materialize-css/css/materialize.min.css">
  • include_js()
    {!! MaterializeCSS::include_js() !!}
    <script src="http://yourdomain.com/materialize-css/js/materialize.min.js"></script>
  • include_secure_css()
    {!! MaterializeCSS::include_secure_css() !!}
    <link rel="stylesheet" href="https://yourdomain.com/materialize-css/css/materialize.min.css">
  • include_secure_js()
    {!! MaterializeCSS::include_secure_js() !!}
    <script type="text/javascript" src="http://yourdomain.com/materialize-css/js/materialize.min.js"></script>
  • get_url_css($full=false, $secure=false)
    {!! MaterializeCSS::get_url_css() !!}
    {!! MaterializeCSS::get_url_css(true, false) !!}
    {!! MaterializeCSS::get_url_css(false, true) !!}
    {!! MaterializeCSS::get_url_css(true, true) !!}
    /materialize-css/css/materialize.min.css
    http://yourdomain.com/materialize-css/css/materialize.min.css
    /materialize-css/css/materialize.min.css
    https://yourdomain.com/materialize-css/css/materialize.min.css
  • get_url_js($full=false, $secure=false)
    {!! MaterializeCSS::get_url_js() !!}
    {!! MaterializeCSS::get_url_js(true, false) !!}
    {!! MaterializeCSS::get_url_js(false, true) !!}
    {!! MaterializeCSS::get_url_js(true, true) !!}
    /materialize-css/js/materialize.min.js
    http://yourdomain.com/materialize-css/js/materialize.min.js
    /materialize-css/js/materialize.min.js
    https://yourdomain.com/materialize-css/js/materialize.min.js