2016-12-04 18 views
1

php artisan make:authで認証の例ページを作成しました。 example page CSSスタイルシートを変更しても何も起こっていません。ページは常に同じように見えます。 CSSスタイルシートは\ public \ cssフォルダにあります。Laravel make:auth CSSスタイルシート

app.blade.php

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 

<!-- CSRF Token --> 
<meta name="csrf-token" content="{{ csrf_token() }}"> 

<title>{{ config('app.name', 'Laravel') }}</title> 

<!-- Styles --> 
<link rel="stylesheet" href="{{ URL::asset('/css/app.css') }}"> 

<!-- Scripts --> 
<script> 
    window.Laravel = <?php echo json_encode([ 
     'csrfToken' => csrf_token(), 
    ]); ?> 
</script> 
</head> 
<body> 
<div id="app"> 
    <nav class="navbar navbar-default navbar-static-top"> 
     <div class="container"> 
      <div class="navbar-header"> 

    <!-- Collapsed Hamburger --> 
       <button type="button" class="navbar-toggle collapsed" data- toggle="collapse" data-target="#app-navbar-collapse"> 
        <span class="sr-only">Toggle Navigation</span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
       </button> 

       <!-- Branding Image --> 
       <a class="navbar-brand" href="{{ url('/') }}"> 
        {{ config('app.name', 'Laravel') }} 
       </a> 
      </div> 

      <div class="collapse navbar-collapse" id="app-navbar-collapse"> 
       <!-- Left Side Of Navbar --> 
       <ul class="nav navbar-nav"> 
        &nbsp; 
       </ul> 

       <!-- Right Side Of Navbar --> 
       <ul class="nav navbar-nav navbar-right"> 
        <!-- Authentication Links --> 
        @if (Auth::guest()) 
         <li><a href="{{ url('/login') }}">Login</a></li> 
         <li><a href="{{ url('/register') }}">Register</a></li> 
        @else 
         <li class="dropdown"> 
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"> 
           {{ Auth::user()->name }} <span class="caret"></span> 
          </a> 

          <ul class="dropdown-menu" role="menu"> 
           <li> 
            <a href="{{ url('/logout') }}" 
             onclick="event.preventDefault(); 
               document.getElementById('logout-form').submit();"> 
             Logout 
            </a> 

            <form id="logout-form" action="{{ url('/logout') }}" method="POST" style="display: none;"> 
             {{ csrf_field() }} 
            </form> 
           </li> 
          </ul> 
         </li> 
        @endif 
       </ul> 
      </div> 
     </div> 
    </nav> 

    @yield('content') 
</div> 

<!-- Scripts --> 
<script src="/js/app.js"></script> 
</body> 
</html> 

app.cssは、私はよく分からない

app.scss

// Fonts 
@import url(https://fonts.googleapis.com/css?family=Raleway:300,400,600); 

// Variables 
@import "variables"; 

// Bootstrap 
@import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; 

_variables.scss

// Body 
$body-bg: #f5f8fa; 

// Borders 
$laravel-border-color: darken($body-bg, 10%); 
$list-group-border: $laravel-border-color; 
$navbar-default-border: $laravel-border-color; 
$panel-default-border: $laravel-border-color; 
$panel-inner-border: $laravel-border-color; 

// Brands 
$brand-primary: #3097D1; 
$brand-info: #8eb4cb; 
$brand-success: #2ab27b; 
$brand-warning: #cbb956; 
$brand-danger: #bf5329; 

// Typography 
$font-family-sans-serif: "Raleway", sans-serif; 
$font-size-base: 14px; 
$line-height-base: 1.6; 
$text-color: #636b6f; 

// Navbar 
$navbar-default-bg: #fff; 

// Buttons 
$btn-default-color: $text-color; 

// Inputs 
$input-border: lighten($text-color, 40%); 
$input-border-focus: lighten($brand-primary, 25%); 
$input-color-placeholder: lighten($text-color, 30%); 

// Panels 
$panel-default-heading-bg: #fff; 
+0

私は問題が何であるか把握する必要があります – Birdman

+0

@Birdman ok私はコードを追加しましたが、これはphp artisan make:authコマンドによって生成された単純なコードです – asapa

答えて

1

空白でありますの編集について話している場合ファイルまたは新しいカスタムファイルです。

app.cssプリプロセッサ(通常はshoudn't)、あなたは常にpublic/css/my-styles.cssに新しいCSSファイルを作成し、ビューでそれを読み込むことができますによって上書きされた場合:

<!-- Styles --> 
<link rel="stylesheet" href="{{ URL::asset('/css/app.css') }}"> 
<link rel="stylesheet" href="{{ URL::asset('/css/my-styles.css') }}"> 

高い特異性を利用するようにしてくださいCSSルールを使用して事前定義済みの設定を上書きするか、!importantを使用してください。

また、ブラウザのキャッシュを消去する(またはChromeのシークレットモードなどのプライベートモードを使用する)と、キャッシュされたコンテンツではなく現在のCSS設定が表示されます。

+0

助けてくれてありがとう。ブラウザのキャッシュをクリアすることができました。 – asapa

+0

キャッシュは時々痛みです。喜んで助けました! – LePhleg

関連する問題