Crow/MeikanClient
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Forgot to commit for a while, shit commit <3

Browse source
This commit is contained in:
Crow Crowcrow 2017-04-10 21:14:40 +02:00
parent 9a4c281db3
commit c26e955a08
18 changed files with 442 additions and 535 deletions
Download patch file Download diff file Expand all files Collapse all files

1
static/css/animeList.css Normal file
View file

@ -0,0 +1 @@
.search{display:flex}.search .filters{width:300px}.search .cardList{padding:20px 0;flex:1}.search .cardList .card{display:flex;overflow:hidden;border-radius:2px;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24)}.search .cardList .card:not(:last-child){margin-bottom:20px}.search .cardList .card img{height:200px}.search .cardList .card .body{display:flex;flex-direction:column;max-height:200px;flex:1}.search .cardList .card .body .info{display:flex;overflow:hidden;flex-direction:column;padding:16px 16px 0;flex:1}.search .cardList .card .body .info .title{font-size:25px;color:#ff4081}.search .cardList .card .body .info .synopsis{overflow:hidden;display:-webkit-box;padding:16px 0 0 0;color:rgba(0,0,0,0.52);-webkit-line-clamp:3;-webkit-box-orient:vertical;margin-bottom:16px}.search .cardList .card .body .action{padding:16px;border-top:1px rgba(0,0,0,0.12) solid}.search .cardList .card .body .action button{font-size:16px;color:#448aff;border:none;background:none;outline:none}

2
static/css/base.css
View file

@ -1 +1 @@
@font-face{font-family:'Roboto';font-weight:400;font-style:normal;src:local("Roboto"),local("Roboto-Regular"),url(/static/fonts/roboto.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215}@font-face{font-family:'Material Icons';font-weight:400;font-style:normal;src:local("Material Icons"),local("MaterialIcons-Regular"),url(/static/fonts/material-icons.woff2) format("woff2")}*{box-sizing:border-box}html,body{font-family:'Roboto', sans-serif;height:100%;margin:0}body:after{position:absolute;top:65px;left:0;width:100%;height:calc(100% - 65px);content:'';opacity:.05;background:url("/static/img/bg.svg");background-size:cover}body .material-icons{font-family:'Material Icons';font-size:24px;font-weight:normal;font-style:normal;line-height:1;display:inline-block;white-space:nowrap;letter-spacing:normal;text-transform:none;word-wrap:normal;direction:ltr;-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased}body .container{position:relative;width:1240px;margin:0 auto}body .menu{font-size:0;position:relative;z-index:2;height:65px;margin:0;padding:0;background:#fff;box-shadow:0 3px 6px rgba(0,0,0,0.23),0 3px 6px rgba(0,0,0,0.16)}body .menu a{font-size:22px;font-variant:small-caps;line-height:65px;display:inline-block;height:100%;padding:0 30px;transition:background .1s, color .1s;vertical-align:middle;text-decoration:none;color:rgba(0,0,0,0.52)}body .menu a:first-child{font-size:30px;font-variant:normal;padding-left:0;color:#ff4081}body .menu a:first-child>i{height:inherit;line-height:inherit;vertical-align:top;font-size:30px}body .menu a:first-child>span{margin-left:10px}body .menu a:not(:first-child):hover,body .menu a:not(:first-child).open{color:#fff;background:#ff4081}body .submenu{position:relative;z-index:1;overflow:hidden;width:100%;height:0;transition:height .5s;background:#212121;box-shadow:inset 0 3px 6px rgba(0,0,0,0.23);will-change:height}body .submenu.open{height:350px}body .submenu .container{height:350px}body .submenu .container .group{position:absolute;top:0;left:0;display:flex;width:100%;height:100%;pointer-events:none;opacity:0}body .submenu .container .group.open{opacity:1}body .submenu .container .group .column{display:flex;flex-direction:column;margin:20px 10px;color:#fff;flex:1}body .submenu .container .group .column .groupTitle{line-height:20px;max-height:20px}body .submenu .container .group .column>*{display:flex;height:100%}body .submenu .container .group .column ul{display:flex;flex-direction:column;margin:20px 0 0 10px;padding:10px 20px;list-style:none;border-left:2px rgba(255,255,255,0.1) solid}body .submenu .container .group .column ul li{position:relative;flex:1}body .submenu .container .group .column ul li .title{font-size:16px;display:block;margin-bottom:3px;color:#ff80ab}body .submenu .container .group .column ul li .info{font-size:.8em;font-weight:light;color:#aaa}
@font-face{font-family:'Roboto';font-weight:400;font-style:normal;src:local("Roboto"),local("Roboto-Regular"),url(/static/fonts/roboto.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215}@font-face{font-family:'Material Icons';font-weight:400;font-style:normal;src:local("Material Icons"),local("MaterialIcons-Regular"),url(/static/fonts/material-icons.woff2) format("woff2")}*{box-sizing:border-box}html,body{font-family:'Roboto', sans-serif;height:100%;margin:0}body:after{position:fixed;top:0;left:0;z-index:-1;width:100%;height:100%;content:'';opacity:.05;background:url("/static/img/bg.svg");background-size:cover}body .material-icons{font-family:'Material Icons';font-size:24px;font-weight:normal;font-style:normal;line-height:1;display:inline-block;white-space:nowrap;letter-spacing:normal;text-transform:none;word-wrap:normal;direction:ltr;-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased}body .container{position:relative;width:1240px;margin:0 auto}body .menu{font-size:0;position:relative;z-index:2;height:65px;margin:0;padding:0;background:#fff;box-shadow:0 3px 6px rgba(0,0,0,0.23),0 3px 6px rgba(0,0,0,0.16)}body .menu a{font-size:22px;font-variant:small-caps;line-height:65px;display:inline-block;height:100%;padding:0 30px;transition:background .1s, color .1s;vertical-align:middle;text-decoration:none;color:rgba(0,0,0,0.52)}body .menu a:first-child{font-size:30px;font-variant:normal;padding-left:0;color:#ff4081}body .menu a:first-child>i{font-size:30px;line-height:inherit;height:inherit;vertical-align:top}body .menu a:first-child>span{margin-left:10px}body .menu a:not(:first-child):hover,body .menu a:not(:first-child).open{color:#fff;background:#ff4081}body .submenu{position:absolute;z-index:1;top:65px;overflow:hidden;width:100%;height:0;transition:height .5s;background:#212121;box-shadow:inset 0 3px 6px rgba(0,0,0,0.23);will-change:height}body .submenu.open{height:350px}body .submenu .container{height:350px}body .submenu .container .group{position:absolute;top:0;left:0;display:flex;width:100%;height:100%;pointer-events:none;opacity:0}body .submenu .container .group.open{opacity:1}body .submenu .container .group .column{display:flex;flex-direction:column;margin:20px 10px;color:#fff;flex:1}body .submenu .container .group .column .groupTitle{line-height:20px;max-height:20px}body .submenu .container .group .column>*{display:flex;height:100%}body .submenu .container .group .column ul{display:flex;flex-direction:column;margin:20px 0 0 10px;padding:10px 20px;list-style:none;border-left:2px rgba(255,255,255,0.1) solid}body .submenu .container .group .column ul li{position:relative;flex:1}body .submenu .container .group .column ul li .title{font-size:16px;display:block;margin-bottom:3px;color:#ff80ab}body .submenu .container .group .column ul li .info{font-size:.8em;font-weight:light;color:#aaa}

2
static/css/menu.css
View file

@ -1 +1 @@
.menu{font-size:0;position:relative;z-index:2;height:65px;margin:0;padding:0;background:#fff;box-shadow:0 3px 6px rgba(0,0,0,0.23),0 3px 6px rgba(0,0,0,0.16)}.menu a{font-size:22px;font-variant:small-caps;line-height:65px;display:inline-block;height:100%;padding:0 30px;transition:background .1s, color .1s;vertical-align:middle;text-decoration:none;color:rgba(0,0,0,0.52)}.menu a:first-child{font-size:30px;font-variant:normal;padding-left:0;color:#ff4081}.menu a:first-child>i{height:inherit;line-height:inherit;vertical-align:top;font-size:30px}.menu a:first-child>span{margin-left:10px}.menu a:not(:first-child):hover,.menu a:not(:first-child).open{color:#fff;background:#ff4081}.submenu{position:relative;z-index:1;overflow:hidden;width:100%;height:0;transition:height .5s;background:#212121;box-shadow:inset 0 3px 6px rgba(0,0,0,0.23);will-change:height}.submenu.open{height:350px}.submenu .container{height:350px}.submenu .container .group{position:absolute;top:0;left:0;display:flex;width:100%;height:100%;pointer-events:none;opacity:0}.submenu .container .group.open{opacity:1}.submenu .container .group .column{display:flex;flex-direction:column;margin:20px 10px;color:#fff;flex:1}.submenu .container .group .column .groupTitle{line-height:20px;max-height:20px}.submenu .container .group .column>*{display:flex;height:100%}.submenu .container .group .column ul{display:flex;flex-direction:column;margin:20px 0 0 10px;padding:10px 20px;list-style:none;border-left:2px rgba(255,255,255,0.1) solid}.submenu .container .group .column ul li{position:relative;flex:1}.submenu .container .group .column ul li .title{font-size:16px;display:block;margin-bottom:3px;color:#ff80ab}.submenu .container .group .column ul li .info{font-size:.8em;font-weight:light;color:#aaa}
.menu{font-size:0;position:relative;z-index:2;height:65px;margin:0;padding:0;background:#fff;box-shadow:0 3px 6px rgba(0,0,0,0.23),0 3px 6px rgba(0,0,0,0.16)}.menu a{font-size:22px;font-variant:small-caps;line-height:65px;display:inline-block;height:100%;padding:0 30px;transition:background .1s, color .1s;vertical-align:middle;text-decoration:none;color:rgba(0,0,0,0.52)}.menu a:first-child{font-size:30px;font-variant:normal;padding-left:0;color:#ff4081}.menu a:first-child>i{height:inherit;line-height:inherit;vertical-align:top;font-size:30px}.menu a:first-child>span{margin-left:10px}.menu a:not(:first-child):hover,.menu a:not(:first-child).open{color:#fff;background:#ff4081}.submenu{position:absolute;top:65px;z-index:1;overflow:hidden;width:100%;height:0;transition:height .5s;background:#212121;box-shadow:inset 0 3px 6px rgba(0,0,0,0.23);will-change:height}.submenu.open{height:350px}.submenu .container{height:350px}.submenu .container .group{position:absolute;top:0;left:0;display:flex;width:100%;height:100%;pointer-events:none;opacity:0}.submenu .container .group.open{opacity:1}.submenu .container .group .column{display:flex;flex-direction:column;margin:20px 10px;color:#fff;flex:1}.submenu .container .group .column .groupTitle{line-height:20px;max-height:20px}.submenu .container .group .column>*{display:flex;height:100%}.submenu .container .group .column ul{display:flex;flex-direction:column;margin:20px 0 0 10px;padding:10px 20px;list-style:none;border-left:2px rgba(255,255,255,0.1) solid}.submenu .container .group .column ul li{position:relative;flex:1}.submenu .container .group .column ul li .title{font-size:16px;display:block;margin-bottom:3px;color:#ff80ab}.submenu .container .group .column ul li .info{font-size:.8em;font-weight:light;color:#aaa}

37
static/js/menu.js Normal file
View file

@ -0,0 +1,37 @@
let menus = document.querySelectorAll('a[data-group]'),
subMenu = document.getElementById("subMenu"),
activeSubMenuGroup = [
document.querySelector(`div.group[data-group]`),
document.querySelector(`a[data-group]`)
];
subMenuGroups = [];
function openMenu(event){
activeSubMenuGroup[0].classList.remove("open");
activeSubMenuGroup[1].classList.remove("open");
activeSubMenuGroup[0] = subMenuGroups[this.dataset.group];
activeSubMenuGroup[1] = this;
this.classList.add("open");
subMenu.classList.add("open");
activeSubMenuGroup[0].classList.add("open");
}
function keepMenuOpen(event){
subMenu.classList.add("open");
activeSubMenuGroup[1].classList.add("open")
}
function closeMenu(event){
subMenu.classList.remove("open");
activeSubMenuGroup[1].classList.remove("open");
}
subMenu.addEventListener("mouseenter", keepMenuOpen);
subMenu.addEventListener("mouseleave", closeMenu);
for(let m of menus){
subMenuGroups[m.dataset.group] = document.querySelector(`div.group[data-group="${m.dataset.group}"]`);
m.addEventListener("mouseenter", openMenu);
m.addEventListener("mouseleave", closeMenu);
}