Difference between revisions of "Template:NCKU Tainan/css/protocol style"
Oscarliu117 (Talk | contribs) (Created page with " .contentimg { width: 100%; } .head2 { color: white; width: 26%; font-size: 50px; /* font-...") |
|||
| (37 intermediate revisions by 2 users not shown) | |||
| Line 1: | Line 1: | ||
| − | + | body { | |
| − | + | background-color: #272625; | |
| − | + | } | |
| − | + | #HQ_page p { | |
| − | + | font-size: 20px; | |
| − | + | margin: 0; | |
| − | + | background-color: #010E00; | |
| − | + | } | |
| − | + | h4, h1, p { | |
| − | + | color: white; | |
| − | + | padding-bottom: 10px; | |
| − | + | } | |
| − | + | .container.content { | |
| − | + | margin-top: 70px; | |
| − | + | } | |
| − | + | .caret { | |
| − | + | display: inline-block; | |
| − | + | width: 0; | |
| − | + | height: 0; | |
| − | + | margin-left: 2px; | |
| − | + | vertical-align: middle; | |
| − | + | border-top: 4px solid; | |
| − | + | border-right: 4px solid transparent; | |
| − | + | border-left: 4px solid transparent; | |
| − | + | } | |
| − | + | #HQ_page h1 { | |
| − | + | border-bottom: 10px solid #7ae26f; | |
| − | + | } | |
| − | + | [class*="col-"] { | |
| − | + | float: left; | |
| − | + | padding: 13px; | |
| − | + | } | |
| − | + | a.list-group-item:visited { | |
| − | + | color: white; | |
| − | + | } | |
| − | + | a:hover { | |
| − | + | background-color: transparent; | |
| − | + | } | |
| − | + | .list-group { | |
| − | + | margin-top: 100px; | |
| − | + | } | |
| − | + | .col-2.side { | |
| − | + | padding: 0; | |
| − | + | } | |
| − | + | .list-group-item { | |
| − | + | padding: .55rem .35rem; | |
| − | + | background-color: #272625; | |
| − | + | color: white; | |
| − | + | border: none; | |
| − | + | font-size: 19px; | |
| − | + | margin: 5px 0; | |
| − | + | } | |
| − | + | a.list-group-item.list-group-item-action { | |
| − | + | background-color: transparent; | |
| − | + | } | |
| − | + | a.list-group-item.list-group-item-action:hover { | |
| − | + | color: #98CC9B; | |
| − | + | } | |
| − | + | a.list-group-item.list-group-item-action.active { | |
| − | + | background-color: transparent; | |
| − | + | color: #7ae26f; | |
| − | + | } | |
| − | + | /*folded-corner*/ | |
| − | + | .post { | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | /* | + | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | . | + | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
position: relative; | position: relative; | ||
| − | |||
| − | |||
| − | |||
| − | |||
} | } | ||
| − | + | .folded-corner { | |
| − | + | ||
| − | + | ||
| − | + | ||
position: absolute; | position: absolute; | ||
| − | + | bottom: 0px; | |
| − | + | right: 0px; | |
| − | border- | + | border-width: 0; |
| − | + | border-style: solid; | |
| − | + | background: hsla(260,100%,100%,0.2); | |
| − | - | + | box-shadow: 0px -4px 0px rgba(0,0,0,0.3), -1px -4px 0px rgba(0,0,0,0.1); |
| − | - | + | border-radius: 15px 0 0 0; |
| − | + | border-color: transparent #B9DEBB transparent transparent; | |
| + | transition: border-width 0.2s ease-out; | ||
} | } | ||
| − | + | .post:hover .folded-corner { | |
| − | + | border-width: 40px 40px 0 0; | |
| − | . | + | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
} | } | ||
| − | . | + | .photo .folded-corner { |
| − | + | background: hsla(260,5%,75%,0.5); | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
} | } | ||
| − | |||
.head { | .head { | ||
color: white; | color: white; | ||
| − | width: | + | width: 50%; |
font-size: 50px; | font-size: 50px; | ||
| − | |||
border-bottom: 10px solid #7ae26f !important; | border-bottom: 10px solid #7ae26f !important; | ||
position: relative; | position: relative; | ||
| − | |||
} | } | ||
| − | . | + | .card { |
| − | + | background-color: #B9DEBB; | |
| − | + | cursor: pointer; | |
} | } | ||
| − | + | .card-body { | |
| − | + | background-color: #B9DEBB; | |
| − | + | text-align: center; | |
| − | + | ||
} | } | ||
| − | + | .card-deck { | |
| − | + | margin: 10px; | |
} | } | ||
| − | + | .modal { | |
| − | + | width: 100%; | |
} | } | ||
| − | . | + | .modal-dialog { |
| − | + | max-width: none !important; | |
| + | width: 1000px; | ||
| + | z-index: 100px !important; | ||
} | } | ||
| − | . | + | .modal-content { |
| − | + | position: relative; | |
} | } | ||
| − | + | td { | |
| − | + | text-align: center; | |
| − | background-color: | + | color: black !important; |
| − | + | border: none !important; | |
| − | + | border-bottom: 2px solid black !important; | |
| − | font-size: | + | border-top: 2px solid black !important; |
| + | background-color: white !important; | ||
| + | padding: 5px !important; | ||
| + | vertical-align: inherit !important; | ||
| + | font-size: 1rem; | ||
} | } | ||
| − | + | table { | |
| − | + | border: none !important; | |
| + | text-align: center !important; | ||
} | } | ||
| − | + | .table { | |
| − | + | padding-top: 80px; | |
} | } | ||
| − | + | th { | |
| − | background-color: | + | border: none !important; |
| − | color: | + | background-color: #262624 !important; |
| + | color: white !important; | ||
| + | font-size: 20px !important; | ||
| + | padding: 10px 10px !important; | ||
} | } | ||
| − | . | + | .centertable { |
| − | + | margin: auto; | |
} | } | ||
| − | + | img.contentimg { | |
| − | + | width: 50%; | |
| − | + | margin: 20px 80px; | |
| + | cursor: pointer; | ||
} | } | ||
| − | + | .modal-backdrop { | |
| − | + | z-index: 1 !important; | |
} | } | ||
| − | + | .blackp { | |
| − | + | color: black !important; | |
| + | background-color: transparent !important; | ||
} | } | ||
| − | + | li.licontent { | |
| − | + | color: black !important; | |
| + | background-color: transparent !important; | ||
} | } | ||
| − | + | ul { | |
| − | + | list-style-image: none !important; | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
} | } | ||
Latest revision as of 17:49, 17 October 2018
body {
background-color: #272625;
}
- HQ_page p {
font-size: 20px; margin: 0; background-color: #010E00;
} h4, h1, p {
color: white; padding-bottom: 10px;
} .container.content {
margin-top: 70px;
} .caret {
display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 4px solid; border-right: 4px solid transparent; border-left: 4px solid transparent;
}
- HQ_page h1 {
border-bottom: 10px solid #7ae26f;
} [class*="col-"] {
float: left; padding: 13px;
} a.list-group-item:visited {
color: white;
} a:hover {
background-color: transparent;
} .list-group {
margin-top: 100px;
} .col-2.side {
padding: 0;
} .list-group-item {
padding: .55rem .35rem; background-color: #272625; color: white; border: none; font-size: 19px; margin: 5px 0;
} a.list-group-item.list-group-item-action {
background-color: transparent;
} a.list-group-item.list-group-item-action:hover {
color: #98CC9B;
} a.list-group-item.list-group-item-action.active {
background-color: transparent; color: #7ae26f;
}
/*folded-corner*/
.post {
position: relative;
}
.folded-corner {
position: absolute;
bottom: 0px;
right: 0px;
border-width: 0;
border-style: solid;
background: hsla(260,100%,100%,0.2);
box-shadow: 0px -4px 0px rgba(0,0,0,0.3), -1px -4px 0px rgba(0,0,0,0.1);
border-radius: 15px 0 0 0;
border-color: transparent #B9DEBB transparent transparent;
transition: border-width 0.2s ease-out;
}
.post:hover .folded-corner {
border-width: 40px 40px 0 0;
}
.photo .folded-corner {
background: hsla(260,5%,75%,0.5);
}
.head {
color: white;
width: 50%;
font-size: 50px;
border-bottom: 10px solid #7ae26f !important;
position: relative;
}
.card {
background-color: #B9DEBB;
cursor: pointer;
}
.card-body {
background-color: #B9DEBB;
text-align: center;
}
.card-deck {
margin: 10px;
}
.modal {
width: 100%;
}
.modal-dialog {
max-width: none !important;
width: 1000px;
z-index: 100px !important;
}
.modal-content {
position: relative;
}
td {
text-align: center;
color: black !important;
border: none !important;
border-bottom: 2px solid black !important;
border-top: 2px solid black !important;
background-color: white !important;
padding: 5px !important;
vertical-align: inherit !important;
font-size: 1rem;
}
table {
border: none !important;
text-align: center !important;
}
.table {
padding-top: 80px;
}
th {
border: none !important;
background-color: #262624 !important;
color: white !important;
font-size: 20px !important;
padding: 10px 10px !important;
}
.centertable {
margin: auto;
}
img.contentimg {
width: 50%;
margin: 20px 80px;
cursor: pointer;
}
.modal-backdrop {
z-index: 1 !important;
}
.blackp {
color: black !important;
background-color: transparent !important;
}
li.licontent {
color: black !important;
background-color: transparent !important;
}
ul {
list-style-image: none !important;
}