diff --git a/src/components/main/Header/style.scss b/src/components/main/Header/style.scss index e8fa4337..f9e56a01 100644 --- a/src/components/main/Header/style.scss +++ b/src/components/main/Header/style.scss @@ -27,6 +27,7 @@ transition: color 0.25s; text-decoration: none; color: white; + white-space: nowrap; &:hover { color: $red; diff --git a/src/components/main/UserButton/styles.scss b/src/components/main/UserButton/styles.scss index 030f0cc0..13d16a76 100644 --- a/src/components/main/UserButton/styles.scss +++ b/src/components/main/UserButton/styles.scss @@ -9,23 +9,35 @@ .menu { position: absolute; - right: 0; + right: -$gap; top: 100%; padding: $gap; - background: $content_bg; - border-radius: 0 0 $radius $radius; + border-radius: $radius; display: none; z-index: 1; - background: $content_bg; min-width: 100%; box-sizing: border-box; + // transform: translate(0, $gap); + padding: $gap; & > div { + background: transparentize($content_bg, 0.2) url('~/sprites/stripes.svg'); padding: $gap $gap * 2; cursor: pointer; opacity: 0.5; box-sizing: border-box; transition: opacity 0.25s; + width: 100%; + + &:first-child { + border-top-left-radius: $radius; + border-top-right-radius: $radius; + } + + &:last-child { + border-bottom-left-radius: $radius; + border-bottom-right-radius: $radius; + } } &:hover > div { @@ -42,8 +54,8 @@ cursor: pointer; margin-left: $gap; white-space: nowrap; - box-shadow: inset transparentize($content_bg, 0.8) 0 0 0 1px; - background: transparentize($content_bg, 0.1); + // box-shadow: inset transparentize($content_bg, 0.8) 0 0 0 1px; + // background: transparentize($content_bg, 0.1); padding: 0; } diff --git a/src/components/node/CommentContent/styles.scss b/src/components/node/CommentContent/styles.scss index 3b5141cc..40edb9ff 100644 --- a/src/components/node/CommentContent/styles.scss +++ b/src/components/node/CommentContent/styles.scss @@ -44,6 +44,7 @@ box-sizing: border-box; position: relative; color: #cccccc; + word-break: break-all; b { font-weight: 600; diff --git a/src/containers/node/BorisLayout/styles.scss b/src/containers/node/BorisLayout/styles.scss index 1cc12029..54ea41d3 100644 --- a/src/containers/node/BorisLayout/styles.scss +++ b/src/containers/node/BorisLayout/styles.scss @@ -21,17 +21,9 @@ margin-right: $gap; border-radius: $radius; padding: $gap * 2; + display: none; } -// .content { -// padding: $gap; -// text-align: center; -// font: $font_24_bold; -// text-transform: uppercase; -// position: relative; -// display: none; -// } - .cover { position: fixed; z-index: 1; @@ -40,9 +32,7 @@ width: 100%; height: 100vh; overflow: hidden; - // background: linear-gradient($red, transparentize($red, 1)); background: 50% 0% no-repeat/cover url('~/sprites/boris_bg.svg'); - // display: none; } .header { @@ -80,6 +70,12 @@ align-items: flex-start; justify-content: center; flex-direction: row; + width: 80%; + margin: auto; + + @include tablet { + width: 100%; + } } .image { @@ -90,7 +86,16 @@ justify-content: flex-end; img { - width: 90%; + // width: 90%; + } + + @include tablet { + height: 100px; + width: 100%; + + img { + display: none; + } } } @@ -104,6 +109,18 @@ align-items: flex-start; justify-content: flex-end; font: $font_48_bold; + font-size: 72px; + line-height: 0.95em; flex-direction: column; padding-bottom: $gap * 2; + padding: 0 10% $gap * 2; + + @include tablet { + align-items: flex-start; + justify-content: center; + width: 100%; + + padding: $gap; + font-size: 48px; + } } diff --git a/src/index.html b/src/index.html index 5835b8ea..0a0d0eaf 100644 --- a/src/index.html +++ b/src/index.html @@ -31,7 +31,7 @@ @keyframes erdball { 0% { - transform: translate(100%, 100%); + transform: translate(0, 100%); } 100% { diff --git a/src/sprites/boris_robot.svg b/src/sprites/boris_robot.svg index 282622ce..3931fccf 100644 --- a/src/sprites/boris_robot.svg +++ b/src/sprites/boris_robot.svg @@ -55,7 +55,7 @@ fy="83.708092" r="44.979172" gradientUnits="userSpaceOnUse" - gradientTransform="matrix(1.7352932,-0.01764706,0.01387765,1.3646349,-204.79604,-62.042332)" /> + gradientTransform="matrix(1.7352932,-0.01764706,0.01387765,1.3646349,-170.32084,-62.042332)" /> @@ -420,7 +420,7 @@ x2="344.48761" y2="129.496" gradientUnits="userSpaceOnUse" - gradientTransform="translate(0,-21.166667)" /> + gradientTransform="translate(34.475201,-21.166667)" /> @@ -446,7 +446,7 @@ x2="354.54169" y2="126.321" gradientUnits="userSpaceOnUse" - gradientTransform="translate(0,-21.166667)" /> + gradientTransform="translate(34.475201,-21.166667)" /> @@ -468,7 +468,7 @@ x2="350.06058" y2="140.94655" gradientUnits="userSpaceOnUse" - gradientTransform="translate(0,-21.166667)" /> + gradientTransform="translate(34.475201,-21.166667)" /> @@ -490,7 +490,7 @@ fx="329.13629" fy="88.19883" r="7.8439121" - gradientTransform="matrix(1.2742904,0,0,1.1775775,-5.6122675,-10.427498)" + gradientTransform="matrix(1.2742904,0,0,1.1775775,20.846066,-10.427498)" gradientUnits="userSpaceOnUse" /> + transform="matrix(0.18735757,0,0,0.18735757,403.27086,87.767217)" /> + transform="matrix(0.20440322,0,0,0.20440322,428.21379,70.560933)" /> + transform="translate(34.475201,-37.041668)"> + transform="matrix(0.12456547,0,0,0.12456547,409.20677,102.43518)" /> + transform="matrix(0.08767551,0,0,0.08767551,457.56692,105.5866)" /> + transform="matrix(0.40004177,0,0,0.40004177,249.11828,38.813949)" /> + transform="matrix(0.08767551,0,0,0.08767551,379.25022,76.217847)" /> + transform="matrix(0.15463501,0,0,0.15463501,483.64882,105.65812)" /> + transform="matrix(0.11445931,0,0,0.11445931,436.51422,39.52229)" /> + transform="matrix(0.20440322,0,0,0.20440322,348.83884,113.29115)" /> + transform="matrix(0.08767551,0,0,0.08767551,331.62519,107.96785)" /> + transform="matrix(0.08767551,0,0,0.08767551,216.34236,95.116656)" /> + transform="matrix(0.20440322,0,0,0.20440322,243.00546,63.77626)" /> + transform="matrix(0.34414504,0,0,0.34414504,190.67534,95.320527)" />