hank.chen/FIC_Solar
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

全系統-loading樣式，使用SmartAdmin v4.5.1

Browse Source
This commit is contained in:
wanling040@gmail.com 2022-08-08 14:01:25 +08:00
parent 4145d2404e
commit 6125a31f3a
19 changed files with 62 additions and 292 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
SolarPower/Views/AnalysisInverter/Index.cshtml
View File

@ -4,16 +4,8 @@
ViewData["Title"] = "逆變器交叉分析";
}
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<div class="container-fluid">

12
SolarPower/Views/AnalysisStationCombine/Index.cshtml
View File

@ -6,16 +6,8 @@
@using SolarPower.Models.Role
@model RoleLayerEnum
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<div class="container-fluid">

12
SolarPower/Views/AnalysisStationInfo/Index.cshtml
View File

@ -4,16 +4,8 @@
ViewData["Title"] = "電站交叉分析";
}
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<div class="container-fluid">

12
SolarPower/Views/Company/Index.cshtml
View File

@ -19,16 +19,8 @@
</div>
<!-- Your main content goes below here: -->
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<div class="row">

12
SolarPower/Views/ElectricitySoldRecord/Index.cshtml
View File

@ -6,16 +6,8 @@
@using SolarPower.Models.Role
@model RoleLayerEnum
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<div class="container-fluid">

12
SolarPower/Views/ExceptionRecord/Index.cshtml
View File

@ -12,16 +12,8 @@
<li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li>
</ol>
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<div class="row">

64
SolarPower/Views/Login/Index.cshtml
View File

@ -25,20 +25,8 @@
<!-- icheck bootstrap -->
<link href="~/lib/icheck-bootstrap/icheck-bootstrap.min.css" rel="stylesheet" />
<!-- Theme style -->
<link rel="stylesheet" href="~/css/loading.css" />
</head>
<body>
<div class="loadEffect" id="loading" style="top: 50%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>
<div class="blankpage-form-field">
<div class="page-logo m-0 w-100 align-items-center justify-content-center rounded border-bottom-left-radius-0 border-bottom-right-radius-0 px-4">
@ -52,31 +40,31 @@
{
<p class="alert alert-danger">@ViewBag.ErrMsg</p>
}
<form id="login-form" asp-action="Index" method="post">
<div class="form-group">
<label class="form-label" for="username">帳號</label>
<input asp-for="Account" type="text" id="account" class="form-control" placeholder="Account">
<span asp-validation-for="Account" class="text-danger"></span>
<span class="help-block">
您的帳號
</span>
</div>
<div class="form-group">
<label class="form-label" for="password">密碼</label>
<input asp-for="Password" type="password" id="password" class="form-control" placeholder="Password" autocomplete="off">
<span asp-validation-for="Password" class="text-danger"></span>
<span class="help-block">
您的密碼
</span>
</div>
<div class="form-group text-left">
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="rememberme">
<label class="custom-control-label" for="rememberme"> 記住我</label>
<form id="login-form" asp-action="Index" method="post">
<div class="form-group">
<label class="form-label" for="username">帳號</label>
<input asp-for="Account" type="text" id="account" class="form-control" placeholder="Account">
<span asp-validation-for="Account" class="text-danger"></span>
<span class="help-block">
您的帳號
</span>
</div>
</div>
<button type="submit" class="btn btn-default float-right" id="login">登入</button>
</form>
<div class="form-group">
<label class="form-label" for="password">密碼</label>
<input asp-for="Password" type="password" id="password" class="form-control" placeholder="Password" autocomplete="off">
<span asp-validation-for="Password" class="text-danger"></span>
<span class="help-block">
您的密碼
</span>
</div>
<div class="form-group text-left">
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="rememberme">
<label class="custom-control-label" for="rememberme"> 記住我</label>
</div>
</div>
<button type="submit" class="btn btn-default float-right" id="login">登入</button>
</form>
</div>
<div class="blankpage-footer text-center">
<a asp-controller="Login" asp-action="ForgotPassword"><strong>忘記密碼</strong></a>
@ -87,6 +75,10 @@
<source src="~/media/video/cc.webm" type="video/webm">
<source src="~/media/video/cc.mp4" type="video/mp4">
</video>
<div class="d-flex justify-content-center text-secondary" style="transform: translateY(1150%);">
<div class="spinner-border" role="status" id="loading" style="display: none"></div>
</div>
@*
<div class="login-box">

12
SolarPower/Views/MapOverview/Index.cshtml
View File

@ -11,16 +11,8 @@
<!-- Your main content goes below here: -->
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative; ">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
@*<div class="row mb-5">*@

12
SolarPower/Views/NoticeSchedule/Index.cshtml
View File

@ -6,16 +6,8 @@
@using SolarPower.Models.Role
@model RoleLayerEnum
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<div class="container-fluid">

12
SolarPower/Views/Operation/Index.cshtml
View File

@ -6,16 +6,8 @@
@using SolarPower.Models.Role
@model RoleLayerEnum
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<ol class="breadcrumb page-breadcrumb">

12
SolarPower/Views/Operation/OperationRecord.cshtml
View File

@ -17,16 +17,8 @@
</h1>
</div>
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<!-- Your main content goes below here: -->

12
SolarPower/Views/PowerGeneration/Index.cshtml
View File

@ -6,16 +6,8 @@
@using SolarPower.Models.Role
@model RoleLayerEnum
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<div class="container-fluid">

12
SolarPower/Views/PowerStation/Index.cshtml
View File

@ -6,16 +6,8 @@
@using SolarPower.Models.Role
@model RoleLayerEnum
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<ol class="breadcrumb page-breadcrumb">

12
SolarPower/Views/PowerStation/PowerStationEdit.cshtml
View File

@ -16,16 +16,8 @@
<!-- Your main content goes below here: -->
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<div class="row">

12
SolarPower/Views/SensorType/Index.cshtml
View File

@ -19,16 +19,8 @@
</div>
<!-- Your main content goes below here: -->
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<div class="row">

12
SolarPower/Views/StationOverview/Index.cshtml
View File

@ -12,16 +12,8 @@
<!-- Your main content goes below here: -->
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<div class="row">

12
SolarPower/Views/StationOverview/StationOverviewInfo.cshtml
View File

@ -13,16 +13,8 @@
<li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li>
</ol>*@
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<div class="row">

12
SolarPower/Views/User/Index.cshtml
View File

@ -11,16 +11,8 @@
<li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li>
</ol>
<link rel="stylesheet" href="~/css/loading.css" />
<div class="loadEffect" id="loading" style="top: 10%;">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
</div>
<div class="row">

86
SolarPower/wwwroot/css/loading.css
View File

@ -1,86 +0,0 @@
.loadEffect {
z-index: 9999;
left: 50%;
transform: translate(-50%,-50%);
width: 100px;
height: 100px;
position: absolute;
margin: 0 auto;
margin-top: 100px;
display: none;
}
.loadEffect span {
display: inline-block;
width: 13px;
height: 13px;
border-radius: 50%;
background: black;
position: absolute;
-webkit-animation: load 1.04s ease infinite;
}
@-webkit-keyframes load {
0% {
opacity: 1;
}
100% {
opacity: 0.2;
}
}
.loadEffect span:nth-child(1) {
left: 0;
top: 50%;
margin-top: -8px;
-webkit-animation-delay: 0.13s;
}
.loadEffect span:nth-child(2) {
left: 14px;
top: 14px;
-webkit-animation-delay: 0.26s;
}
.loadEffect span:nth-child(3) {
left: 50%;
top: 0;
margin-left: -8px;
-webkit-animation-delay: 0.39s;
}
.loadEffect span:nth-child(4) {
top: 14px;
right: 14px;
-webkit-animation-delay: 0.52s;
}
.loadEffect span:nth-child(5) {
right: 0;
top: 50%;
margin-top: -8px;
-webkit-animation-delay: 0.65s;
}
.loadEffect span:nth-child(6) {
right: 14px;
bottom: 14px;
-webkit-animation-delay: 0.78s;
}
.loadEffect span:nth-child(7) {
bottom: 0;
left: 50%;
margin-left: -8px;
-webkit-animation-delay: 0.91s;
}
.loadEffect span:nth-child(8) {
bottom: 14px;
left: 14px;
-webkit-animation-delay: 1.04s;
}