update: タブレット用にスタイルシートを修正

This commit is contained in:
yuki540 2018-04-19 16:11:01 +09:00
parent 70d5742a38
commit b2cb8a3afb
4 changed files with 8 additions and 30 deletions

View File

@ -1,22 +0,0 @@
@keyframes page-box__show {
from { transform: rotate(90deg); }
to { transform: rotate(0deg); }
}
@keyframes page-box__hidden {
from { transform: rotate(0deg); }
to { transform: rotate(-90deg); }
}
@keyframes page-box__show-close-btn {
from { transform: translate(calc(100% + 20px), calc(-100% + -20px)); }
to { transform: translate(0, 0); }
}
@keyframes page-box__rotate-close-btn {
from { transform: rotate(0deg); }
to { transform: rotate(15deg); }
}
@keyframes page-box__show-content {
from { transform: scale(0.9); opacity: 0; }
to { transform: scale(1); opacity: 1; }
}

View File

@ -1,4 +1,4 @@
@include pc-layout {
@include tablet-layout {
.page-box {
position: absolute;
top: 0; left: 0;
@ -42,8 +42,8 @@
/*** content ***/
.page-box__content {
position: absolute;
top: 40px; left: 40px;
width: calc(100% - 80px); height: calc(100% - 80px);
top: 20px; left: 20px;
width: calc(100% - 40px); height: calc(100% - 40px);
border: solid 10px $theme-pink;
box-sizing: border-box;
background-color: $theme-bg;
@ -56,7 +56,7 @@
.page-title {
position: relative;
margin: 50px auto;
width: 600px; height: 45px;
width: 500px; height: 45px;
div {
position: absolute;
@ -83,7 +83,7 @@
/*** close-btn ***/
.page-box__close-btn {
position: absolute;
top: 10px; right: 10px;
top: 5px; right: 5px;
width: 100px; height: 100px;
display: block;
transform: translate(calc(100% + 20px), calc(-100% + -20px));

View File

@ -1,4 +1,4 @@
@include pc-layout {
@include tablet-layout {
.profile-page {}
/*** body ***/
@ -65,7 +65,7 @@
border-bottom: solid 1px $theme-light-pink;
span {
font-size: 12px;
font-size: 14px;
color: $theme-light-purple;
margin-right: 5px;
}

View File

@ -5,7 +5,7 @@
width: 100%; height: 100%;
background-color: $theme-bg;
overflow: hidden;
z-index: 996;
z-index: 1001;
&::after {
content: ""; display: block;