nishiki/hugo-theme-relearn
1
0
Fork 0
mirror of https://github.com/McShelby/hugo-theme-relearn.git synced 2024-11-23 07:47:54 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

tabs: remove side effects caused by button style #240

Browse source
This commit is contained in:
Sören Weber 2022-05-29 23:22:15 +02:00
parent 5617ca2359
commit e3b5dfd0c0
No known key found for this signature in database
GPG key ID: 07D17FF580AE7589
2 changed files with 11 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
layouts/shortcodes/tabs.html
View file

@ -6,7 +6,7 @@
<button <button
data-tab-item="{{ .name }}" data-tab-item="{{ .name }}"
data-tab-group="{{ $groupId }}" data-tab-group="{{ $groupId }}"
class="tab-nav-button btn {{ cond (eq $idx 0) "active" ""}}" class="tab-nav-button {{ cond (eq $idx 0) "active" ""}}"
onclick="switchTab('{{ $groupId }}','{{ .name }}')" onclick="switchTab('{{ $groupId }}','{{ .name }}')"
><span>{{ .name }}</span></button> ><span>{{ .name }}</span></button>
{{- end }} {{- end }}

15
static/css/tabs.css
View file

@ -1,21 +1,26 @@
#body .tab-nav-button { #body .tab-nav-button {
background-color: rgba( 134, 134, 134, .166 ) !important; background-color: rgba( 134, 134, 134, .166 );
border-color: rgba( 134, 134, 134, .333 ) !important; border-color: rgba( 134, 134, 134, .333 );
border-radius: 4px 4px 0 0 !important; border-radius: 4px 4px 0 0;
border-width: 1px 1px 1px 1px !important; border-style: solid;
border-width: 1px;
bottom: -1px; bottom: -1px;
-webkit-print-color-adjust: exact; -webkit-print-color-adjust: exact;
color-adjust: exact; color-adjust: exact;
display: block; display: block;
float: left; float: left;
font-size: 14px;
font-weight: 500;
line-height: 1.42857143;
margin-left: 4px; margin-left: 4px;
padding: 6px 12px;
position: relative; position: relative;
} }
#body .tab-nav-button:first-child { #body .tab-nav-button:first-child {
margin-left: 9px; margin-left: 9px;
} }
#body .tab-nav-button:not(.active) { #body .tab-nav-button:not(.active) {
border-bottom-color: rgba( 134, 134, 134, .1 ) !important; border-bottom-color: rgba( 134, 134, 134, .1 );
margin-top: 7px; margin-top: 7px;
padding-bottom: 2px !important; padding-bottom: 2px !important;
padding-top: 2px !important; padding-top: 2px !important;