First Upload
This commit is contained in:
5
dist/css/bootstrap.min.css
vendored
Normal file
5
dist/css/bootstrap.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
dist/css/bootstrap.min.css.map
vendored
Normal file
1
dist/css/bootstrap.min.css.map
vendored
Normal file
File diff suppressed because one or more lines are too long
272
dist/css/main.css
vendored
Normal file
272
dist/css/main.css
vendored
Normal file
@@ -0,0 +1,272 @@
|
||||
:root {
|
||||
/*
|
||||
Color Palette
|
||||
https://coolors.co/palette/033270-1368aa-4091c9-9dcee2-fedfd4-f29479-f26a4f-ef3c2d-cb1b16-65010c
|
||||
--yale-blue: #033270ff;
|
||||
--green-blue: #1368aaff;
|
||||
--celestial-blue: #4091c9ff;
|
||||
--light-blue: #9dcee2ff;
|
||||
--misty-rose: #fedfd4ff;
|
||||
--salmon: #f29479ff;
|
||||
--tomato: #f26a4fff;
|
||||
--vermilion: #ef3c2dff;
|
||||
--engineering-orange: #cb1b16ff;
|
||||
--rosewood: #65010cff;
|
||||
*/
|
||||
--split-foreground: #000000;
|
||||
/* Combination of Salmon/Tomato */
|
||||
--split-background: #F27F64;
|
||||
--join-foreground: #000000;
|
||||
/* Combination of Light/Celestial Blue */
|
||||
--join-background: #6FB0D6;
|
||||
|
||||
/* Color Palettes for subnet highlights
|
||||
https://coolors.co/palette/f0d7df-f9e0e2-f8eaec-f7ddd9-f7e6da-e3e9dd-c4dbd9-d4e5e3-cae0e4-c8c7d6
|
||||
https://coolors.co/palette/54478c-2c699a-048ba8-0db39e-16db93-83e377-b9e769-efea5a-f1c453-f29e4c
|
||||
https://coolors.co/palette/e2e2df-d2d2cf-e2cfc4-f7d9c4-faedcb-c9e4de-c6def1-dbcdf0-f2c6de-f9c6c9
|
||||
https://coolors.co/palette/54478c-2c699a-048ba8-0db39e-16db93-83e377-b9e769-efea5a-f1c453-f29e4c
|
||||
https://coolors.co/palette/ffadad-ffd6a5-fdffb6-caffbf-9bf6ff-a0c4ff-bdb2ff-ffc6ff-e6e6e6
|
||||
*/
|
||||
--subpal-1-1: #ffadadff;
|
||||
--subpal-1-2: #ffd6a5ff;
|
||||
--subpal-1-3: #fdffb6ff;
|
||||
--subpal-1-4: #caffbfff;
|
||||
--subpal-1-5: #9bf6ffff;
|
||||
--subpal-1-6: #a0c4ffff;
|
||||
--subpal-1-7: #bdb2ffff;
|
||||
--subpal-1-8: #ffc6ffff;
|
||||
--subpal-1-9: #e6e6e6ff;
|
||||
--subpal-1-10: #ffffffff;
|
||||
}
|
||||
|
||||
.table>:not(caption)>*>* {
|
||||
background-color: unset;
|
||||
}
|
||||
|
||||
#bottom_nav {
|
||||
height:2rem;
|
||||
}
|
||||
|
||||
#bottom_nav span {
|
||||
border-bottom:1px black dotted;
|
||||
}
|
||||
|
||||
#whats_new {
|
||||
cursor:pointer !important;
|
||||
text-align: right;
|
||||
width:15rem;
|
||||
float:right;
|
||||
}
|
||||
|
||||
#whats_new a {
|
||||
width:15rem;
|
||||
text-align: right;
|
||||
text-decoration: none;
|
||||
border-bottom:1px var(--bs-success) dotted;
|
||||
}
|
||||
|
||||
|
||||
#copy_url {
|
||||
cursor:pointer !important;
|
||||
text-align: center;
|
||||
width:11rem;
|
||||
}
|
||||
|
||||
#copy_url span {
|
||||
width:11rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#color_palette {
|
||||
min-width: 0rem;
|
||||
}
|
||||
|
||||
#color_palette #colors_word_close {
|
||||
line-height: 2rem;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
#color_palette #colors_word_open {
|
||||
display:inline-block;
|
||||
height:2rem;
|
||||
cursor:pointer;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#color_palette div {
|
||||
display:inline-block;
|
||||
height:2rem;
|
||||
cursor:pointer;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#color_palette div[id^='palette_picker_'] {
|
||||
width:2rem;
|
||||
border:1px solid;
|
||||
}
|
||||
|
||||
#color_palette #palette_picker_1 {
|
||||
background-color: var(--subpal-1-1);
|
||||
}
|
||||
#color_palette #palette_picker_2 {
|
||||
background-color: var(--subpal-1-2);
|
||||
}
|
||||
#color_palette #palette_picker_3 {
|
||||
background-color: var(--subpal-1-3);
|
||||
}
|
||||
#color_palette #palette_picker_4 {
|
||||
background-color: var(--subpal-1-4);
|
||||
}
|
||||
#color_palette #palette_picker_5 {
|
||||
background-color: var(--subpal-1-5);
|
||||
}
|
||||
#color_palette #palette_picker_6 {
|
||||
background-color: var(--subpal-1-6);
|
||||
}
|
||||
#color_palette #palette_picker_7 {
|
||||
background-color: var(--subpal-1-7);
|
||||
}
|
||||
#color_palette #palette_picker_8 {
|
||||
background-color: var(--subpal-1-8);
|
||||
}
|
||||
#color_palette #palette_picker_9 {
|
||||
background-color: var(--subpal-1-9);
|
||||
}
|
||||
#color_palette #palette_picker_10 {
|
||||
background-color: var(--subpal-1-10);
|
||||
}
|
||||
|
||||
.container-xxl {
|
||||
min-width: 576px;
|
||||
}
|
||||
|
||||
#navigation a {
|
||||
color:#000000;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#subnet_input #network {
|
||||
flex-grow: 0;
|
||||
flex-basis: 11rem;
|
||||
}
|
||||
#subnet_input #netsize {
|
||||
flex-grow: 0;
|
||||
flex-basis: 4rem;
|
||||
}
|
||||
|
||||
#calc {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#calc>tbody>tr>td, #calc>tbody>tr>th, #calc>tfoot>tr>td, #calc>tfoot>tr>th, #calc>thead>tr>td, #calc>thead>tr>th {
|
||||
/* Equivalent to p-1 */
|
||||
padding: 0.25rem;
|
||||
/* Equivalent to p-2 */
|
||||
padding-top: 0.25rem;
|
||||
padding-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
/*
|
||||
#joinHeader {
|
||||
border:none;
|
||||
}
|
||||
|
||||
#calc thead {
|
||||
border-right-width: 1px;
|
||||
border-bottom-width: 0px;
|
||||
}*/
|
||||
|
||||
#calc span.split {
|
||||
color: var(--split-background);
|
||||
}
|
||||
|
||||
#calc span.join {
|
||||
color: var(--join-background);
|
||||
}
|
||||
|
||||
#calc td.split {
|
||||
background-color: var(--split-background);
|
||||
color: var(--split-foreground);
|
||||
cursor: pointer;
|
||||
min-width: 2.3rem;
|
||||
width: 1%;
|
||||
font-size:1rem;
|
||||
}
|
||||
|
||||
#notifyModal .modal-content {
|
||||
background-color: var(--bs-alert-bg);
|
||||
}
|
||||
|
||||
#calc td.join {
|
||||
background-color: var(--join-background);
|
||||
color: var(--join-foreground);
|
||||
cursor: pointer;
|
||||
min-width: 2.3rem;
|
||||
width: 1%;
|
||||
font-size:1rem;
|
||||
}
|
||||
|
||||
#calc td.split, #calc td.join {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#calc td.split span, #calc td.join span {
|
||||
padding-right: 0.4rem;
|
||||
}
|
||||
#calc .note {
|
||||
padding-left:0.5rem;
|
||||
padding-right:0.5rem;
|
||||
}
|
||||
|
||||
#calc .note label,input {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#calc .row_address {
|
||||
white-space: nowrap;
|
||||
padding-left:0.5rem;
|
||||
padding-right:0.5rem;
|
||||
}
|
||||
|
||||
#calc .row_range {
|
||||
/* TODO: Make this a checkbox?
|
||||
white-space: nowrap;
|
||||
*/
|
||||
padding-left:0.5rem;
|
||||
padding-right:0.5rem;
|
||||
}
|
||||
|
||||
#calc .row_usable {
|
||||
/* TODO: Make this a checkbox?
|
||||
white-space: nowrap;
|
||||
*/
|
||||
padding-left:0.5rem;
|
||||
padding-right:0.5rem;
|
||||
}
|
||||
|
||||
#calc .row_hosts {
|
||||
width:1%;
|
||||
white-space: nowrap;
|
||||
padding-left:0.5rem;
|
||||
padding-right:0.5rem;
|
||||
}
|
||||
|
||||
|
||||
#calc .note input {
|
||||
border: none !important;
|
||||
border-color: transparent !important;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* https://stackoverflow.com/a/47245068/606974 */
|
||||
.rotate {
|
||||
vertical-align: middle;
|
||||
text-align: end;
|
||||
}
|
||||
.rotate span {
|
||||
-ms-writing-mode: tb-rl;
|
||||
-webkit-writing-mode: vertical-rl;
|
||||
writing-mode: vertical-rl;
|
||||
white-space: nowrap;
|
||||
padding-top: 0.25rem;
|
||||
}
|
||||
Reference in New Issue
Block a user