mirror of
				https://github.com/go-gitea/gitea.git
				synced 2025-11-04 10:44:12 +01:00 
			
		
		
		
	Improve CSS helper naming (#28769)
* `gt-w-100` => `gt-w-full` to match tailwind * clarify `gt-hidden` priority
This commit is contained in:
		
							parent
							
								
									7d62615513
								
							
						
					
					
						commit
						34a0684397
					
				@ -20,7 +20,7 @@
 | 
				
			|||||||
			{{if .DatabaseCheckInconsistentCollationColumns}}
 | 
								{{if .DatabaseCheckInconsistentCollationColumns}}
 | 
				
			||||||
				<div class="ui red message">
 | 
									<div class="ui red message">
 | 
				
			||||||
					{{ctx.Locale.Tr "admin.self_check.database_inconsistent_collation_columns" .DatabaseCheckResult.DatabaseCollation}}
 | 
										{{ctx.Locale.Tr "admin.self_check.database_inconsistent_collation_columns" .DatabaseCheckResult.DatabaseCollation}}
 | 
				
			||||||
					<ul class="gt-w-100">
 | 
										<ul class="gt-w-full">
 | 
				
			||||||
					{{range .DatabaseCheckInconsistentCollationColumns}}
 | 
										{{range .DatabaseCheckInconsistentCollationColumns}}
 | 
				
			||||||
						<li>{{.}}</li>
 | 
											<li>{{.}}</li>
 | 
				
			||||||
					{{end}}
 | 
										{{end}}
 | 
				
			||||||
 | 
				
			|||||||
@ -5,7 +5,7 @@
 | 
				
			|||||||
	<div id="test-modal-form-1" class="ui mini modal">
 | 
						<div id="test-modal-form-1" class="ui mini modal">
 | 
				
			||||||
		<div class="header">Form dialog (layout 1)</div>
 | 
							<div class="header">Form dialog (layout 1)</div>
 | 
				
			||||||
		<form class="content" method="post">
 | 
							<form class="content" method="post">
 | 
				
			||||||
			<div class="ui input gt-w-100"><input name="user_input"></div>
 | 
								<div class="ui input gt-w-full"><input name="user_input"></div>
 | 
				
			||||||
			{{template "base/modal_actions_confirm" (dict "ModalButtonTypes" "confirm")}}
 | 
								{{template "base/modal_actions_confirm" (dict "ModalButtonTypes" "confirm")}}
 | 
				
			||||||
		</form>
 | 
							</form>
 | 
				
			||||||
	</div>
 | 
						</div>
 | 
				
			||||||
@ -14,7 +14,7 @@
 | 
				
			|||||||
		<div class="header">Form dialog (layout 2)</div>
 | 
							<div class="header">Form dialog (layout 2)</div>
 | 
				
			||||||
		<form method="post">
 | 
							<form method="post">
 | 
				
			||||||
			<div class="content">
 | 
								<div class="content">
 | 
				
			||||||
				<div class="ui input gt-w-100"><input name="user_input"></div>
 | 
									<div class="ui input gt-w-full"><input name="user_input"></div>
 | 
				
			||||||
				{{template "base/modal_actions_confirm" (dict "ModalButtonTypes" "confirm")}}
 | 
									{{template "base/modal_actions_confirm" (dict "ModalButtonTypes" "confirm")}}
 | 
				
			||||||
			</div>
 | 
								</div>
 | 
				
			||||||
		</form>
 | 
							</form>
 | 
				
			||||||
@ -24,7 +24,7 @@
 | 
				
			|||||||
		<div class="header">Form dialog (layout 3)</div>
 | 
							<div class="header">Form dialog (layout 3)</div>
 | 
				
			||||||
		<form method="post">
 | 
							<form method="post">
 | 
				
			||||||
			<div class="content">
 | 
								<div class="content">
 | 
				
			||||||
				<div class="ui input gt-w-100"><input name="user_input"></div>
 | 
									<div class="ui input gt-w-full"><input name="user_input"></div>
 | 
				
			||||||
			</div>
 | 
								</div>
 | 
				
			||||||
			{{template "base/modal_actions_confirm" (dict "ModalButtonTypes" "confirm")}}
 | 
								{{template "base/modal_actions_confirm" (dict "ModalButtonTypes" "confirm")}}
 | 
				
			||||||
		</form>
 | 
							</form>
 | 
				
			||||||
@ -33,7 +33,7 @@
 | 
				
			|||||||
	<div id="test-modal-form-4" class="ui mini modal">
 | 
						<div id="test-modal-form-4" class="ui mini modal">
 | 
				
			||||||
		<div class="header">Form dialog (layout 4)</div>
 | 
							<div class="header">Form dialog (layout 4)</div>
 | 
				
			||||||
		<div class="content">
 | 
							<div class="content">
 | 
				
			||||||
			<div class="ui input gt-w-100"><input name="user_input"></div>
 | 
								<div class="ui input gt-w-full"><input name="user_input"></div>
 | 
				
			||||||
		</div>
 | 
							</div>
 | 
				
			||||||
		<form method="post">
 | 
							<form method="post">
 | 
				
			||||||
			{{template "base/modal_actions_confirm" (dict "ModalButtonTypes" "confirm")}}
 | 
								{{template "base/modal_actions_confirm" (dict "ModalButtonTypes" "confirm")}}
 | 
				
			||||||
 | 
				
			|||||||
@ -203,7 +203,7 @@
 | 
				
			|||||||
							{{if $showFileViewToggle}}
 | 
												{{if $showFileViewToggle}}
 | 
				
			||||||
								{{/* for image or CSV, it can have a horizontal scroll bar, there won't be review comment context menu (position absolute) which would be clipped by "overflow" */}}
 | 
													{{/* for image or CSV, it can have a horizontal scroll bar, there won't be review comment context menu (position absolute) which would be clipped by "overflow" */}}
 | 
				
			||||||
								<div id="diff-rendered-{{$file.NameHash}}" class="file-body file-code {{if $.IsSplitStyle}}code-diff-split{{else}}code-diff-unified{{end}} gt-overflow-x-scroll">
 | 
													<div id="diff-rendered-{{$file.NameHash}}" class="file-body file-code {{if $.IsSplitStyle}}code-diff-split{{else}}code-diff-unified{{end}} gt-overflow-x-scroll">
 | 
				
			||||||
									<table class="chroma gt-w-100">
 | 
														<table class="chroma gt-w-full">
 | 
				
			||||||
										{{if $isImage}}
 | 
															{{if $isImage}}
 | 
				
			||||||
											{{template "repo/diff/image_diff" dict "file" . "root" $ "blobBase" $blobBase "blobHead" $blobHead "sniffedTypeBase" $sniffedTypeBase "sniffedTypeHead" $sniffedTypeHead}}
 | 
																{{template "repo/diff/image_diff" dict "file" . "root" $ "blobBase" $blobBase "blobHead" $blobHead "sniffedTypeBase" $sniffedTypeBase "sniffedTypeHead" $sniffedTypeHead}}
 | 
				
			||||||
										{{else}}
 | 
															{{else}}
 | 
				
			||||||
 | 
				
			|||||||
@ -6,7 +6,7 @@
 | 
				
			|||||||
			{{end}}
 | 
								{{end}}
 | 
				
			||||||
		</div>
 | 
							</div>
 | 
				
			||||||
	{{end}}
 | 
						{{end}}
 | 
				
			||||||
	<div class="content gt-p-0 gt-w-100">
 | 
						<div class="content gt-p-0 gt-w-full">
 | 
				
			||||||
		<div class="gt-df gt-items-start">
 | 
							<div class="gt-df gt-items-start">
 | 
				
			||||||
			<div class="issue-card-icon">
 | 
								<div class="issue-card-icon">
 | 
				
			||||||
				{{template "shared/issueicon" .}}
 | 
									{{template "shared/issueicon" .}}
 | 
				
			||||||
 | 
				
			|||||||
@ -12,8 +12,6 @@ Gitea's private styles use `g-` prefix.
 | 
				
			|||||||
.gt-f1 { flex: 1 !important; }
 | 
					.gt-f1 { flex: 1 !important; }
 | 
				
			||||||
.gt-fw { flex-wrap: wrap !important; }
 | 
					.gt-fw { flex-wrap: wrap !important; }
 | 
				
			||||||
.gt-vm { vertical-align: middle !important; }
 | 
					.gt-vm { vertical-align: middle !important; }
 | 
				
			||||||
.gt-w-100 { width: 100% !important; }
 | 
					 | 
				
			||||||
.gt-h-100 { height: 100% !important; }
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
.gt-mono {
 | 
					.gt-mono {
 | 
				
			||||||
  font-family: var(--fonts-monospace) !important;
 | 
					  font-family: var(--fonts-monospace) !important;
 | 
				
			||||||
@ -69,15 +67,17 @@ Gitea's private styles use `g-` prefix.
 | 
				
			|||||||
.gt-self-start { align-self: flex-start !important; }
 | 
					.gt-self-start { align-self: flex-start !important; }
 | 
				
			||||||
.gt-self-end { align-self: flex-end !important; }
 | 
					.gt-self-end { align-self: flex-end !important; }
 | 
				
			||||||
.gt-no-underline { text-decoration-line: none !important; }
 | 
					.gt-no-underline { text-decoration-line: none !important; }
 | 
				
			||||||
.gt-w-auto { width: auto !important; }
 | 
					 | 
				
			||||||
.gt-normal-case { text-transform: none !important; }
 | 
					.gt-normal-case { text-transform: none !important; }
 | 
				
			||||||
.gt-italic { font-style: italic !important; }
 | 
					.gt-italic { font-style: italic !important; }
 | 
				
			||||||
.gt-overflow-x-auto { overflow-x: auto !important; }
 | 
					.gt-overflow-x-auto { overflow-x: auto !important; }
 | 
				
			||||||
.gt-overflow-x-scroll { overflow-x: scroll !important; }
 | 
					.gt-overflow-x-scroll { overflow-x: scroll !important; }
 | 
				
			||||||
.gt-overflow-y-hidden { overflow-y: hidden !important; }
 | 
					.gt-overflow-y-hidden { overflow-y: hidden !important; }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.gt-w-screen { width: 100vw !important; }
 | 
					 | 
				
			||||||
.gt-h-screen { height: 100vh !important; }
 | 
					.gt-h-screen { height: 100vh !important; }
 | 
				
			||||||
 | 
					.gt-h-full { height: 100% !important; }
 | 
				
			||||||
 | 
					.gt-w-auto { width: auto !important; }
 | 
				
			||||||
 | 
					.gt-w-screen { width: 100vw !important; }
 | 
				
			||||||
 | 
					.gt-w-full { width: 100% !important; }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.gt-float-left { float: left !important; }
 | 
					.gt-float-left { float: left !important; }
 | 
				
			||||||
.gt-float-right { float: right !important; }
 | 
					.gt-float-right { float: right !important; }
 | 
				
			||||||
@ -268,7 +268,7 @@ Gitea's private styles use `g-` prefix.
 | 
				
			|||||||
.gt-font-18 { font-size: 18px !important }
 | 
					.gt-font-18 { font-size: 18px !important }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
/*
 | 
					/*
 | 
				
			||||||
gt-hidden must be placed after all other "display: xxx !important" classes to win the chance
 | 
					gt-hidden must win all other "display: xxx !important" classes to get the chance to "hide" an element.
 | 
				
			||||||
do not use:
 | 
					do not use:
 | 
				
			||||||
* "[hidden]" attribute: it's too weak, can not be applied to an element with "display: flex"
 | 
					* "[hidden]" attribute: it's too weak, can not be applied to an element with "display: flex"
 | 
				
			||||||
* ".hidden" class: it has been polluted by Fomantic UI in many cases
 | 
					* ".hidden" class: it has been polluted by Fomantic UI in many cases
 | 
				
			||||||
@ -278,4 +278,4 @@ only use:
 | 
				
			|||||||
* this ".gt-hidden" class
 | 
					* this ".gt-hidden" class
 | 
				
			||||||
* showElem/hideElem/toggleElem functions in "utils/dom.js"
 | 
					* showElem/hideElem/toggleElem functions in "utils/dom.js"
 | 
				
			||||||
*/
 | 
					*/
 | 
				
			||||||
.gt-hidden { display: none !important; }
 | 
					.gt-hidden.gt-hidden { display: none !important; }
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user