Skip to content
GitLab
Commit 43618c2f authored by Isabella Skořepová's avatar Isabella Skořepová
Browse files

Format css

parent cf8ce674
Pipeline #1034 passed with stage
in 2 minutes and 24 seconds
Hide whitespace changes
Inline Side-by-side
theme-source/sass/components/_global.scss
View file @ 43618c2f
//Default styles
html {
box-sizing: border-box;
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
*,
*:before,
*:after {
box-sizing: inherit;
}
body {
......@@ -18,18 +20,17 @@ main {
}
ul {
list-style-type: none;
list-style-type: none;
}
a {
color: $link-color;
text-decoration: none;
color: $link-color;
text-decoration: none;
// Gets rid of tap active state
-webkit-tap-highlight-color: transparent;
}
// Positioning
.valign-wrapper {
display: flex;
......@@ -40,7 +41,6 @@ a {
}
}
ul {
padding: 0;
li {
......@@ -53,37 +53,39 @@ ul {
clear: both;
}
// Z-levels
.z-depth-0 {
box-shadow: none !important;
}
.z-depth-1{
.z-depth-1 {
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}
.z-depth-1-half{
.z-depth-1-half {
box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
}
.z-depth-2{
.z-depth-2 {
box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.z-depth-3{
box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19);
.z-depth-3 {
box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24),
0 17px 50px 0 rgba(0, 0, 0, 0.19);
}
.z-depth-4{
box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22), 0 25px 55px 0 rgba(0, 0, 0, 0.21);
.z-depth-4 {
box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22),
0 25px 55px 0 rgba(0, 0, 0, 0.21);
}
.z-depth-5{
box-shadow: 0 27px 24px 0 rgba(0, 0, 0, 0.2), 0 40px 77px 0 rgba(0, 0, 0, 0.22);
.z-depth-5 {
box-shadow: 0 27px 24px 0 rgba(0, 0, 0, 0.2),
0 40px 77px 0 rgba(0, 0, 0, 0.22);
}
.hoverable {
transition: box-shadow .25s;
transition: box-shadow 0.25s;
box-shadow: 0;
}
.hoverable:hover {
transition: box-shadow .25s;
transition: box-shadow 0.25s;
box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
......@@ -92,10 +94,9 @@ ul {
.divider {
height: 1px;
overflow: hidden;
background-color: color("grey", "lighten-2");
background-color: color('grey', 'lighten-2');
}
// Blockquote
blockquote {
......@@ -138,11 +139,9 @@ video.responsive-video {
height: auto;
}
// Pagination
.pagination {
li {
display: inline-block;
font-size: 1.2rem;
......@@ -151,11 +150,17 @@ video.responsive-video {
border-radius: 2px;
text-align: center;
a { color: #444; }
a {
color: #444;
}
&.active a { color: #fff; }
&.active a {
color: #fff;
}
&.active { background-color: $primary-color; }
&.active {
background-color: $primary-color;
}
&.disabled a {
cursor: default;
......@@ -168,7 +173,6 @@ video.responsive-video {
}
}
li.pages ul li {
display: inline-block;
float: none;
......@@ -194,10 +198,11 @@ video.responsive-video {
// Breadcrumbs
.breadcrumb {
font-size: 18px;
color: rgba(255,255,255, .7);
color: rgba(255, 255, 255, 0.7);
i,
[class^="mdi-"], [class*="mdi-"],
[class^='mdi-'],
[class*='mdi-'],
i.material-icons {
display: inline-block;
float: left;
......@@ -206,7 +211,7 @@ video.responsive-video {
&:before {
content: '\E5CC';
color: rgba(255,255,255, .7);
color: rgba(255, 255, 255, 0.7);
vertical-align: top;
display: inline-block;
font-family: 'Material Icons';
......@@ -226,7 +231,6 @@ video.responsive-video {
}
}
// Parallax
.parallax-container {
position: relative;
......@@ -249,14 +253,15 @@ video.responsive-video {
bottom: 0;
min-width: 100%;
min-height: 100%;
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
transform: translateX(-50%);
}
}
// Pushpin
.pin-top, .pin-bottom {
.pin-top,
.pin-bottom {
position: relative;
}
.pinned {
......@@ -276,7 +281,6 @@ ul.staggered-list li {
transform-origin: 0 50%;
}
/*********************
Media Query Classes
**********************/
......@@ -326,7 +330,6 @@ ul.staggered-list li {
}
}
// Center text on mobile
.center-on-small-only {
@media #{$small-and-down} {
......@@ -344,19 +347,21 @@ footer.page-footer {
overflow: hidden;
height: 50px;
line-height: 50px;
color: rgba(255,255,255,.8);
background-color: rgba(51,51,51,.08);
color: rgba(255, 255, 255, 0.8);
background-color: rgba(51, 51, 51, 0.08);
@extend .light;
}
}
// Tables
table, th, td {
border: none;
table,
th,
td {
border: none;
}
table {
width:100%;
width: 100%;
display: table;
&.bordered > thead > tr,
......@@ -375,26 +380,26 @@ table {
}
&.highlight > tbody > tr {
transition: background-color .25s ease;
transition: background-color 0.25s ease;
&:hover {
background-color: $table-striped-color;
}
}
&.centered {
thead tr th, tbody tr td {
thead tr th,
tbody tr td {
text-align: center;
}
}
}
thead {
border-bottom: 1px solid $table-border-color;
}
td, th{
td,
th {
padding: 15px 5px;
display: table-cell;
text-align: left;
......@@ -404,7 +409,6 @@ td, th{
// Responsive Table
@media #{$medium-and-down} {
table.responsive-table {
width: 100%;
border-collapse: collapse;
......@@ -418,7 +422,9 @@ td, th{
vertical-align: top;
}
th { text-align: left; }
th {
text-align: left;
}
thead {
display: block;
float: left;
......@@ -428,7 +434,7 @@ td, th{
padding: 0 10px 0 0;
th::before {
content: "\00a0";
content: '\00a0';
}
}
}
......@@ -453,7 +459,9 @@ td, th{
min-height: 1.25em;
text-align: left;
}
tr { padding: 0 10px; }
tr {
padding: 0 10px;
}
/* sort out borders */
thead {
......@@ -462,17 +470,25 @@ td, th{
}
&.bordered {
th { border-bottom: 0; border-left: 0; }
td { border-left: 0; border-right: 0; border-bottom: 0; }
tr { border: 0; }
tbody tr { border-right: 1px solid $table-border-color; }
th {
border-bottom: 0;
border-left: 0;
}
td {
border-left: 0;
border-right: 0;
border-bottom: 0;
}
tr {
border: 0;
}
tbody tr {
border-right: 1px solid $table-border-color;
}
}
}
}
// Collections
.collection {
margin: $element-top-margin 0 $element-bottom-margin 0;
......@@ -511,7 +527,6 @@ td, th{
text-align: center;
}
.title {
font-size: 16px;
}
......@@ -525,10 +540,8 @@ td, th{
top: 16px;
right: 16px;
}
}
&:last-child {
border-bottom: none;
}
......@@ -542,9 +555,9 @@ td, th{
}
}
}
a.collection-item{
a.collection-item {
display: block;
transition: .25s;
transition: 0.25s;
color: $collection-link-color;
&:not(.active) {
&:hover {
......@@ -566,7 +579,6 @@ td, th{
padding-left: 72px;
}
}
}
// Made less specific to allow easier overriding
.secondary-content {
......@@ -578,8 +590,6 @@ td, th{
border: none;
}
// Badges
span.badge {
min-width: 3rem;
......@@ -600,7 +610,7 @@ span.badge {
border-radius: 2px;
}
&.new:after {
content: " new";
content: ' new';
}
}
nav ul a span.badge {
......@@ -611,30 +621,32 @@ nav ul a span.badge {
// Responsive Videos
.video-container {
// position: relative;
// padding-bottom: 56.25%;
// height: 0;
// overflow: hidden;
iframe, object, embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
// position: relative;
// padding-bottom: 56.25%;
// height: 0;
// overflow: hidden;
iframe,
object,
embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
}
// Progress Bar
.progress {
position: relative;
height: 4px;
display: block;
width: 100%;
background-color: lighten($progress-bar-color, 40%);
border-radius: 2px;
margin: $element-top-margin 0 $element-bottom-margin 0;
overflow: hidden;
position: relative;
height: 4px;
display: block;
width: 100%;
background-color: lighten($progress-bar-color, 40%);
border-radius: 2px;
margin: $element-top-margin 0 $element-bottom-margin 0;
overflow: hidden;
.determinate {
position: absolute;
background-color: inherit;
......@@ -642,7 +654,7 @@ nav ul a span.badge {
left: 0;
bottom: 0;
background-color: $progress-bar-color;
transition: width .3s linear;
transition: width 0.3s linear;
}
.indeterminate {
background-color: $progress-bar-color;
......@@ -651,58 +663,58 @@ nav ul a span.badge {
position: absolute;
background-color: inherit;
top: 0;
left:0;
left: 0;
bottom: 0;
will-change: left, right;
// Custom bezier
animation: indeterminate 2.1s cubic-bezier(0.650, 0.815, 0.735, 0.395) infinite;
animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395)
infinite;
}
&:after {
content: '';
position: absolute;
background-color: inherit;
top: 0;
left:0;
left: 0;
bottom: 0;
will-change: left, right;
// Custom bezier
animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.840, 0.440, 1.000) infinite;
animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1)
infinite;
animation-delay: 1.15s;
}
}
}
@keyframes indeterminate {
0% {
left: -35%;
right:100%;
}
60% {
left: 100%;
right: -90%;
}
100% {
left: 100%;
right: -90%;
}
0% {
left: -35%;
right: 100%;
}
60% {
left: 100%;
right: -90%;
}
100% {
left: 100%;
right: -90%;
}
}
@keyframes indeterminate-short {
0% {
left: -200%;
right: 100%;
}
60% {
left: 107%;
right: -8%;
}
100% {
left: 107%;
right: -8%;
}
0% {
left: -200%;
right: 100%;
}
60% {
left: 107%;
right: -8%;
}
100% {
left: 107%;
right: -8%;
}
}
/*******************
Utility Classes
*******************/
......@@ -716,9 +728,10 @@ nav ul a span.badge {
text-align: left;
}
.right-align {
text-align: right
text-align: right;
}
.center, .center-align {
.center,
.center-align {
text-align: center;
}
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment