上傳檔案到 'static'

static/index.css

@@ -1,205 +1,212 @@
 #sitebody{
-        margin:0 auto;
-        margin-top: -80px;
-        font-size:13px;
+    margin:0 auto;
+    margin-top: -80px;
+    font-size:13px;
 }
 
 #nav-side-bar{
-    /* background-color; */
-    /* width:120px; */
+/* background-color; */
+/* width:120px; */
 /*     height:120px; */
 /*     text-align:center; */
-    line-height:40px;
-    height: 100%;
-    width: 250px;
-    position: fixed;
-    z-index: 1;
-    top: 59.6333px;
-    left: 0;
-    background: url(../static/img/sidebar.png);
-    background-size: cover;
-    overflow-x: hidden;
-    transition: 0.5s;
+line-height:40px;
+height: 100%;
+width: 250px;
+position: fixed;
+z-index: 1;
+top: 59.6333px;
+left: 0;
+background: url(../static/img/sidebar.png);
+background-size: cover;
+overflow-x: hidden;
+transition: 0.5s;
 }
 
 #nav-side-bar .bar_img {
-    transform: rotate(270deg);
-    position: absolute;
-    right: -110%;
-    top: 15rem;
-    z-index: 3;
+transform: rotate(270deg);
+position: absolute;
+right: -110%;
+top: 15rem;
+z-index: 3;
 }
 
 #content{
+    position: absolute; 
+    left: 50px; 
+    top: 60px;
     width: calc(100% - 250px);
-    margin-left: 250px;
-/*     border-style:solid; */
-}
+    margin-left: 200px;
+    /*     border-style:solid; */
+    }
 
 #content_login {
-    width: calc(100% - 250px);
-    height: calc(100vh - 60px);
-    margin-left: 250px;
-    background: linear-gradient(105deg, rgba(255, 255, 255, 0.884) 0%, rgba(255, 255, 255, 0.884) 100%, transparent 100%), url(../static/img/technology.jpg);
+width: calc(100% - 250px);
+height: calc(100vh - 60px);
+margin-left: 250px;
+background: linear-gradient(105deg, rgba(255, 255, 255, 0.884) 0%, rgba(255, 255, 255, 0.884) 100%, transparent 100%), url(../static/img/technology.jpg);
 }
 
 
 #show_factory_class_1{
-    border-style:solid;
-    text-align:center;
+border-style:solid;
+text-align:center;
 }
 
 #show_factory_class_2{
-    border-style:solid;
-    text-align:center;
+border-style:solid;
+text-align:center;
 }
 
 .navbar {
     box-shadow: 0 2px 2px -2px rgba(0,0,0,.2);
+    position:fixed;
+    top:0px;
+    width: 100vw !important;
+    z-index: 100;
 }
 
 .navbar-brand img{
-    width: 120px;
+width: 120px;
 }
 
 .nav-side-bar ul {
-    margin-top: 3rem;
-    margin-left: 2.5rem;
-    padding-left: 0rem;
+margin-top: 3rem;
+margin-left: 2.5rem;
+padding-left: 0rem;
 
 }
 
 .nav-side-bar li {
-    padding: .5rem 0; 
+padding: .5rem 0; 
 
 }
 
 .nav-side-bar .side-bar-link {
-    display: block;
-    text-decoration-line: none;
-    font-size: .9rem;
-    color: white;
-    padding-left: 2rem;
+display: block;
+text-decoration-line: none;
+font-size: .9rem;
+color: white;
+padding-left: 2rem;
 }
 
 .nav-side-bar .side-bar-link.active, .nav-side-bar .side-bar-link:hover {
-    background: white;
-    color: black;
-    border-top-left-radius: 8px;
-    border-bottom-left-radius: 8px;
-    position: relative;
+background: white;
+color: black;
+border-top-left-radius: 8px;
+border-bottom-left-radius: 8px;
+position: relative;
 }
 
 .nav-side-bar .side-bar-link.active::after {
-    position: absolute;
-    right: 1rem;
-    top: -2px;
-    content: ">";
+position: absolute;
+right: 1rem;
+top: -2px;
+content: ">";
 }
 
 .login_form {
-    display: block;
-    margin: 5rem auto;
-    width: 60%;
-    padding-top: 7rem;
+display: block;
+margin: 5rem auto;
+width: 60%;
+padding-top: 7rem;
 }
 
 .login_form h2 {
-    text-align: center;
-    font-size: 2.5rem;
-    color: #002e86;
-    margin-bottom: 4rem;
+text-align: center;
+font-size: 2.5rem;
+color: #002e86;
+margin-bottom: 4rem;
 }
 
 .login_form label {
-    color: #002e86;
+color: #002e86;
 }
 
 .login_form input {
-    border-radius: 10px;
-    padding-top: .5rem;
-    padding-bottom: .5rem;
+border-radius: 10px;
+padding-top: .5rem;
+padding-bottom: .5rem;
 }
 
 .login_form #btn_login,.login_form #btn_register {
-    display: block;
-    width: 100%;
-    border-radius: 10px;
-    background: #002e86;
-    border-color: #002e86;
-    padding-top: .5rem;
-    padding-bottom: .5rem;
+display: block;
+width: 100%;
+border-radius: 10px;
+background: #002e86;
+border-color: #002e86;
+padding-top: .5rem;
+padding-bottom: .5rem;
 }
 
 /* 版本一 */
 body{
-    background: #f8f9fb;
+background: #f8f9fb;
 }
 .option{
-    background: #0174c7;
-    color:#000;
+background: #0174c7;
+color:#000;
 }
 .tower-data{
-    width: 80vw;
-    margin: 0 auto;
+width: 80vw;
+margin: 0 auto;
 }
 #select_boxes{
-    padding: 10px 25px;
+padding: 10px 25px;
 }
 .select-item{
-    width: 20%;
-    padding: 10px;
-    margin: 10px;
-    border-radius: 5px;
-    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
-    border:none;
+width: 20%;
+padding: 10px;
+margin: 10px;
+border-radius: 5px;
+box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
+border:none;
 
 }
 #tower_btn{
-    padding: 8px 15px;
-    margin: 10px;
-    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
-    border:none;
-    border-radius: 5px;
-    background: #fff;
-    color:#0174c7;
-    transition: 0.3s;
+padding: 8px 15px;
+margin: 10px;
+box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
+border:none;
+border-radius: 5px;
+background: #fff;
+color:#0174c7;
+transition: 0.3s;
 }
 #tower_btn:hover{
-    background: #0174c7;
-    color:#fff;
+background: #0174c7;
+color:#fff;
 }
 #tower-box{
-    padding: 10px;
+padding: 10px;
 }
 #tower{
-    width: 100%;
-    padding: 10px;
-    border-radius: 5px;
-    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
-    border:none;
+width: 100%;
+padding: 10px;
+border-radius: 5px;
+box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
+border:none;
 
 }
 h1{
-    font-size: 1.6rem;
-    font-weight: 900;
-    padding: 15px;
-   
+font-size: 1.6rem;
+font-weight: 900;
+padding: 15px;
+
 }
 p{
-  font-size: 2.4vmin;
+font-size: 2.4vmin;
 }
 
 .card{
-    margin: 2.3vmin;
-    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
-    border-radius:15px;
-    padding: 15px;
+margin: 2.3vmin;
+box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
+border-radius:15px;
+padding: 15px;
 }
 .unit{
-    font-size: 25px;
-    font-weight: 900;
+font-size: 25px;
+font-weight: 900;
 }
 .data-title{
-    color:#495057;
+color:#495057;
 }