the-old-stuff/random-user
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Aktualisieren src_less/main.less, README.md Dateien

Browse Source
This commit is contained in:
Luca Jäntsch
2019-06-09 03:28:30 +02:00
parent 85338a9a45
commit 042782236d
2 changed files with 114 additions and 113 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@@ -31,7 +31,7 @@ Just use a simple webserver, if you want to use the rescan.php then you need php
```json ```json
{"user":[ {"user":[
["<file_name(w/o filetype)>","<filetype>"], ["<file_name(w/o filetype)>","<filetype>"],
["test","jpg"], ["test","jpg"]
] ]
} }

225
src_less/main.less
View File

@@ -1,113 +1,114 @@
@bg-color:#FFF; @bg-color:#FFF;
@bg-color-dm:#DDD; @bg-color-dm:#DDD;
@bg-color-dm-nav:darken(@bg-color-dm,10%); @bg-color-dm-nav:darken(@bg-color-dm,10%);
@btn-bgcolor:#0c81f5; @btn-bgcolor:#0c81f5;
@btn-color:#FFF; @btn-color:#FFF;
.App{ .App{
border: #e0e0e0 1px solid; border: #e0e0e0 1px solid;
margin:24px; margin:24px;
} }
*{ *{
box-sizing: border-box; box-sizing: border-box;
font-family: Open Sans,Arial,sans-serif; font-family: Open Sans,Arial,sans-serif;
} }
html,body{ html,body{
margin:0; margin:0;
color:rgba(0,0,0,.87); color:rgba(0,0,0,.87);
background-color:#f9f9f9; background-color:#f9f9f9;
} }
.nav{ .nav{
background-color:#f4f5f6; background-color:#f4f5f6;
height:52px; height:52px;
line-height: 50px; line-height: 50px;
display:flex; display:flex;
border: #e0e0e0 1px solid; border: #e0e0e0 1px solid;
.select-wrapper { .select-wrapper {
position: relative; position: relative;
width: 200px; width: 200px;
} }
.select-wrapper::before { .select-wrapper::before {
color: @btn-bgcolor; color: @btn-bgcolor;
font-size: 20px; font-size: 20px;
pointer-events: none; pointer-events: none;
position: absolute; position: absolute;
right: 15px; right: 15px;
top: 10px; top: 10px;
} }
select { select {
background: #f4f5f6; background: #f4f5f6;
border: none; border: none;
border: 1px @btn-bgcolor solid; border: 1px @btn-bgcolor solid;
color: @btn-bgcolor; color: @btn-bgcolor;
cursor: pointer; cursor: pointer;
font-family: 'Open Sans', sans-serif; font-family: 'Open Sans', sans-serif;
font-size: 16px; font-size: 16px;
height: 40px; height: 40px;
outline: none; outline: none;
padding-left: 10px; padding-left: 10px;
width: 100%; width: 100%;
} margin-top: 6px;
}
select option {
color: @btn-bgcolor; select option {
} color: @btn-bgcolor;
}
select::-ms-expand {
display: none; select::-ms-expand {
} display: none;
}
select:focus::-ms-value {
background-color: transparent; select:focus::-ms-value {
} background-color: transparent;
}
input[type=number]{
height: 40px; input[type=number]{
border: 1px solid @btn-bgcolor; height: 40px;
background: none; border: 1px solid @btn-bgcolor;
color: @btn-bgcolor; background: none;
padding: 0px 5px; color: @btn-bgcolor;
} padding: 0px 5px;
button{ }
height: 40px; button{
border: 1px solid @btn-bgcolor; height: 40px;
background: @btn-bgcolor; border: 1px solid @btn-bgcolor;
color: @btn-color; background: @btn-bgcolor;
} color: @btn-color;
} }
}
.studentList{
display: flex; .studentList{
flex-wrap: wrap; display: flex;
.user{ flex-wrap: wrap;
border: 1px solid #454545; .user{
margin: 5px; border: 1px solid #454545;
padding: 5px; margin: 5px;
transition: cubic-bezier(0.075, 0.82, 0.165, 1) 1000ms; padding: 5px;
&.disappear{ transition: cubic-bezier(0.075, 0.82, 0.165, 1) 1000ms;
opacity: 0.09; &.disappear{
transition: cubic-bezier(0.075, 0.82, 0.165, 1) 1000ms; opacity: 0.09;
} transition: cubic-bezier(0.075, 0.82, 0.165, 1) 1000ms;
&.appear{ }
opacity: 1; &.appear{
transition: cubic-bezier(0.075, 0.82, 0.165, 1) 1000ms; opacity: 1;
} transition: cubic-bezier(0.075, 0.82, 0.165, 1) 1000ms;
.user_img{ }
img{ .user_img{
width:200px; img{
} width:200px;
} }
.username{ }
text-align: center; .username{
display: inline-block; text-align: center;
width: 200px; display: inline-block;
} width: 200px;
} }
}
} }