mirror of
https://github.com/mertJF/tailblocks.git
synced 2025-12-08 17:03:24 +00:00
App :: github link ui update
This commit is contained in:
@@ -297,9 +297,13 @@ class App extends Component {
|
|||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
<a href="https://github.com/mertJF/tailblocks" className="github" target="_blank" rel="noopener noreferrer">
|
<a href="https://github.com/mertJF/tailblocks" className="github" target="_blank" rel="noopener noreferrer">
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
||||||
<path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"></path>
|
<path
|
||||||
|
fill="currentColor"
|
||||||
|
d="M12 .5C5.37.5 0 5.78 0 12.292c0 5.211 3.438 9.63 8.205 11.188.6.111.82-.254.82-.567 0-.28-.01-1.022-.015-2.005-3.338.711-4.042-1.582-4.042-1.582-.546-1.361-1.335-1.725-1.335-1.725-1.087-.731.084-.716.084-.716 1.205.082 1.838 1.215 1.838 1.215 1.07 1.803 2.809 1.282 3.495.981.108-.763.417-1.282.76-1.577-2.665-.295-5.466-1.309-5.466-5.827 0-1.287.465-2.339 1.235-3.164-.135-.298-.54-1.497.105-3.121 0 0 1.005-.316 3.3 1.209.96-.262 1.98-.392 3-.398 1.02.006 2.04.136 3 .398 2.28-1.525 3.285-1.209 3.285-1.209.645 1.624.24 2.823.12 3.121.765.825 1.23 1.877 1.23 3.164 0 4.53-2.805 5.527-5.475 5.817.42.354.81 1.077.81 2.182 0 1.578-.015 2.846-.015 3.229 0 .309.21.678.825.56C20.565 21.917 24 17.495 24 12.292 24 5.78 18.627.5 12 .5z"
|
||||||
|
/>
|
||||||
</svg>
|
</svg>
|
||||||
|
GitHub
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -552,19 +552,25 @@ pre, code {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.github {
|
.github {
|
||||||
width: 52px;
|
padding: 8px 12px;
|
||||||
height: 52px;
|
border-radius: 50px;
|
||||||
border-radius: 50%;
|
|
||||||
position: fixed;
|
position: fixed;
|
||||||
right: 20px;
|
right: 20px;
|
||||||
bottom: 20px;
|
bottom: 20px;
|
||||||
background-color: var(--solid-900);
|
background-color: var(--solid-900);
|
||||||
color: #fff;
|
color: #fff;
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
|
font-weight: 600;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.github svg {
|
||||||
|
width: 24px;
|
||||||
|
flex-shrink: 0;
|
||||||
|
margin-right: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
.dark-mode .github {
|
.dark-mode .github {
|
||||||
color: #1a202c;
|
color: #1a202c;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
@@ -651,3 +657,30 @@ pre, code {
|
|||||||
background-color: #1a202c;
|
background-color: #1a202c;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (max-width: 380px) {
|
||||||
|
.github {
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 50%;
|
||||||
|
color: transparent;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.github svg {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
color: #fff;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .github {
|
||||||
|
color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .github svg {
|
||||||
|
color: #1a202c;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user