This commit is contained in:
杜恒
2021-02-03 14:24:58 +08:00
parent ff86838e55
commit 0a0ff61a25
16 changed files with 201 additions and 171 deletions

File diff suppressed because one or more lines are too long

View File

@@ -1,11 +1,10 @@
.joe_live {
&__type {
&__contain {
position: relative;
background: var(--background);
border-radius: var(--radius-wrap);
box-shadow: var(--box-shadow);
padding: 60px 15px 15px;
margin-bottom: 15px;
&-title {
display: flex;
align-items: center;
@@ -18,17 +17,11 @@
box-shadow: 2px 5px 10px rgba(49, 58, 70, 0.15);
height: 30px;
line-height: 30px;
padding: 0 8px 0 12px;
padding: 0 12px;
border-radius: 2px 2px 2px 0;
user-select: none;
.icon {
width: 15px;
height: 15px;
fill: #fff;
margin-left: 5px;
cursor: pointer;
}
&::before {
&::after {
content: '';
position: absolute;
bottom: -10px;
@@ -39,6 +32,19 @@
transform: rotate(90deg);
}
}
}
&__type {
margin-bottom: 15px;
&-title {
padding-right: 8px;
.icon {
width: 15px;
height: 15px;
fill: #fff;
margin-left: 5px;
cursor: pointer;
}
}
&-list {
display: grid;
gap: 15px;
@@ -231,4 +237,44 @@
}
}
}
&__pagination {
display: flex;
align-items: center;
justify-content: flex-end;
padding-top: 15px;
&-item {
user-select: none;
cursor: pointer;
margin-left: 5px;
height: 32px;
line-height: 32px;
padding: 0 15px;
background: var(--background);
color: var(--main);
border-radius: 2px;
transition: background 0.35s, color 0.35s;
svg {
fill: var(--routine);
transition: fill 0.35s;
}
.next {
transform: rotate(180deg);
}
&.active,
&:hover {
color: #fff;
background: var(--theme);
svg {
fill: #fff;
}
}
}
}
&__play {
&-player {
width: 100%;
height: 580px;
background: #000;
}
}
}

View File

@@ -1 +1 @@
*{margin:0;padding:0;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{border-radius:4px;background:var(--seat)}::-webkit-scrollbar-track{background:transparent}body{font-size:14px;font-family:'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif}body::before{content:'';position:fixed;top:0;left:0;right:0;bottom:0;z-index:-520;pointer-events:none}input[type='text']{-webkit-appearance:none;border-radius:0;font-size:13px;font-weight:500}iframe{display:block;border:none;margin:0 auto}textarea{resize:none;-webkit-appearance:none}li{list-style:none}a{text-decoration:none}h1,h2,h3,h4,h5,h6{font-weight:500}img{border:0;vertical-align:middle}img[src=''],img:not([src]){border:0;opacity:0}svg,canvas{vertical-align:middle}button{cursor:pointer;-webkit-appearance:none;font-size:13px}table{border-collapse:collapse;border-spacing:0}.joe_main{min-width:0;flex:1;padding:15px 0}.joe_container{display:flex;width:100%;margin:0 auto;padding:0 15px}@media (min-width: 576px){.joe_container{max-width:540px}}@media (min-width: 768px){.joe_container{max-width:720px}}@media (min-width: 992px){.joe_container{max-width:960px}}@media (min-width: 1200px){.joe_container{max-width:1140px}}@media (min-width: 1400px){.joe_container{max-width:1320px}}
*{margin:0;padding:0;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{border-radius:4px;background:var(--seat)}::-webkit-scrollbar-track{background:transparent}body{font-size:14px;font-family:'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif}body::before{content:'';position:fixed;top:0;left:0;right:0;bottom:0;z-index:-520;pointer-events:none}input[type='text']{-webkit-appearance:none;border-radius:0;font-size:13px;font-weight:500}iframe{display:block;border:none;margin:0 auto;vertical-align:middle}textarea{resize:none;-webkit-appearance:none}li{list-style:none}a{text-decoration:none}h1,h2,h3,h4,h5,h6{font-weight:500}img{border:0;vertical-align:middle}img[src=''],img:not([src]){border:0;opacity:0}svg,canvas{vertical-align:middle}button{cursor:pointer;-webkit-appearance:none;font-size:13px}table{border-collapse:collapse;border-spacing:0}.joe_main{min-width:0;flex:1;padding:15px 0}.joe_container{display:flex;width:100%;margin:0 auto;padding:0 15px}@media (min-width: 576px){.joe_container{max-width:540px}}@media (min-width: 768px){.joe_container{max-width:720px}}@media (min-width: 992px){.joe_container{max-width:960px}}@media (min-width: 1200px){.joe_container{max-width:1140px}}@media (min-width: 1400px){.joe_container{max-width:1320px}}

View File

@@ -48,6 +48,7 @@ iframe {
display: block;
border: none;
margin: 0 auto;
vertical-align: middle;
}
textarea {

File diff suppressed because one or more lines are too long

View File

@@ -72,7 +72,6 @@
}
}
&__list {
margin-bottom: 15px;
&-item {
display: grid;
gap: 15px;
@@ -201,6 +200,7 @@
display: flex;
align-items: center;
justify-content: flex-end;
padding-top: 15px;
&-item {
user-select: none;
cursor: pointer;

File diff suppressed because one or more lines are too long

View File

@@ -72,7 +72,6 @@
&__list {
display: grid;
grid-template-columns: repeat(5, 1fr);
margin-bottom: 15px;
.item {
position: relative;
display: block;
@@ -139,6 +138,7 @@
display: flex;
align-items: center;
justify-content: flex-end;
padding-top: 15px;
&-item {
user-select: none;
cursor: pointer;