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

更換loading樣式

Browse Source
This commit is contained in:
wanling040@gmail.com 2022-07-25 18:29:49 +08:00
parent ed78000e99
commit 9a9b4f0d77
19 changed files with 63 additions and 291 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">

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

@ -26,19 +26,8 @@
<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">
@ -87,6 +76,11 @@
<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;
}