2016-10-12 03:10:06 +08:00
|
|
|
@import "../../stylesheets/variables/_all";
|
|
|
|
|
|
|
|
.center {
|
|
|
|
text-align: center;
|
|
|
|
font-size: $font-size-large;
|
|
|
|
padding-top: 40px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.closeBtn {
|
|
|
|
position: absolute;
|
|
|
|
right: 10px;
|
|
|
|
top: 10px;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Modifies the close button style
|
|
|
|
Button.closeBtn span:first-child {
|
|
|
|
color: $color-gray-light;
|
|
|
|
background: none;
|
2017-01-12 00:50:07 +08:00
|
|
|
background-color: $color-primary;
|
2016-10-12 03:10:06 +08:00
|
|
|
border: none;
|
|
|
|
box-shadow: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Modifies the audio button icon colour
|
|
|
|
Button.audioBtn span:first-child {
|
|
|
|
color: #25385D;
|
2017-01-12 00:50:07 +08:00
|
|
|
border: 5px solid $color-white;
|
|
|
|
background-color: $color-primary;
|
2016-10-12 03:10:06 +08:00
|
|
|
box-shadow: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
// When hovering over a button of class audioBtn, change the border colour of first span-child
|
|
|
|
Button.audioBtn:hover span:first-child {
|
|
|
|
border: 5px solid $color-primary;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Modifies the button label text
|
|
|
|
Button.audioBtn span:last-child {
|
|
|
|
color: $color-gray-dark;
|
|
|
|
font-size: 30%;
|
|
|
|
}
|
|
|
|
|
|
|
|
Button.audioBtn:first-of-type {
|
|
|
|
margin-right: 70px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.inner {
|
|
|
|
padding: 10px;
|
|
|
|
min-height: 350px;
|
|
|
|
min-width: 500px;
|
|
|
|
}
|
2016-10-13 03:55:02 +08:00
|
|
|
|
|
|
|
// Audio settings menu
|
|
|
|
.half {
|
|
|
|
width: 50%;
|
|
|
|
float: left;
|
|
|
|
padding-top: 30px;
|
|
|
|
}
|
|
|
|
|
2016-12-01 23:32:22 +08:00
|
|
|
div.half label {
|
|
|
|
font-size: 0.75em;
|
|
|
|
font-weight: 600;
|
|
|
|
color: $color-primary;
|
|
|
|
margin-bottom: 5px;
|
|
|
|
}
|
|
|
|
|
2016-10-13 03:55:02 +08:00
|
|
|
.backBtn {
|
|
|
|
position: absolute;
|
|
|
|
left: 10px;
|
|
|
|
top: 10px;
|
2016-10-25 00:01:50 +08:00
|
|
|
border: none;
|
|
|
|
box-shadow: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
.playSound {
|
|
|
|
border: none;
|
|
|
|
box-shadow: none;
|
2016-10-13 03:55:02 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
.enterBtn {
|
|
|
|
position: absolute;
|
|
|
|
bottom: 10px;
|
|
|
|
right: 10px;
|
2016-10-25 00:01:50 +08:00
|
|
|
border: none;
|
|
|
|
box-shadow: none;
|
2016-10-13 03:55:02 +08:00
|
|
|
}
|
2016-12-06 00:21:55 +08:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.containerLeftHalf {
|
|
|
|
width: 50%;
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
|
|
|
|
.containerRightHalf {
|
|
|
|
width: 50%;
|
|
|
|
float: right;
|
|
|
|
}
|
|
|
|
|
|
|
|
.containerFull{
|
|
|
|
width: 100%;
|
|
|
|
float: right;
|
|
|
|
}
|
|
|
|
|
|
|
|
.containerLeftHalfContent {
|
|
|
|
@extend .containerLeftHalf;
|
|
|
|
@extend .row;
|
|
|
|
}
|
|
|
|
|
|
|
|
.containerRightHalfContent {
|
|
|
|
@extend .containerRightHalf;
|
|
|
|
@extend .row;
|
|
|
|
}
|
|
|
|
|
|
|
|
.row {
|
|
|
|
height: 42px;
|
|
|
|
}
|
2016-12-09 02:17:08 +08:00
|
|
|
|
2016-12-23 05:01:56 +08:00
|
|
|
.item {
|
2016-12-09 02:17:08 +08:00
|
|
|
display: block;
|
|
|
|
margin-bottom: $md-padding-y;
|
2016-12-23 03:32:26 +08:00
|
|
|
width: 85%;
|
2016-12-23 05:33:30 +08:00
|
|
|
margin-bottom: 2em;
|
2016-12-23 05:01:56 +08:00
|
|
|
border-bottom: 3px solid;
|
|
|
|
border-top:0px;
|
|
|
|
border-left: 0px;
|
|
|
|
border-right: 0px;
|
|
|
|
outline:0px;
|
|
|
|
border-color: $color-gray-dark;
|
|
|
|
text-decoration-color: $color-gray-dark;
|
2016-12-23 03:32:26 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.title {
|
|
|
|
color: $color-gray-dark;
|
|
|
|
font-weight: 700;
|
|
|
|
font-size: $font-size-large;
|
2016-12-23 05:33:30 +08:00
|
|
|
margin-top: -1em;
|
2016-12-23 03:32:26 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
.audioNote {
|
|
|
|
color: $color-text;
|
|
|
|
display: inline-block;
|
2016-12-23 05:33:30 +08:00
|
|
|
margin-top: 1.75em;
|
|
|
|
margin-bottom: 2em;
|
2016-12-23 03:32:26 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
.heading {
|
|
|
|
font-weight: 700;
|
|
|
|
font-size: $font-size-small;
|
|
|
|
display: inline-block;
|
2016-12-23 05:33:30 +08:00
|
|
|
margin-bottom: .5em;
|
2016-12-23 03:32:26 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
.joinButton {
|
|
|
|
position: relative;
|
2016-12-23 05:33:30 +08:00
|
|
|
left: 11em;
|
|
|
|
top: 3em;
|
2016-12-09 02:17:08 +08:00
|
|
|
}
|