fnp
/
cas.git
/ blobdiff
commit
grep
author
committer
pickaxe
?
search:
re
summary
|
shortlog
|
log
|
commit
|
commitdiff
|
tree
raw
|
inline
| side by side
Add services page.
[cas.git]
/
src
/
cas
/
static
/
css
/
main.css
diff --git
a/src/cas/static/css/main.css
b/src/cas/static/css/main.css
index
d4b74b5
..
0c5cda4
100644
(file)
--- a/
src/cas/static/css/main.css
+++ b/
src/cas/static/css/main.css
@@
-1,18
+1,19
@@
+* {
+ box-sizing: border-box;
+}
+
.enclose {
.enclose {
- text-align: center;
- min-height: 500px;
- background: url(../brackets.png) no-repeat 50% 0;
- margin-top: 1em;
+ height: 450px;
+ background: url("../brackets.png") no-repeat 50% 0;
+ margin: 1em 0;
background-size: auto 450px;
background-size: auto 450px;
+ display: flex;
+ flex-direction: column;
}
.enclosed {
}
.enclosed {
- margin-top: 70px;
- display: inline-block;
- text-align: left;
max-width: 300px;
max-width: 300px;
- background-color: rgb(247, 247, 247);
- background-color: rgba(247, 247, 247, .5);
+ margin: auto;
}
a {
}
a {
@@
-22,26
+23,39
@@
a:hover {
text-decoration: underline;
}
text-decoration: underline;
}
-
-form p {
+.errorlist {
+ color: red;
margin: 0;
margin: 0;
+ padding: 0;
+ list-style: none;
}
}
-form label, form input {
+
+
+label, input, button, textarea {
display: block;
width: 100%;
}
display: block;
width: 100%;
}
-#login-form input {
+
+.enclosed input {
font-size: 1.75em;
margin-bottom: .4em;
font-size: 1.75em;
margin-bottom: .4em;
+ width: 100%;
+}
+.enclosed button {
+ font-size: 1.75em;
+ width: 100%;
+ margin-bottom: 0;
+}
+.enclosed p {
+ margin-bottom: 0;
+}
+h1 {
+ font-size: 1.75em;
+ margin: 0 0 16px;
}
}
-
-
-
-
html, body {
margin: 0;
padding: 0;
html, body {
margin: 0;
padding: 0;
- height: 100%;
}
body {
background-color: #F7F7F7;
}
body {
background-color: #F7F7F7;
@@
-71,11
+85,9
@@
footer, #content_push {
margin: auto;
}
margin: auto;
}
-
#details {
#details {
- margin: 1em;
- float: left;
- max-width: 75%;
+ margin: 1em 0;
+ padding: 0 2em;
}
#details form table th {
}
#details form table th {
@@
-98,32
+110,63
@@
footer, #content_push {
color: green;
}
color: green;
}
-#details h2 {
- margin-top: 0;
+.menu {
+ margin: 1em 0;
+ text-align: center;
+}
+.menu .active {
+ font-weight: bold;
+ color: black;
}
}
+@media screen and (min-width: 620px) {
+ .menu {
+ float: left;
+ max-width: 20%;
+ }
-.user_avatar {
- float: left;
- margin: 1em;
- max-width: 20%;
- text-align: center;
+ #details {
+ float: right;
+ width: 80%;
+ }
}
}
-.
user_avatar
img {
+.
menu
img {
box-shadow: 0 0 .2em black;
box-shadow: 0 0 .2em black;
+ margin-bottom: 1em;
}
}
-#services-list {
- clear: both;
- border-top: 1px solid black;
+code.key {
+ white-space: nowrap;
+ width: 100%;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ display: block;
+ color: #666;
}
}
-#services-list h1 {
- margin-bottom: 0;
-}
-#services-list img {
- width: 90px;
- height: 50px;
- margin: 10px 10px 0 0;
+.service-list {
+ display: flex;
+ gap: 10px;
+ flex-wrap: wrap;
+}
+a.service {
+ width: 130px;
+ height: 80px;
+ background: white;
+ box-shadow: 3px 3px 5px #aaa;
+ padding: 10px;
+ position: relative;
+ display: flex;
+ color: black;
+ align-items: center;
+ justify-content: center;
+}
+a.service:hover {
+ text-decoration: none;
+ background: orange;
+}
+.service-icon {
+ max-width: 100%;
+ max-height: 100%;
}
}