]> git.plutz.net Git - rawnet/blobdiff - rawnet.css
video updating, custom login form
[rawnet] / rawnet.css
index 472db1eb086132303e2ae1677d14c1ae96a965d9..c397b2d8dde2c07f63afabccadc6a10414698941 100644 (file)
@@ -1,4 +1,5 @@
 body {
+  background-position: right;
   background-size: 4pt 4pt;
   background-image: /* #6AF #6FF */
     linear-gradient( 0deg, transparent 25%, rgba(128,128,128,.5) 25% 50%, transparent 50% 75%, rgba(192,192,192,.5) 75%),
@@ -6,31 +7,33 @@ body {
 }
 
 header {
-  background-size: inherit;
-  background-position: right;
-  background-image: /* #6AF #6FF */
-    linear-gradient( 0deg, rgba(0,0,0,.75) 0% 100%),
-    linear-gradient( 0deg, transparent 25%, rgba(128,128,128,.5) 25% 50%, transparent 50% 75%, rgba(192,192,192,.5) 75%),
-    linear-gradient(90deg, transparent 25%, rgba(128,128,128,.5) 25% 50%, transparent 50% 75%, rgba(192,192,192,.5) 75%),
-    linear-gradient( 0deg, #FFF 0% 100%);
-  padding: .25em;
-  box-shadow: #000 .25em .25em .25em;
+  background: inherit;
+  padding: .25em 12em;
   text-align: center;
-  padding-right: .25em 12em;
+  box-shadow: #000 .25em .25em .25em;
   z-index: 1;
 }
 
+header > * { background: inherit; }
+header:before,
+header > *:before {
+  content: ''; position: absolute;
+  top: 0; right: 0; bottom: 0; left: 0;
+  background-color: rgba(0,0,0,.75);
+}
+
+header a { color: #8CE; }
+
 header #user_login {
-  background-size: inherit;
-  background-image: inherit;
-  box-shadow: inherit;
   position: absolute;
-  right: 0; top: 30.5pt; max-height: 0;
+  right: 0; top: 31pt; max-height: 0;
+  width: 12em;
   padding: 0 .5em;
-  transition: max-height linear .125s;
   text-align: center;
-  width: 12em;
+  box-shadow: inherit;
+  transition: max-height linear .125s;
 }
+
 #user_login > * {
   position: relative;
   top: -2.5em;
@@ -43,34 +46,35 @@ header #user_login:hover {
 }
 header #user_login > p {
   color: #EEE;
-  font-size: .875em; line-height: 1.125em;
+  font-size: .875em;
+  line-height: 1.125em;
 }
 header #user_login > p span {
   display: block;
   font-size: initial;
   line-height: 1.375em;
 }
-header #user_login.login:before {
-  display: block;
-  content: "Login";
-  position: relative;
+header #user_login label {
+  top: -1.5em;
   font-size: 1.25em;
   text-decoration: underline;
-  top: -1.5em;
   padding-bottom: 1em;
   color: #EEE;
   text-align: right;
 }
-header #user_login input,
-header #user_login button {
+header #user_login > * {
   display: none;
 }
-header #user_login:hover input,
-header #user_login:hover button {
+header #user_login > :first-child,
+header #user_login:hover > * {
   display: block;
   margin-left: auto;
   margin-right: auto;
 }
+header #user_login:hover > a[href$="/register/"] {
+  text-align: right;
+  margin-top: .75em;
+}
 
 main {
   background-color: rgba(255,255,255,.75);
@@ -92,13 +96,16 @@ body.channel main h1.name {
   text-align: center;
 }
 body.channel main .description,
-body.channel main form.edit.channel {
+body.channel main form.edit,
+body.video   main form.edit {
   max-width: 40em;
   margin: auto;
 }
 
-body.channel main form.edit.channel input[name=name],
-body.channel main form.edit.channel textarea[name=description] {
+body.video main form.edit input[name=name],
+body.video main form.edit textarea[name=description],
+body.channel main form.edit input[name=name],
+body.channel main form.edit textarea[name=description] {
   display: block;
   width: 100%;
   margin-bottom: .5em;
@@ -117,3 +124,7 @@ body.channels main .channel > .description {
   width: 140pt;
   background-color: #FFF;
 }
+
+body.channel .videos .video {
+  display: inline-block;
+}