mirror of
https://github.com/Gioni06/terminal.css
synced 2025-03-09 09:09:04 -04:00
fix smaller things
This commit is contained in:
Jonas Duri
parent
a6444e767c
commit
4d16082d19
@ -108,8 +108,6 @@ ul,
|
||||
h1,
|
||||
.logo {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
display: table-cell;
|
||||
padding: calc(var(--global-space) * 2) 0 calc(var(--global-space) * 2);
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
@ -142,7 +140,6 @@ h6 {
|
||||
blockquote {
|
||||
position: relative;
|
||||
padding-left: calc(var(--global-space) * 2);
|
||||
padding-left: 2ch;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@ -499,8 +496,10 @@ table th {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
table thead th {
|
||||
table thead tr th {
|
||||
font-size: 1em;
|
||||
vertical-align: middle;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
table tfoot tr th {
|
||||
@ -512,11 +511,6 @@ table caption {
|
||||
margin: 0 0 1em;
|
||||
}
|
||||
|
||||
table tbody td:first-child {
|
||||
font-weight: 700;
|
||||
color: var(--secondary-color);
|
||||
}
|
||||
|
||||
.form {
|
||||
width: 100%;
|
||||
}
|
||||
@ -535,12 +529,20 @@ input[type="email"],
|
||||
input[type="text"],
|
||||
input[type="number"],
|
||||
input[type="password"],
|
||||
input[type="search"] {
|
||||
input[type="search"],
|
||||
input[type="date"],
|
||||
input[type="time"] {
|
||||
border: 1px var(--input-style) var(--font-color);
|
||||
width: 100%;
|
||||
padding: 0.7em 0.5em;
|
||||
font-size: 1em;
|
||||
font-family: var(--font-stack);
|
||||
|
||||
/* stylelint-disable */
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
/* stylelint-enable */
|
||||
|
||||
appearance: none;
|
||||
border-radius: 0;
|
||||
}
|
||||
@ -550,12 +552,22 @@ input[type="text"]:active,
|
||||
input[type="number"]:active,
|
||||
input[type="password"]:active,
|
||||
input[type="search"]:active,
|
||||
input[type="date"]:active,
|
||||
input[type="time"]:active,
|
||||
input[type="email"]:focus,
|
||||
input[type="text"]:focus,
|
||||
input[type="number"]:focus,
|
||||
input[type="password"]:focus,
|
||||
input[type="search"]:focus {
|
||||
input[type="search"]:focus,
|
||||
input[type="date"]:focus,
|
||||
input[type="time"]:focus {
|
||||
outline: none;
|
||||
|
||||
/* stylelint-disable */
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
/* stylelint-enable */
|
||||
|
||||
appearance: none;
|
||||
border: 1px solid var(--font-color);
|
||||
}
|
||||
@ -564,7 +576,9 @@ input[type="text"]:not(:placeholder-shown):invalid,
|
||||
input[type="email"]:not(:placeholder-shown):invalid,
|
||||
input[type="password"]:not(:placeholder-shown):invalid,
|
||||
input[type="search"]:not(:placeholder-shown):invalid,
|
||||
input[type="number"]:not(:placeholder-shown):invalid {
|
||||
input[type="number"]:not(:placeholder-shown):invalid,
|
||||
input[type="date"]:not(:placeholder-shown):invalid,
|
||||
input[type="time"]:not(:placeholder-shown):invalid {
|
||||
border-color: var(--error-color);
|
||||
}
|
||||
|
||||
@ -594,6 +608,12 @@ textarea {
|
||||
|
||||
textarea:focus {
|
||||
outline: none;
|
||||
|
||||
/* stylelint-disable */
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
/* stylelint-enable */
|
||||
|
||||
appearance: none;
|
||||
border: 1px solid var(--font-color);
|
||||
}
|
||||
@ -602,6 +622,26 @@ textarea:not(:placeholder-shown):invalid {
|
||||
border-color: var(--error-color);
|
||||
}
|
||||
|
||||
select {
|
||||
border: 1px var(--input-style) var(--font-color);
|
||||
width: 100%;
|
||||
padding: .7em .5em;
|
||||
font-size: 1em;
|
||||
font-family: var(--font-stack);
|
||||
color: var(--font-color);
|
||||
border-radius: 0;
|
||||
|
||||
/* stylelint-disable */
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
/* stylelint-enable */
|
||||
|
||||
background-color: var(--background-color);
|
||||
background-image: url("data:image/svg+xml;utf8,<svg fill='currentColor' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
|
||||
background-repeat: no-repeat;
|
||||
background-position: right .5em bottom .5em;
|
||||
}
|
||||
|
||||
input:-webkit-autofill,
|
||||
input:-webkit-autofill:hover,
|
||||
input:-webkit-autofill:focus textarea:-webkit-autofill,
|
||||
@ -813,7 +853,10 @@ select:-webkit-autofill:focus {
|
||||
border-color: var(--primary-color);
|
||||
}
|
||||
|
||||
@media screen and (width <= 960px) {
|
||||
/* stylelint-disable */
|
||||
@media screen and (min-width: 960px) {
|
||||
/* stylelint-enable */
|
||||
|
||||
label {
|
||||
display: block;
|
||||
width: 100%;
|
||||
@ -824,13 +867,17 @@ select:-webkit-autofill:focus {
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (width <= 480px) {
|
||||
/* stylelint-disable */
|
||||
@media screen and (min-width: 480px) {
|
||||
/* stylelint-enable */
|
||||
form {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (width >= 30em) {
|
||||
/* stylelint-disable */
|
||||
@media screen and (min-width: 30rem) {
|
||||
/* stylelint-enable */
|
||||
.terminal-nav {
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
@ -844,8 +891,7 @@ select:-webkit-autofill:focus {
|
||||
}
|
||||
|
||||
.terminal-menu li {
|
||||
margin: 0;
|
||||
margin-right: 2em;
|
||||
margin: 0 2em 0 0;
|
||||
}
|
||||
|
||||
.terminal-menu li:last-child {
|
||||
|
||||
@ -35,8 +35,16 @@
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="tarea">Textarea:</label>
|
||||
<textarea id="tarea" cols="30" rows="5" name=="tarea">Textarea text</textarea>
|
||||
<label for="event-date">Event date:</label>
|
||||
<input type="date" id="event-date" name="event-date">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="event-time">Event time:</label>
|
||||
<input type="time" id="event-time" name="event-time">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="textarea">Textarea:</label>
|
||||
<textarea id="textarea" cols="30" rows="5" name=="textarea">Textarea text</textarea>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="submit">Input Button:</label>
|
||||
|
||||
@ -1,74 +1,54 @@
|
||||
<section>
|
||||
<header>
|
||||
<h2 id="Tables">Tables</h2>
|
||||
</header>
|
||||
<table>
|
||||
<caption>
|
||||
Most Downloaded Movies on BitTorrent, 2011
|
||||
</caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Rank</th>
|
||||
<th>Movie</th>
|
||||
<th>Downloads</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th colspan="4">torrentfreak.com</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>1</th>
|
||||
<td>Fast Five</td>
|
||||
<td>9,260,000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>2</th>
|
||||
<td>The Hangover II</td>
|
||||
<td>8,840,000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>3</th>
|
||||
<td>Thor</td>
|
||||
<td>8,330,000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>4</th>
|
||||
<td>Source Code</td>
|
||||
<td>7,910,000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>5</th>
|
||||
<td>I Am Number Four</td>
|
||||
<td>7,670,000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>6</th>
|
||||
<td>Sucker Punch</td>
|
||||
<td>7,200,000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>7</th>
|
||||
<td>127 Hours</td>
|
||||
<td>6,910,000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>8</th>
|
||||
<td>Rango</td>
|
||||
<td>6,480,000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>9</th>
|
||||
<td>The King’s Speech</td>
|
||||
<td>6,250,000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>10</th>
|
||||
<td>Harry Potter and the Deathly Hallows Part 2</td>
|
||||
<td>6,030,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<header>
|
||||
<h2 id="Tables">Tables</h2>
|
||||
</header>
|
||||
<table>
|
||||
<caption>
|
||||
Traditional colors of Japan
|
||||
</caption>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th colspan="5"><a href="https://en.wikipedia.org/wiki/Traditional_colors_of_Japan" target="_blank">Source: Wikipedia</a></th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Japanese name</th>
|
||||
<th>Romanized</th>
|
||||
<th>English translation</th>
|
||||
<th>RGB</th>
|
||||
<th>Hex triplet</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tr>
|
||||
<td>一斤染</td>
|
||||
<td>Ikkonzome</td>
|
||||
<td>One kin (0.6 kg (1.3 lb)) dye</td>
|
||||
<td>240,143,144</td>
|
||||
<td>#F08F90</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>紅梅色</td>
|
||||
<td>Kōbai-iro</td>
|
||||
<td>Red plum colored</td>
|
||||
<td>219,90,107</td>
|
||||
<td>#DB5A6B</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>桜色</td>
|
||||
<td>Sakura-iro</td>
|
||||
<td>Cherry blossom color</td>
|
||||
<td>252,201,185</td>
|
||||
<td>#FCC9B9</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>薄紅</td>
|
||||
<td>Usubeni</td>
|
||||
<td>Pale crimson (dye)</td>
|
||||
<td>242,102,108</td>
|
||||
<td>#F2666C</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</section>
|
||||
Loading…
x
Reference in New Issue
Block a user