Create cvss-new.css

cvss-new.css

@@ -0,0 +1,142 @@
+/* Improved CSS for CVSS */
+
+.cvssjs i {
+    width: 1em;
+    height: 1em;
+    display: inline-block;
+    background: url("cvssicons.png") no-repeat center;
+    background-size: cover;
+    margin-right: 6px;
+    margin: 2px;
+    font-size: 40px;
+}
+
+.cvssjs a {
+    color: #3A9BDC;
+    text-decoration: none;
+}
+
+.cvssjs dl {
+    display: inline-block;
+    vertical-align: top;
+    background-color: #424a40;
+    margin: 2px;
+    border-radius: 6px;
+    box-shadow: 0px 0px 10px rgba(0,0,0,0.1);
+    transition: background-color 0.3s ease;
+}
+.cvssjs dt {
+    color: #f1f1f1;
+    padding: 5px;
+    font-size: 70%;
+    text-transform: uppercase;
+    letter-spacing: 0.5px;
+}
+.cvssjs dl:hover {
+    background-color: #676a60;
+}
+.cvssjs dl:hover dt {
+    color: #ffffff;
+}
+
+.cvssjs dd {
+    margin: 0;
+    padding: 0;
+    text-align: left;
+}
+
+.cvssjs dd label,
+#predef span {
+    min-width: 7.5em;
+    padding: 5px 4px;
+    display: block;
+    background-color: #f9f9f7;
+    transition: background-color 0.3s ease;
+}
+
+.cvssjs dd:last-child label,
+#predef span:last-child {
+    border-bottom-left-radius: 4px;
+    border-bottom-right-radius: 4px;
+}
+
+.cvssjs dd small {
+    display: none;
+}
+
+.cvssjs dd:hover small {
+    position: absolute;
+    max-width: 220px;
+    border: 1px solid #333;
+    display: block;
+    color: black;
+    background-color: #FFFFC1;
+    border-radius: 5px;
+    padding: 6px;
+    margin-top: 0.7em;
+    margin-left: 5em;
+    box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
+    z-index: 1;
+}
+
+.cvssjs dd > input {
+    border: 0;
+    clip: rect(0 0 0 0);
+    height: 1px;
+    margin: -1px;
+    overflow: hidden;
+    padding: 0;
+    position: absolute;
+    width: 1px;
+}
+
+.cvssjs dd input:checked + label {
+    background-color: rgb(250, 180, 93);
+    transition: background-color 0.1s ease;
+}
+
+.cvssjs dd label:hover {
+    background-color: rgb(250, 200, 103);
+    transition: background-color 0.2s ease;
+}
+
+.cvssjs .severity {
+    width: 5em;
+    padding: 6px;
+    border-radius: 4px;
+    text-align: center;
+    font-weight: bold;
+    color: #ffffff;
+    transition: background-color 0.1s ease;
+}
+
+.cvssjs .score {
+    width: 1.5em;
+}
+
+.cvssjs .results {
+    padding: 8px;
+    background-color: #efefef;
+    border-radius: 4px;
+}
+
+.cvssjs .copy-button {
+    border: none;
+    background: transparent;
+    cursor: pointer;
+    user-select: none;
+}
+
+.cvssjs .copy-button:before {
+    content: " ";
+    display: inline-block;
+    width: 16px;
+    height: 16px;
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23000' d='M433.941 65.941l-51.882-51.882A48 48 0 0 0 348.118 0H176c-26.51 0-48 21.49-48 48v48H48c-26.51 0-48 21.49-48 48v320c0 26.51 21.49 48 48 48h224c26.51 0 48-21.49 48-48v-48h80c26.51 0 48-21.49 48-48V99.882a48 48 0 0 0-14.059-33.941zM266 464H54a6 6 0 0 1-6-6V150a6 6 0 0 1 6-6h74v224c0 26.51 21.49 48 48 48h96v42a6 6 0 0 1-6 6zm128-96H182a6 6 0 0 1-6-6V54a6 6 0 0 1 6-6h106v88c0 13.255 10.745 24 24 24h88v202a6 6 0 0 1-6 6zm6-256h-64V48h9.632c1.591 0 3.117.632 4.243 1.757l48.368 48.368a6 6 0 0 1 1.757 4.243V112z'%3E%3C/path%3E%3C/svg%3E");
+    background-size: contain;
+    background-repeat: no-repeat;
+}
+
+.cvssjs .copy-button:hover:before {
+    opacity: 0.7;
+}