nautobot 2.4.21__py3-none-any.whl → 3.0.0a3__py3-none-any.whl

nautobot/project-static/css/base.css

@@ -1,1040 +0,0 @@
-/* Layout */
-
-:root {
-    --navbar-transition-duration: 350ms;
-}
-
-* {
-    margin: 0;
-}
-html {
-    overflow-y: scroll;
-}
-html, body {
-    height: 100%;
-}
-body {
-    padding-left: 240px;  /* same as width of .navbar-fixed-left */
-    padding-top: 20px;
-}
-.wrapper {
-    min-height: 100%;
-    height: auto !important;
-    margin: 0 auto -48px; /* the bottom margin is the negative value of the footer's height */
-    padding-bottom: 30px;
-}
-#main-content {
-    transition-duration: var(--navbar-transition-duration);
-    transition-timing-function: ease-in-out;
-    transition-property: margin-left, width;
-    min-height: calc(100vh - 20px);
-}
-#main-content > .form {
-    margin-top: 20px;
-}
-.footer, .push {
-    height: 48px; /* .push must be the same height as .footer */
-}
-.footer {
-    background-color: #f5f5f5;
-    border-top-left-radius: 10px;
-    border-top-right-radius: 10px;
-    white-space: nowrap;
-    transition-duration: var(--navbar-transition-duration);
-    transition-timing-function: ease-in-out;
-    transition-property: margin-left, width;
-    overflow: visible;
-    margin: 0;
-}
-.footer .row {
-    background-color: #f5f5f5;
-}
-footer p {
-    margin: 12px 0;
-}
-.right-side-panel {
-    max-width: 400px;
-    min-width: 300px;
-    padding-right: 0;
-}
-
-/* Printer friendly CSS class and various fixes for printing. */
-@media print {
-    body {
-        padding-top: 0px;
-    }
-    a[href]:after {
-        content: none !important;
-    }
-    .noprint {
-        display: none !important;
-    }
-}
-
-/* Forms */
-label {
-    font-weight: normal;
-}
-label.required {
-    font-weight: bold;
-}
-input[name="pk"] {
-    margin-top: 0;
-}
-
-
-/* Tables */
-th.pk, td.pk {
-    padding-bottom: 6px;
-    padding-top: 10px;
-    width: 30px;
-}
-tfoot td {
-    font-weight: bold;
-}
-table.attr-table td:nth-child(1) {
-    width: 25%;
-}
-.table-headings th {
-    background-color: #f5f5f5;
-    white-space: nowrap;
-}
-td.min-width {
-    width: 1%;
-}
-
-/* Paginator */
-div.paginator {
-    margin-bottom: 20px;
-}
-div.paginator form {
-    margin-bottom: 6px;
-}
-nav ul.pagination {
-    margin-top: 0;
-    margin-bottom: 8px !important;
-}
-
-/* Devices */
-table.component-list td.subtable {
-    padding: 0;
-    padding-left: 16px;
-}
-table.component-list td.subtable td {
-    border: none;
-    padding-bottom: 6px;
-    padding-top: 6px;
-}
-
-/* Reports */
-table.reports td.method {
-    font-family: monospace;
-    padding-left: 30px;
-}
-td.report-stats label {
-    display: inline-block;
-    line-height: 14px;
-    margin-bottom: 0;
-    min-width: 40px;
-}
-table.report th {
-    position: relative;
-}
-table.report th a {
-    position: absolute;
-    top: -51px;
-}
-
-/* Rendered Markdown */
-.rendered-markdown table {
-    width: 100%;
-}
-.rendered-markdown th {
-    border-bottom: 2px solid #dddddd;
-    padding: 8px;
-}
-.rendered-markdown td {
-    border-top: 1px solid #dddddd;
-    padding: 8px;
-}
-.rendered-markdown :last-child {
-    margin-bottom: 0;
-}
-
-/* Cable tracing */
-.cable-trace {
-    max-width: 600px;
-    margin: 16px auto;
-    text-align: center;
-}
-.cable-trace .node {
-    background-color: #f0f0f0;
-    border: 1px solid #909090;
-    border-radius: 8px;
-    padding: 24px 16px;
-    position: relative;
-    z-index: 1;
-}
-.cable-trace .termination {
-    background-color: #f7f7f7;
-    border: 1px solid #909090;
-    border-radius: 4px;
-    margin: -16px auto;
-    padding: 12px;
-    position: relative;
-    width: 60%;
-    z-index: 2;
-}
-.cable-trace .active {
-    border: 3px solid #30C030;
-}
-.cable-trace .cable {
-    border-left-style: solid;
-    border-left-width: 4px;
-    margin: 12px 0 12px 50%;
-    padding: 24px;
-    text-align: left;
-    width: 50%;
-}
-.cable-trace .trace-end {
-    margin-top: 48px;
-    text-align: center;
-}
-
-/* Admonition (docs) */
-.admonition {
-    margin-bottom: 10px;
-    padding-bottom: 2px;
-}
-.admonition p {
-    padding: 0 12px;
-}
-.admonition pre {
-    margin: 0 12px 10px;
-}
-.admonition p.admonition-title {
-    color: rgb(255, 255, 255);
-    font-weight: bold;
-    padding: 4px 12px;
-}
-.admonition p.admonition-title::before {
-    content: "\f06a";
-    font-family: "FontAwesome";
-    margin-right: 4px;
-}
-/* Admonition - Note */
-.admonition.note {
-    background-color: rgb(231, 242, 250);
-}
-.admonition.note .admonition-title {
-    background-color: rgb(106, 176, 222);
-}
-.admonition.note .admonition-title::before {
-    content: "\f05a";
-}
-/* Admonition - Warning */
-.admonition.warning {
-    background-color: rgb(255, 237, 204);
-}
-.admonition.warning .admonition-title {
-    background-color: rgb(240, 179, 126);
-}
-.admonition.warning .admonition-title::before {
-    content: "\f06a";
-}
-/* Admonition - Danger */
-.admonition.danger {
-    background-color: rgb(253, 243, 242);
-}
-.admonition.danger .admonition-title {
-    background-color: rgb(242, 159, 151);
-}
-.admonition.danger .admonition-title::before {
-    content: "\f071";
-}
-
-/* AJAX loader */
-.loading {
-    position: fixed;
-    display: none;
-    z-index: 999;
-    height: 2em;
-    width: 2em;
-    overflow: show;
-    margin: auto;
-    top: 0;
-    left: 0;
-    bottom: 0;
-    right: 0;
-}
-.loading:before {
-    content: '';
-    display: block;
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background-color: rgba(0, 0, 0, 0.3);
-}
-
-/* Misc */
-.color-block {
-    display: block;
-    width: 80px;
-    border: 1px solid grey;
-}
-.inline-color-block {
-    display: inline-block;
-    width: 1.5em;
-    height: 1.5em;
-    border: 1px solid grey;
-    border-radius: .25em;
-    vertical-align: middle;
-}
-.text-nowrap {
-    white-space: nowrap;
-}
-.banner-bottom {
-    margin-bottom: 50px;
-}
-.panel table {
-    margin-bottom: 0;
-    overflow: hidden;
-}
-.panel .table th {
-    border-bottom-width: 1px;
-}
-.panel table tr.even:first-child td {
-    border-top: 0;
-}
-.panel .list-group {
-    max-height: 400px;
-    overflow: auto;
-    border-bottom-left-radius: 9px;
-    border-bottom-right-radius: 9px;
-}
-.panel-heading {
-    font-weight: 700;
-}
-.panel-body {
-    border-bottom-left-radius: 9px;
-    border-bottom-right-radius: 9px;
-}
-ul.nav-tabs, ul.nav-pills {
-    margin-bottom: 20px;
-}
-ul.nav-tabs li a {
-    padding: 8px 10px;
-    border: none;
-}
-ul.nav-tabs li a:hover,
-ul.nav-tabs li a:focus,
-ul.nav-pills li a:hover,
-ul.nav-pills li.active a:hover,
-ul.nav-pills li a:focus {
-    background-color: #d2d2d2;
-}
-ul.nav-pills li.active a {
-    background-color: #eaf2f9;
-}
-ul.nav-tabs li a:hover,
-.label a {
-    color: inherit;
-}
-ul.software-image-hierarchy {
-    list-style-type: "↳ ";
-    padding-left: 18px;
-}
-
-ul.tree-hierarchy {
-    list-style-type: none;
-    padding-left: 0px;
-}
-ul.tree-hierarchy ul {
-    list-style-type: "↳ ";
-    padding-left: 18px;
-}
-
-/* Filters */
-.filter-container {
-    box-sizing: border-box;
-    display: inline-block;
-    margin: 0;
-    position: relative;
-    vertical-align: middle;
-}
-
-.filter-container.display-inline {
-    display: inline-block;
-}
-
-.filter-container .filter-selection {
-    min-height: 34px;
-    padding: 5px;
-    height: auto;
-    box-sizing: border-box;
-    cursor: pointer;
-    display: block;
-    user-select: none;
-    -webkit-user-select: none;
-    margin: 0;
-    webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
-    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
-    background-color: #fff;
-    border: 1px solid #ccc;
-    border-radius: 4px;
-    color: #555;
-    font-size: 14px;
-    outline: 0;
-}
-
-.remove-filter-param {
-    color: #999;
-    cursor: pointer;
-    float: right;
-    font-weight: 700;
-    margin-left: 10px;
-}
-
-.fitler-container .filter-selection .filter-selection-rendered {
-    webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box;
-    display: block;
-    line-height: 1.42857143;
-    list-style: none;
-    margin: 0;
-    overflow: hidden;
-    padding: 0;
-    width: 100%;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-}
-
-.filter-container .filter-selection .filter-selection-choice {
-    color: #555;
-    background: #fff;
-    border: 1px solid #ccc;
-    border-radius: 4px;
-    cursor: default;
-    float: left;
-    margin: 5px 3px 0 0;
-    padding: 0 6px;
-}
-
-.filter-container .filter-selection .filter-selection-rendered {
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box;
-    display: block;
-    line-height: 1.42857143;
-    list-style: none;
-    margin: 0;
-    overflow: hidden;
-    padding: 0;
-    width: 100%;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-}
-
-.filter-container .filter-selection .filter-selection-choice-remove {
-    display: inline-block;
-    margin-right: 3px;
-    margin-left: 0;
-    float: none;
-}
-
-.filter-container .filter-selection .filter-selection-rendered {
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box;
-    display: block;
-    line-height: 1.42857143;
-    list-style: none;
-    margin: 0;
-    overflow: hidden;
-    padding: 0;
-    width: 100%;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-}
-
-/* Fix progress bar margin inside table cells */
-td .progress {
-    margin-bottom: 0;
-    min-width: 100px;
-}
-textarea {
-    font-family: Consolas, Lucida Console, monospace;
-}
-
-/* MDI icons */
-.mdi::before {
-    font-size: 20px;
-    line-height: 20px;
-    position: relative;
-    top: 2px;
-}
-.btn .mdi {
-    margin: 0 -2px;
-}
-.btn .mdi::before {
-    font-size: 20px;
-    line-height: 14px;
-    position: relative;
-    top: 2px;
-}
-.btn-xs .mdi::before {
-    font-size: 18px;
-    top: 3px;
-}
-.btn-sm .mdi::before {
-    font-size: 18px;
-    top: 3px;
-}
-.btn-inline {
-    font-size: .9em;
-    line-height: .9em;
-    vertical-align: baseline;
-    border-radius: 3px;
-    padding: 1px 5px;
-}
-h1 .btn-inline {
-    font-size: .45em;
-}
-.btn-inline .mdi::before {
-    font-size: .9em;
-    top: 0px;
-}
-.dropdown-menu .mdi {
-    margin-left: 2px;
-}
-.nav .mdi::before {
-    left: -2px;
-    position: relative;
-    top: 2px;
-}
-.breadcrumb {
-    transition-duration: var(--navbar-transition-duration);
-    transition-timing-function: ease-in-out;
-    transition-property: margin-left, width;
-}
-.breadcrumb.collapsed {
-    margin-left: 240px;
-}
-.breadcrumb .mdi::before {
-    position: relative;
-    top: 4px;
-}
-.breadcrumb a:hover {
-    text-decoration: none;
-}
-.breadcrumb a:hover span {
-    text-decoration: underline;
-}
-.alert .mdi::before {
-    position: relative;
-    top: 4px;
-    margin-right: 2px;
-}
-.input-group-addon .mdi::before {
-    position: relative;
-    top: 3px;
-}
-.input-group-btn .mdi::before {
-    font-size: 20px;
-}
-.list-group-item .mdi::before {
-    position: relative;
-    top: 3px;
-    left: -3px
-}
-.badge .mdi::before {
-    font-size: 12px;
-    left: 0;
-    line-height: 12px;
-    top: 0;
-}
-
-span.hover_copy .hover_copy_button {
-    display: none;
-    margin-left: 2px;
-}
-span.hover_copy:hover .hover_copy_button {
-    display: inline;
-}
-td span.hover_copy .hover_copy_button {
-    vertical-align: top;
-    opacity: 0;
-    display: inline;
-    margin-left: 2px;
-}
-td span.hover_copy:hover .hover_copy_button {
-    opacity: 1;
-}
-
-.powered-by-nautobot {
-    background: url('/static/img/nautobot_icon_blue.svg');
-    background-repeat: no-repeat;
-    background-size: 16px 16px;
-    background-position: center bottom;
-    height: 20px;
-    width: 20px;
-    display: inline-block;
-    position: relative;
-    top: 2px;
-}
-
-/* Jobs list view accordion styling */
-.accordion-toggle {
-    border: 0;
-    color: black;
-    font-size: 14px;
-    font-weight: 700;
-    padding: 0;
-    text-decoration: none;
-}
-.accordion-toggle:hover, .accordion-toggle:active, .accordion-toggle:visited, .accordion-toggle:link, .accordion-toggle:focus {
-    border: 0;
-    color: black;
-    outline: 0;
-    padding: 0;
-    text-decoration: none;
-}
-.accordion-toggle-all {
-    display: inline;
-}
-
-/* Theme modal */
-.theme-table .img-responsive {
-    margin: 0 auto;
-}
-.theme-table .active-theme {
-    border: 5px solid #FF0000;
-}
-
-/* Fixes select dropdowns in modals and improves modal UX by making the modal body scrollable (instead of the whole page) */
-.modal-body {
-    max-height: calc(100vh - 212px);
-    overflow-y: scroll;
-}
-
-/* Navbar */
-.navbar-fixed-left {
-    border: none;
-    border-radius: 0;
-    bottom: 0;
-    left: 0;
-    margin-bottom: 0;
-    margin-right: 20px;
-    overflow: auto;
-    overflow-y: auto;
-    position: fixed;
-    top: 0;
-    width: 240px;  /* same as body padding-left */
-    z-index: 1030; /* `1030` is taken from Bootstrap's `navbar-fixed-top` */
-    -ms-overflow-style: none;  /* Hide scrollbar IE and Edge */
-    scrollbar-width: none;  /* Hide scrollbar Firefox */
-    transition-duration: var(--navbar-transition-duration);
-    transition-timing-function: ease-in-out;
-    transition-property: margin-left, width;
-}
-
-.navbar-fixed-left.collapsed {
-    width: 0px;
-}
-
-.navbar-fixed-left.collapsed:hover {
-    cursor: pointer;
-}
-
-.navbar-fixed-left > .container-fluid {
-    padding-left: 0;
-    padding-right: 0;
-}
-
-.navbar-fixed-left .navbar-header {
-    float: none;
-    margin: 0;
-}
-
-.navbar-fixed-left .navbar-header > .navbar-brand {
-    height: auto;
-    margin: 0;
-    padding: 25px 60px 10px 20px;
-    background-color: transparent;
-}
-
-.navbar-fixed-left .navbar-header > .navbar-brand img {
-    transition: opacity 0.5s ease;
-}
-
-.navbar-fixed-left .navbar-form {
-    border: none;
-    box-shadow: none;
-    margin: 0;
-    padding: 10px 20px 20px 20px;
-}
-
-.navbar-fixed-left .navbar-form input,
-.navbar-fixed-left .navbar-form button {
-    padding: 7px 10px;
-}
-
-.navbar-fixed-left .navbar-nav {
-    margin: 0;
-    width: 100%;
-    display: none; /* Hide menu items by default */
-}
-
-/* When navbar is expanded, show menu items */
-.navbar-fixed-left:not(.collapsed) .navbar-nav {
-    display: block;
-}
-
-.navbar-fixed-left .navbar-nav > .dropdown > a {
-    display: flex;
-    align-items: center;
-}
-
-/* Change color of dropdown anchor element when dropdown is opened */
-.navbar-fixed-left .navbar-nav > .dropdown > a[aria-expanded="true"] {
-    color: #ff8000; /* Color when expanded */
-}
-
-/* Reset focus color when dropdown is closed */
-.navbar-fixed-left .navbar-nav > .dropdown > a[aria-expanded="false"]:focus {
-    color: #999999;
-}
-
-/* Re-add hover color after dropdown is closed */
-.navbar-fixed-left .navbar-nav > .dropdown > a[aria-expanded="false"]:hover {
-    color: #ff8000;
-}
-
-.navbar-fixed-left .navbar-nav > .dropdown > a > .mdi-chevron-down {
-    margin-left: auto;
-}
-
-/* Change arrow direction, color when the dropdown is opened */
-.navbar-fixed-left .navbar-nav > .dropdown > a[aria-expanded="true"] > .mdi-chevron-down::before {
-    transition: transform 300ms ease;
-    transform: rotate(-180deg);
-    color: #ff8000; /* Color when expanded */
-}
-
-/* Change arrow direction, color when the dropdown is closed */
-.navbar-fixed-left .navbar-nav > .dropdown > a[aria-expanded="false"] > .mdi-chevron-down::before {
-    transition: transform 300ms ease;
-}
-
-.navbar-fixed-left .navbar-nav > .dropdown > .dropdown-toggle > #dropdown_title {
-    display: inline-block;
-    max-width: calc(100% - 51px); /* 51px = 30px of chevron + 14px of caret + 7px of whitespaces between inline elements */
-    overflow: hidden;
-    text-overflow: ellipsis;
-    vertical-align: middle;
-    white-space: nowrap;
-}
-
-.navbar-fixed-left .navbar-nav > .dropdown > .dropdown-toggle > img {
-    margin-right: 10px;
-}
-
-.navbar-fixed-left .navbar-nav:last-of-type > .dropdown > .dropdown-toggle {
-    text-transform: uppercase;
-}
-
-/* Navbar Dropdown Behavior */
-.navbar-fixed-left .navbar-nav > .dropdown > .nav-dropdown-menu {
-    color: #999999 !important;
-    background-color: #151e2a;
-    position: relative;
-    padding: 5px 0;
-    padding-left: 0;
-    margin: 2px 0 0;
-    margin-top: 0;
-    width: 100%;
-    min-width: auto;
-    font-size: 14px;
-    border: none;
-    border-top-left-radius: 0;
-    border-top-right-radius: 0;
-    border-radius: 6px;
-}
-
-.navbar-fixed-left .navbar-nav > .dropdown > .nav-dropdown-menu .divider {
-    height: 1px;
-    margin: 11px 0;
-    overflow: hidden;
-    background-color: #646464;
-}
-
-.navbar-fixed-left .navbar-nav > .dropdown > .nav-dropdown-menu > .dropdown-header {
-    line-height: 2;
-    padding: 3px 20px;
-    text-transform: uppercase;
-}
-
-.navbar-fixed-left .navbar-nav > .dropdown > .nav-dropdown-menu > li {
-    display: flex;
-    align-items: center;
-}
-
-/* Default style for the dropdown links */
-.navbar-fixed-left .navbar-nav > .dropdown > .nav-dropdown-menu > li > a {
-    color: #ffffff;
-    display: block;
-    clear: left;
-    line-height: 1.285714286;
-    margin-right: 0;
-    padding: 8px 20px;
-    white-space: normal;
-    text-decoration: none;
-    transition: color 200ms ease;
-    flex-grow: 1;
-}
-
-/* Change dropdown link on hover */
-.navbar-fixed-left .navbar-nav > .dropdown > .nav-dropdown-menu > li > a:hover {
-    transition: background-color 200ms ease;
-    background-color: #cdf3ff1a;
-    text-decoration: none;
-    border-radius: 8px;
-}
-
-/* Change dropdown link color when item is active (after clicking) */
-.navbar-fixed-left .navbar-nav > .dropdown > .nav-dropdown-menu > li.active > a {
-    color: #ff8000 !important;
-    text-decoration: none;
-}
-
-.navbar-fixed-left .navbar-nav > .dropdown > .nav-dropdown-menu > li > .buttons {
-    display: flex;
-    margin-left: 5px;
-    margin-right: 5px;
-    gap: 5px;
-    text-wrap: nowrap;
-}
-
-.navbar-fixed-left .navbar-nav > li {
-    width: 100%;
-}
-
-.navbar-fixed-left .navbar-nav > li > a {
-    padding: 12px 20px;
-}
-
-.navbar-fixed-left .navbar-nav > li > a > i.mdi {
-    margin-right: 7px;
-}
-
-.navbar-fixed-left .navbar-nav .nav-divider {
-    margin: 11px 17px;
-    width: 206px;
-    background-color: #999999;
-}
-
-/* Hide scrollbar for Chrome, Safari, and Opera */
-.navbar-fixed-left::-webkit-scrollbar {
-    display: none;
-}
-
-.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
-    border-color: transparent;
-}
-
-.navbar-inverse .navbar-nav > li > a {
-    color: #999999;
-    transition: background-color 200ms ease, color 200ms ease;
-}
-
-.navbar-inverse .navbar-nav > .dropdown > .nav-dropdown-menu {
-    background-color: #151e2a;
-}
-
-.nav-dropdown-menu .mdi {
-    margin-left: 2px;
-}
-
-.navbar-toggler {
-    position: fixed;
-    left: 225px;
-    top: 25px;
-    z-index: 1035;
-    justify-content: flex-start;
-    transition-duration: var(--navbar-transition-duration);
-    transition-timing-function: ease-in-out;
-}
-
-/* Collapse icon on homepage panels */
-.collapse-icon {
-    float: right;
-    cursor: pointer !important;
-    transition: transform 0.3s ease;
-}
-
-/* Rotates element 180 degrees */
-.rotated180 {
-    transform: rotate(180deg);
-}
-
-/* Draggable homepage panels fade in effect on page load */
-#draggable-homepage-panels {
-    opacity: 0;
-}
-
-/* Change cursor when hovering over panel headings on homepage */
-#draggable-homepage-panels .panel-heading {
-    cursor: move;
-}
-
-/* Make text in homepage panels selectable */
-#draggable-homepage-panels .list-group-item {
-    user-select: text !important;
-}
-
-/* Make panel being dragged opaque */
-.dragging {
-    opacity: 0.5;
-}
-
-/* Special diff block `<pre><code>...</code></pre>` backgrounds */
-pre.diff-added {
-    background-color: #e6ffec;
-}
-pre.diff-removed {
-    background-color: #ffebe9;
-}
-pre.diff-added code,
-pre.diff-removed code {
-    background-color: inherit;
-}
-
-/* Fix highlight.js and Bootstrap 3 style incompatibilities */
-pre:has(code.hljs) {
-    padding: 0; /* Reset Bootstrap 3 `pre` padding in case it contains a `code` element already formatted by highlight.js */
-}
-pre code.hljs {
-    padding: 11.5px; /* Same as Bootstrap 3 `pre` padding */
-    background-color: #f4f4f4; /* Reset Bootstrap 3 `pre` background-color in case it contains a `code` element already formatted by highlight.js */
-}
-code.hljs {
-    padding: 2px 4px; /* Same as Bootstrap 3 `code` padding */
-}
-
-/* Table or tile dropdown context menu option spacings and icon colors */
-.context-menu li i {
-    margin-right: 10px;
-}
-.context-menu a:focus i,
-.context-menu a:focus span,
-.context-menu a:hover i,
-.context-menu a:hover span {
-    color: inherit;
-}
-
-/* Tile component styles */
-.tiles {
-    display: grid;
-    grid-gap: 20px;
-    grid-template-columns: repeat(auto-fill, minmax(445px, 1fr));
-}
-@media (max-width: 1007px) {
-    .tiles {
-        /* More than one tile won't fit into a row when the viewport is narrower than 1007px */
-        /* On the other hand this makes tiles shrink if container width becomes less than 445px */
-        grid-template-columns: 1fr;
-    }
-}
-.tile {
-    background: #ffffff;
-    border: 1px solid #d8d8d8;
-    border-radius: 10px;
-    display: flex;
-    flex-direction: column;
-    padding: 20px;
-}
-.tile.clickable {
-    cursor: pointer;
-    outline: none;
-    transition: border-color 200ms ease, box-shadow 200ms ease;
-}
-.tile.clickable:active,
-.tile.clickable:focus-visible,
-.tile.clickable:hover {
-    border-color: #007dff;
-    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
-}
-a.tile.clickable,
-a.tile.clickable:hover,
-a.tile.clickable:focus,
-a.tile.clickable:visited {
-    color: inherit;
-    text-decoration: none;
-}
-.tile.disabled {
-    background: #f4f4f4;
-    color: #7d7f7c;
-}
-.tile h2 {
-    margin: 10px 0;
-}
-.tile-header {
-    align-items: center;
-    display: flex;
-    gap: 10px;
-}
-.tile-header h3 {
-    color: #999999;
-    display: flex;
-    flex: 1;
-    font-size: 12px;
-    font-weight: 400;
-    margin: 0;
-}
-.tile-header img {
-    float: left;
-    margin-right: 20px;
-}
-.tile-description {
-    flex: 1;
-}
-.tile-footer {
-    border-top: 1px solid #d8d8d8;
-    column-gap: 10px;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
-    padding-top: 10px;
-}
-
-/* Buttons inside dropdown menus */
-.dropdown-menu button {
-    background: none;
-    border: none;
-    display: block;
-    width: 100%;
-    text-align: left;
-    padding: 3px 20px;
-    cursor: pointer;
-    text-wrap: nowrap;
-}
-.dropdown-menu button:focus,
-.dropdown-menu button:hover {
-    color: #ffffff;
-    text-decoration: none;
-    background-color: #646464;
-}
-
-/* Monaco Editor container */
-.editor-container {
-    display: flex;  /* Use flexbox for layout */
-    flex-direction: column;
-    flex: 1;  /* Allow container to grow */
-    min-height: 100px;
-    position: relative;  /* Required for Monaco's absolute positioning */
-    overflow: hidden;  /* Let Monaco handle scrolling */
-}
-