更換loading樣式
This commit is contained in:
wanling040@gmail.com
parent
ed78000e99
commit
9a9b4f0d77
@ -4,16 +4,8 @@
|
|||||||
ViewData["Title"] = "逆變器交叉分析";
|
ViewData["Title"] = "逆變器交叉分析";
|
||||||
}
|
}
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
|
|||||||
@ -6,16 +6,8 @@
|
|||||||
@using SolarPower.Models.Role
|
@using SolarPower.Models.Role
|
||||||
@model RoleLayerEnum
|
@model RoleLayerEnum
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
|
|||||||
@ -4,16 +4,8 @@
|
|||||||
ViewData["Title"] = "電站交叉分析";
|
ViewData["Title"] = "電站交叉分析";
|
||||||
}
|
}
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
|
|||||||
@ -19,16 +19,8 @@
|
|||||||
</div>
|
</div>
|
||||||
<!-- Your main content goes below here: -->
|
<!-- Your main content goes below here: -->
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|||||||
@ -6,16 +6,8 @@
|
|||||||
@using SolarPower.Models.Role
|
@using SolarPower.Models.Role
|
||||||
@model RoleLayerEnum
|
@model RoleLayerEnum
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
|
|||||||
@ -12,16 +12,8 @@
|
|||||||
<li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li>
|
<li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li>
|
||||||
</ol>
|
</ol>
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|||||||
@ -26,19 +26,8 @@
|
|||||||
<link href="~/lib/icheck-bootstrap/icheck-bootstrap.min.css" rel="stylesheet" />
|
<link href="~/lib/icheck-bootstrap/icheck-bootstrap.min.css" rel="stylesheet" />
|
||||||
<!-- Theme style -->
|
<!-- Theme style -->
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<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="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">
|
<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 +41,31 @@
|
|||||||
{
|
{
|
||||||
<p class="alert alert-danger">@ViewBag.ErrMsg</p>
|
<p class="alert alert-danger">@ViewBag.ErrMsg</p>
|
||||||
}
|
}
|
||||||
<form id="login-form" asp-action="Index" method="post">
|
<form id="login-form" asp-action="Index" method="post">
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label class="form-label" for="username">帳號</label>
|
<label class="form-label" for="username">帳號</label>
|
||||||
<input asp-for="Account" type="text" id="account" class="form-control" placeholder="Account">
|
<input asp-for="Account" type="text" id="account" class="form-control" placeholder="Account">
|
||||||
<span asp-validation-for="Account" class="text-danger"></span>
|
<span asp-validation-for="Account" class="text-danger"></span>
|
||||||
<span class="help-block">
|
<span class="help-block">
|
||||||
您的帳號
|
您的帳號
|
||||||
</span>
|
</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>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="form-group">
|
||||||
<button type="submit" class="btn btn-default float-right" id="login">登入</button>
|
<label class="form-label" for="password">密碼</label>
|
||||||
</form>
|
<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>
|
||||||
<div class="blankpage-footer text-center">
|
<div class="blankpage-footer text-center">
|
||||||
<a asp-controller="Login" asp-action="ForgotPassword"><strong>忘記密碼</strong></a>
|
<a asp-controller="Login" asp-action="ForgotPassword"><strong>忘記密碼</strong></a>
|
||||||
@ -87,6 +76,11 @@
|
|||||||
<source src="~/media/video/cc.webm" type="video/webm">
|
<source src="~/media/video/cc.webm" type="video/webm">
|
||||||
<source src="~/media/video/cc.mp4" type="video/mp4">
|
<source src="~/media/video/cc.mp4" type="video/mp4">
|
||||||
</video>
|
</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">
|
<div class="login-box">
|
||||||
|
|||||||
@ -11,16 +11,8 @@
|
|||||||
|
|
||||||
<!-- Your main content goes below here: -->
|
<!-- Your main content goes below here: -->
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative; ">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row mb-5">
|
<div class="row mb-5">
|
||||||
|
|||||||
@ -6,16 +6,8 @@
|
|||||||
@using SolarPower.Models.Role
|
@using SolarPower.Models.Role
|
||||||
@model RoleLayerEnum
|
@model RoleLayerEnum
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
|
|||||||
@ -6,16 +6,8 @@
|
|||||||
@using SolarPower.Models.Role
|
@using SolarPower.Models.Role
|
||||||
@model RoleLayerEnum
|
@model RoleLayerEnum
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ol class="breadcrumb page-breadcrumb">
|
<ol class="breadcrumb page-breadcrumb">
|
||||||
|
|||||||
@ -17,16 +17,8 @@
|
|||||||
</h1>
|
</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Your main content goes below here: -->
|
<!-- Your main content goes below here: -->
|
||||||
|
|||||||
@ -6,16 +6,8 @@
|
|||||||
@using SolarPower.Models.Role
|
@using SolarPower.Models.Role
|
||||||
@model RoleLayerEnum
|
@model RoleLayerEnum
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
|
|||||||
@ -6,16 +6,8 @@
|
|||||||
@using SolarPower.Models.Role
|
@using SolarPower.Models.Role
|
||||||
@model RoleLayerEnum
|
@model RoleLayerEnum
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ol class="breadcrumb page-breadcrumb">
|
<ol class="breadcrumb page-breadcrumb">
|
||||||
|
|||||||
@ -16,16 +16,8 @@
|
|||||||
|
|
||||||
<!-- Your main content goes below here: -->
|
<!-- Your main content goes below here: -->
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|||||||
@ -19,16 +19,8 @@
|
|||||||
</div>
|
</div>
|
||||||
<!-- Your main content goes below here: -->
|
<!-- Your main content goes below here: -->
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|||||||
@ -12,16 +12,8 @@
|
|||||||
|
|
||||||
<!-- Your main content goes below here: -->
|
<!-- Your main content goes below here: -->
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|||||||
@ -13,16 +13,8 @@
|
|||||||
<li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li>
|
<li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li>
|
||||||
</ol>*@
|
</ol>*@
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|||||||
@ -11,16 +11,8 @@
|
|||||||
<li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li>
|
<li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li>
|
||||||
</ol>
|
</ol>
|
||||||
|
|
||||||
<link rel="stylesheet" href="~/css/loading.css" />
|
<div class="d-flex justify-content-center text-secondary" style="top: 10%; transform: translateY(50%); z-index: 100; position: relative;">
|
||||||
<div class="loadEffect" id="loading" style="top: 10%;">
|
<div class="spinner-border" role="status" style="width: 3rem; height: 3rem; display:none;" id="loading"></div>
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|||||||
@ -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;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Loading…
Reference in New Issue
Block a user