GTFOBins.github.io/assets/style.scss

246 lines
4.1 KiB
SCSS
Raw Normal View History

2018-05-21 21:14:41 +02:00
---
---
$accent: #bf0707;
$lighter: #fff4f4;
2018-09-15 18:20:39 +02:00
$marked: #ffcccc;
2018-05-21 21:14:41 +02:00
$hover: #ff0000;
// layout
$column-width: 800px;
$grace-space: 200px;
$layout-break: "(min-width: #{$column-width + $grace-space})";
@media #{$layout-break} {
2018-05-21 21:14:41 +02:00
body {
width: $column-width;
margin: 40px auto;
2018-05-21 21:14:41 +02:00
}
2018-05-29 19:30:39 +02:00
p {
text-align: justify;
}
2018-05-21 21:14:41 +02:00
}
@media not all and #{$layout-break} {
.github-corner {
display: none;
}
}
2018-05-21 21:14:41 +02:00
// common tags
body {
font-family: sans, sans-serif;
}
code {
padding: 0.15em 0.25em;
border-radius: 0.25em;
color: $accent;
background: $lighter;
}
pre {
background: $lighter;
padding: 1em;
overflow-x: auto;
code {
padding: 0;
border-radius: 0;
}
}
a:link, a:visited {
color: $accent;
}
a:hover {
color: $hover;
}
2018-05-24 12:27:09 +02:00
// permalink on headings
2018-05-21 21:14:41 +02:00
2018-05-24 12:27:09 +02:00
h2, h3, h4, h5, h5 {
.permalink {
margin-left: 5px;
text-decoration: none;
visibility: hidden;
&::before {
content: "#";
}
}
&:target {
border-left: 5px solid $accent;
padding-left: 5px;
}
&:hover {
.permalink {
visibility: visible;
}
}
2018-05-21 21:14:41 +02:00
}
// binary list and search
#bin-search-wrapper {
margin: 50px 0;
padding: 10px 0;
2018-10-09 16:13:16 +02:00
position: relative; // XXX needed for tooltip sizing
#bin-search-filters {
text-align: center;
2018-10-09 15:12:34 +02:00
2018-10-09 16:13:16 +02:00
a {
background: $lighter;
font-size: initial;
border-radius: 0.25em;
&:hover:before {
content: attr(data-title);
font-size: 0.8rem;
display: block;
position: absolute;
left: 0;
right: 0;
margin-top: 1.75rem; // XXX below the button
margin-left: 10%;
margin-right: 10%;
padding: 1em;
border-radius: 1em;
color: $lighter;
background: rgba(0, 0, 0, 0.75);
z-index: 1;
pointer-events: none;
}
2018-10-09 15:12:34 +02:00
}
}
#bin-search {
margin-top: 25px;
padding: 1em;
font-size: 1rem;
width: 100%;
box-sizing: border-box;
border: 1px solid $accent;
outline-color: $accent;
}
2018-05-21 21:14:41 +02:00
}
#bin-table {
width: 100%;
th, td {
padding: 0.2em 1em;
}
th {
text-align: left;
}
2018-05-25 19:17:36 +02:00
tbody tr:hover {
background: $lighter;
}
2018-05-21 21:14:41 +02:00
#search-message {
display: none;
2018-05-21 21:14:41 +02:00
text-align: center;
padding: 1em;
}
}
// function description
.function-list {
font-size: 0.8rem;
list-style: none;
padding: 0;
margin: 0;
li {
display: inline-block;
2018-09-15 16:30:54 +02:00
a {
display: inline-block;
padding: 0.25em 0.5em;
margin: 0.2em 0;
border: 1px solid $accent;
}
2018-05-21 21:14:41 +02:00
a:link, a:visited {
color: $accent;
text-decoration: none;
}
2018-09-15 16:30:54 +02:00
a:hover {
2018-05-21 21:14:41 +02:00
color: $hover;
border-color: $hover;
}
2018-09-15 18:20:39 +02:00
&.match a {
background: $marked;
}
2018-05-21 21:14:41 +02:00
}
}
2018-05-22 12:24:49 +02:00
// bin examples
.examples {
display: table;
width: 100%;
table-layout: fixed;
counter-reset: item;
margin: 0;
padding: 0;
2018-05-22 12:24:49 +02:00
2018-06-05 00:22:30 +02:00
li {
2018-05-22 12:24:49 +02:00
display: table-row;
2018-06-05 00:22:30 +02:00
&:not(:only-child):before {
2018-05-22 12:24:49 +02:00
display: table-cell;
font-size: 0.8rem;
2018-05-29 21:55:46 +02:00
font-weight: bold;
width: 3em;
2018-05-22 12:24:49 +02:00
text-align: center;
counter-increment: item;
2018-05-24 12:48:22 +02:00
content: "(" counter(item, lower-alpha) ")";
2018-05-22 12:24:49 +02:00
}
}
}
// other classes
2018-05-21 21:14:41 +02:00
2018-05-29 19:30:39 +02:00
.logo {
$margin: 20px;
float: right;
width: 100px;
height: 100px;
margin-left: $margin;
margin-bottom: $margin;
}
2018-05-21 21:14:41 +02:00
.bin-name {
font-family: monospace;
font-size: 1.2rem;
}
.function-name {
font-size: 1.4rem;
font-weight: bold;
}
2018-05-21 23:09:02 +02:00
.github-buttons {
display: inline-block;
margin-left: 10px;
2018-05-21 23:09:02 +02:00
// avoid displaying the link text during loading
a.github-button {
visibility: hidden;
}
}