🎨 remove blue in links of the bootstrap lib, add strike line on create button

This commit is contained in:
tykayn 2019-08-12 15:06:41 +02:00
parent 2d03578a1d
commit 07989e454f
4 changed files with 377 additions and 349 deletions

View File

@ -5,327 +5,326 @@
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md) * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
*/ */
*, *,
*::before, *::before,
*::after { *::after {
box-sizing: border-box; box-sizing: border-box;
} }
html { html {
font-family: sans-serif; font-family: sans-serif;
line-height: 1.15; line-height: 1.15;
-webkit-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
} }
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section { article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
display: block; display: block;
} }
body { body {
margin: 0; margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
font-size: 1rem; font-size: 1rem;
font-weight: 400; font-weight: 400;
line-height: 1.5; line-height: 1.5;
color: #212529; color: #212529;
text-align: left; text-align: left;
background-color: #fff; background-color: #fff;
} }
[tabindex="-1"]:focus { [tabindex="-1"]:focus {
outline: 0 !important; outline: 0 !important;
} }
hr { hr {
box-sizing: content-box; box-sizing: content-box;
height: 0; height: 0;
overflow: visible; overflow: visible;
} }
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
margin-top: 0; margin-top: 0;
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
} }
p { p {
margin-top: 0; margin-top: 0;
margin-bottom: 1rem; margin-bottom: 1rem;
} }
abbr[title], abbr[title],
abbr[data-original-title] { abbr[data-original-title] {
text-decoration: underline; text-decoration: underline;
-webkit-text-decoration: underline dotted; -webkit-text-decoration: underline dotted;
text-decoration: underline dotted; text-decoration: underline dotted;
cursor: help; cursor: help;
border-bottom: 0; border-bottom: 0;
-webkit-text-decoration-skip-ink: none; -webkit-text-decoration-skip-ink: none;
text-decoration-skip-ink: none; text-decoration-skip-ink: none;
} }
address { address {
margin-bottom: 1rem; margin-bottom: 1rem;
font-style: normal; font-style: normal;
line-height: inherit; line-height: inherit;
} }
ol, ol,
ul, ul,
dl { dl {
margin-top: 0; margin-top: 0;
margin-bottom: 1rem; margin-bottom: 1rem;
} }
ol ol, ol ol,
ul ul, ul ul,
ol ul, ol ul,
ul ol { ul ol {
margin-bottom: 0; margin-bottom: 0;
} }
dt { dt {
font-weight: 700; font-weight: 700;
} }
dd { dd {
margin-bottom: .5rem; margin-bottom: .5rem;
margin-left: 0; margin-left: 0;
} }
blockquote { blockquote {
margin: 0 0 1rem; margin: 0 0 1rem;
} }
b, b,
strong { strong {
font-weight: bolder; font-weight: bolder;
} }
small { small {
font-size: 80%; font-size: 80%;
} }
sub, sub,
sup { sup {
position: relative; position: relative;
font-size: 75%; font-size: 75%;
line-height: 0; line-height: 0;
vertical-align: baseline; vertical-align: baseline;
} }
sub { sub {
bottom: -.25em; bottom: -.25em;
} }
sup { sup {
top: -.5em; top: -.5em;
} }
a { a {
color: #007bff; text-decoration: none;
text-decoration: none; background-color: transparent;
background-color: transparent; }
}
a:hover {
a:hover { text-decoration: underline;
color: #0056b3; }
text-decoration: underline;
} a:not([href]):not([tabindex]) {
color: inherit;
a:not([href]):not([tabindex]) { text-decoration: none;
color: inherit; }
text-decoration: none;
} a:not([href]):not([tabindex]):hover, a:not([href]):not([tabindex]):focus {
color: inherit;
a:not([href]):not([tabindex]):hover, a:not([href]):not([tabindex]):focus { text-decoration: none;
color: inherit; }
text-decoration: none;
} a:not([href]):not([tabindex]):focus {
outline: 0;
a:not([href]):not([tabindex]):focus { }
outline: 0;
} pre,
code,
pre, kbd,
code, samp {
kbd, font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
samp { font-size: 1em;
font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
font-size: 1em;
} pre {
margin-top: 0;
pre { margin-bottom: 1rem;
margin-top: 0; overflow: auto;
margin-bottom: 1rem; }
overflow: auto;
} figure {
margin: 0 0 1rem;
figure { }
margin: 0 0 1rem;
} img {
vertical-align: middle;
img { border-style: none;
vertical-align: middle; }
border-style: none;
} svg {
overflow: hidden;
svg { vertical-align: middle;
overflow: hidden; }
vertical-align: middle;
} table {
border-collapse: collapse;
table { }
border-collapse: collapse;
} caption {
padding-top: 0.75rem;
caption { padding-bottom: 0.75rem;
padding-top: 0.75rem; color: #6c757d;
padding-bottom: 0.75rem; text-align: left;
color: #6c757d; caption-side: bottom;
text-align: left; }
caption-side: bottom;
} th {
text-align: inherit;
th { }
text-align: inherit;
} label {
display: inline-block;
label { margin-bottom: 0.5rem;
display: inline-block; }
margin-bottom: 0.5rem;
} button {
border-radius: 0;
button { }
border-radius: 0;
} button:focus {
outline: 1px dotted;
button:focus { outline: 5px auto -webkit-focus-ring-color;
outline: 1px dotted; }
outline: 5px auto -webkit-focus-ring-color;
} input,
button,
input, select,
button, optgroup,
select, textarea {
optgroup, margin: 0;
textarea { font-family: inherit;
margin: 0; font-size: inherit;
font-family: inherit; line-height: inherit;
font-size: inherit; }
line-height: inherit;
} button,
input {
button, overflow: visible;
input { }
overflow: visible;
} button,
select {
button, text-transform: none;
select { }
text-transform: none;
} select {
word-wrap: normal;
select { }
word-wrap: normal;
} button,
[type="button"],
button, [type="reset"],
[type="button"], [type="submit"] {
[type="reset"], -webkit-appearance: button;
[type="submit"] { }
-webkit-appearance: button;
} button:not(:disabled),
[type="button"]:not(:disabled),
button:not(:disabled), [type="reset"]:not(:disabled),
[type="button"]:not(:disabled), [type="submit"]:not(:disabled) {
[type="reset"]:not(:disabled), cursor: pointer;
[type="submit"]:not(:disabled) { }
cursor: pointer;
} button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
button::-moz-focus-inner, [type="reset"]::-moz-focus-inner,
[type="button"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
[type="reset"]::-moz-focus-inner, padding: 0;
[type="submit"]::-moz-focus-inner { border-style: none;
padding: 0; }
border-style: none;
} input[type="radio"],
input[type="checkbox"] {
input[type="radio"], box-sizing: border-box;
input[type="checkbox"] { padding: 0;
box-sizing: border-box; }
padding: 0;
} input[type="date"],
input[type="time"],
input[type="date"], input[type="datetime-local"],
input[type="time"], input[type="month"] {
input[type="datetime-local"], -webkit-appearance: listbox;
input[type="month"] { }
-webkit-appearance: listbox;
} textarea {
overflow: auto;
textarea { resize: vertical;
overflow: auto; }
resize: vertical;
} fieldset {
min-width: 0;
fieldset { padding: 0;
min-width: 0; margin: 0;
padding: 0; border: 0;
margin: 0; }
border: 0;
} legend {
display: block;
legend { width: 100%;
display: block; max-width: 100%;
width: 100%; padding: 0;
max-width: 100%; margin-bottom: .5rem;
padding: 0; font-size: 1.5rem;
margin-bottom: .5rem; line-height: inherit;
font-size: 1.5rem; color: inherit;
line-height: inherit; white-space: normal;
color: inherit; }
white-space: normal;
} progress {
vertical-align: baseline;
progress { }
vertical-align: baseline;
} [type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
[type="number"]::-webkit-inner-spin-button, height: auto;
[type="number"]::-webkit-outer-spin-button { }
height: auto;
} [type="search"] {
outline-offset: -2px;
[type="search"] { -webkit-appearance: none;
outline-offset: -2px; }
-webkit-appearance: none;
} [type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
[type="search"]::-webkit-search-decoration { }
-webkit-appearance: none;
} ::-webkit-file-upload-button {
font: inherit;
::-webkit-file-upload-button { -webkit-appearance: button;
font: inherit; }
-webkit-appearance: button;
} output {
display: inline-block;
output { }
display: inline-block;
} summary {
display: list-item;
summary { cursor: pointer;
display: list-item; }
cursor: pointer;
} template {
display: none;
template { }
display: none;
} [hidden] {
display: none !important;
[hidden] { }
display: none !important;
} /*# sourceMappingURL=bootstrap-reboot.css.map */
/*# sourceMappingURL=bootstrap-reboot.css.map */

View File

@ -1,5 +1,9 @@
@charset "UTF-8"; @charset "UTF-8";
a {
color: $black;
}
// buttons // buttons
.btn { .btn {
display: inline-block; display: inline-block;
@ -29,7 +33,26 @@
border: solid 1px $primary_color; border: solid 1px $primary_color;
} }
.striked { .btn-next {
@extend .btn-outline; @extend .striked;
color: $primary_color; text-align: right;
width: 100%;
padding: 1em 2em;
a {
display: block;
}
}
.striked {
&::after {
content: "";
display: block;
width: 12ch;
height: 4px;
margin-top: -0.7em;
margin-right: 0;
margin-left: auto;
background-color: $primary_color;
}
} }

View File

@ -1,28 +1,30 @@
@charset "UTF-8"; @charset "UTF-8";
nav {
a { a {
position: relative; position: relative;
font-family: $default_font; font-family: $default_font;
font-weight: 600; font-weight: 600;
font-size: 1.6rem; font-size: 1.6rem;
color: $black; color: $black;
text-decoration: none; text-decoration: none;
&::before { &::before {
content: ""; content: "";
position: absolute; position: absolute;
top: 0; top: 0;
bottom: 0; bottom: 0;
display: block; display: block;
width: 100%; width: 100%;
height: 6px; height: 6px;
margin: auto; margin: auto;
background-color: $primary_color; background-color: $primary_color;
z-index: -1; z-index: -1;
} }
&::after { &::after {
content: ">"; content: ">";
}
} }
} }

View File

@ -1,6 +1,10 @@
@charset "UTF-8"; @charset "UTF-8";
html { html {
font-size: 62.5%; /* 10px */ font-size: 62.5%; /* 10px */
font-size: calc(1em * 0.625); /* fix */ font-size: calc(1em * 0.625); /* fix */
} }
.text-right {
text-align: right;
}