locked
How to display icon using Bootstrap Metro Dashboard RRS feed

Answers

  • User-1330485181 posted

    Hi Yuki Tao,

    Thanks for your suggestion, I have tried in html file, like the code below it works perfectly.

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <link id="base-style" rel="stylesheet" href="https://linghucong.js.org/Bootstrap_Metro_Dashboard/css/style.css">
    </head>
    
    <body>
    <div class="box-icon">
    <a href="#" class="btn-setting"><i class="halflings-icon wrench"></i></a>
    <a href="#" class="btn-minimize"><i class="halflings-icon chevron-up"></i></a>
    <a href="#" class="btn-close"><i class="halflings-icon remove"></i></a>
    </div>
    
    <div class="center">
    <a class="btn btn-success" href="#">
    <i class="halflings-icon white zoom-in"></i>
    </a>
    <a class="btn btn-info" href="#">
    <i class="halflings-icon white edit"></i>
    </a>
    <a class="btn btn-danger" href="#">
    <i class="halflings-icon white trash"></i>
    </a>
    </div>
    </body>
    </html>

    But when I applied to ASP.NET MVC Visual Studio 2017, It does not work.  Finally, I know the problem, I must define Layout = "~/Views/Shared/MasterLayout.cshtml"; in order to work on ASP.NET MVC

    @{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/MasterLayout.cshtml";
    }



    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, February 15, 2019 9:07 AM

All replies

  • User1034446946 posted

    i am guessing by the prefix that the btn class are all for buttons

    try

    <button class="btn btn-success>click here</button>

    Thursday, February 14, 2019 2:39 PM
  • User1520731567 posted

    Hi Sentoso,

    According to your problem,I guess you may be missing a CSS reference package:

    <link id="base-style" rel="stylesheet" href="https://linghucong.js.org/Bootstrap_Metro_Dashboard/css/style.css">

    You could refer to this demo:

    
    <link id="base-style" rel="stylesheet" href="https://linghucong.js.org/Bootstrap_Metro_Dashboard/css/style.css">
    
    
    <div class="box-icon">
            <a href="#" class="btn-setting"><i class="halflings-icon wrench"></i></a>
    	<a href="#" class="btn-minimize"><i class="halflings-icon chevron-up"></i></a>
            <a href="#" class="btn-close"><i class="halflings-icon remove"></i></a>
    </div>
    
    <div class="center">
    	<a class="btn btn-success" href="#">
    	   <i class="halflings-icon white zoom-in"></i>  
    	</a>
    	<a class="btn btn-info" href="#">
    	   <i class="halflings-icon white edit"></i>  
    	</a>
    	<a class="btn btn-danger" href="#">
    	   <i class="halflings-icon white trash"></i> 
    	</a>
    </div>

    How it work:

    Best Regards.

    Yuki Tao

    Friday, February 15, 2019 6:44 AM
  • User-1330485181 posted

    Hi Yuki Tao,

    Thanks for your suggestion, I have tried in html file, like the code below it works perfectly.

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <link id="base-style" rel="stylesheet" href="https://linghucong.js.org/Bootstrap_Metro_Dashboard/css/style.css">
    </head>
    
    <body>
    <div class="box-icon">
    <a href="#" class="btn-setting"><i class="halflings-icon wrench"></i></a>
    <a href="#" class="btn-minimize"><i class="halflings-icon chevron-up"></i></a>
    <a href="#" class="btn-close"><i class="halflings-icon remove"></i></a>
    </div>
    
    <div class="center">
    <a class="btn btn-success" href="#">
    <i class="halflings-icon white zoom-in"></i>
    </a>
    <a class="btn btn-info" href="#">
    <i class="halflings-icon white edit"></i>
    </a>
    <a class="btn btn-danger" href="#">
    <i class="halflings-icon white trash"></i>
    </a>
    </div>
    </body>
    </html>

    But when I applied to ASP.NET MVC Visual Studio 2017, It does not work.  Finally, I know the problem, I must define Layout = "~/Views/Shared/MasterLayout.cshtml"; in order to work on ASP.NET MVC

    @{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/MasterLayout.cshtml";
    }



    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, February 15, 2019 9:07 AM