[TASK] Use px instead of pt

This commit is contained in:
Xaver Maierhofer 2016-06-19 13:14:13 +02:00
parent f4073784a1
commit 3fd4abbda6
8 changed files with 37 additions and 34 deletions

View File

@ -30,12 +30,12 @@ h3 {
} }
h2, h3 { h2, h3 {
padding-left: $buttondistance; padding-left: $button-distance;
padding-right: $buttondistance; padding-right: $button-distance;
} }
p, pre, ul, h4 { p, pre, ul, h4 {
padding: 0 $buttondistance 1em; padding: 0 $button-distance 1em;
} }
img { img {

View File

@ -5,7 +5,7 @@ button {
color: $color-black; color: $color-black;
cursor: pointer; cursor: pointer;
font-family: $font-family-icons; font-family: $font-family-icons;
font-size: 20pt; font-size: $button-font-size;
height: 1.8em; height: 1.8em;
opacity: .7; opacity: .7;
outline: none; outline: none;
@ -44,9 +44,9 @@ button {
} }
color: transparentize($color-black, .5); color: transparentize($color-black, .5);
float: right; float: right;
font-size: 20pt; font-size: $button-font-size;
height: auto; height: auto;
margin: $buttondistance; margin: $button-distance;
width: auto; width: auto;
} }
} }

View File

@ -2,7 +2,7 @@
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
font-size: .83em; font-size: .83em;
padding: 0 6pt 6pt; padding: 0 8px 8px;
li { li {
align-items: center; align-items: center;
@ -10,8 +10,8 @@
border: 1px solid $color-primary; border: 1px solid $color-primary;
color: $color-primary; color: $color-primary;
display: flex; display: flex;
margin: 3pt; margin: 4px;
padding: 0 0 0 8pt; padding: 0 0 0 10px;
label { label {
cursor: pointer; cursor: pointer;
@ -20,10 +20,10 @@
button { button {
background: none; background: none;
color: $color-gray-light; color: $color-gray-light;
font-size: 12pt; font-size: $font-size-small;
height: 18pt; height: 24px;
margin: 2pt; margin: 3px;
width: 18pt; width: 24px;
&:hover { &:hover {
color: $color-primary; color: $color-primary;

View File

@ -6,22 +6,22 @@
.buttons { .buttons {
direction: rtl; direction: rtl;
position: absolute; position: absolute;
right: $buttondistance; right: $button-distance;
top: $buttondistance; top: $button-distance;
unicode-bidi: bidi-override; unicode-bidi: bidi-override;
z-index: 100; z-index: 100;
button { button {
margin-left: $buttondistance; margin-left: $button-distance;
} }
@media screen and (max-width: $minscreenwidth) { @media screen and (max-width: $min-screen-width) {
right: -1rem; right: -1rem;
top: 0; top: 0;
transform: scale(.8); transform: scale(.8);
} }
} }
@media screen and (max-width: $minscreenwidth) { @media screen and (max-width: $min-screen-width) {
height: calc(100vh - 150px); height: calc(100vh - 150px);
min-height: 240px; min-height: 240px;
position: relative; position: relative;

View File

@ -2,17 +2,17 @@
box-sizing: border-box; box-sizing: border-box;
position: absolute; position: absolute;
transition: left .5s; transition: left .5s;
width: $sidebarwidth; width: $sidebar-width;
z-index: 5; z-index: 5;
&.hidden { &.hidden {
left: -$sidebarwidth - $buttondistance; left: -$sidebar-width - $button-distance;
.sidebarhandle { .sidebarhandle {
left: $buttondistance; left: $button-distance;
transform: scale(-1, 1); transform: scale(-1, 1);
} }
@media screen and (max-width: $minscreenwidth) { @media screen and (max-width: $min-screen-width) {
width: auto; width: auto;
} }
} }
@ -73,10 +73,10 @@
background: $color-white; background: $color-white;
font-size: .8em; font-size: .8em;
margin: 0; margin: 0;
width: $sidebarwidthsmall; width: $sidebar-width-small;
.sidebarhandle { .sidebarhandle {
left: $sidebarwidthsmall + $buttondistance; left: $sidebar-width-small + $button-distance;
} }
.container, .infobox { .container, .infobox {
@ -88,7 +88,7 @@
} }
} }
@media screen and (max-width: $minscreenwidth) { @media screen and (max-width: $min-screen-width) {
height: auto; height: auto;
min-height: 0; min-height: 0;
position: static; position: static;
@ -107,9 +107,9 @@
} }
.sidebarhandle { .sidebarhandle {
left: $sidebarwidth + 2 * $buttondistance; left: $sidebar-width + 2 * $button-distance;
position: fixed; position: fixed;
top: $buttondistance; top: $button-distance;
transition: left .5s, box-shadow .5s, color .5s, transform .5s; transition: left .5s, box-shadow .5s, color .5s, transform .5s;
z-index: 10; z-index: 10;

View File

@ -1,7 +1,7 @@
table { table {
border-collapse: separate; border-collapse: separate;
border-spacing: 0 .5em; border-spacing: 0 .5em;
padding: 0 $buttondistance; padding: 0 $button-distance;
width: 100%; width: 100%;
&.attributes { &.attributes {

View File

@ -28,7 +28,7 @@
} }
.visible { .visible {
border-bottom: 2pt solid $color-primary; border-bottom: 2px solid $color-primary;
color: $color-primary; color: $color-primary;
} }
} }

View File

@ -15,12 +15,15 @@ $font-family: 'Roboto Slab', serif !default;
$font-family-secondary: Roboto, sans-serif !default; $font-family-secondary: Roboto, sans-serif !default;
$font-family-icons: ionicons !default; $font-family-icons: ionicons !default;
$font-family-monospace: monospace !default; $font-family-monospace: monospace !default;
$font-size: 11pt !default; $font-size: 15px !default;
$font-size-small: $font-size / 1.4 !default;
$minscreenwidth: 630pt !default; $button-font-size: 1.6rem !default;
$sidebarwidth: 420pt !default; $button-distance: 16px !default;
$sidebarwidthsmall: 320pt !default;
$buttondistance: 12pt !default; $min-screen-width: 840px !default;
$sidebar-width: 560px !default;
$sidebar-width-small: 426px !default;
// En/disable box-shadows // En/disable box-shadows
$shadows: 1 !default; $shadows: 1 !default;