Template:Infobox NaviCust part/grid/styles.css: Difference between revisions

Template page
No edit summary
m (Protected "Template:Infobox NaviCust part/grid/styles.css" ([Edit=Allow only administrators] (indefinite) [Move=Allow only administrators] (indefinite)))
 
(3 intermediate revisions by the same user not shown)
Line 1: Line 1:
.navicust-grid {
.navicust-grid {
   display: grid;
   display: grid;
  grid-template-columns: repeat(7, 28px);
  grid-template-rows: repeat(7, 28px);
   grid-column-gap: 3px;
   grid-column-gap: 3px;
   grid-row-gap: 3px;
   grid-row-gap: 3px;
Line 23: Line 21:
.navicust-grid--plus .navicust-grid__cell--filled::before {
.navicust-grid--plus .navicust-grid__cell--filled::before {
position: absolute;
position: absolute;
width: 100%;
left: calc(50% - 1.5px);
    background-color: var(--part-stroke);
top: 0;
width: 3px;
height: 100%;
background-color: var(--part-stroke);
content: " ";
}
}


.navicust-grid--plus .navicust-grid__cell--filled::after {
.navicust-grid--plus .navicust-grid__cell--filled::after {
position: absolute;
position: absolute;
left: 0;
top: calc(50% - 1.5px);
width: 100%;
width: 100%;
    background-color: var(--part-stroke);
height: 3px;
background-color: var(--part-stroke);
content: " ";
}
}

Latest revision as of 21:02, 25 October 2022

.navicust-grid {
  display: grid;
  grid-column-gap: 3px;
  grid-row-gap: 3px;
  margin: 1rem auto;
  background: #000;
  border: 3px solid #000;
}

.navicust-grid__cell {
	position: relative;
	background-color: #202020;
	color: transparent;
	text-align: center;
}

.navicust-grid__cell--filled {
	background: var(--part-fill);
}

.navicust-grid--plus .navicust-grid__cell--filled::before {
	position: absolute;
	left: calc(50% - 1.5px);
	top: 0;
	width: 3px;
	height: 100%;
	background-color: var(--part-stroke);
	content: " ";
}

.navicust-grid--plus .navicust-grid__cell--filled::after {
	position: absolute;
	left: 0;
	top: calc(50% - 1.5px);
	width: 100%;
	height: 3px;
	background-color: var(--part-stroke);
	content: " ";
}